new base 64 url function NO ARRAY
by Nick Hulea
HTML
<div id="preloader" style="display:none;">
<div id="status"> </div>
</div>
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;
}
#preloader {
position:fixed;
top:0;
left:0;
right:0;
bottom:0;
background-color:#fff;
z-index:99;
}
#status {
width:200px;
height:200px;
position:absolute;
left:50%;
top:50%;
background-image:url(http://eyahuska.com/draw_image_v2/css/img/status.gif);
background-repeat:no-repeat;
background-position:center;
margin:-100px 0 0 -100px;
}
JavaScript
var imgurcache = [];
var ajaxlength = [];
var dude, output;
var valueajax = isNaN(valueajax) ? 0 : valueajax;
function base64(url) {
var dataURL;
var img = new Image(),
canvas = document.createElement("canvas"),
ctx = canvas.getContext("2d"),
src = url; // insert image url here
img.crossOrigin = "Anonymous";
img.onload = function () {
canvas.height = img.height;
canvas.width = img.width;
ctx.drawImage(img, 0, 0);
var dataURL = canvas.toDataURL('image/png');
canvas = null;
pass(dataURL);
};
img.src = url;
}
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',
headers: {
Authorization: authorization,
Accept: 'application/json'
},
crossDomain: true,
data: {
image: localStorage.dataBase64,
type: 'base64'
},
beforeSend: function () {
$('#preloader').css('display', 'block');
},
success: handleData
});
function handleData(result) {
$.each(result.data, function (idx, image) {
if (result.data[idx].animated === false) if (result.data[idx].is_album === false) {
var rimgur = image.link;
ajaxlength.push({imageamount:valueajax++})
var newimage = base64(rimgur);
}
});
}
function pass(dataURL) {
console.log(ajaxlength.length);
imgurcache.push({image:dataURL});
console.log(imgurcache.length);
console.log(dataURL);
if(ajaxlength.length == imgurcache.length){
$('#preloader').fadeOut('slow');
console.log('done');
}
}