// define variables var socket = io(); var uploader = new SocketIOFileUpload(socket); var stagedFiles = null; var license = 'Creative Commons'; var nsfw = false; var claimName; function dataURItoBlob(dataURI) { // convert base64/URLEncoded data component to raw binary data held in a string var byteString; if (dataURI.split(',')[0].indexOf('base64') >= 0) byteString = atob(dataURI.split(',')[1]); else byteString = unescape(dataURI.split(',')[1]); // separate out the mime component var mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0]; // write the bytes of the string to a typed array var ia = new Uint8Array(byteString.length); for (var i = 0; i < byteString.length; i++) { ia[i] = byteString.charCodeAt(i); } return new Blob([ia], {type:mimeString}); } function startPublish() { //download the image var dataUrl = canvas.toDataURL('image/jpeg'); // canvas defined in memeDraw.js var blob = dataURItoBlob(dataUrl) claimName = claimNameInput.value; // claimNameInput.value defined in memeDraw.js var fileName = claimNameInput.value + ".jpg"; var file = new File([blob], fileName, {type: 'image/jpeg', lastModified: Date.now()}); console.log(file); stageAndPublish(file); }; /* helper functions */ // create a progress animation function createProgressBar(element, size){ var x = 1; var adder = 1; function addOne(){ var bars = '

|'; for (var i = 0; i < x; i++){ bars += ' | '; } bars += '

'; element.innerHTML = bars; if (x === size){ adder = -1; } else if ( x === 0){ adder = 1; } x += adder; }; setInterval(addOne, 300); } function stageAndPublish(file) { // stage files stagedFiles = [file]; // stores the selected file for // make sure a file was selected if (stagedFiles) { // make sure only 1 file was selected if (stagedFiles.length < 1) { alert("A file is needed"); return; } // make sure the content type is acceptable switch (stagedFiles[0].type) { case "image/png": case "image/jpeg": case "image/gif": case "video/mp4": uploader.submitFiles(stagedFiles); break; default: alert("Only .png, .jpeg, .gif, and .mp4 files are currently supported"); break; } } } // update the publish status function updatePublishStatus(msg){ document.getElementById('publish-status').innerHTML = msg; } /* socketio-file-upload listeners */ uploader.addEventListener('start', function(event){ event.file.meta.name = claimName; event.file.meta.license = license; event.file.meta.nsfw = nsfw; event.file.meta.type = stagedFiles[0].type; // re-set the html in the publish area document.getElementById('publish-active-area').innerHTML = '
'; // start a progress animation createProgressBar(document.getElementById('progress-bar'), 12); }); uploader.addEventListener('progress', function(event){ var percent = event.bytesLoaded / event.file.size * 100; updatePublishStatus('File is ' + percent.toFixed(2) + '% loaded to the server'); }); /* socket.io message listeners */ socket.on('publish-status', function(msg){ updatePublishStatus(msg); }); socket.on('publish-failure', function(msg){ document.getElementById('publish-active-area').innerHTML = '

' + JSON.stringify(msg) + '

--(✖╭╮✖)→

For help, post the above error text in the #speech channel on the LBRY slack'; }); socket.on('publish-complete', function(msg){ var publishResults; var directUrl = '/' + msg.name + '/' + msg.result.claim_id; // build new publish area publishResults = '

Your publish is complete! View it here:

'; publishResults += '

spee.ch' + directUrl + '

'; publishResults += '

'; publishResults += '

View the transaction details

'; publishResults += '

'; // update publish area document.getElementById('publish-active-area').innerHTML = publishResults; // update the link holder document.getElementById('direct-link-holder').innerText = 'https://spee.ch' + directUrl; // enable copy-to-clipboard var copyBtn = document.querySelector('.copy-button'); copyBtn.addEventListener('click', function(event) { // select the text var text = document.getElementById('direct-link-holder'); text.select(); try { var successful = document.execCommand('copy'); var msg = successful ? 'successful' : 'unsuccessful'; console.log('Copying text command was ' + msg); } catch (err) { alert('Oops, unable to copy'); } }); });