filesafe/dist/js/home.js
Bobby Wibowo 9e9b0d4439
Updated
Updated some dev dependencies.

---

Gulp will now build CSS/JS files during development into dist-dev
directory, to prevent IDE's Git from unnecessarily building diff's.

Added dist-dev to ignore files.

---

The entire config fille will now be passed to Nunjuck templates for ease
of access of config values.

Root domain for use in Nunjuck templates will now be parsed from config.

Better page titles.

Updated help message for "Uploads history order" option in
homepage's config tab.

Added "Load images for preview" option to homepage's config tab.
Setting this to false will now prevent image uploads from loading
themselves for previews.

Uploads' original names in homepage's uploads history are now
selectable.

Min/max length for user/pass are now enforced in auth's front-end.

Improved performance of album public pages.
Their generated HTML pages will now be cached into memory.
Unfortunately, No-JS version of their pages will be cached separately,
so each album may take up to double the memory space.

File names in thumbnails no longer have their full URLs as tooltips.
I saw no point in that behavior.

Added video icons.
Homepage's uploads history will now display video icons for videos.

"View thumbnail" button in Dashboard is now renamed to "Show preview".
Their icons will also be changed depending on their file types.

Added max length for albums' title & description.
These will be enforced both in front-end and back-end.
Existing albums that have surpassed the limits will not be enforced.

A few other small improvements.
2019-09-17 11:13:41 +07:00

