html5-audio-editor icon indicating copy to clipboard operation
html5-audio-editor copied to clipboard

Can I load web media file?

Open SamhwanKim opened this issue 8 years ago • 1 comments

Is this library available by loading web media files, not drag and drop?

SamhwanKim avatar Nov 25 '16 01:11 SamhwanKim

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);

	}); 

};

}; `

ajhalls avatar Jul 21 '17 19:07 ajhalls