optimizing code for speed working (imgur api paper working random image NO DRAWING public (for now) with cross origin browser enabled)

working (cross browser working for data images do not alter !!!) you can edit this code to your hearts content

by Nick Hulea

HTML

<script src="http://cdn.eyahuska.com/papernew.js"></script>
<canvas resize="true" id="mycanvas"></canvas>
<div id="button">click</div>
<script type="text/paperscript" canvas="mycanvas">
    var r;
    var path;
    var preloadAmount = 4;
    var cache = [];
    var imgurcache = [];
    var convertCache = [];
    var resultcache = [];
    var rArray = [];
    var convertedArray = [];
    var raster;
    var background;
    var imagesrc;
    var imagesrcs;
    var autoShowNext = false;
    var value = isNaN(value) ? 0 : value;

    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');
            dude = dataURL;
            callback.call(this, dataURL);
            canvas = null;
        };
        img.src = url;
    }

    function convertImages(urlList) {
        var promiseList = [];

        promiseList = urlList.map(function(url) {
            var dfd = new $.Deferred();

            convertImgToBase64(url, function(img) {
                dfd.resolve(img);
            });

            return dfd.promise();
        });

        return $.when.apply(this, promiseList);
    }

    function extractToken(hash) {
        var match = hash.match(/access_token=(\w+)/);
        return !!match && match[1];
    }
    var num = Math.floor(Math.random() * 10); // 0...6
    var token = extractToken(document.location.hash);
    var clientId = 'b144351ffb05838';
    var auth;
    if (token) authorization = 'Bearer ' + token;
    else authorization = 'Client-ID ' + clientId;
    $.ajax({
        url: 'https://api.imgur.com/3/gallery/random/random/page=' + num,
        method: 'GET',
       ...

CSS

canvas {
    width:100%;
    overflow:hidden;
    position:absolute;
    top:0;
    left:0;
    margin-top:50px;
    cursor:pointer;
}
#button {
    width:10%;
    overflow:hidden;
    position:absolute;
    top:0;
    left:0;
    background-color:#666;
    color:#fff;
    padding:10px;
}
#button:hover {
    background-color:#000;
    cursor:pointer;
}

JavaScript

$("#button").on("click", function () {
    var img = document.createElement('img');
    var canvas = document.getElementById('mycanvas');
    var url = canvas.toDataURL(); // Read succeeds, canvas won't be dirty
    console.log(url);
    img.src = url;
});