is there a way to encode canvas.getImageData() pixel Array to base64 ?

i have used base 64 encoder on my canvas.getImageData() pixel array i want its base64 encoded string to save the image to file...

i cant use canvas.toDataURL because it is not supported in webOS

here is my code it does generate a base64 encoded string but the string doesnot generate an image...

EditorAssistant.prototype.encode = function (input) { 
 this._keyStr = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";

    // public method for encoding

        var output = "";
        var chr1, chr2, chr3, enc1, enc2, enc3, enc4;
        var i = 0;

        input = this._utf8_encode(input);

        while (i 开发者_如何学编程< input.length) {

            chr1 = input.charCodeAt(i++);
            chr2 = input.charCodeAt(i++);
            chr3 = input.charCodeAt(i++);

            enc1 = chr1 >> 2;
            enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
            enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
            enc4 = chr3 & 63;

            if (isNaN(chr2)) {
                enc3 = enc4 = 64;
            } else if (isNaN(chr3)) {
                enc4 = 64;
            }

            output = output +
            this._keyStr.charAt(enc1) + this._keyStr.charAt(enc2) +
            this._keyStr.charAt(enc3) + this._keyStr.charAt(enc4);

        }

        return output;
    }

EditorAssistant.prototype._utf8_encode =function (string) {
        string = string.replace(/\r\n/g,"\n");
        var utftext = "";

        for (var n = 0; n < string.length; n++) {
            var c = string.charCodeAt(n);
            if (c < 128) {
                utftext += String.fromCharCode(c);
            }
            else if((c > 127) && (c < 2048)) {
                utftext += String.fromCharCode((c >> 6) | 192);
                utftext += String.fromCharCode((c & 63) | 128);
            }
            else {
                utftext += String.fromCharCode((c >> 12) | 224);
                utftext += String.fromCharCode(((c >> 6) & 63) | 128);
                utftext += String.fromCharCode((c & 63) | 128);
            }

        }

        return utftext;
    }

here i am calling above function

        var imaged = this.canvasContext.getImageData(0, 0, this.canvas.width, this.canvas.height);

    var data ="";
    for(var i = 0; i<imaged.data.length; i++){
        data += imaged.data[i];
    }   

    var strEncoded = this.encode(data);

    $('image').src = 'data:image/jpeg;base64,'+strEncoded;

can u tell me where i am doing wrong ?? thnks

---

$.getImageData({
  url: "http://farm4.static.flickr.com/3002/2758349058_ab6dc9cfdc_z.jpg?zz=1",
  success: function(image){

    // Set up the canvas
    var can = document.getElementsByTagName('canvas')[0];
    var ctx = can.getContext('2d');

    // Set the canvas width and heigh to the same as the image
    $(can).attr('width', image.width);
    $(can).attr('height', image.height);

    // Draw the image on to the canvas
    ctx.drawImage(image, 0, 0, image.width, image.height);

    // Get the image data
    var image_data = ctx.getImageData(0, 0,  image.width, image.height);
    var image_data_array = image_data.data;


    // Write the image data to the canvas
    ctx.putImageData(image_data, 0, 0);

  },
  error: function(xhr, text_status){
    // Handle your error here
  }
});