gif.js lib testing

Description

by Guddu Kumar

HTML

<script src="https://rawgit.com/lucusp/drawr/master/drawr.js"></script>
<script src="https://rawgit.com/jnordberg/gif.js/gh-pages/gif.worker.js"></script>
<script src="https://rawgit.com/jnordberg/gif.js/gh-pages/gif.js"></script>
<canvas id="myCanvas"></canvas>

<button id="addFrame">Add Frame</button>
<button id="makeGIF">Make GIF</button>

CSS

#myCanvas {
    
    border: 1px solid;
    
}

JavaScript

drawr.start({id:"myCanvas", w:300, h:300});
drawr.draw('black', 5);

    var gif = new GIF({
      workers: 2,
      quality: 10
    });

    // or a canvas element
    $('#addFrame').click(function(){
      var $newFrame = $('#myCanvas');
      gif.addFrame($newFrame[0], {delay: 200});
      console.log("Frame Added");
    });

    $('#makeGIF').click(function(){
        gif.on('finished', function(blob) {
          window.open(URL.createObjectURL(blob));
          debugger
        });
        
        gif.render();
    });