Search code examples
javascripthtmlcanvasflashcanvas

FlashCanvas drawImage NotWorking


I'm on Windows7 IE9 running in IE8. This works in IE9 only because I can use canvas however in IE8 it's suppose to fall back to flash canvas. Here is my source http://blog.jackadam.net/2010/alpha-jpegs/ NOW it seems im having a problem in IE with the context.drawImage not drawing the image? I've posted on the flashcanvas google group but they seem to take some time to repsond so was hoping there maybe a flashcanvas guru here.

;(function() {

var create_alpha_jpeg = function(img) {

    var alpha_path = img.getAttribute('data-alpha-src')
    if(!alpha_path) return

    // Hide the original un-alpha'd
    img.style.visiblity = 'hidden'

    // Preload the un-alpha'd image
    var image = document.createElement('img')
    image.src = img.src + '?' + Math.random()
    console.log(image.src);
    image.onload = function () {
        console.log('image.onload');

        // Then preload alpha mask
        var alpha = document.createElement('img')
        alpha.src = alpha_path + '?' + Math.random()
        alpha.onload = function () {
            console.log('alpha.onload');
            var canvas = document.createElement('canvas')
            canvas.width = image.width
            canvas.height = image.height
            img.parentNode.replaceChild(canvas, img)

            // For IE7/8
            if(typeof FlashCanvas != 'undefined') FlashCanvas.initElement(canvas)

            // Canvas compositing code
            var context = canvas.getContext('2d')
            context.clearRect(0, 0, image.width, image.height)
            context.drawImage(image, 0, 0, image.width, image.height)
            //context.globalCompositeOperation = 'xor'
            //context.drawImage(alpha, 0, 0, image.width, image.height)

        }

    }

}

// Apply this technique to every image on the page once DOM is ready
// (I just placed it at the bottom of the page for brevity)
var imgs = document.getElementsByTagName('img')
for(var i = 0; i < imgs.length; i++)
create_alpha_jpeg(imgs[i])

})();

Solution

  • The solution to this was it only works with the older version of flashcanvas AND it only works with flashcanvas pro... as noted in the second footer of the website

    This technique uses the globalCompositeOperation operation, which requires FlashCanvas Pro. Free for non-profit use or just $31 for a commercial license.