Skip to content

Instantly share code, notes, and snippets.

@builtbylane

builtbylane/image_to_base64url.js

Forked from HaNdTriX/image_to_data_url.js
Created June 19, 2014 01:37
Show Gist options
  • Save builtbylane/0804fbf3aa4a6c4744f4 to your computer and use it in GitHub Desktop.
Save builtbylane/0804fbf3aa4a6c4744f4 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. @HaNdTriX HaNdTriX revised this gist Mar 11, 2014. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion image_to_base64url.js
    View file
    Original file line number Diff line number Diff line change
    @@ -38,7 +38,7 @@ function imgToDataURL(url, callback, outputFormat, quality) {
    canvas = img = null;
    };
    img.onerror = function() {
    callback(new Error('Could not load image.'), null);
    callback(new Error('Could not load image'), null);
    };
    img.src = url;
    }
  2. @HaNdTriX HaNdTriX revised this gist Mar 11, 2014. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion image_to_base64url.js
    View file
    Original file line number Diff line number Diff line change
    @@ -5,7 +5,7 @@
    * If you want to use the
    * outputFormat or quality param
    * I strongly recommend you read the docs
    * @mozilla for `canvas.toDataURL()`
    * @ mozilla for `canvas.toDataURL()`
    *
    * @param {String} url
    * @param {Function} callback
  3. @HaNdTriX HaNdTriX revised this gist Mar 11, 2014. 1 changed file with 6 additions and 1 deletion.
    7 changes: 6 additions & 1 deletion image_to_base64url.js
    View file
    Original file line number Diff line number Diff line change
    @@ -1,7 +1,12 @@
    /**
    * Converts an image to
    * a base64 string.
    *
    *
    * If you want to use the
    * outputFormat or quality param
    * I strongly recommend you read the docs
    * @mozilla for `canvas.toDataURL()`
    *
    * @param {String} url
    * @param {Function} callback
    * @param {String} [outputFormat='image/png']
  4. @HaNdTriX HaNdTriX revised this gist Mar 11, 2014. 1 changed file with 4 additions and 3 deletions.
    7 changes: 4 additions & 3 deletions image_to_base64url.js
    View file
    Original file line number Diff line number Diff line change
    @@ -2,9 +2,10 @@
    * Converts an image to
    * a base64 string.
    *
    * @param {String} url
    * @param {Function} callback
    * @param {String} [outputFormat='image/png']
    * @param {String} url
    * @param {Function} callback
    * @param {String} [outputFormat='image/png']
    * @param {Float} [quality=0.0 to 1.0]
    * @url https://gist.github.com/HaNdTriX/7704632/
    * @docs https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement#Methods
    * @author HaNdTriX
  5. @HaNdTriX HaNdTriX revised this gist Mar 11, 2014. 1 changed file with 11 additions and 9 deletions.
    20 changes: 11 additions & 9 deletions image_to_base64url.js
    View file
    Original file line number Diff line number Diff line change
    @@ -2,16 +2,18 @@
    * Converts an image to
    * a base64 string.
    *
    * @param {String} url
    * @param {Function} callback
    * @param {String} [outputFormat='image/png']
    * @author HaNdTriX
    * @param {String} url
    * @param {Function} callback
    * @param {String} [outputFormat='image/png']
    * @url https://gist.github.com/HaNdTriX/7704632/
    * @docs https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement#Methods
    * @author HaNdTriX
    * @example
    * imgToDataURL('http://goo.gl/AOxHAL', function(err, base64Img){
    * console.log('IMAGE:',base64Img);
    * })
    * imgToDataURL('http://goo.gl/AOxHAL', function(err, base64Img){
    * console.log('IMAGE:',base64Img);
    * })
    */
    function imgToDataURL(url, callback, outputFormat) {
    function imgToDataURL(url, callback, outputFormat, quality) {
    var canvas = document.createElement('CANVAS'),
    ctx = canvas.getContext('2d'),
    img = new Image();
    @@ -22,7 +24,7 @@ function imgToDataURL(url, callback, outputFormat) {
    canvas.width = img.width;
    try {
    ctx.drawImage(img, 0, 0);
    dataURL = canvas.toDataURL(outputFormat);
    dataURL = canvas.toDataURL(outputFormat, quality);
    callback(null, dataURL);
    } catch (e) {
    callback(e, null);
  6. @HaNdTriX HaNdTriX revised this gist Mar 11, 2014. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion image_to_base64url.js
    View file
    Original file line number Diff line number Diff line change
    @@ -22,7 +22,7 @@ function imgToDataURL(url, callback, outputFormat) {
    canvas.width = img.width;
    try {
    ctx.drawImage(img, 0, 0);
    dataURL = canvas.toDataURL(outputFormat || 'image/png');
    dataURL = canvas.toDataURL(outputFormat);
    callback(null, dataURL);
    } catch (e) {
    callback(e, null);
  7. @HaNdTriX HaNdTriX revised this gist Mar 11, 2014. 1 changed file with 10 additions and 10 deletions.
    20 changes: 10 additions & 10 deletions image_to_base64url.js
    View file
    Original file line number Diff line number Diff line change
    @@ -1,7 +1,7 @@
    /**
    * Converts an image to
    * a base64 string.
    *
    *
    * @param {String} url
    * @param {Function} callback
    * @param {String} [outputFormat='image/png']
    @@ -11,25 +11,25 @@
    * console.log('IMAGE:',base64Img);
    * })
    */
    function imgToDataURL(url, callback, outputFormat){
    function imgToDataURL(url, callback, outputFormat) {
    var canvas = document.createElement('CANVAS'),
    ctx = canvas.getContext('2d'),
    img = new Image();
    img.crossOrigin = 'Anonymous';
    img.onload = function(){
    img.onload = function() {
    var dataURL;
    canvas.height = img.height;
    canvas.width = img.width;
    try{
    ctx.drawImage(img,0,0);
    dataURL = canvas.toDataURL(outputFormat || 'image/png');
    callback(null, dataURL);
    }catch(e){
    try {
    ctx.drawImage(img, 0, 0);
    dataURL = canvas.toDataURL(outputFormat || 'image/png');
    callback(null, dataURL);
    } catch (e) {
    callback(e, null);
    }
    canvas = img = null;
    canvas = img = null;
    };
    img.onerror = function(){
    img.onerror = function() {
    callback(new Error('Could not load image.'), null);
    };
    img.src = url;
  8. @HaNdTriX HaNdTriX revised this gist Mar 11, 2014. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions image_to_base64url.js
    View file
    Original file line number Diff line number Diff line change
    @@ -7,11 +7,11 @@
    * @param {String} [outputFormat='image/png']
    * @author HaNdTriX
    * @example
    * convertImgToBase64('http://goo.gl/AOxHAL', function(err, base64Img){
    * imgToDataURL('http://goo.gl/AOxHAL', function(err, base64Img){
    * console.log('IMAGE:',base64Img);
    * })
    */
    function convertImgToBase64(url, callback, outputFormat){
    function imgToDataURL(url, callback, outputFormat){
    var canvas = document.createElement('CANVAS'),
    ctx = canvas.getContext('2d'),
    img = new Image();
  9. @HaNdTriX HaNdTriX revised this gist Mar 11, 2014. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion image_to_base64url.js
    View file
    Original file line number Diff line number Diff line change
    @@ -27,7 +27,7 @@ function convertImgToBase64(url, callback, outputFormat){
    }catch(e){
    callback(e, null);
    }
    canvas = null;
    canvas = img = null;
    };
    img.onerror = function(){
    callback(new Error('Could not load image.'), null);
  10. @HaNdTriX HaNdTriX revised this gist Mar 11, 2014. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion image_to_base64url.js
    View file
    Original file line number Diff line number Diff line change
    @@ -14,7 +14,7 @@
    function convertImgToBase64(url, callback, outputFormat){
    var canvas = document.createElement('CANVAS'),
    ctx = canvas.getContext('2d'),
    img = new Image;
    img = new Image();
    img.crossOrigin = 'Anonymous';
    img.onload = function(){
    var dataURL;
  11. @HaNdTriX HaNdTriX revised this gist Mar 11, 2014. 1 changed file with 3 additions and 3 deletions.
    6 changes: 3 additions & 3 deletions image_to_base64url.js
    View file
    Original file line number Diff line number Diff line change
    @@ -7,9 +7,9 @@
    * @param {String} [outputFormat='image/png']
    * @author HaNdTriX
    * @example
    convertImgToBase64('http://goo.gl/AOxHAL', function(err, base64Img){
    console.log('IMAGE:',base64Img);
    })
    * convertImgToBase64('http://goo.gl/AOxHAL', function(err, base64Img){
    * console.log('IMAGE:',base64Img);
    * })
    */
    function convertImgToBase64(url, callback, outputFormat){
    var canvas = document.createElement('CANVAS'),
  12. @HaNdTriX HaNdTriX revised this gist Mar 11, 2014. 1 changed file with 3 additions and 1 deletion.
    4 changes: 3 additions & 1 deletion image_to_base64url.js
    View file
    Original file line number Diff line number Diff line change
    @@ -1,5 +1,7 @@
    /**
    * convertImgToBase64
    * Converts an image to
    * a base64 string.
    *
    * @param {String} url
    * @param {Function} callback
    * @param {String} [outputFormat='image/png']
  13. @HaNdTriX HaNdTriX revised this gist Mar 11, 2014. 1 changed file with 12 additions and 4 deletions.
    16 changes: 12 additions & 4 deletions image_to_base64url.js
    View file
    Original file line number Diff line number Diff line change
    @@ -5,7 +5,7 @@
    * @param {String} [outputFormat='image/png']
    * @author HaNdTriX
    * @example
    convertImgToBase64('http://goo.gl/AOxHAL', function(base64Img){
    convertImgToBase64('http://goo.gl/AOxHAL', function(err, base64Img){
    console.log('IMAGE:',base64Img);
    })
    */
    @@ -15,12 +15,20 @@ function convertImgToBase64(url, callback, outputFormat){
    img = new Image;
    img.crossOrigin = 'Anonymous';
    img.onload = function(){
    var dataURL;
    canvas.height = img.height;
    canvas.width = img.width;
    ctx.drawImage(img,0,0);
    var dataURL = canvas.toDataURL(outputFormat || 'image/png');
    callback.call(this, dataURL);
    try{
    ctx.drawImage(img,0,0);
    dataURL = canvas.toDataURL(outputFormat || 'image/png');
    callback(null, dataURL);
    }catch(e){
    callback(e, null);
    }
    canvas = null;
    };
    img.onerror = function(){
    callback(new Error('Could not load image.'), null);
    };
    img.src = url;
    }
  14. @HaNdTriX HaNdTriX revised this gist Jan 30, 2014. 1 changed file with 3 additions and 3 deletions.
    6 changes: 3 additions & 3 deletions image_to_base64url.js
    View file
    Original file line number Diff line number Diff line change
    @@ -10,9 +10,9 @@
    })
    */
    function convertImgToBase64(url, callback, outputFormat){
    var canvas = document.createElement('CANVAS');
    var ctx = canvas.getContext('2d');
    var img = new Image;
    var canvas = document.createElement('CANVAS'),
    ctx = canvas.getContext('2d'),
    img = new Image;
    img.crossOrigin = 'Anonymous';
    img.onload = function(){
    canvas.height = img.height;
  15. @HaNdTriX HaNdTriX created this gist Nov 29, 2013.
    26 changes: 26 additions & 0 deletions image_to_base64url.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,26 @@
    /**
    * convertImgToBase64
    * @param {String} url
    * @param {Function} callback
    * @param {String} [outputFormat='image/png']
    * @author HaNdTriX
    * @example
    convertImgToBase64('http://goo.gl/AOxHAL', function(base64Img){
    console.log('IMAGE:',base64Img);
    })
    */
    function convertImgToBase64(url, callback, outputFormat){
    var canvas = document.createElement('CANVAS');
    var ctx = canvas.getContext('2d');
    var img = new Image;
    img.crossOrigin = 'Anonymous';
    img.onload = function(){
    canvas.height = img.height;
    canvas.width = img.width;
    ctx.drawImage(img,0,0);
    var dataURL = canvas.toDataURL(outputFormat || 'image/png');
    callback.call(this, dataURL);
    canvas = null;
    };
    img.src = url;
    }