mirror of
https://github.com/BobbyWibowo/lolisafe.git
synced 2024-12-15 00:46:22 +00:00
7855801d62
Rewritten codes for home uploader config. All options are now defined in a single config object in home.js. Config tab content will be dynamically generated through that config. This should eliminate the need of modifying home.njk whenever a new option needs to be added, make the codes more readable, and easier to extend. Upgrade stylelint dev dependency. Bumped v1 version string.
3 lines
19 KiB
JavaScript
3 lines
19 KiB
JavaScript
var lsKeys={token:"token",chunkSize:"chunkSize",parallelUploads:"parallelUploads",uploadsHistoryOrder:"uploadsHistoryOrder",previewImages:"previewImages",fileLength:"fileLength",uploadAge:"uploadAge"},page={token:localStorage[lsKeys.token],private:null,enableUserAccounts:null,maxSize:null,chunkSize:null,temporaryUploadAges:null,fileIdentifierLength:null,album:null,parallelUploads:2,previewImages:null,fileLength:null,uploadAge:null,maxSizeBytes:null,urlMaxSize:null,urlMaxSizeBytes:null,tabs:[],activeTab:null,albumSelect:null,previewTemplate:null,dropzone:null,clipboardJS:null,lazyLoad:null,imageExts:[".webp",".jpg",".jpeg",".bmp",".gif",".png",".tiff",".tif",".svg"],videoExts:[".webm",".mp4",".wmv",".avi",".mov",".mkv"],albumTitleMaxLength:70,albumDescMaxLength:4e3,onInitError:function(e){document.querySelector("#albumDiv").classList.add("is-hidden"),document.querySelector("#tabs").classList.add("is-hidden"),document.querySelectorAll(".tab-content").forEach((function(e){return e.classList.add("is-hidden")}));var a=document.querySelector("#loginToUpload");a.innerText="An error occurred. Try to reload?",a.classList.remove("is-loading"),a.classList.remove("is-hidden"),a.addEventListener("click",(function(){location.reload()})),e.response?page.onAxiosError(e):page.onError(e)},onError:function(e){console.error(e);var a=document.createElement("div");return a.innerHTML="<code>"+e.toString()+"</code>",swal({title:"An error occurred!",icon:"error",content:a})},onAxiosError:function(e){console.error(e);var a={520:"Unknown Error",521:"Web Server Is Down",522:"Connection Timed Out",523:"Origin Is Unreachable",524:"A Timeout Occurred",525:"SSL Handshake Failed",526:"Invalid SSL Certificate",527:"Railgun Error",530:"Origin DNS Error"}[e.response.status]||e.response.statusText,t=e.response.data&&e.response.data.description?e.response.data.description:"There was an error with the request, please check the console for more information.";return swal(e.response.status+" "+a,t,"error")},checkIfPublic:function(){var e=!1;return axios.get("api/check",{onDownloadProgress:function(){e||"function"!=typeof page.doRender||(page.doRender(),e=!0)}}).then((function(e){return page.private=e.data.private,page.enableUserAccounts=e.data.enableUserAccounts,page.maxSize=parseInt(e.data.maxSize),page.maxSizeBytes=1e6*page.maxSize,page.chunkSize=parseInt(e.data.chunkSize),page.temporaryUploadAges=e.data.temporaryUploadAges,page.fileIdentifierLength=e.data.fileIdentifierLength,page.preparePage()})).catch(page.onInitError)},preparePage:function(){if(!page.private)return page.prepareUpload();if(page.token)return page.verifyToken(page.token,!0);var e=document.querySelector("#loginToUpload");e.href="auth",e.classList.remove("is-loading"),page.enableUserAccounts?e.innerText="Anonymous upload is disabled. Log in to upload.":e.innerText="Running in private mode. Log in to upload."},verifyToken:function(e,a){return axios.post("api/tokens/verify",{token:e}).then((function(t){return!1===t.data.success?swal({title:"An error occurred!",text:t.data.description,icon:"error"}).then((function(){a&&(localStorage.removeItem("token"),location.reload())})):(localStorage[lsKeys.token]=e,page.token=e,page.prepareUpload())})).catch(page.onInitError)},prepareUpload:function(){page.token&&(document.querySelector("#albumDiv").classList.remove("is-hidden"),page.albumSelect=document.querySelector("#albumSelect"),page.albumSelect.addEventListener("change",(function(){page.album=parseInt(page.albumSelect.value),"function"==typeof page.prepareShareX&&page.prepareShareX()})),page.fetchAlbums()),page.prepareUploadConfig(),document.querySelector("#maxSize > span").innerHTML=page.getPrettyBytes(page.maxSizeBytes),document.querySelector("#loginToUpload").classList.add("is-hidden"),!page.token&&page.enableUserAccounts&&(document.querySelector("#loginLinkText").innerHTML="Create an account and keep track of your uploads"),page.prepareDropzone(),"function"==typeof page.prepareShareX&&page.prepareShareX();var e=document.querySelector("#urlMaxSize");e&&(page.urlMaxSize=parseInt(e.innerHTML),page.urlMaxSizeBytes=1e6*page.urlMaxSize,e.innerHTML=page.getPrettyBytes(page.urlMaxSizeBytes),document.querySelector("#uploadUrls").addEventListener("click",(function(e){page.uploadUrls(e.currentTarget)})));for(var a=document.querySelector("#tabs"),t=a.querySelectorAll("li"),n=function(e){var a=t[e].dataset.id,n=document.querySelector("#"+a);n&&(t[e].addEventListener("click",(function(){page.setActiveTab(e)})),page.tabs.push({tab:t[e],content:n}))},r=0;r<t.length;r++)n(r);page.tabs.length&&(page.setActiveTab(0),a.classList.remove("is-hidden"))},setActiveTab:function(e){for(var a=0;a<page.tabs.length;a++)a===e?(page.tabs[a].tab.classList.add("is-active"),page.tabs[a].content.classList.remove("is-hidden"),page.activeTab=e):(page.tabs[a].tab.classList.remove("is-active"),page.tabs[a].content.classList.add("is-hidden"))},fetchAlbums:function(){return axios.get("api/albums",{headers:{token:page.token}}).then((function(e){if(!1===e.data.success)return swal("An error occurred!",e.data.description,"error");if(Array.isArray(e.data.albums)&&e.data.albums.length)for(var a=0;a<e.data.albums.length;a++){var t=e.data.albums[a],n=document.createElement("option");n.value=t.id,n.innerHTML=t.name,page.albumSelect.appendChild(n)}})).catch(page.onInitError)},prepareDropzone:function(){var e=document.querySelector("#tpl");page.previewTemplate=e.innerHTML,e.parentNode.removeChild(e);var a=document.querySelector("#tab-files"),t=document.createElement("div");t.className="control is-expanded",t.innerHTML='\n <div id="dropzone" class="button is-danger is-outlined is-fullwidth is-unselectable">\n <span class="icon">\n <i class="icon-upload-cloud"></i>\n </span>\n <span>Click here or drag & drop files</span>\n </div>\n ',a.querySelector(".dz-container").appendChild(t);var n=a.querySelector("#tab-files .field.uploads");page.dropzone=new Dropzone(document.body,{url:"api/upload",paramName:"files[]",clickable:a.querySelector("#dropzone"),maxFilesize:page.maxSizeBytes/1024/1024,parallelUploads:page.parallelUploads,uploadMultiple:!1,previewsContainer:n,previewTemplate:page.previewTemplate,createImageThumbnails:!1,autoProcessQueue:!0,headers:{token:page.token},chunking:Boolean(page.chunkSize),chunkSize:1e6*page.chunkSize,parallelChunkUploads:!1,chunksUploaded:function(e,a){return e.previewElement.querySelector(".progress").setAttribute("value",100),e.previewElement.querySelector(".progress").innerHTML="100%",axios.post("api/upload/finishchunks",{files:[{uuid:e.upload.uuid,original:e.name,type:e.type,albumid:page.album,filelength:page.fileLength,age:page.uploadAge}]},{headers:{token:page.token}}).catch((function(e){return e.response.data?e.response:{data:{success:!1,description:e.toString()}}})).then((function(t){return e.previewElement.querySelector(".progress").classList.add("is-hidden"),!1===t.data.success&&(e.previewElement.querySelector(".error").innerHTML=t.data.description),t.data.files&&t.data.files[0]&&page.updateTemplate(e,t.data.files[0]),a()}))}}),page.dropzone.on("addedfile",(function(e){0!==page.activeTab&&page.setActiveTab(0),a.querySelector(".uploads").classList.remove("is-hidden"),e.previewElement.querySelector(".name").innerHTML=e.name})),page.dropzone.on("sending",(function(e,a){e.upload.chunked||(null!==page.album&&a.setRequestHeader("albumid",page.album),null!==page.fileLength&&a.setRequestHeader("filelength",page.fileLength),null!==page.uploadAge&&a.setRequestHeader("age",page.uploadAge))})),page.dropzone.on("uploadprogress",(function(e,a){e.upload.chunked&&100===a||(e.previewElement.querySelector(".progress").setAttribute("value",a),e.previewElement.querySelector(".progress").innerHTML=a+"%")})),page.dropzone.on("success",(function(e,a){a&&(e.previewElement.querySelector(".progress").classList.add("is-hidden"),!1===a.success&&(e.previewElement.querySelector(".error").innerHTML=a.description),a.files&&a.files[0]&&page.updateTemplate(e,a.files[0]))})),page.dropzone.on("error",(function(e,a){("string"==typeof a&&/^File is too big/.test(a)||"object"==typeof a&&/File too large/.test(a.description))&&(a="File too large ("+page.getPrettyBytes(e.size)+")."),page.updateTemplateIcon(e.previewElement,"icon-block"),e.previewElement.querySelector(".progress").classList.add("is-hidden"),e.previewElement.querySelector(".name").innerHTML=e.name,e.previewElement.querySelector(".error").innerHTML=a.description||a}))},uploadUrls:function(e){var a=document.querySelector("#tab-urls");if(a&&!e.classList.contains("is-loading"))return e.classList.add("is-loading"),function(){var e={token:page.token,albumid:page.album,age:page.uploadAge,filelength:page.fileLength},n=a.querySelector(".uploads"),r=document.querySelector("#urls").value.split(/\r?\n/).filter((function(e){return e.trim().length}));if(document.querySelector("#urls").value=r.join("\n"),!r.length)return t("You have not entered any URLs.");a.querySelector(".uploads").classList.remove("is-hidden");var l=r.map((function(e){var a=document.createElement("template");a.innerHTML=page.previewTemplate.trim();var t=a.content.firstChild;return t.querySelector(".name").innerHTML=e,n.appendChild(t),{url:e,previewElement:t}}));return function a(n){if(n===l.length)return t();function r(e){return l[n].previewElement.querySelector(".progress").classList.add("is-hidden"),e.success?page.updateTemplate(l[n],e.files[0]):(page.updateTemplateIcon(l[n].previewElement,"icon-block"),l[n].previewElement.querySelector(".error").innerHTML=e.description),a(n+1)}return l[n].previewElement.querySelector(".progress").removeAttribute("value"),axios.post("api/upload",{urls:[l[n].url]},{headers:e}).then((function(e){return r(e.data)})).catch((function(e){return r({success:!1,description:e.response?e.response.data.description:e.toString()})}))}(0)}();function t(a){a&&swal("An error occurred!",a,"error"),e.classList.remove("is-loading")}},updateTemplateIcon:function(e,a){var t=e.querySelector(".icon");t&&(t.classList.add(a),t.classList.remove("is-hidden"))},updateTemplate:function(e,a){if(a.url){var t=e.previewElement.querySelector(".link > a"),n=e.previewElement.querySelector(".clipboard-mobile > .clipboard-js");t.href=t.innerHTML=n.dataset.clipboardText=a.url,n.parentElement.classList.remove("is-hidden");var r=/.[\w]+(\?|$)/.exec(a.url),l=r&&r[0]?r[0].toLowerCase():null;if(page.imageExts.includes(l))if(page.previewImages){var i=e.previewElement.querySelector("img");i.setAttribute("alt",a.name||""),i.dataset.src=a.url,i.classList.remove("is-hidden"),i.onerror=function(a){a.currentTarget.classList.add("is-hidden"),page.updateTemplateIcon(e.previewElement,"icon-picture")},page.lazyLoad.update(e.previewElement.querySelectorAll("img"))}else page.updateTemplateIcon(e.previewElement,"icon-picture");else page.videoExts.includes(l)?page.updateTemplateIcon(e.previewElement,"icon-video"):page.updateTemplateIcon(e.previewElement,"icon-doc-inv");if(a.expirydate){var o=e.previewElement.querySelector(".expiry-date");o.innerHTML="EXP: "+page.getPrettyDate(new Date(1e3*a.expirydate)),o.classList.remove("is-hidden")}}},createAlbum:function(){var e=document.createElement("div");e.innerHTML='\n <div class="field">\n <div class="controls">\n <input id="swalName" class="input" type="text" placeholder="Name" maxlength="'+page.albumTitleMaxLength+'">\n </div>\n <p class="help">Max length is '+page.albumTitleMaxLength+' characters.</p>\n </div>\n <div class="field">\n <div class="control">\n <textarea id="swalDescription" class="textarea" placeholder="Description" rows="2" maxlength="'+page.albumDescMaxLength+'"></textarea>\n </div>\n <p class="help">Max length is '+page.albumDescMaxLength+' characters.</p>\n </div>\n <div class="field">\n <div class="control">\n <label class="checkbox">\n <input id="swalDownload" type="checkbox" checked>\n Enable download\n </label>\n </div>\n </div>\n <div class="field">\n <div class="control">\n <label class="checkbox">\n <input id="swalPublic" type="checkbox" checked>\n Enable public link\n </label>\n </div>\n </div>\n ',swal({title:"Create new album",icon:"info",content:e,buttons:{cancel:!0,confirm:{closeModal:!1}}}).then((function(e){if(e){var a=document.querySelector("#swalName").value.trim();axios.post("api/albums",{name:a,description:document.querySelector("#swalDescription").value.trim(),download:document.querySelector("#swalDownload").checked,public:document.querySelector("#swalPublic").checked},{headers:{token:page.token}}).then((function(e){if(!1===e.data.success)return swal("An error occurred!",e.data.description,"error");var t=document.createElement("option");page.albumSelect.appendChild(t),t.value=e.data.id,t.innerHTML=a,t.selected=!0,swal("Woohoo!","Album was created successfully.","success")})).catch(page.onError)}}))},prepareUploadConfig:function(){var e={chunkSize:page.chunkSize,parallelUploads:page.parallelUploads},a=Array.isArray(page.temporaryUploadAges)&&page.temporaryUploadAges.length,t=page.fileIdentifierLength&&"number"==typeof page.fileIdentifierLength.min&&"number"==typeof page.fileIdentifierLength.max,n={siBytes:{label:"File size display",select:[{value:"default",text:"1000 B = 1 kB = 1 Kilobyte"},{value:"0",text:"1024 B = 1 KiB = 1 Kibibyte"}],help:"This will be used in our homepage, dashboard, and album public pages.",valueHandler:function(){}},fileLength:{display:t,label:"File identifier length",number:t?{min:page.fileIdentifierLength.min,max:page.fileIdentifierLength.max,round:!0}:void 0,help:!0,disabled:t&&page.fileIdentifierLength.force},uploadAge:{display:a,label:"Upload age",select:[],help:"This allows your files to automatically be deleted after a certain period of time."},chunkSize:{display:!isNaN(page.chunkSize),label:"Upload chunk size (MB)",number:{min:1,max:95,suffix:" MB",round:!0},help:!0},parallelUploads:{label:"Parallel uploads",number:{min:1,max:10,round:!0},help:!0},uploadsHistoryOrder:{label:"Uploads history order",select:[{value:"default",text:"Older files on top"},{value:"0",text:"Newer files on top"}],help:'Newer files on top will use <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/flex-direction#Accessibility_Concerns" target="_blank" rel="noopener">a CSS technique</a>.<br>\n Trying to select their texts manually from top to bottom will end up selecting the texts from bottom to top instead.',valueHandler:function(e){if("0"===e)for(var a=document.querySelectorAll(".tab-content > .uploads"),t=0;t<a.length;t++)a[t].classList.add("is-reversed")}},previewImages:{label:"Load images for preview",select:[{value:"default",text:"Yes"},{value:"0",text:"No"}],help:"By default, uploaded images will be loaded as their previews.",valueHandler:function(e){page.previewImages="0"!==e}}};if(a)for(var r=parseFloat(localStorage[lsKeys.uploadAge]),l=0;l<page.temporaryUploadAges.length;l++){var i=page.temporaryUploadAges[l];n.uploadAge.select.push({value:0===l?"default":String(i),text:page.getPrettyUploadAge(i)}),i===r&&(n.uploadAge.value=r)}if(t){e.fileLength=page.fileIdentifierLength.default||void 0;var o=parseInt(localStorage[lsKeys.fileLength]);!page.fileIdentifierLength.force&&!isNaN(o)&&o>=page.fileIdentifierLength.min&&o<=page.fileIdentifierLength.max&&(n.fileLength.value=o)}var s=document.querySelector("#tab-config"),p=document.createElement("form");p.addEventListener("submit",(function(e){return e.preventDefault()}));for(var d=Object.keys(n),c=0;c<d.length;c++){var u=d[c],g=n[u];if(!1!==g.display){var m=document.createElement("div");m.className="field";var f=void 0;if(!g.disabled){if(void 0!==g.value)f=g.value;else if(void 0!==g.number){var v=parseInt(localStorage[lsKeys[u]]);isNaN(v)||(f=v)}else f=localStorage[lsKeys[u]];"function"==typeof g.valueHandler?g.valueHandler(f):void 0!==f&&(page[u]=f)}var h=void 0;if(Array.isArray(g.select)){(h=document.createElement("div")).className="select is-fullwidth";for(var b=[],y=0;y<g.select.length;y++){var S=g.select[y],L=f&&S.value===String(f);b.push('\n <option value="'+S.value+'"'+(L?" selected":"")+">\n "+S.text+("default"===S.value?" (default)":"")+"\n </option>\n ")}h.innerHTML='\n <select id="'+u+'">\n '+b.join("\n")+"\n </select>\n "}else void 0!==g.number&&((h=document.createElement("input")).id=h.name=u,h.className="input is-fullwidth",h.type="number",void 0!==g.number.min&&(h.min=g.number.min),void 0!==g.number.max&&(h.max=g.number.max),"number"==typeof f?h.value=f:void 0!==e[u]&&(h.value=e[u]));var w=void 0;if(g.disabled)h.disabled=g.disabled,w="This option is currently disabled.";else if("string"==typeof g.help)w=g.help;else if(!0===g.help&&void 0!==g.number){var x=[];void 0!==e[u]&&x.push("Default is "+e[u]+(g.number.suffix||"")+"."),void 0!==g.number.min&&x.push("Min is "+g.number.min+(g.number.suffix||"")+"."),void 0!==g.number.max&&x.push("Max is "+g.number.max+(g.number.suffix||"")+"."),w=x.join(" ")}m.innerHTML='\n <label class="label">'+g.label+'</label>\n <div class="control"></div>\n '+(w?'<p class="help">'+w+"</p>":"")+"\n ",m.querySelector("div.control").appendChild(h),p.appendChild(m)}}var k=document.createElement("div");k.className="field",k.innerHTML='\n <p class="control">\n <button id="saveConfig" type="submit" class="button is-danger is-outlined is-fullwidth">\n <span class="icon">\n <i class="icon-floppy"></i>\n </span>\n <span>Save & reload</span>\n </button>\n </p>\n <p class="help">\n This configuration will only be used in this browser.<br>\n After reloading the page, some of them will also be applied to the ShareX config that you can download by clicking on the ShareX icon below.\n </p>\n ',p.appendChild(k),p.querySelector("#saveConfig").addEventListener("click",(function(){if(p.checkValidity()){for(var a=Object.keys(n).filter((function(e){return!1!==n[e].display&&!0!==n[e].disabled})),t=0;t<a.length;t++){var r=a[t],l=void 0;if(void 0!==n[r].select)"default"!==p.elements[r].value&&(l=p.elements[r].value);else if(void 0!==n[r].number){var i=parseInt(p.elements[r].value);isNaN(i)||(l=Math.min(Math.max(i,n[r].number.min),n[r].number.max))}void 0!==l&&l!==e[r]?localStorage[lsKeys[r]]=l:localStorage.removeItem(lsKeys[r])}swal({title:"Woohoo!",text:"Configuration saved into this browser.",icon:"success"}).then((function(){location.reload()}))}})),s.appendChild(p)},getPrettyUploadAge:function(e){if(0===e)return"Permanent";if(e<1){var a=60*e;return a+" minute"+(1===a?"":"s")}if(e>=24){var t=e/24;return t+" day"+(1===t?"":"s")}return e+" hour"+(1===e?"":"s")}};window.addEventListener("paste",(function(e){for(var a=(e.clipboardData||e.originalEvent.clipboardData).items,t=Object.keys(a),n=0;n<t.length;n++){var r=a[t[n]];if("file"===r.kind){var l=r.getAsFile(),i=new File([l],"pasted-image."+l.type.match(/(?:[^/]*\/)([^;]*)/)[1],{type:l.type});page.dropzone.addFile(i)}}})),window.onload=function(){page.checkIfPublic(),page.clipboardJS=new ClipboardJS(".clipboard-js"),page.clipboardJS.on("success",(function(){return swal("Copied!","The link has been copied to clipboard.","success")})),page.clipboardJS.on("error",page.onError),page.lazyLoad=new LazyLoad({elements_selector:".field.uploads img"}),document.querySelector("#createAlbum").addEventListener("click",(function(){page.createAlbum()}))};
|
|
//# sourceMappingURL=home.js.map
|