html5-audio-editor
html5-audio-editor copied to clipboard
Can I load web media file?
Is this library available by loading web media files, not drag and drop?
I know this is old, but I figured out a way to do it by modifying the 'filedropbox.js' file. Just add an anchor tag with the class fileSelect to use, like this:
<a href="aug.wav" id="fileSelect">Select some files</a>
`/* Cross Browser Support */ window.requestFileSystem = window.requestFileSystem || window.webkitRequestFileSystem; window.BlobBuilder = window.WebKitBlobBuilder || window.MozBlobBuilder; window.URL = window.URL || window.webkitURL;
/* The FileDropbox prepares a HTMLElement to be a drop container and loads the first dropped file into a array */ function FileDropbox() { this.result = null; this.resultArrayBuffer = null; this.onFinish = null; this.onFail = null;
this.defineDropHandler = function defineDropHandler(dropContainerElement)
{
// init event handlers
dropContainerElement.addEventListener("dragenter", this.skipEventHandler, false);
dropContainerElement.addEventListener("dragexit", this.skipEventHandler, false);
dropContainerElement.addEventListener("dragover", this.skipEventHandler, false);
dropContainerElement.addEventListener("drop", this.dropHandler, false);
dropContainerElement.masterObj = this; // need to define this controller for further events
$('.fileSelect').click(function(e)
{
var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
var source;
var audioData;
function getData(audioFile) {
source = audioCtx.createBufferSource();
var request = new XMLHttpRequest();
request.open('GET', audioFile, true);
request.responseType = 'arraybuffer';
request.onload = function() {
var audioData = request.response;
dropContainerElement.masterObj.resultArrayBuffer = audioData;
// write into the result array
dropContainerElement.masterObj.result = new Uint8Array(audioData);
// callback
if (dropContainerElement.masterObj.onFinish !== null)
{
dropContainerElement.masterObj.onFinish();
}
}
request.send();
}
e.stopPropagation();
e.preventDefault();
getData(e.currentTarget.href);
});
};
}; `