Test blob()

by Johnny Lee

HTML

<div id="container"></div>
<img id="img" alt="Red dot" />

JavaScript

(function () {
    
    window.URL = window.URL || window.webkitURL;

    function contentLoaded() {
        // Demo 1 (text/Plain)
        var blob1 = new Blob(['Hello from blob1'],
                             { type: 'text/plain'});
        var fr = new FileReader();
        fr.onloadend = function(e) {         
            var txtArea = document.getElementById('container');         
            txtArea.innerText= e.target.result;
        };
        fr.readAsText(blob1, 'utf-8');
        
        // Demo 2 (image/png)  
        var blob2 = new Blob(['data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB9YGARc5KB0XV+IAAAAddEVYdENvbW1lbnQAQ3JlYXRlZCB3aXRoIFRoZSBHSU1Q72QlbgAAAF1JREFUGNO9zL0NglAAxPEfdLTs4BZM4DIO4C7OwQg2JoQ9LE1exdlYvBBeZ7jqch9//q1uH4TLzw4d6+ErXMMcXuHWxId3KOETnnXXV6MJpcq2MLaI97CER3N0vr4MkhoXe0rZigAAAABJRU5ErkJggg=='],
                             { type: 'image/png'});
        var fr2 = new FileReader();
        fr2.onloadend = function(e) {         
            var imgArea = document.getElementById('img');         
            imgArea.src= this.result;
        };
        fr2.readAsText(blob2);
        
        // Demo 3 (text/JavaScript)
        var blob3 = new Blob(['alert("Hello from blob3")'], 
                            { type: 'text/javascript' });
        var script = document.createElement('script');

        script.setAttribute('src', window.URL.createObjectURL(blob3));
                document.body.appendChild(script);
    }

    window.addEventListener('DOMContentLoaded', contentLoaded, false);

} ());