diff --git a/pixelapi/list.go b/pixelapi/list.go index 85f6623..4b94c1e 100644 --- a/pixelapi/list.go +++ b/pixelapi/list.go @@ -14,7 +14,7 @@ type List struct { Title string `json:"title"` DateCreated time.Time `json:"date_created"` FileCount int `json:"file_count"` - Files []ListFile `json:"files,omitempty"` + Files []ListFile `json:"files"` } // ListFile information object from the pixeldrain API @@ -26,11 +26,6 @@ type ListFile struct { // GetList get a List from the pixeldrain API. Errors will be available through // List.Error. Standard error checks apply. -func (p *PixelAPI) GetList(id string) (resp *List, err error) { - resp = &List{} - err = p.jsonRequest("GET", p.apiEndpoint+"/list/"+id, resp) - if err != nil { - return nil, err - } - return resp, nil +func (p *PixelAPI) GetList(id string) (resp List, err error) { + return resp, p.jsonRequest("GET", p.apiEndpoint+"/list/"+id, &resp) } diff --git a/res/include/script/dependencies/UploadManager.js b/res/include/script/dependencies/UploadManager.js index 7492e52..0bb29fb 100644 --- a/res/include/script/dependencies/UploadManager.js +++ b/res/include/script/dependencies/UploadManager.js @@ -1,12 +1,11 @@ -function UploadManager(apiAddress, uploadsFinished) {let um = this; - - um.apiAddress = apiAddress; +function UploadManager(apiAddress, uploadsFinished) { + this.apiAddress = apiAddress; // Callback function for when the queue is empty - um.uploadsFinished = uploadsFinished; + this.uploadsFinished = uploadsFinished; // Counts the total number of upload jobs - um.jobCounter = 0; + this.jobCounter = 0; // Queue of files to be uploaded. Format: // { @@ -18,28 +17,28 @@ function UploadManager(apiAddress, uploadsFinished) {let um = this; // onFailure: function, // tries: number // } - um.uploadQueue = []; + this.uploadQueue = []; // Here we put successful jobs. The array should be sorted by job ID. // Format: // { jobID: number, fileID: string, fileName: string } - um.uploadLog = []; + this.uploadLog = []; // Max number of uploading threads at once - um.maxWorkers = 3; + this.maxWorkers = 3; // Threads which are currently uploading - um.activeWorkers = 0; + this.activeWorkers = 0; // Total number of jobs accepted - um.jobCounter = 0; + this.jobCounter = 0; } -UploadManager.prototype.finishedUploads = function() {let um = this; - um.uploadLog.sort(function(a, b) { +UploadManager.prototype.finishedUploads = function() { + this.uploadLog.sort((a, b) => { return a.jobID - b.jobID; }) - return um.uploadLog; + return this.uploadLog; } UploadManager.prototype.addFile = function( @@ -48,9 +47,9 @@ UploadManager.prototype.addFile = function( onProgress, // func (progress: number) onFinished, // func (id: string) onFailure // func (errorID: string, errorMessage: string) -) {let um = this; - um.uploadQueue.push({ - jobID: um.jobCounter, +) { + this.uploadQueue.push({ + jobID: this.jobCounter, file: file, name: name, onProgress: onProgress, @@ -60,43 +59,43 @@ UploadManager.prototype.addFile = function( }); // Increment the job counter - um.jobCounter++ + this.jobCounter++ - if (um.activeWorkers < um.maxWorkers) { + if (this.activeWorkers < this.maxWorkers) { // Run the upload function - um.startUpload(); + this.startUpload(); } } -UploadManager.prototype.startUpload = function() {let um = this; - if (um.uploadQueue.length === 0) { +UploadManager.prototype.startUpload = function() { + if (this.uploadQueue.length === 0) { return; // Nothing to upload } - if (um.activeWorkers < um.maxWorkers) { - um.activeWorkers++; - um.uploadThread(); + if (this.activeWorkers < this.maxWorkers) { + this.activeWorkers++; + this.uploadThread(); } } -UploadManager.prototype.finishUpload = function() {let um = this; - um.activeWorkers--; +UploadManager.prototype.finishUpload = function() { + this.activeWorkers--; if ( - um.uploadQueue.length === 0 && - um.activeWorkers === 0 && - typeof(um.uploadsFinished) === "function" + this.uploadQueue.length === 0 && + this.activeWorkers === 0 && + typeof(this.uploadsFinished) === "function" ) { - um.uploadsFinished(); + this.uploadsFinished(); return; } // Run the upload function for the next file - um.startUpload(); + this.startUpload(); } -UploadManager.prototype.uploadThread = function() {let um = this; - let job = um.uploadQueue.shift(); // Get the first element of the array +UploadManager.prototype.uploadThread = function() { + let job = this.uploadQueue.shift(); // Get the first element of the array console.debug("Starting upload of " + job.name); let form = new FormData(); @@ -104,17 +103,17 @@ UploadManager.prototype.uploadThread = function() {let um = this; form.append('file', job.file); let xhr = new XMLHttpRequest(); - xhr.open("POST", um.apiAddress + "/file", true); + xhr.open("POST", this.apiAddress + "/file", true); xhr.timeout = 21600000; // 6 hours, to account for slow connections // Report progress updates back to the caller - xhr.upload.addEventListener("progress", function (evt) { + xhr.upload.addEventListener("progress", evt => { if (evt.lengthComputable && typeof(job.onProgress) === "function") { job.onProgress(evt.loaded / evt.total); } }); - xhr.onreadystatechange = function () { + xhr.onreadystatechange = () => { // readystate 4 means the upload is done if (xhr.readyState !== 4) { return; } @@ -124,7 +123,7 @@ UploadManager.prototype.uploadThread = function() {let um = this; addUploadHistory(resp.id) // Log the successful job - um.uploadLog.push({ + this.uploadLog.push({ jobID: job.jobID, fileID: resp.id, fileName: job.name @@ -135,7 +134,7 @@ UploadManager.prototype.uploadThread = function() {let um = this; } // Finish the upload job - um.finishUpload(); + this.finishUpload(); } else if (xhr.status >= 400) { // Request failed console.log("Upload error. status: " + xhr.status + " response: " + xhr.response); @@ -144,11 +143,11 @@ UploadManager.prototype.uploadThread = function() {let um = this; job.onFailure(resp.value, resp.message); } else { // Try again job.tries++; - um.uploadQueue.push(job); + this.uploadQueue.push(job); } // Sleep the upload thread for 5 seconds - window.setTimeout(() => { um.finishUpload(); }, 5000); + window.setTimeout(() => { this.finishUpload(); }, 5000); } else { // Request did not arrive if (job.tries === 3) { // Upload failed @@ -157,11 +156,11 @@ UploadManager.prototype.uploadThread = function() {let um = this; } } else { // Try again job.tries++; - um.uploadQueue.push(job); + this.uploadQueue.push(job); } // Sleep the upload thread for 5 seconds - window.setTimeout(() => { um.finishUpload(); }, 5000); + window.setTimeout(() => { this.finishUpload(); }, 5000); } }; xhr.send(form); diff --git a/res/include/script/file_viewer/DetailsWindow.js b/res/include/script/file_viewer/DetailsWindow.js index f2d0a12..5dbb51f 100644 --- a/res/include/script/file_viewer/DetailsWindow.js +++ b/res/include/script/file_viewer/DetailsWindow.js @@ -1,48 +1,48 @@ -function DetailsWindow(viewer) {let dw = this; - dw.viewer = viewer; - dw.visible = false; - dw.fileID = ""; - dw.graph = 0; +function DetailsWindow(viewer) { + this.viewer = viewer; + this.visible = false; + this.fileID = ""; + this.graph = 0; - dw.divPopup = document.getElementById("details_popup"); - dw.btnDetails = document.getElementById("btn_details"); - dw.btnCloseDetails = document.getElementById("btn_close_details"); - dw.divFileDetails = document.getElementById("info_file_details"); + this.divPopup = document.getElementById("details_popup"); + this.btnDetails = document.getElementById("btn_details"); + this.btnCloseDetails = document.getElementById("btn_close_details"); + this.divFileDetails = document.getElementById("info_file_details"); - dw.btnDetails.addEventListener("click", () => { dw.toggle(); }); - dw.btnCloseDetails.addEventListener("click", () => { dw.toggle(); }); + this.btnDetails.addEventListener("click", () => { this.toggle(); }); + this.btnCloseDetails.addEventListener("click", () => { this.toggle(); }); } -DetailsWindow.prototype.toggle = function() {let dw = this; - if (dw.visible) { - dw.divPopup.style.opacity = "0"; - dw.divPopup.style.visibility = "hidden"; - dw.btnDetails.classList.remove("button_highlight"); - dw.visible = false; +DetailsWindow.prototype.toggle = function() { + if (this.visible) { + this.divPopup.style.opacity = "0"; + this.divPopup.style.visibility = "hidden"; + this.btnDetails.classList.remove("button_highlight"); + this.visible = false; } else { - dw.divPopup.style.opacity = "1"; - dw.divPopup.style.visibility = "visible"; - dw.btnDetails.classList.add("button_highlight"); - dw.visible = true; + this.divPopup.style.opacity = "1"; + this.divPopup.style.visibility = "visible"; + this.btnDetails.classList.add("button_highlight"); + this.visible = true; // This is a workaround for a chrome bug which makes it so hidden // windows can't be scrolled after they are shown - dw.divPopup.focus(); + this.divPopup.focus(); - if (dw.graph === 0) { - dw.renderGraph(); + if (this.graph === 0) { + this.renderGraph(); } - dw.updateGraph(dw.fileID); + this.updateGraph(this.fileID); } } -DetailsWindow.prototype.setDetails = function(file) {let dw = this; +DetailsWindow.prototype.setDetails = function(file) { let desc = ""; - if (dw.viewer.isList) { + if (this.viewer.isList) { desc = file.description; } - dw.fileID = file.id; - dw.divFileDetails.innerHTML = "" + this.fileID = file.id; + this.divFileDetails.innerHTML = "
" + "" + "" + "" @@ -53,25 +53,25 @@ DetailsWindow.prototype.setDetails = function(file) {let dw = this; + "" + "
Name" + escapeHTML(file.name) + "
URL"+domainURL()+"/u/" + file.id + "
Mime Type" + escapeHTML(file.mime_type) + "
Description" + escapeHTML(desc) + "
"; - if(dw.visible) { - dw.updateGraph(file.id); + if(this.visible) { + this.updateGraph(file.id); } } -DetailsWindow.prototype.updateGraph = function(fileID) {let dw = this; +DetailsWindow.prototype.updateGraph = function(fileID) { console.log("updating graph "+fileID); fetch(apiEndpoint+"/file/" + fileID + "/timeseries?interval=60?days=14").then(resp => { if (!resp.ok) {return null;} return resp.json(); }).then(resp => { - dw.graph.data.labels = resp.labels; - dw.graph.data.datasets[0].data = resp.downloads; - dw.graph.data.datasets[1].data = resp.views; - dw.graph.update(); + this.graph.data.labels = resp.labels; + this.graph.data.datasets[0].data = resp.downloads; + this.graph.data.datasets[1].data = resp.views; + this.graph.update(); }) } -DetailsWindow.prototype.renderGraph = function() {let dw = this; +DetailsWindow.prototype.renderGraph = function() { console.log("rendering graph"); Chart.defaults.global.defaultFontColor = "#b3b3b3"; Chart.defaults.global.defaultFontSize = 15; @@ -81,7 +81,7 @@ DetailsWindow.prototype.renderGraph = function() {let dw = this; Chart.defaults.global.tooltips.mode = "index"; Chart.defaults.global.tooltips.axis = "x"; Chart.defaults.global.tooltips.intersect = false; - dw.graph = new Chart( + this.graph = new Chart( document.getElementById('bandwidth_chart'), { type: 'line', diff --git a/res/include/script/file_viewer/ListNavigator.js b/res/include/script/file_viewer/ListNavigator.js index 29d9451..b514d7e 100644 --- a/res/include/script/file_viewer/ListNavigator.js +++ b/res/include/script/file_viewer/ListNavigator.js @@ -1,23 +1,24 @@ -function ListNavigator(viewer, data) {let ln = this; - ln.viewer = viewer; - ln.data = data; - ln.length = data.length; - ln.position = 0; - ln.history = []; - ln.shuffle = false; +function ListNavigator(viewer, files) { + this.viewer = viewer; + this.files = files; + this.length = files.length; + this.position = 0; + this.history = []; + this.shuffle = false; - ln.divListNavigator = document.getElementById("list_navigator"); + this.divListNavigator = document.getElementById("list_navigator"); - ln.btnDownloadList = document.getElementById("btn_download_list"); - ln.btnDownloadList.style.display = ""; - ln.btnDownloadList.addEventListener("click", () => { ln.downloadList(); }); - - ln.btnShuffle = document.getElementById("btn_shuffle"); - ln.btnShuffle.style.display = ""; - ln.btnShuffle.addEventListener("click", () => { ln.toggleShuffle(); }); + this.btnDownloadList = document.getElementById("btn_download_list"); + if (files.id !== "") { + this.btnDownloadList.style.display = ""; + this.btnDownloadList.addEventListener("click", () => { this.downloadList(); }); + } + this.btnShuffle = document.getElementById("btn_shuffle"); + this.btnShuffle.style.display = ""; + this.btnShuffle.addEventListener("click", () => { this.toggleShuffle(); }); // Render list contents in list navigator div - data.forEach((item, i) => { + files.forEach((item, i) => { let filename; if(item.name !== "null"){ filename = item.name; @@ -27,89 +28,92 @@ function ListNavigator(viewer, data) {let ln = this; let d = document.createElement("div"); d.classList = "file_button list_item"; - d.addEventListener("click", () => { ln.setItem(i); }); + d.addEventListener("click", () => { this.setItem(i); }); d.innerText = filename; - ln.divListNavigator.appendChild(d); + this.divListNavigator.appendChild(d); }); // Make the navigator visible - ln.divListNavigator.style.display = "inline-block"; + this.divListNavigator.style.display = "inline-block"; // Skip to the file defined in the link hash - if(Number.isInteger(parseInt(getHashValue("item")))){ - ln.setItem(parseInt(getHashValue("item"))); + let matches = location.hash.match(new RegExp('item=([^&]*)')); + let hashID = matches ? matches[1] : null; + + if(Number.isInteger(parseInt(hashID))){ + this.setItem(parseInt(hashID)); }else{ - ln.setItem(0); + this.setItem(0); } } -ListNavigator.prototype.nextItem = function() {let ln = this; - if(ln.shuffle){ - ln.randItem(); +ListNavigator.prototype.nextItem = function() { + if(this.shuffle){ + this.randItem(); return; } - if (ln.position >= ln.length) { - ln.position = 0; + if (this.position >= this.length) { + this.position = 0; } else { - ln.position++; + this.position++; } - ln.setItem(ln.position); + this.setItem(this.position); } -ListNavigator.prototype.previousItem = function() {let ln = this; - if(ln.position === 0){ - ln.position = ln.length - 1; +ListNavigator.prototype.previousItem = function() { + if(this.position === 0){ + this.position = this.length - 1; }else{ - ln.position--; + this.position--; } - ln.setItem(ln.position); + this.setItem(this.position); } -ListNavigator.prototype.randItem = function() {let ln = this; +ListNavigator.prototype.randItem = function() { // Avoid viewing the same file multiple times let rand; do { - rand = Math.round(Math.random() * ln.length); + rand = Math.round(Math.random() * this.length); console.log("rand is " + rand); - } while(ln.history.indexOf(rand) > -1); + } while(this.history.indexOf(rand) > -1); - ln.setItem(rand); + this.setItem(rand); } -ListNavigator.prototype.setItem = function(index) {let ln = this; - if(index >= ln.length){ - ln.position = 0; +ListNavigator.prototype.setItem = function(index) { + if(index >= this.length){ + this.position = 0; }else{ - ln.position = index; + this.position = index; } // Set the URL hash - location.hash = "item=" + ln.position; - ln.viewer.setFile(ln.data[ln.position]); + location.hash = "item=" + this.position; + this.viewer.setFile(this.files[this.position]); - ln.addToHistory(index); - ln.loadThumbnails(index); + this.addToHistory(index); + this.loadThumbnails(index); document.querySelectorAll("#list_navigator > .file_button_selected").forEach(el => { el.classList.remove("file_button_selected"); }); - let selectedItem = ln.divListNavigator.children[ln.position]; + let selectedItem = this.divListNavigator.children[this.position]; selectedItem.classList.add("file_button_selected"); let cst = window.getComputedStyle(selectedItem); let itemWidth = selectedItem.offsetWidth + parseInt(cst.marginLeft) + parseInt(cst.marginRight); - let start = ln.divListNavigator.scrollLeft; - let end = ((ln.position * itemWidth) + (itemWidth / 2)) - (ln.divListNavigator.clientWidth / 2); + let start = this.divListNavigator.scrollLeft; + let end = ((this.position * itemWidth) + (itemWidth / 2)) - (this.divListNavigator.clientWidth / 2); let steps = 60; // One second let stepSize = (end - start)/steps; let animateScroll = (pos, step) => { - ln.divListNavigator.scrollLeft = pos; + this.divListNavigator.scrollLeft = pos; if (step < steps) { requestAnimationFrame(() => { @@ -120,31 +124,30 @@ ListNavigator.prototype.setItem = function(index) {let ln = this; animateScroll(start, 0); } -ListNavigator.prototype.downloadList = function() {let ln = this; - document.getElementById("download_frame").src = "/api/list/" + ln.viewer.listId + "/zip"; +ListNavigator.prototype.downloadList = function() { + document.getElementById("download_frame").src = "/api/list/" + this.viewer.listId + "/zip"; } -ListNavigator.prototype.addToHistory = function(index) {let ln = this; - if(ln.history.length >= (ln.length - 6)){ - ln.history.shift(); +ListNavigator.prototype.addToHistory = function(index) { + if(this.history.length >= (this.length - 6)){ + this.history.shift(); } - - ln.history.push(index); + this.history.push(index); } -ListNavigator.prototype.toggleShuffle = function() {let ln = this; - ln.shuffle = !ln.shuffle; // :P +ListNavigator.prototype.toggleShuffle = function() { + this.shuffle = !this.shuffle; // :P - if(ln.shuffle){ + if(this.shuffle){ document.querySelector("#btn_shuffle > span").innerHTML = "Shuffle ☑"; // Check icon - ln.btnShuffle.classList.add("button_highlight"); + this.btnShuffle.classList.add("button_highlight"); }else{ document.querySelector("#btn_shuffle > span").innerHTML = "Shuffle ☐"; // Empty checkbox - ln.btnShuffle.classList.remove("button_highlight"); + this.btnShuffle.classList.remove("button_highlight"); } } -ListNavigator.prototype.loadThumbnails = function(index) {let ln = this; +ListNavigator.prototype.loadThumbnails = function(index) { let startPos = +index - 50; let endPos = +index + 50; // fyi, the + is to let javascript know it's actually a number instead of a string @@ -152,9 +155,8 @@ ListNavigator.prototype.loadThumbnails = function(index) {let ln = this; if(startPos < 0){ startPos = 0; } - - if(endPos >= ln.length){ - endPos = ln.length - 1; + if(endPos >= this.length){ + endPos = this.length - 1; } let navigatorItems = document.getElementById("list_navigator").children @@ -164,8 +166,8 @@ ListNavigator.prototype.loadThumbnails = function(index) {let ln = this; continue; // Thumbnail already loaded } - let thumb = "/api/file/" + ln.data[i].id + "/thumbnail?width=48&height=48"; - let name = ln.data[i].name; + let thumb = "/api/file/" + this.files[i].id + "/thumbnail?width=48&height=48"; + let name = this.files[i].name; let itemHtml = "\""" @@ -174,11 +176,3 @@ ListNavigator.prototype.loadThumbnails = function(index) {let ln = this; navigatorItems[i].innerHTML = itemHtml; } } - - - -// Misc function, don't really know where else to put it -function getHashValue(key) { - let matches = location.hash.match(new RegExp(key + '=([^&]*)')); - return matches ? matches[1] : null; -} diff --git a/res/include/script/file_viewer/Toolbar.js b/res/include/script/file_viewer/Toolbar.js index 12d0e56..bd9b777 100644 --- a/res/include/script/file_viewer/Toolbar.js +++ b/res/include/script/file_viewer/Toolbar.js @@ -1,73 +1,73 @@ -function Toolbar(viewer) {let t = this; - t.viewer = viewer; - t.visible = false; - t.sharebarVisible = false; +function Toolbar(viewer) { + this.viewer = viewer; + this.visible = false; + this.sharebarVisible = false; - t.divToolbar = document.getElementById("toolbar"); - t.divFilePreview = document.getElementById("filepreview"); - t.downloadFrame = document.getElementById("download_frame"); - t.spanViews = document.getElementById("stat_views"); - t.spanDownloads = document.getElementById("stat_downloads"); - t.spanSize = document.getElementById("stat_size"); + this.divToolbar = document.getElementById("toolbar"); + this.divFilePreview = document.getElementById("filepreview"); + this.downloadFrame = document.getElementById("download_frame"); + this.spanViews = document.getElementById("stat_views"); + this.spanDownloads = document.getElementById("stat_downloads"); + this.spanSize = document.getElementById("stat_size"); - t.btnToggleToolbar = document.getElementById("btn_toggle_toolbar"); - t.btnDownload = document.getElementById("btn_download"); - t.btnCopyLink = document.getElementById("btn_copy"); - t.spanCopyLink = document.querySelector("#btn_copy > span"); - t.btnShare = document.getElementById("btn_share"); - t.divSharebar = document.getElementById("sharebar"); + this.btnToggleToolbar = document.getElementById("btn_toggle_toolbar"); + this.btnDownload = document.getElementById("btn_download"); + this.btnCopyLink = document.getElementById("btn_copy"); + this.spanCopyLink = document.querySelector("#btn_copy > span"); + this.btnShare = document.getElementById("btn_share"); + this.divSharebar = document.getElementById("sharebar"); - t.btnToggleToolbar.addEventListener("click", () => { t.toggle(); }); - t.btnDownload.addEventListener("click", () => { t.download(); }); - t.btnCopyLink.addEventListener("click", () => { t.copyUrl(); }); - t.btnShare.addEventListener("click", () => { t.toggleSharebar(); }); + this.btnToggleToolbar.addEventListener("click", () => { this.toggle(); }); + this.btnDownload.addEventListener("click", () => { this.download(); }); + this.btnCopyLink.addEventListener("click", () => { this.copyUrl(); }); + this.btnShare.addEventListener("click", () => { this.toggleSharebar(); }); } -Toolbar.prototype.toggle = function() {let t = this; - if (t.visible) { - if (t.sharebarVisible) { t.toggleSharebar(); } +Toolbar.prototype.toggle = function() { + if (this.visible) { + if (this.sharebarVisible) { this.toggleSharebar(); } - t.divToolbar.style.left = "-8em"; - t.divFilePreview.style.left = "0px"; - t.btnToggleToolbar.classList.remove("button_highlight"); - t.visible = false; + this.divToolbar.style.left = "-8em"; + this.divFilePreview.style.left = "0px"; + this.btnToggleToolbar.classList.remove("button_highlight"); + this.visible = false; } else { - t.divToolbar.style.left = "0px"; - t.divFilePreview.style.left = "8em"; - t.btnToggleToolbar.classList.add("button_highlight"); - t.visible = true; + this.divToolbar.style.left = "0px"; + this.divFilePreview.style.left = "8em"; + this.btnToggleToolbar.classList.add("button_highlight"); + this.visible = true; } } -Toolbar.prototype.toggleSharebar = function() {let t = this; +Toolbar.prototype.toggleSharebar = function() { if (navigator.share) { navigator.share({ - title: t.viewer.title, - text: "Download " + t.viewer.title + " here", + title: this.viewer.title, + text: "Download " + this.viewer.title + " here", url: window.location.href }); return; } - if(t.sharebarVisible){ - t.divSharebar.style.left = "-8em"; - t.btnShare.classList.remove("button_highlight") - t.sharebarVisible = false; + if(this.sharebarVisible){ + this.divSharebar.style.left = "-8em"; + this.btnShare.classList.remove("button_highlight") + this.sharebarVisible = false; }else{ - t.divSharebar.style.left = "8em"; - t.btnShare.classList.add("button_highlight") - t.sharebarVisible = true; + this.divSharebar.style.left = "8em"; + this.btnShare.classList.add("button_highlight") + this.sharebarVisible = true; } } -Toolbar.prototype.download = function() {let t = this; +Toolbar.prototype.download = function() { let triggerDL = (captchaResp = "") => { if (captchaResp === "") { - t.downloadFrame.src = apiEndpoint+"/file/"+ - t.viewer.currentFile+"?download"; + this.downloadFrame.src = apiEndpoint+"/file/"+ + this.viewer.currentFile+"?download"; } else { - t.downloadFrame.src = apiEndpoint+"/file/"+ - t.viewer.currentFile+"?download&recaptcha_response="+captchaResp; + this.downloadFrame.src = apiEndpoint+"/file/"+ + this.viewer.currentFile+"?download&recaptcha_response="+captchaResp; } } @@ -87,7 +87,7 @@ Toolbar.prototype.download = function() {let t = this; return; } - fetch(apiEndpoint+"/file/"+t.viewer.currentFile+"/availability").then(resp => { + fetch(apiEndpoint+"/file/"+this.viewer.currentFile+"/availability").then(resp => { return resp.json(); }).then(resp => { let popupDiv = document.getElementById("captcha_popup"); @@ -130,28 +130,28 @@ Toolbar.prototype.download = function() {let t = this; }); } -Toolbar.prototype.copyUrl = function() {let t = this; +Toolbar.prototype.copyUrl = function() { if(copyText(window.location.href)) { console.log('Text copied'); - t.spanCopyLink.innerText = "Copied!"; - t.btnCopyLink.classList.add("button_highlight") + this.spanCopyLink.innerText = "Copied!"; + this.btnCopyLink.classList.add("button_highlight") } else { console.log('Copying not supported'); - t.spanCopyLink.innerText = "Error!"; + this.spanCopyLink.innerText = "Error!"; alert("Your browser does not support copying text."); } // Return to normal setTimeout(() => { - t.spanCopyLink.innerText = "Copy"; - t.btnCopyLink.classList.remove("button_highlight") + this.spanCopyLink.innerText = "Copy"; + this.btnCopyLink.classList.remove("button_highlight") }, 60000); } -Toolbar.prototype.setStats = function(file) {let t = this; - t.spanViews.innerText = file.views - t.spanDownloads.innerText = Math.round((file.bandwidth_used/file.size)*10)/10; - t.spanSize.innerText = formatDataVolume(file.size, 3); +Toolbar.prototype.setStats = function(file) { + this.spanViews.innerText = file.views + this.spanDownloads.innerText = Math.round((file.bandwidth_used/file.size)*10)/10; + this.spanSize.innerText = formatDataVolume(file.size, 3); } diff --git a/res/include/script/file_viewer/Viewer.js b/res/include/script/file_viewer/Viewer.js index 00f7f31..9ae714d 100644 --- a/res/include/script/file_viewer/Viewer.js +++ b/res/include/script/file_viewer/Viewer.js @@ -1,27 +1,27 @@ -function Viewer(type, viewToken, data) {let v = this; +function Viewer(type, viewToken, data) { // Set defaults - v.toolbar = null; - v.listNavigator = null; - v.detailsWindow = null; - v.divFilepreview = null; - v.currentFile = ""; - v.title = ""; // Contains either the file name or list title - v.listId = ""; - v.viewToken = ""; - v.isList = false; - v.isFile = false; - v.initialized = false; + this.toolbar = null; + this.listNavigator = null; + this.detailsWindow = null; + this.divFilepreview = null; + this.currentFile = ""; + this.title = ""; // Contains either the file name or list title + this.listId = ""; + this.viewToken = ""; + this.isList = false; + this.isFile = false; + this.initialized = false; - v.viewToken = viewToken; - v.toolbar = new Toolbar(v); - v.detailsWindow = new DetailsWindow(v); + this.viewToken = viewToken; + this.toolbar = new Toolbar(this); + this.detailsWindow = new DetailsWindow(this); - v.divFilepreview = document.getElementById("filepreview"); + this.divFilepreview = document.getElementById("filepreview"); // On small screens the toolbar takes too much space, so it collapses // automatically - if (v.divFilepreview.clientWidth > 600 && !v.toolbar.visible) { - v.toolbar.toggle(); + if (this.divFilepreview.clientWidth > 600 && !this.toolbar.visible) { + this.toolbar.toggle(); } // The close button only works if the window has an opener. So we hide @@ -31,41 +31,41 @@ function Viewer(type, viewToken, data) {let v = this; } if (type === "file") { - v.isFile = true; - v.currentFile = data.id; - v.title = data.name; - v.setFile(data); + this.isFile = true; + this.currentFile = data.id; + this.title = data.name; + this.setFile(data); } else if (type === "list") { - v.isList = true; - v.listId = data.id; - v.title = data.title; - v.listNavigator = new ListNavigator(v, data.data); + this.isList = true; + this.listId = data.id; + this.title = data.title; + this.listNavigator = new ListNavigator(this, data.files); } - v.renderSponsors(); - window.addEventListener("resize", e => { v.renderSponsors(e); }); + this.renderSponsors(); + window.addEventListener("resize", e => { this.renderSponsors(e); }); // Register keyboard shortcuts - document.addEventListener("keydown", e => { v.keyboardEvent(e); }); + document.addEventListener("keydown", e => { this.keyboardEvent(e); }); - v.initialized = true; + this.initialized = true; } -Viewer.prototype.setFile = function(file) {let v = this; - v.currentFile = file.id; - if (v.isList) { +Viewer.prototype.setFile = function(file) { + this.currentFile = file.id; + if (this.isList) { document.getElementById("file_viewer_headerbar_title").style.lineHeight = "1em"; document.getElementById("file_viewer_list_title").innerText = this.title; document.getElementById("file_viewer_file_title").innerText = file.name; - document.title = v.title + " ~ " + file.name + " ~ pixeldrain"; + document.title = this.title + " ~ " + file.name + " ~ pixeldrain"; } else { document.getElementById("file_viewer_file_title").innerText = file.name; document.title = file.name + " ~ pixeldrain"; } // Update the file details - v.detailsWindow.setDetails(file); - v.toolbar.setStats(file); + this.detailsWindow.setDetails(file); + this.toolbar.setStats(file); // Register a new view. We don't care what this returns becasue we can't // do anything about it anyway @@ -73,47 +73,47 @@ Viewer.prototype.setFile = function(file) {let v = this; { method: "POST", headers: {"Content-Type": "application/x-www-form-urlencoded"}, - body: "token="+v.viewToken + body: "token="+this.viewToken } ); // Clear the canvas - v.divFilepreview.innerHTML = ""; + this.divFilepreview.innerHTML = ""; let nextItem = () => { - if (v.listNavigator !== null) { - v.listNavigator.nextItem(); + if (this.listNavigator !== null) { + this.listNavigator.nextItem(); } }; if ( file.mime_type.startsWith("image") ) { - new ImageViewer(v, file).render(v.divFilepreview); + new ImageViewer(this, file).render(this.divFilepreview); } else if ( file.mime_type.startsWith("video") || file.mime_type === "application/matroska" || file.mime_type === "application/x-matroska" ) { - new VideoViewer(v, file, nextItem).render(v.divFilepreview); + new VideoViewer(this, file, nextItem).render(this.divFilepreview); } else if ( file.mime_type.startsWith("audio") || file.mime_type === "application/ogg" || file.name.endsWith(".mp3") ) { - new AudioViewer(v, file, nextItem).render(v.divFilepreview); + new AudioViewer(this, file, nextItem).render(this.divFilepreview); } else if ( file.mime_type === "application/pdf" || file.mime_type === "application/x-pdf" ) { - new PDFViewer(v, file).render(v.divFilepreview); + new PDFViewer(this, file).render(this.divFilepreview); } else if ( file.mime_type.startsWith("text") || file.id === "demo" ) { - new TextViewer(v, file).render(v.divFilepreview); + new TextViewer(this, file).render(this.divFilepreview); } else { - new FileViewer(v, file).render(v.divFilepreview); + new FileViewer(this, file).render(this.divFilepreview); } } @@ -152,7 +152,7 @@ Viewer.prototype.renderSponsors = function() { } } -Viewer.prototype.keyboardEvent = function(evt) {let v = this; +Viewer.prototype.keyboardEvent = function(evt) { if (evt.ctrlKey || evt.altKey) { return // prevent custom shortcuts from interfering with system shortcuts } @@ -160,33 +160,33 @@ Viewer.prototype.keyboardEvent = function(evt) {let v = this; switch (evt.keyCode) { case 65: // A or left arrow key go to previous file case 37: - if (v.listNavigator != null) { - v.listNavigator.previousItem(); + if (this.listNavigator != null) { + this.listNavigator.previousItem(); } break; case 68: // D or right arrow key go to next file case 39: - if (v.listNavigator != null) { - v.listNavigator.nextItem(); + if (this.listNavigator != null) { + this.listNavigator.nextItem(); } break; case 83: if (evt.shiftKey) { - v.listNavigator.downloadList(); // SHIFT + S downloads all files in list + this.listNavigator.downloadList(); // SHIFT + S downloads all files in list } else { - v.toolbar.download(); // S to download the current file + this.toolbar.download(); // S to download the current file } break; case 82: // R to toggle list shuffle - if (v.listNavigator != null) { - v.listNavigator.toggleShuffle(); + if (this.listNavigator != null) { + this.listNavigator.toggleShuffle(); } break; case 67: // C to copy to clipboard - v.toolbar.copyUrl(); + this.toolbar.copyUrl(); break; case 73: // I to open the details window - v.detailsWindow.toggle(); + this.detailsWindow.toggle(); break; case 81: // Q to close the window window.close(); diff --git a/res/include/script/file_viewer/viewer_scripts/AudioViewer.js b/res/include/script/file_viewer/viewer_scripts/AudioViewer.js index 7e638ae..a782137 100644 --- a/res/include/script/file_viewer/viewer_scripts/AudioViewer.js +++ b/res/include/script/file_viewer/viewer_scripts/AudioViewer.js @@ -1,33 +1,33 @@ -function AudioViewer(viewer, file, next) {let v = this; - v.viewer = viewer; - v.file = file; - v.next = next; +function AudioViewer(viewer, file, next) { + this.viewer = viewer; + this.file = file; + this.next = next; - v.container = document.createElement("div"); - v.container.classList = "image-container"; - v.container.appendChild(document.createElement("br")); + this.container = document.createElement("div"); + this.container.classList = "image-container"; + this.container.appendChild(document.createElement("br")); - v.icon = document.createElement("img"); - v.icon.src = "/res/img/mime/audio.png"; - v.container.appendChild(v.icon); + this.icon = document.createElement("img"); + this.icon.src = "/res/img/mime/audio.png"; + this.container.appendChild(this.icon); - v.container.appendChild(document.createElement("br")); - v.container.appendChild(document.createTextNode(file.name)); - v.container.appendChild(document.createElement("br")); - v.container.appendChild(document.createElement("br")); + this.container.appendChild(document.createElement("br")); + this.container.appendChild(document.createTextNode(file.name)); + this.container.appendChild(document.createElement("br")); + this.container.appendChild(document.createElement("br")); - v.element = document.createElement("audio"); - v.element.autoplay = "autoplay"; - v.element.controls = "controls"; - v.element.style.width = "90%"; - v.element.addEventListener("ended", () => { v.next(); }, false); + this.element = document.createElement("audio"); + this.element.autoplay = "autoplay"; + this.element.controls = "controls"; + this.element.style.width = "90%"; + this.element.addEventListener("ended", () => { this.next(); }, false); - v.source = document.createElement("source"); - v.source.src = apiEndpoint+"/file/"+v.file.id; - v.element.appendChild(v.source); - v.container.appendChild(v.element); + this.source = document.createElement("source"); + this.source.src = apiEndpoint+"/file/"+this.file.id; + this.element.appendChild(this.source); + this.container.appendChild(this.element); } -AudioViewer.prototype.render = function(parent) {let v = this; - parent.appendChild(v.container); +AudioViewer.prototype.render = function(parent) { + parent.appendChild(this.container); } diff --git a/res/include/script/file_viewer/viewer_scripts/FileViewer.js b/res/include/script/file_viewer/viewer_scripts/FileViewer.js index bc5ae72..c634832 100644 --- a/res/include/script/file_viewer/viewer_scripts/FileViewer.js +++ b/res/include/script/file_viewer/viewer_scripts/FileViewer.js @@ -1,27 +1,27 @@ -function FileViewer(viewer, file, next) {let v = this; - v.viewer = viewer; - v.file = file; - v.next = next; +function FileViewer(viewer, file, next) { + this.viewer = viewer; + this.file = file; + this.next = next; - v.container = document.createElement("div"); - v.container.classList = "image-container"; - v.container.appendChild(document.createElement("br")); + this.container = document.createElement("div"); + this.container.classList = "image-container"; + this.container.appendChild(document.createElement("br")); - v.icon = document.createElement("img"); - v.icon.src = apiEndpoint+"/"+file.thumbnail_href; - v.container.appendChild(v.icon); + this.icon = document.createElement("img"); + this.icon.src = apiEndpoint+"/"+file.thumbnail_href; + this.container.appendChild(this.icon); - v.container.appendChild(document.createElement("br")); - v.container.appendChild(document.createTextNode(file.name)); - v.container.appendChild(document.createElement("br")); - v.container.appendChild(document.createTextNode("Type: "+file.mime_type)); - v.container.appendChild(document.createElement("br")); - v.container.appendChild(document.createElement("br")); - v.container.appendChild(document.createTextNode( + this.container.appendChild(document.createElement("br")); + this.container.appendChild(document.createTextNode(file.name)); + this.container.appendChild(document.createElement("br")); + this.container.appendChild(document.createTextNode("Type: "+file.mime_type)); + this.container.appendChild(document.createElement("br")); + this.container.appendChild(document.createElement("br")); + this.container.appendChild(document.createTextNode( "Press the 'Download' button in the menu to download this file" )); } -FileViewer.prototype.render = function(parent) {let v = this; - parent.appendChild(v.container); +FileViewer.prototype.render = function(parent) { + parent.appendChild(this.container); } diff --git a/res/include/script/file_viewer/viewer_scripts/ImageViewer.js b/res/include/script/file_viewer/viewer_scripts/ImageViewer.js index 50d3f4c..a916ab9 100644 --- a/res/include/script/file_viewer/viewer_scripts/ImageViewer.js +++ b/res/include/script/file_viewer/viewer_scripts/ImageViewer.js @@ -1,48 +1,48 @@ -function ImageViewer(viewer, file) {let v = this; - v.viewer = viewer; - v.file = file; - v.zoomed = false; - v.x = 0; - v.y = 0; - v.dragging = false; +function ImageViewer(viewer, file) { + this.viewer = viewer; + this.file = file; + this.zoomed = false; + this.x = 0; + this.y = 0; + this.dragging = false; - v.container = document.createElement("dv"); - v.container.classList = "image-container"; - // v.container.style.lineHeight = "0"; + this.container = document.createElement("dv"); + this.container.classList = "image-container"; + // this.container.style.lineHeight = "0"; - v.element = document.createElement("img"); - v.element.classList = "pannable center drop-shadow"; - v.element.src = apiEndpoint+"/file/"+v.file.id; - v.element.addEventListener("dblclick", (e) => { return v.doubleclick(e); }); - v.element.addEventListener("doubletap", (e) => { return v.doubleclick(e); }); - v.element.addEventListener("mousedown", (e) => { return v.mousedown(e); }); - document.addEventListener("mousemove", (e) => { return v.mousemove(e); }); - document.addEventListener("mouseup", (e) => { return v.mouseup(e); }); + this.element = document.createElement("img"); + this.element.classList = "pannable center drop-shadow"; + this.element.src = apiEndpoint+"/file/"+this.file.id; + this.element.addEventListener("dblclick", (e) => { return this.doubleclick(e); }); + this.element.addEventListener("doubletap", (e) => { return this.doubleclick(e); }); + this.element.addEventListener("mousedown", (e) => { return this.mousedown(e); }); + document.addEventListener("mousemove", (e) => { return this.mousemove(e); }); + document.addEventListener("mouseup", (e) => { return this.mouseup(e); }); - v.container.appendChild(v.element); + this.container.appendChild(this.element); } -ImageViewer.prototype.render = function(parent) {let v = this; - parent.appendChild(v.container); +ImageViewer.prototype.render = function(parent) { + parent.appendChild(this.container); } -ImageViewer.prototype.doubleclick = function(e) {let v = this; - if (v.zoomed) { - v.element.style.maxWidth = "100%"; - v.element.style.maxHeight = "100%"; - v.element.style.top = "50%"; - v.element.style.left = "auto"; - v.element.style.transform = "translateY(-50%)"; - v.container.style.overflow = "hidden"; - v.zoomed = false; +ImageViewer.prototype.doubleclick = function(e) { + if (this.zoomed) { + this.element.style.maxWidth = "100%"; + this.element.style.maxHeight = "100%"; + this.element.style.top = "50%"; + this.element.style.left = "auto"; + this.element.style.transform = "translateY(-50%)"; + this.container.style.overflow = "hidden"; + this.zoomed = false; } else { - v.element.style.maxWidth = "none"; - v.element.style.maxHeight = "none"; - v.element.style.top = "0"; - v.element.style.left = ""; - v.element.style.transform = "none"; - v.container.style.overflow = "scroll"; - v.zoomed = true; + this.element.style.maxWidth = "none"; + this.element.style.maxHeight = "none"; + this.element.style.top = "0"; + this.element.style.left = ""; + this.element.style.transform = "none"; + this.container.style.overflow = "scroll"; + this.zoomed = true; } e.preventDefault(); @@ -50,11 +50,11 @@ ImageViewer.prototype.doubleclick = function(e) {let v = this; return false; } -ImageViewer.prototype.mousedown = function(e) {let v = this; - if (!v.dragging && e.which === 1 && v.zoomed) { - v.x = e.pageX; - v.y = e.pageY; - v.dragging = true; +ImageViewer.prototype.mousedown = function(e) { + if (!this.dragging && e.which === 1 && this.zoomed) { + this.x = e.pageX; + this.y = e.pageY; + this.dragging = true; e.preventDefault(); e.stopPropagation(); @@ -62,13 +62,13 @@ ImageViewer.prototype.mousedown = function(e) {let v = this; } } -ImageViewer.prototype.mousemove = function(e) {let v = this; - if (v.dragging) { - v.container.scrollLeft = v.container.scrollLeft - (e.pageX - v.x); - v.container.scrollTop = v.container.scrollTop - (e.pageY - v.y); +ImageViewer.prototype.mousemove = function(e) { + if (this.dragging) { + this.container.scrollLeft = this.container.scrollLeft - (e.pageX - this.x); + this.container.scrollTop = this.container.scrollTop - (e.pageY - this.y); - v.x = e.pageX; - v.y = e.pageY; + this.x = e.pageX; + this.y = e.pageY; e.preventDefault(); e.stopPropagation(); @@ -77,9 +77,9 @@ ImageViewer.prototype.mousemove = function(e) {let v = this; } -ImageViewer.prototype.mouseup = function(e) {let v = this; - if (v.dragging) { - v.dragging = false; +ImageViewer.prototype.mouseup = function(e) { + if (this.dragging) { + this.dragging = false; e.preventDefault(); e.stopPropagation(); diff --git a/res/include/script/file_viewer/viewer_scripts/PDFViewer.js b/res/include/script/file_viewer/viewer_scripts/PDFViewer.js index 17fb34a..7e79c60 100644 --- a/res/include/script/file_viewer/viewer_scripts/PDFViewer.js +++ b/res/include/script/file_viewer/viewer_scripts/PDFViewer.js @@ -1,13 +1,13 @@ -function PDFViewer(viewer, file) {let v = this; - v.viewer = viewer; - v.file = file; +function PDFViewer(viewer, file) { + this.viewer = viewer; + this.file = file; - v.container = document.createElement("iframe"); - v.container.classList = "image-container"; - v.container.style.border = "none"; - v.container.src = "/res/misc/pdf-viewer/web/viewer.html?file="+apiEndpoint+"/file/"+file.id; + this.container = document.createElement("iframe"); + this.container.classList = "image-container"; + this.container.style.border = "none"; + this.container.src = "/res/misc/pdf-viewer/web/viewer.html?file="+apiEndpoint+"/file/"+file.id; } -PDFViewer.prototype.render = function(parent) {let v = this; - parent.appendChild(v.container); +PDFViewer.prototype.render = function(parent) { + parent.appendChild(this.container); } diff --git a/res/include/script/file_viewer/viewer_scripts/TextViewer.js b/res/include/script/file_viewer/viewer_scripts/TextViewer.js index 2843d12..52018d0 100644 --- a/res/include/script/file_viewer/viewer_scripts/TextViewer.js +++ b/res/include/script/file_viewer/viewer_scripts/TextViewer.js @@ -1,56 +1,56 @@ -function TextViewer(viewer, file) {let v = this; - v.viewer = viewer; - v.file = file; - v.pre = null; - v.prettyprint = null; +function TextViewer(viewer, file) { + this.viewer = viewer; + this.file = file; + this.pre = null; + this.prettyprint = null; - v.container = document.createElement("div"); - v.container.classList = "text-container"; + this.container = document.createElement("div"); + this.container.classList = "text-container"; if (file.name.endsWith(".md") || file.name.endsWith(".markdown") || file.id === "demo") { - v.getMarkdown(); + this.getMarkdown(); } else { - v.getText(); + this.getText(); } } -TextViewer.prototype.getText = function() {let v = this; - v.pre = document.createElement("pre"); - v.pre.classList = "pre-container prettyprint linenums"; - v.pre.innerText = "Loading..."; - v.container.appendChild(v.pre); +TextViewer.prototype.getText = function() { + this.pre = document.createElement("pre"); + this.pre.classList = "pre-container prettyprint linenums"; + this.pre.innerText = "Loading..."; + this.container.appendChild(this.pre); - if (v.file.size > 1<<22) { // File larger than 4 MiB - v.pre.innerText = "File is too large to view online.\nPlease download and view it locally."; + if (this.file.size > 1<<22) { // File larger than 4 MiB + this.pre.innerText = "File is too large to view online.\nPlease download and view it locally."; return; } - fetch(apiEndpoint+"/file/"+v.file.id).then(resp => { + fetch(apiEndpoint+"/file/"+this.file.id).then(resp => { if (!resp.ok) { return Promise.reject(resp.status); } return resp.text(); }).then(resp => { - v.pre.innerText = resp; + this.pre.innerText = resp; // Load prettyprint script - v.prettyprint = document.createElement("script"); - v.prettyprint.src = "https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js?skin=desert"; - v.container.appendChild(v.prettyprint); + this.prettyprint = document.createElement("script"); + this.prettyprint.src = "https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js?skin=desert"; + this.container.appendChild(this.prettyprint); }).catch(err => { - v.pre.innerText = "Error loading file: "+err; + this.pre.innerText = "Error loading file: "+err; }); } -TextViewer.prototype.getMarkdown = function() {let v = this; - fetch("/u/"+v.file.id+"/preview").then(resp => { +TextViewer.prototype.getMarkdown = function() { + fetch("/u/"+this.file.id+"/preview").then(resp => { if (!resp.ok) { return Promise.reject(resp.status); } return resp.text(); }).then(resp => { - v.container.innerHTML = resp; + this.container.innerHTML = resp; }).catch(err => { - v.container.innerText = "Error loading file: "+err; + this.container.innerText = "Error loading file: "+err; }); } -TextViewer.prototype.render = function(parent) {let v = this; - parent.appendChild(v.container); +TextViewer.prototype.render = function(parent) { + parent.appendChild(this.container); } diff --git a/res/include/script/file_viewer/viewer_scripts/VideoViewer.js b/res/include/script/file_viewer/viewer_scripts/VideoViewer.js index ef164d3..bc9a467 100644 --- a/res/include/script/file_viewer/viewer_scripts/VideoViewer.js +++ b/res/include/script/file_viewer/viewer_scripts/VideoViewer.js @@ -1,24 +1,24 @@ -function VideoViewer(viewer, file, next) {let v = this; - v.viewer = viewer; - v.file = file; - v.next = next; +function VideoViewer(viewer, file, next) { + this.viewer = viewer; + this.file = file; + this.next = next; - v.vidContainer = document.createElement("div"); - v.vidContainer.classList = "image-container"; + this.vidContainer = document.createElement("div"); + this.vidContainer.classList = "image-container"; - v.vidElement = document.createElement("video"); - v.vidElement.autoplay = "autoplay"; - v.vidElement.controls = "controls"; - v.vidElement.classList = "center drop-shadow"; - v.vidElement.addEventListener("ended", () => { v.next(); }, false); + this.vidElement = document.createElement("video"); + this.vidElement.autoplay = "autoplay"; + this.vidElement.controls = "controls"; + this.vidElement.classList = "center drop-shadow"; + this.vidElement.addEventListener("ended", () => { this.next(); }, false); - v.videoSource = document.createElement("source"); - v.videoSource.src = apiEndpoint+"/file/"+v.file.id; + this.videoSource = document.createElement("source"); + this.videoSource.src = apiEndpoint+"/file/"+this.file.id; - v.vidElement.appendChild(v.videoSource); - v.vidContainer.appendChild(v.vidElement); + this.vidElement.appendChild(this.videoSource); + this.vidContainer.appendChild(this.vidElement); } -VideoViewer.prototype.render = function(parent) {let v = this; - parent.appendChild(v.vidContainer); +VideoViewer.prototype.render = function(parent) { + parent.appendChild(this.vidContainer); } diff --git a/res/include/script/homepage.js b/res/include/script/homepage.js index 149866b..714bbbd 100644 --- a/res/include/script/homepage.js +++ b/res/include/script/homepage.js @@ -1,28 +1,27 @@ -function UploadProgressBar(uploadManager, queueDiv, file){let upb = this; - upb.uploadManager = uploadManager; - upb.file = file; - upb.name = file.name; +function UploadProgressBar(uploadManager, queueDiv, file){ + this.uploadManager = uploadManager; + this.file = file; + this.name = file.name; - upb.uploadDiv = document.createElement("a"); - upb.uploadDiv.classList.add("file_button"); - upb.uploadDiv.style.opacity = "0"; - upb.uploadDiv.innerText = "Queued\n" + upb.file.name; - queueDiv.appendChild(upb.uploadDiv); + this.uploadDiv = document.createElement("a"); + this.uploadDiv.classList.add("file_button"); + this.uploadDiv.style.opacity = "0"; + this.uploadDiv.innerText = "Queued\n" + this.file.name; + queueDiv.appendChild(this.uploadDiv); // Start uploading the file - upb.uploadManager.addFile( - upb.file, - upb.name, - function(progress) { upb.onProgress(progress); }, - function(id) { upb.onFinished(id); }, - function(val, msg) { upb.onFailure(val, msg); } + this.uploadManager.addFile( + this.file, + this.name, + (progress) => { this.onProgress(progress); }, + (id) => { this.onFinished(id); }, + (val, msg) => { this.onFailure(val, msg); } ); // Browsers don't render the transition if the opacity is set and // updated in the same frame. So we have to wait a frame (or more) // before changing the opacity to make sure the transition triggers - var d = this.uploadDiv // `this` stops working after constructor ends - window.setTimeout(function(){d.style.opacity = "1";}, 100) + window.setTimeout(() => {this.uploadDiv.style.opacity = "1";}, 100) } UploadProgressBar.prototype.onProgress = function(progress){ diff --git a/res/include/style/layout.css b/res/include/style/layout.css index 761c255..37fe27d 100644 --- a/res/include/style/layout.css +++ b/res/include/style/layout.css @@ -25,13 +25,13 @@ html, body { overflow-x: hidden; } body{ - background-color: #0d0d0d; /* Fallback */ + background-color: #111111; /* Fallback */ background-color: var(--body_color); background-repeat: repeat; font-family: sans-serif; margin: 0; line-height: 1.5em; - color: #bfbfbf; /* Fallback */ + color: #b2b2b2; /* Fallback */ color: var(--text_color); padding: 0; } @@ -54,9 +54,11 @@ body{ padding: 10px 20px 15px 10px; font-size: 2em; margin: 0; + background: #3f3f3f; background: var(--input_color); border-radius: 0; border-bottom-right-radius: 90%; + box-shadow: 2px 2px 8px -3px #000000; box-shadow: 2px 2px 8px -3px var(--shadow_color); } .page_navigation { @@ -67,12 +69,14 @@ body{ height: 100%; left: 0; float: left; + background-color: #1c1c1c; background-color: var(--layer_1_color); padding: 20px 0 0.5em 0; box-sizing: border-box; overflow-y: auto; overflow-x: hidden; text-align: left; + box-shadow: inset -10px 0px 10px -10px #000000; box-shadow: inset -10px 0px 10px -10px var(--shadow_color); transition: left 0.5s; } @@ -107,7 +111,9 @@ body{ width: 100%; height: auto; padding: 20px 0 20px 0; + background-color: #212121; background-color: var(--layer_2_color); + box-shadow: 1px 1px 20px 0 #000000; box-shadow: 1px 1px 20px 0 var(--shadow_color); box-sizing: border-box; clear: both; @@ -125,6 +131,7 @@ body{ } .page_body > h1 { text-shadow: 1px 1px 25px #000000; + text-shadow: 1px 1px 25px var(--shadow_color); } /* Page contents */ @@ -140,7 +147,7 @@ body{ float: none; display: block; box-sizing: border-box; - color: #bfbfbf; /* Fallback */ + color: #b2b2b2; /* Fallback */ color: var(--text_color); text-align: center; padding: 6px 6px; @@ -153,12 +160,15 @@ body{ border-radius: 5px; } .page_navigation a:hover { + background-color: #3f3f3f; background-color: var(--input_color); + color: #ffffff; color: var(--input_text_color); text-decoration: none; } .inset { + box-shadow: inset 1px 1px 20px 0 #000000; box-shadow: inset 1px 1px 20px 0 var(--shadow_color); } .checkers { diff --git a/res/include/style/listview_embed.css b/res/include/style/listview_embed.css deleted file mode 100644 index 7bf27bb..0000000 --- a/res/include/style/listview_embed.css +++ /dev/null @@ -1,87 +0,0 @@ -/* - Created on : Jul 30, 2015, 12:46:39 PM - Author : Fornax -*/ - -.file-container{ - position: absolute; - top: 100px; - left: 0px; - right: 0px; - bottom: 0px; - width: 100%; - overflow: hidden; - border: none; -} - -.file-container-frame{ - position: absolute; - width: 100%; - height: 100%; - border: none; -} - -#listNavigator{ - position: absolute; - left: 0; - right: 0; - top: -100px; - height: 58px; - background-color: #000; - border-bottom: 2px ridge #9FCF6C; - text-align: center; - overflow-x: hidden; - overflow-y: hidden; - z-index: 1000; -} - -#listNavigatorItems{ - position: absolute; - top: 0; - left: 0; - right: 0; - height: 100%; - white-space: nowrap; - overflow-x: scroll; - overflow-y: hidden; - border: none; - padding: 0 40px; - z-index: 1001; - -} - -.listItem{ - display: inline-block; - position: relative; - height: 92%; - width: 100px; - margin-right: 5px; - text-align: center; - border: #333 solid 2px; - font-size: 12px; - overflow: hidden; - cursor: pointer; -} - -.listItemThumbnail{ - position: relative; - max-width: 100%; - max-height: 74%; - margin: 0; -} - -#arrow-left{ - position: fixed; - height: 58px; - width: 25px; - left: 0; - z-index: 1002; -} - -#arrow-right{ - position: fixed; - height: 58px; - width: 25px; - right: 0; - z-index: 1002; -} \ No newline at end of file diff --git a/res/include/style/viewer_embed.css b/res/include/style/viewer_embed.css deleted file mode 100644 index ff3f4ca..0000000 --- a/res/include/style/viewer_embed.css +++ /dev/null @@ -1,128 +0,0 @@ -/* - Created on : May 22, 2015, 1:20:02 PM - Author : Fornax -*/ - -body{ - background-color: #111; - background-image: url("img/checker.png"); - background-repeat: repeat; - color: #eeeeee; - font-size: 16px; - font-family: 'Ubuntu', sans-serif; - margin: 0; - overflow: hidden; -} - -a{ - color: #9FCF6C; - text-decoration: none; -} - -a:hover{ - text-decoration: underline; - color: #9FCF6C; -} - -::-webkit-scrollbar{ - width: 10px; /* for vertical scrollbars */ - height: 10px; /* for horizontal scrollbars */ -} -::-webkit-scrollbar-track{ - background: #000; -} -::-webkit-scrollbar-thumb{ - background-color: #444; -} -::-webkit-scrollbar-corner{ - background: transparent; -} - -button:active{ - background-color: #111; -} -button:hover{ - background-color: #333; -} - -#filepreview{ - position: absolute; - display: inline-block; - top: 0; - left: 0; - right: 0; - bottom: 0; - min-height: 100px; - min-width: 100px; - text-align: center; - vertical-align: middle; -} - -/* =========================== - == START FILE CONTAINERS == - ===========================*/ -.image-container{ - position: absolute; - top: 0px; - left: 0px; - right: 0px; - bottom: 0px; - height: 100%; - width: 100%; - text-align: center; - overflow: hidden; -} - -.image{ - position: relative; - display: block; - margin: auto; - max-width: 100%; - max-height: 100%; -} - -.text-container{ - background: #333 none; - position: absolute; - overflow-y: scroll; - overflow-x: auto; - text-align: left; - top: 0; - bottom: 0; - left: 0; - right: 0; - padding: 5px 5px 5px 20px; - box-sizing: border-box; -} - -.pre-container{ - white-space: pre-wrap; - word-wrap: break-word; -} - -.pannable{ - position: relative; - display: inline-block; - margin: auto; - max-width: 100%; - max-height: 100%; - cursor: move; - top: 50%; - transform: translateY(-50%); - -webkit-transform: translateY(-50%); -} - -.center{ - position: relative; - display: block; - margin: auto; - max-width: 100%; - max-height: 100%; - top: 50%; - transform: translateY(-50%); - -webkit-transform: translateY(-50%); -} - -.drop-shadow{ - box-shadow: #000 10px 10px 50px; -} \ No newline at end of file diff --git a/res/template/404.html b/res/template/404.html index 4f271ef..32d7718 100644 --- a/res/template/404.html +++ b/res/template/404.html @@ -25,5 +25,5 @@ {{template "page_bottom"}} {{template "analytics"}} - + {{end}} diff --git a/res/template/file_viewer_compat.html b/res/template/file_viewer_compat.html new file mode 100644 index 0000000..138c8ac --- /dev/null +++ b/res/template/file_viewer_compat.html @@ -0,0 +1,66 @@ +{{define "file_viewer_compat"}} + + + + {{.Title}} + + + {{template "user_style" .}} + + + + + + + + {{.OGData}} + + + + {{template "page_top" .}} +