3 lines
17 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:null,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:280,albumDescMaxLength:4e3,onInitError:function(e){console.error(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");if(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)return page.onUnexpectedError(e,!0);var t={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,r=e.response.data&&e.response.data.description?e.response.data.description:"Please check the console for more information.";return swal(e.response.status+" "+t,r,"error")},onUnexpectedError:function(e,a){if(a||console.error(e),e.response)return swal("An error occurred!","There was an error with the request, please check the console for more information.","error");var t=document.createElement("div");return t.innerHTML="<code>"+e.toString()+"</code>",swal({title:"An error occurred!",icon:"error",content:t})},checkIfPublic:function(e){var a=!1;return axios.get("api/check",{onDownloadProgress:function(){a||"function"!=typeof page.doRender||(page.doRender(),a=!0)}}).then((function(a){return page.private=a.data.private,page.enableUserAccounts=a.data.enableUserAccounts,page.maxSize=parseInt(a.data.maxSize),page.maxSizeBytes=1e6*page.maxSize,page.chunkSize=parseInt(a.data.chunkSize),page.temporaryUploadAges=a.data.temporaryUploadAges,page.fileIdentifierLength=a.data.fileIdentifierLength,page.preparePage(e)})).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.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"),r=function(e){var a=t[e].dataset.id,r=document.querySelector("#"+a);r&&(t[e].addEventListener("click",(function(){page.setActiveTab(e)})),page.tabs.push({tab:t[e],content:r}))},n=0;n<t.length;n++)r(n);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],r=document.createElement("option");r.value=t.id,r.innerHTML=t.name,page.albumSelect.appendChild(r)}})).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-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 r=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:r,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},r=a.querySelector(".uploads"),n=document.querySelector("#urls").value.split(/\r?\n/).filter((function(e){return e.trim().length}));if(document.querySelector("#urls").value=n.join("\n"),!n.length)return t("You have not entered any URLs.");a.querySelector(".uploads").classList.remove("is-hidden");var l=n.map((function(e){var a=document.createElement("template");a.innerHTML=page.previewTemplate.trim();var t=a.content.firstChild;return t.querySelector(".name").innerHTML=e,r.appendChild(t),{url:e,previewElement:t}}));return function a(r){if(r===l.length)return t();function n(e){return l[r].previewElement.querySelector(".progress").classList.add("is-hidden"),e.success?page.updateTemplate(l[r],e.files[0]):(page.updateTemplateIcon(l[r].previewElement,"icon-block"),l[r].previewElement.querySelector(".error").innerHTML=e.description),a(r+1)}return l[r].previewElement.querySelector(".progress").removeAttribute("value"),axios.post("api/upload",{urls:[l[r].url]},{headers:e}).then((function(e){return n(e.data)})).catch((function(e){return n({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"),r=e.previewElement.querySelector(".clipboard-mobile > .clipboard-js");t.href=t.innerHTML=r.dataset.clipboardText=a.url,r.parentElement.classList.remove("is-hidden");var n=/.[\w]+(\?|$)/.exec(a.url),l=n&&n[0]?n[0].toLowerCase():null;if(page.imageExts.includes(l))if(page.previewImages){var o=e.previewElement.querySelector("img");o.setAttribute("alt",a.name||""),o.dataset.src=a.url,o.classList.remove("is-hidden"),o.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 i=e.previewElement.querySelector(".expiry-date");i.innerHTML="EXP: "+page.getPrettyDate(new Date(1e3*a.expirydate)),i.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.onUnexpectedError)}}))},prepareUploadConfig:function(){var e={chunkSize:page.chunkSize,parallelUploads:2};page.chunkSize=parseInt(localStorage[lsKeys.chunkSize])||e.chunkSize,page.parallelUploads=parseInt(localStorage[lsKeys.parallelUploads])||e.parallelUploads,document.querySelector("#chunkSize").value=page.chunkSize,document.querySelector("#parallelUploads").value=page.parallelUploads;var a={chunkSize:{min:1,max:95},parallelUploads:{min:1,max:8}};document.querySelector("#chunkSizeDiv .help").innerHTML="Default is "+e.chunkSize+" MB. Max is "+a.chunkSize.max+" MB.",document.querySelector("#parallelUploadsDiv .help").innerHTML="Default is "+e.parallelUploads+". Max is "+a.parallelUploads.max+".";var t=document.querySelector("#fileLengthDiv");if(page.fileIdentifierLength&&t){var r=document.querySelector("#fileLength"),n=parseInt(localStorage[lsKeys.fileLength]);e.fileLength=page.fileIdentifierLength.default;var l="Default is "+page.fileIdentifierLength.default+".",o="number"==typeof page.fileIdentifierLength.min&&"number"==typeof page.fileIdentifierLength.max;o&&(l+=" Min is "+page.fileIdentifierLength.min+". Max is "+page.fileIdentifierLength.max,a.fileLength={min:page.fileIdentifierLength.min,max:page.fileIdentifierLength.max}),page.fileIdentifierLength.force&&(l+=" This option is currently disabled.",r.disabled=!0),page.fileIdentifierLength.force||isNaN(n)||!o||n<page.fileIdentifierLength.min||n>page.fileIdentifierLength.max?(r.value=e.fileLength,page.fileLength=null):(r.value=n,page.fileLength=n),t.classList.remove("is-hidden"),t.querySelector(".help").innerHTML=l}Object.keys(a).forEach((function(e){document.querySelector("#"+e).setAttribute("min",a[e].min),document.querySelector("#"+e).setAttribute("max",a[e].max)}));var i=document.querySelector("#uploadAgeDiv");if(Array.isArray(page.temporaryUploadAges)&&page.temporaryUploadAges.length&&i){for(var s=document.querySelector("#uploadAge"),c=parseFloat(localStorage[lsKeys.uploadAge]),p=0;p<page.temporaryUploadAges.length;p++){var u=page.temporaryUploadAges[p],d=document.createElement("option");d.value=0===p?"default":u,d.innerHTML=page.getPrettyUploadAge(u)+(0===p?" (default)":""),s.appendChild(d),u===c&&(s.value=d.value,page.uploadAge=c)}i.classList.remove("is-hidden")}var g=document.querySelector("#tab-config").querySelector("form");if(g.addEventListener("submit",(function(e){e.preventDefault()})),"0"!==localStorage[lsKeys.siBytes]||(document.querySelector("#siBytes").value="0"),!("0"!==localStorage[lsKeys.uploadsHistoryOrder])){document.querySelector("#uploadsHistoryOrder").value="0";for(var m=document.querySelectorAll(".tab-content > .uploads"),f=0;f<m.length;f++)m[f].classList.add("is-reversed")}page.previewImages="0"!==localStorage[lsKeys.previewImages],document.querySelector("#saveConfig").addEventListener("click",(function(){if(g.checkValidity()){for(var t=["siBytes","uploadsHistoryOrder","previewImages","uploadAge"],r=0;r<t.length;r++){var n=g.elements[t[r]].value;"default"!==n&&n!==e[t[r]]?localStorage[lsKeys[t[r]]]=n:localStorage.removeItem(lsKeys[t[r]])}for(var l=Object.keys(a),o=0;o<l.length;o++){var i=parseInt(g.elements[l[o]].value)||0,s=Math.min(Math.max(i,a[l[o]].min),a[l[o]].max);s>0&&s!==e[l[o]]?localStorage[lsKeys[l[o]]]=s:localStorage.removeItem(lsKeys[l[o]])}swal({title:"Woohoo!",text:"Configuration saved into this browser.",icon:"success"}).then((function(){location.reload()}))}}))},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),r=0;r<t.length;r++){var n=a[t[r]];if("file"===n.kind){var l=n.getAsFile(),o=new File([l],"pasted-image."+l.type.match(/(?:[^\/]*\/)([^;]*)/)[1],{type:l.type});page.dropzone.addFile(o)}}})),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.onUnexpectedError),page.lazyLoad=new LazyLoad({elements_selector:".field.uploads img"}),document.querySelector("#createAlbum").addEventListener("click",(function(){page.createAlbum()}))};
//# sourceMappingURL=home.js.map