diff --git a/ui (gen4)/experiments/canvas-waveform.html b/ui (gen4)/experiments/canvas-waveform.html index e34d6c33..66fdd620 100644 --- a/ui (gen4)/experiments/canvas-waveform.html +++ b/ui (gen4)/experiments/canvas-waveform.html @@ -286,6 +286,7 @@ var histogram = function(img, canvas, mode, color){ } // XXX make defaults externally savable -- options??? +// XXX add support for img URL... var makeWaveform = function(img, mode, color, controls){ mode = mode || 'color' @@ -307,6 +308,16 @@ var makeWaveform = function(img, mode, color, controls){ b.classList.add('current') : b.classList.remove('current') }) } + // handle img urls... + if(typeof(img) == typeof('str')){ + var src = img + img = document.createElement('img') + img.onload = function(){ + container.setAttribute('image-width', img.width) + container.setAttribute('image-height', img.height) + update() } + img.src = src } + // container... var container = document.createElement('div') container.classList.add('graph', type) @@ -345,7 +356,7 @@ var makeWaveform = function(img, mode, color, controls){ container.setAttribute('image-height', img.height) // init... - update(mode) + update() return container } @@ -358,6 +369,8 @@ var start = function(){ //document.body.appendChild(makeWaveform(document.getElementById('input'), 'color', 'normalized')) document.body.appendChild(makeWaveform(document.getElementById('input'))) + + document.body.appendChild(makeWaveform('../images/splash-800x500.jpg')) }