{{.Title}}

+
+ {{if eq .Other.Type "file"}} + Download {{.Other.APIResponse.Name}} here. + {{else}} + + {{if ne .Other.APIResponse.ID ""}} + Download all files (~{{formatData $totalSize}}) + {{end}} + {{end}} +

Compatibility file viewer

+

+ Welcome to the compatibility version of the file viewer. This + page is only shown to web browsers which can't properly display + the regular file viewer. +

+

+ This page only allows you to download the linked files. If you + want more features like online video / audio players, an image + viewer, a PDF viewer or a text file viewer, please download any + of the supported web browsers: +

+ +
+ {{template "analytics"}} + + +{{end}} diff --git a/res/template/fragments/form.html b/res/template/fragments/form.html index 0df343d..b3a39aa 100644 --- a/res/template/fragments/form.html +++ b/res/template/fragments/form.html @@ -24,7 +24,7 @@ {{end}} - {{range $index, $field := .Fields}} + {{range $field := .Fields}} {{if eq $field.Type "textarea"}}
diff --git a/res/template/fragments/user_style.html b/res/template/fragments/user_style.html index cb58d4b..689cd21 100644 --- a/res/template/fragments/user_style.html +++ b/res/template/fragments/user_style.html @@ -1,6 +1,6 @@ {{define "user_style"}} {{end}} diff --git a/res/template/paste.html b/res/template/paste.html index 569f0f9..9319466 100644 --- a/res/template/paste.html +++ b/res/template/paste.html @@ -44,7 +44,7 @@
- diff --git a/webcontroller/file_viewer.go b/webcontroller/file_viewer.go index 74248ef..331f8a7 100644 --- a/webcontroller/file_viewer.go +++ b/webcontroller/file_viewer.go @@ -4,6 +4,7 @@ import ( "fmt" "net/http" "strings" + "time" "fornaxian.com/pixeldrain-web/pixelapi" "github.com/Fornaxian/log" @@ -18,6 +19,10 @@ func viewTokenOrBust(api *pixelapi.PixelAPI) (t string) { return t } +func browserCompat(ua string) bool { + return strings.Contains(ua, "MSIE") || strings.Contains(ua, "Trident/7.0") +} + type viewerData struct { Type string // file or list CaptchaKey string @@ -33,23 +38,17 @@ func (wc *WebController) serveFileViewer(w http.ResponseWriter, r *http.Request, return } - var list = strings.Contains(p.ByName("id"), ",") - var ids []string - if list { - ids = strings.Split(p.ByName("id"), ",") - } else { - ids = append(ids, p.ByName("id")) - } + var ids = strings.Split(p.ByName("id"), ",") templateData := wc.newTemplateData(w, r) - var finfo []pixelapi.FileInfo + var finfo []pixelapi.ListFile for _, id := range ids { inf, err := templateData.PixelAPI.GetFileInfo(id) if err != nil { continue } - finfo = append(finfo, inf) + finfo = append(finfo, pixelapi.ListFile{FileInfo: inf}) } if len(finfo) == 0 { @@ -58,19 +57,18 @@ func (wc *WebController) serveFileViewer(w http.ResponseWriter, r *http.Request, return } - templateData.OGData = metadataFromFile(finfo[0]) - if list { + templateData.OGData = metadataFromFile(finfo[0].FileInfo) + if len(ids) > 1 { templateData.Title = fmt.Sprintf("%d files on pixeldrain", len(finfo)) templateData.Other = viewerData{ Type: "list", CaptchaKey: wc.captchaKey(), ViewToken: viewTokenOrBust(templateData.PixelAPI), - APIResponse: map[string]interface{}{ - "data": finfo, - "date_created": "now", - "title": "Multiple files", - "date_lastview": "now", - "views": 0, + APIResponse: pixelapi.List{ + Success: true, + Title: "Multiple files", + DateCreated: time.Now(), + Files: finfo, }, } } else { @@ -79,10 +77,16 @@ func (wc *WebController) serveFileViewer(w http.ResponseWriter, r *http.Request, Type: "file", CaptchaKey: wc.captchaKey(), ViewToken: viewTokenOrBust(templateData.PixelAPI), - APIResponse: finfo[0], + APIResponse: finfo[0].FileInfo, } } - err = wc.templates.Get().ExecuteTemplate(w, "file_viewer", templateData) + + var templateName = "file_viewer" + if browserCompat(r.UserAgent()) { + templateName = "file_viewer_compat" + } + + err = wc.templates.Get().ExecuteTemplate(w, templateName, templateData) if err != nil && !strings.Contains(err.Error(), "broken pipe") { log.Error("Error executing template file_viewer: %s", err) } @@ -118,13 +122,11 @@ func (wc *WebController) serveFileViewerDemo(w http.ResponseWriter, r *http.Requ // ServeListViewer controller for GET /l/:id func (wc *WebController) serveListViewer(w http.ResponseWriter, r *http.Request, p httprouter.Params) { - var api = pixelapi.New(wc.apiURLInternal, "") - var list, err = api.GetList(p.ByName("id")) var templateData = wc.newTemplateData(w, r) + var list, err = templateData.PixelAPI.GetList(p.ByName("id")) if err != nil { if err, ok := err.(pixelapi.Error); ok && err.ReqError { log.Error("API request error occurred: %s", err.Value) - } w.WriteHeader(http.StatusNotFound) wc.templates.Get().ExecuteTemplate(w, "list_not_found", templateData) @@ -132,20 +134,20 @@ func (wc *WebController) serveListViewer(w http.ResponseWriter, r *http.Request, } templateData.Title = fmt.Sprintf("%s ~ pixeldrain", list.Title) - templateData.OGData = metadataFromList(*list) + templateData.OGData = metadataFromList(list) templateData.Other = viewerData{ - Type: "list", - CaptchaKey: wc.captchaSiteKey, - ViewToken: viewTokenOrBust(templateData.PixelAPI), - APIResponse: map[string]interface{}{ - "id": list.ID, - "data": list.Files, - "date_created": list.DateCreated, - "title": list.Title, - "views": 0, - }, + Type: "list", + CaptchaKey: wc.captchaSiteKey, + ViewToken: viewTokenOrBust(templateData.PixelAPI), + APIResponse: list, } - err = wc.templates.Get().ExecuteTemplate(w, "file_viewer", templateData) + + var templateName = "file_viewer" + if browserCompat(r.UserAgent()) { + templateName = "file_viewer_compat" + } + + err = wc.templates.Get().ExecuteTemplate(w, templateName, templateData) if err != nil && !strings.Contains(err.Error(), "broken pipe") { log.Error("Error executing template file_viewer: %s", err) } diff --git a/webcontroller/templates.go b/webcontroller/templates.go index 300c0f9..debb4ca 100644 --- a/webcontroller/templates.go +++ b/webcontroller/templates.go @@ -227,8 +227,8 @@ func (tm *TemplateManager) add(a, b interface{}) int { func (tm *TemplateManager) sub(a, b interface{}) int { return detectInt(a) - detectInt(b) } -func (tm *TemplateManager) formatData(i int) string { - return util.FormatData(uint64(i)) +func (tm *TemplateManager) formatData(i interface{}) string { + return util.FormatData(uint64(detectInt(i))) } func detectInt(i interface{}) int {