diff --git a/public/css/style.css b/public/css/style.css index 5fc58c7..324bb9d 100644 --- a/public/css/style.css +++ b/public/css/style.css @@ -50,6 +50,8 @@ div#dropzone:hover { color: #fff; } +div#uploads, p#tokenContainer { display: none; } + img.logo { height: 200px; margin-top: 20px; } .dz-preview .dz-details { display: flex; } .dz-preview .dz-details .dz-size, .dz-preview .dz-details .dz-filename { flex: 1 } diff --git a/public/index.html b/public/index.html index bbf12e1..3a88746 100644 --- a/public/index.html +++ b/public/index.html @@ -24,9 +24,15 @@
-
- View on Github -
Click here or drag and drop files
+
+ +

+ + Check +

+ + View on Github +
diff --git a/public/js/upload.js b/public/js/upload.js index 0696af6..636627e 100644 --- a/public/js/upload.js +++ b/public/js/upload.js @@ -1,53 +1,79 @@ -var maxSize = '512'; - -var xhr = new XMLHttpRequest(); -xhr.onreadystatechange = function() { - if (xhr.readyState == XMLHttpRequest.DONE) { - if(xhr.responseText !== 'not-authorized'){ - document.getElementById('btnGithub').style.display = 'none'; - document.getElementById('dropzone').style.display = 'flex'; - } - if(xhr.responseText.maxFileSize) - maxSize = xhr.responseText.maxFileSize; - } -} -xhr.open('GET', '/api/info', true); -xhr.send(null); window.onload = function () { - var previewNode = document.querySelector("#template"); - previewNode.id = ""; - var previewTemplate = previewNode.parentNode.innerHTML; - previewNode.parentNode.removeChild(previewNode); + var maxSize = '512'; - var dropzone = new Dropzone('div#dropzone', { - url: '/api/upload', - paramName: 'file', - maxFilesize: maxSize, - parallelUploads: 2, - uploadMultiple: false, - previewsContainer: 'div#uploads', - previewTemplate: previewTemplate, - createImageThumbnails: false, - maxFiles: 1000, - autoProcessQueue: true - }); + if(!localStorage.token){ + document.getElementById('tokenContainer').style.display = 'flex' + document.getElementById("tokenSubmit").addEventListener("click", function(){ + getInfo(document.getElementById("token").value) + }); + }else{ + getInfo(localStorage.token); + } - // Update the total progress bar - dropzone.on("uploadprogress", function(file, progress) { - file.previewElement.querySelector(".progress").style.width = progress + "%"; - }); + function prepareDropzone(){ - dropzone.on("success", function(file, response) { - // Handle the responseText here. For example, add the text to the preview element: - a = document.createElement('a'); - a.href = response.url; - a.target = '_blank'; - a.innerHTML = response.filename; + var previewNode = document.querySelector("#template"); + previewNode.id = ""; + var previewTemplate = previewNode.parentNode.innerHTML; + previewNode.parentNode.removeChild(previewNode); - file.previewTemplate.querySelector(".progress").style.display = 'none'; - file.previewTemplate.querySelector(".link").appendChild(a); - }); + var dropzone = new Dropzone('div#dropzone', { + url: '/api/upload', + paramName: 'file', + maxFilesize: maxSize, + parallelUploads: 2, + uploadMultiple: false, + previewsContainer: 'div#uploads', + previewTemplate: previewTemplate, + createImageThumbnails: false, + maxFiles: 1000, + autoProcessQueue: true + }); + // Update the total progress bar + dropzone.on("uploadprogress", function(file, progress) { + file.previewElement.querySelector(".progress").style.width = progress + "%"; + }); + + dropzone.on("success", function(file, response) { + // Handle the responseText here. For example, add the text to the preview element: + a = document.createElement('a'); + a.href = response.url; + a.target = '_blank'; + a.innerHTML = response.filename; + + file.previewTemplate.querySelector(".progress").style.display = 'none'; + file.previewTemplate.querySelector(".link").appendChild(a); + }); + + } + + function getInfo(token) { + var xhr = new XMLHttpRequest(); + + xhr.onreadystatechange = function() { + if (xhr.readyState == XMLHttpRequest.DONE) { + if(xhr.responseText !== 'not-authorized'){ + + div = document.createElement('div'); + div.id = 'dropzone'; + div.innerHTML = 'Click here or drag and drop files'; + div.style.display = 'flex'; + + document.getElementById('btnGithub').style.display = 'none'; + document.getElementById('tokenContainer').style.display = 'none'; + document.getElementById('uploadContainer').appendChild(div); + + if(xhr.responseText.maxFileSize) maxSize = xhr.responseText.maxFileSize; + if(token) localStorage.token = token; + prepareDropzone(); + } + } + } + xhr.open('GET', '/api/info', true); + xhr.setRequestHeader('auth', token); + xhr.send(null); + } }; \ No newline at end of file