pixeldrain/fnx_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

go from classes to prototypes

Browse Source
This commit is contained in:
Wim Brand
2020-01-27 16:56:16 +01:00
parent 9c862c48e1
commit cd69b63583
19 changed files with 1147 additions and 1114 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
res/include/img/icons/pixeldrain.svg Normal file
View File

@@ -0,0 +1,3 @@
<svg enable-background="new 0 0 283.46 283.46" version="1.1" viewBox="0 0 283 283" xmlns="http://www.w3.org/2000/svg">
<path fill="#{{.Style.InputTextColor.RGB}}" d="m142 2.23c-77 0-139 62.5-139 140 0 77 62.5 139 139 139 77 0 139-62.5 139-139 1e-3 -77-62.5-140-139-140zm0 258c-65.7 0-119-53.2-119-119s53.2-119 119-119c65.7 0 119 53.2 119 119 0 65.7-53.2 119-119 119zm0-219c-55.1 0-99.8 44.7-99.8 99.8 0 55.1 44.7 99.8 99.8 99.8s99.8-44.7 99.8-99.8c0-55.1-44.7-99.8-99.8-99.8zm49.3 36c8.69 0 15.7 7.04 15.7 15.7 0 8.69-7.04 15.7-15.7 15.7s-15.7-7.04-15.7-15.7c0-8.69 7.04-15.7 15.7-15.7zm-49.3-20c8.69 0 15.7 7.04 15.7 15.7 0 8.69-7.04 15.7-15.7 15.7s-15.7-7.04-15.7-15.7c0-8.69 7.04-15.7 15.7-15.7zm-48.7 20c8.69 0 15.7 7.04 15.7 15.7 0 8.69-7.04 15.7-15.7 15.7s-15.7-7.04-15.7-15.7c-1e-3 -8.69 7.04-15.7 15.7-15.7zm-35 63.8c0-8.69 7.04-15.7 15.7-15.7s15.7 7.04 15.7 15.7c0 8.69-7.04 15.7-15.7 15.7-8.69 0-15.7-7.04-15.7-15.7zm35 65.6c-8.69 0-15.7-7.04-15.7-15.7s7.04-15.7 15.7-15.7 15.7 7.04 15.7 15.7-7.04 15.7-15.7 15.7zm48.7 20.7c-8.69 0-15.7-7.04-15.7-15.7 0-8.69 7.04-15.7 15.7-15.7 8.69 0 15.7 7.04 15.7 15.7 1e-3 8.68-7.04 15.7-15.7 15.7zm2e-3 -47c-21.2 0-38.5-17.2-38.5-38.5 0-21.2 17.2-38.5 38.5-38.5 21.2 0 38.5 17.2 38.5 38.5 0 21.2-17.2 38.5-38.5 38.5zm49.3 26.3c-8.69 0-15.7-7.04-15.7-15.7s7.04-15.7 15.7-15.7 15.7 7.04 15.7 15.7-7.04 15.7-15.7 15.7zm18.6-49.9c-8.69 0-15.7-7.04-15.7-15.7 0-8.69 7.04-15.7 15.7-15.7s15.7 7.04 15.7 15.7c0 8.69-7.04 15.7-15.7 15.7z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

14
res/include/script/dependencies/UploadManager.js
View File

@@ -1,5 +1,4 @@
class UploadManager { function UploadManager(apiAddress, uploadsFinished) {let um = this;
constructor(apiAddress, uploadsFinished) {let um = this;
um.apiAddress = apiAddress; um.apiAddress = apiAddress;
@@ -36,14 +35,14 @@ class UploadManager {
um.jobCounter = 0; um.jobCounter = 0;
} }
finishedUploads() {let um = this; UploadManager.prototype.finishedUploads = function() {let um = this;
um.uploadLog.sort(function(a, b) { um.uploadLog.sort(function(a, b) {
return a.jobID - b.jobID; return a.jobID - b.jobID;
}) })
return um.uploadLog; return um.uploadLog;
} }
addFile( UploadManager.prototype.addFile = function(
file, // Blob file, // Blob
name, // string name, // string
onProgress, // func (progress: number) onProgress, // func (progress: number)
@@ -69,7 +68,7 @@ class UploadManager {
} }
} }
startUpload() {let um = this; UploadManager.prototype.startUpload = function() {let um = this;
if (um.uploadQueue.length === 0) { if (um.uploadQueue.length === 0) {
return; // Nothing to upload return; // Nothing to upload
} }
@@ -80,7 +79,7 @@ class UploadManager {
} }
} }
finishUpload() {let um = this; UploadManager.prototype.finishUpload = function() {let um = this;
um.activeWorkers--; um.activeWorkers--;
if ( if (
@@ -96,7 +95,7 @@ class UploadManager {
um.startUpload(); um.startUpload();
} }
uploadThread() {let um = this; UploadManager.prototype.uploadThread = function() {let um = this;
let job = um.uploadQueue.shift(); // Get the first element of the array let job = um.uploadQueue.shift(); // Get the first element of the array
console.debug("Starting upload of " + job.name); console.debug("Starting upload of " + job.name);
@@ -167,4 +166,3 @@ class UploadManager {
}; };
xhr.send(form); xhr.send(form);
} }
}

12
res/include/script/file_viewer/DetailsWindow.js
View File

@@ -1,5 +1,4 @@
class DetailsWindow { function DetailsWindow(viewer) {let dw = this;
constructor(viewer) {let dw = this;
dw.viewer = viewer; dw.viewer = viewer;
dw.visible = false; dw.visible = false;
dw.fileID = ""; dw.fileID = "";
@@ -14,7 +13,7 @@ class DetailsWindow {
dw.btnCloseDetails.addEventListener("click", () => { dw.toggle(); }); dw.btnCloseDetails.addEventListener("click", () => { dw.toggle(); });
} }
toggle() {let dw = this; DetailsWindow.prototype.toggle = function() {let dw = this;
if (dw.visible) { if (dw.visible) {
dw.divPopup.style.opacity = "0"; dw.divPopup.style.opacity = "0";
dw.divPopup.style.visibility = "hidden"; dw.divPopup.style.visibility = "hidden";
@@ -37,7 +36,7 @@ class DetailsWindow {
} }
} }
setDetails(file) {let dw = this; DetailsWindow.prototype.setDetails = function(file) {let dw = this;
let desc = ""; let desc = "";
if (dw.viewer.isList) { if (dw.viewer.isList) {
desc = file.description; desc = file.description;
@@ -59,7 +58,7 @@ class DetailsWindow {
} }
} }
updateGraph(fileID) {let dw = this; DetailsWindow.prototype.updateGraph = function(fileID) {let dw = this;
console.log("updating graph "+fileID); console.log("updating graph "+fileID);
fetch(apiEndpoint+"/file/" + fileID + "/timeseries?interval=60?days=14").then(resp => { fetch(apiEndpoint+"/file/" + fileID + "/timeseries?interval=60?days=14").then(resp => {
if (!resp.ok) {return null;} if (!resp.ok) {return null;}
@@ -72,7 +71,7 @@ class DetailsWindow {
}) })
} }
renderGraph() {let dw = this; DetailsWindow.prototype.renderGraph = function() {let dw = this;
console.log("rendering graph"); console.log("rendering graph");
Chart.defaults.global.defaultFontColor = "#b3b3b3"; Chart.defaults.global.defaultFontColor = "#b3b3b3";
Chart.defaults.global.defaultFontSize = 15; Chart.defaults.global.defaultFontSize = 15;
@@ -151,4 +150,3 @@ class DetailsWindow {
} }
); );
} }
}

21
res/include/script/file_viewer/ListNavigator.js
View File

@@ -1,5 +1,4 @@
class ListNavigator { function ListNavigator(viewer, data) {let ln = this;
constructor(viewer, data){let ln = this;
ln.viewer = viewer; ln.viewer = viewer;
ln.data = data; ln.data = data;
ln.length = data.length; ln.length = data.length;
@@ -44,7 +43,7 @@ class ListNavigator {
} }
} }
nextItem(){let ln = this; ListNavigator.prototype.nextItem = function() {let ln = this;
if(ln.shuffle){ if(ln.shuffle){
ln.randItem(); ln.randItem();
return; return;
@@ -59,7 +58,7 @@ class ListNavigator {
ln.setItem(ln.position); ln.setItem(ln.position);
} }
previousItem(){let ln = this; ListNavigator.prototype.previousItem = function() {let ln = this;
if(ln.position === 0){ if(ln.position === 0){
ln.position = ln.length - 1; ln.position = ln.length - 1;
}else{ }else{
@@ -69,7 +68,7 @@ class ListNavigator {
ln.setItem(ln.position); ln.setItem(ln.position);
} }
randItem(){let ln = this; ListNavigator.prototype.randItem = function() {let ln = this;
// Avoid viewing the same file multiple times // Avoid viewing the same file multiple times
let rand; let rand;
do { do {
@@ -80,7 +79,7 @@ class ListNavigator {
ln.setItem(rand); ln.setItem(rand);
} }
setItem(index){let ln = this; ListNavigator.prototype.setItem = function(index) {let ln = this;
if(index >= ln.length){ if(index >= ln.length){
ln.position = 0; ln.position = 0;
}else{ }else{
@@ -121,11 +120,11 @@ class ListNavigator {
animateScroll(start, 0); animateScroll(start, 0);
} }
downloadList(){let ln = this; ListNavigator.prototype.downloadList = function() {let ln = this;
document.getElementById("download_frame").src = "/api/list/" + ln.viewer.listId + "/zip"; document.getElementById("download_frame").src = "/api/list/" + ln.viewer.listId + "/zip";
} }
addToHistory(index){let ln = this; ListNavigator.prototype.addToHistory = function(index) {let ln = this;
if(ln.history.length >= (ln.length - 6)){ if(ln.history.length >= (ln.length - 6)){
ln.history.shift(); ln.history.shift();
} }
@@ -133,7 +132,7 @@ class ListNavigator {
ln.history.push(index); ln.history.push(index);
} }
toggleShuffle(){let ln = this; ListNavigator.prototype.toggleShuffle = function() {let ln = this;
ln.shuffle = !ln.shuffle; // :P ln.shuffle = !ln.shuffle; // :P
if(ln.shuffle){ if(ln.shuffle){
@@ -145,7 +144,7 @@ class ListNavigator {
} }
} }
loadThumbnails(index){let ln = this; ListNavigator.prototype.loadThumbnails = function(index) {let ln = this;
let startPos = +index - 50; let startPos = +index - 50;
let endPos = +index + 50; let endPos = +index + 50;
// fyi, the + is to let javascript know it's actually a number instead of a string // fyi, the + is to let javascript know it's actually a number instead of a string
@@ -175,7 +174,7 @@ class ListNavigator {
navigatorItems[i].innerHTML = itemHtml; navigatorItems[i].innerHTML = itemHtml;
} }
} }
};
// Misc function, don't really know where else to put it // Misc function, don't really know where else to put it

15
res/include/script/file_viewer/Toolbar.js
View File

@@ -1,5 +1,4 @@
class Toolbar { function Toolbar(viewer) {let t = this;
constructor(viewer) {let t = this;
t.viewer = viewer; t.viewer = viewer;
t.visible = false; t.visible = false;
t.sharebarVisible = false; t.sharebarVisible = false;
@@ -24,7 +23,7 @@ class Toolbar {
t.btnShare.addEventListener("click", () => { t.toggleSharebar(); }); t.btnShare.addEventListener("click", () => { t.toggleSharebar(); });
} }
toggle() {let t = this; Toolbar.prototype.toggle = function() {let t = this;
if (t.visible) { if (t.visible) {
if (t.sharebarVisible) { t.toggleSharebar(); } if (t.sharebarVisible) { t.toggleSharebar(); }
@@ -40,7 +39,7 @@ class Toolbar {
} }
} }
toggleSharebar(){let t = this; Toolbar.prototype.toggleSharebar = function() {let t = this;
if (navigator.share) { if (navigator.share) {
navigator.share({ navigator.share({
title: t.viewer.title, title: t.viewer.title,
@@ -61,7 +60,7 @@ class Toolbar {
} }
} }
download() {let t = this; Toolbar.prototype.download = function() {let t = this;
let triggerDL = (captchaResp = "") => { let triggerDL = (captchaResp = "") => {
if (captchaResp === "") { if (captchaResp === "") {
t.downloadFrame.src = apiEndpoint+"/file/"+ t.downloadFrame.src = apiEndpoint+"/file/"+
@@ -131,7 +130,7 @@ class Toolbar {
}); });
} }
copyUrl() {let t = this; Toolbar.prototype.copyUrl = function() {let t = this;
if(copyText(window.location.href)) { if(copyText(window.location.href)) {
console.log('Text copied'); console.log('Text copied');
t.spanCopyLink.innerText = "Copied!"; t.spanCopyLink.innerText = "Copied!";
@@ -149,12 +148,12 @@ class Toolbar {
}, 60000); }, 60000);
} }
setStats(file) {let t = this; Toolbar.prototype.setStats = function(file) {let t = this;
t.spanViews.innerText = file.views t.spanViews.innerText = file.views
t.spanDownloads.innerText = Math.round((file.bandwidth_used/file.size)*10)/10; t.spanDownloads.innerText = Math.round((file.bandwidth_used/file.size)*10)/10;
t.spanSize.innerText = formatDataVolume(file.size, 3); t.spanSize.innerText = formatDataVolume(file.size, 3);
} }
}
// Called by the google recaptcha script // Called by the google recaptcha script
let recaptchaResponse = ""; let recaptchaResponse = "";

13
res/include/script/file_viewer/Viewer.js
View File

@@ -1,5 +1,4 @@
class Viewer { function Viewer(type, viewToken, data) {let v = this;
constructor(type, viewToken, data) {let v = this;
// Set defaults // Set defaults
v.toolbar = null; v.toolbar = null;
v.listNavigator = null; v.listNavigator = null;
@@ -52,7 +51,7 @@ class Viewer {
v.initialized = true; v.initialized = true;
} }
setFile(file) {let v = this; Viewer.prototype.setFile = function(file) {let v = this;
v.currentFile = file.id; v.currentFile = file.id;
if (v.isList) { if (v.isList) {
document.getElementById("file_viewer_headerbar_title").style.lineHeight = "1em"; document.getElementById("file_viewer_headerbar_title").style.lineHeight = "1em";
@@ -118,7 +117,7 @@ class Viewer {
} }
} }
renderSponsors() { Viewer.prototype.renderSponsors = function() {
let scale = 1; let scale = 1;
let scaleWidth = 1; let scaleWidth = 1;
let scaleHeight = 1; let scaleHeight = 1;
@@ -153,12 +152,12 @@ class Viewer {
} }
} }
keyboardEvent(evt) {let v = this; Viewer.prototype.keyboardEvent = function(evt) {let v = this;
if (evt.ctrlKey || evt.altKey) { if (evt.ctrlKey || evt.altKey) {
return // prevent custom shortcuts from interfering with system shortcuts return // prevent custom shortcuts from interfering with system shortcuts
} }
switch (evt.which) { switch (evt.keyCode) {
case 65: // A or left arrow key go to previous file case 65: // A or left arrow key go to previous file
case 37: case 37:
if (v.listNavigator != null) { if (v.listNavigator != null) {
@@ -194,7 +193,7 @@ class Viewer {
break; break;
} }
} }
};
// Against XSS attacks // Against XSS attacks
function escapeHTML(str) { function escapeHTML(str) {

6
res/include/script/file_viewer/viewer_scripts/AudioViewer.js
View File

@@ -1,5 +1,4 @@
class AudioViewer { function AudioViewer(viewer, file, next) {let v = this;
constructor(viewer, file, next) {let v = this;
v.viewer = viewer; v.viewer = viewer;
v.file = file; v.file = file;
v.next = next; v.next = next;
@@ -29,7 +28,6 @@ class AudioViewer {
v.container.appendChild(v.element); v.container.appendChild(v.element);
} }
render(parent) {let v = this; AudioViewer.prototype.render = function(parent) {let v = this;
parent.appendChild(v.container); parent.appendChild(v.container);
} }
}

6
res/include/script/file_viewer/viewer_scripts/FileViewer.js
View File

@@ -1,5 +1,4 @@
class FileViewer { function FileViewer(viewer, file, next) {let v = this;
constructor(viewer, file, next) {let v = this;
v.viewer = viewer; v.viewer = viewer;
v.file = file; v.file = file;
v.next = next; v.next = next;
@@ -23,7 +22,6 @@ class FileViewer {
)); ));
} }
render(parent) {let v = this; FileViewer.prototype.render = function(parent) {let v = this;
parent.appendChild(v.container); parent.appendChild(v.container);
} }
}

14
res/include/script/file_viewer/viewer_scripts/ImageViewer.js
View File

@@ -1,5 +1,4 @@
class ImageViewer { function ImageViewer(viewer, file) {let v = this;
constructor(viewer, file) {let v = this;
v.viewer = viewer; v.viewer = viewer;
v.file = file; v.file = file;
v.zoomed = false; v.zoomed = false;
@@ -23,11 +22,11 @@ class ImageViewer {
v.container.appendChild(v.element); v.container.appendChild(v.element);
} }
render(parent) {let v = this; ImageViewer.prototype.render = function(parent) {let v = this;
parent.appendChild(v.container); parent.appendChild(v.container);
} }
doubleclick(e) {let v = this; ImageViewer.prototype.doubleclick = function(e) {let v = this;
if (v.zoomed) { if (v.zoomed) {
v.element.style.maxWidth = "100%"; v.element.style.maxWidth = "100%";
v.element.style.maxHeight = "100%"; v.element.style.maxHeight = "100%";
@@ -51,7 +50,7 @@ class ImageViewer {
return false; return false;
} }
mousedown(e) {let v = this; ImageViewer.prototype.mousedown = function(e) {let v = this;
if (!v.dragging && e.which === 1 && v.zoomed) { if (!v.dragging && e.which === 1 && v.zoomed) {
v.x = e.pageX; v.x = e.pageX;
v.y = e.pageY; v.y = e.pageY;
@@ -63,7 +62,7 @@ class ImageViewer {
} }
} }
mousemove(e) {let v = this; ImageViewer.prototype.mousemove = function(e) {let v = this;
if (v.dragging) { if (v.dragging) {
v.container.scrollLeft = v.container.scrollLeft - (e.pageX - v.x); v.container.scrollLeft = v.container.scrollLeft - (e.pageX - v.x);
v.container.scrollTop = v.container.scrollTop - (e.pageY - v.y); v.container.scrollTop = v.container.scrollTop - (e.pageY - v.y);
@@ -78,7 +77,7 @@ class ImageViewer {
} }
mouseup(e) {let v = this; ImageViewer.prototype.mouseup = function(e) {let v = this;
if (v.dragging) { if (v.dragging) {
v.dragging = false; v.dragging = false;
@@ -87,4 +86,3 @@ class ImageViewer {
return false; return false;
} }
} }
}

6
res/include/script/file_viewer/viewer_scripts/PDFViewer.js
View File

@@ -1,5 +1,4 @@
class PDFViewer { function PDFViewer(viewer, file) {let v = this;
constructor(viewer, file) {let v = this;
v.viewer = viewer; v.viewer = viewer;
v.file = file; v.file = file;
@@ -9,7 +8,6 @@ class PDFViewer {
v.container.src = "/res/misc/pdf-viewer/web/viewer.html?file="+apiEndpoint+"/file/"+file.id; v.container.src = "/res/misc/pdf-viewer/web/viewer.html?file="+apiEndpoint+"/file/"+file.id;
} }
render(parent) {let v = this; PDFViewer.prototype.render = function(parent) {let v = this;
parent.appendChild(v.container); parent.appendChild(v.container);
} }
}

10
res/include/script/file_viewer/viewer_scripts/TextViewer.js
View File

@@ -1,5 +1,4 @@
class TextViewer { function TextViewer(viewer, file) {let v = this;
constructor(viewer, file) {let v = this;
v.viewer = viewer; v.viewer = viewer;
v.file = file; v.file = file;
v.pre = null; v.pre = null;
@@ -15,7 +14,7 @@ class TextViewer {
} }
} }
getText() {let v = this; TextViewer.prototype.getText = function() {let v = this;
v.pre = document.createElement("pre"); v.pre = document.createElement("pre");
v.pre.classList = "pre-container prettyprint linenums"; v.pre.classList = "pre-container prettyprint linenums";
v.pre.innerText = "Loading..."; v.pre.innerText = "Loading...";
@@ -41,7 +40,7 @@ class TextViewer {
}); });
} }
getMarkdown() {let v = this; TextViewer.prototype.getMarkdown = function() {let v = this;
fetch("/u/"+v.file.id+"/preview").then(resp => { fetch("/u/"+v.file.id+"/preview").then(resp => {
if (!resp.ok) { return Promise.reject(resp.status); } if (!resp.ok) { return Promise.reject(resp.status); }
return resp.text(); return resp.text();
@@ -52,7 +51,6 @@ class TextViewer {
}); });
} }
render(parent) {let v = this; TextViewer.prototype.render = function(parent) {let v = this;
parent.appendChild(v.container); parent.appendChild(v.container);
} }
}

6
res/include/script/file_viewer/viewer_scripts/VideoViewer.js
View File

@@ -1,5 +1,4 @@
class VideoViewer { function VideoViewer(viewer, file, next) {let v = this;
constructor(viewer, file, next) {let v = this;
v.viewer = viewer; v.viewer = viewer;
v.file = file; v.file = file;
v.next = next; v.next = next;
@@ -20,7 +19,6 @@ class VideoViewer {
v.vidContainer.appendChild(v.vidElement); v.vidContainer.appendChild(v.vidElement);
} }
render(parent) {let v = this; VideoViewer.prototype.render = function(parent) {let v = this;
parent.appendChild(v.vidContainer); parent.appendChild(v.vidContainer);
} }
}

58
res/include/script/homepage.js
View File

@@ -1,23 +1,21 @@
class UploadProgressBar { function UploadProgressBar(uploadManager, queueDiv, file){let upb = this;
constructor(uploadManager, queueDiv, file){ upb.uploadManager = uploadManager;
this.uploadManager = uploadManager; upb.file = file;
this.file = file; upb.name = file.name;
this.name = file.name;
this.uploadDiv = document.createElement("a"); upb.uploadDiv = document.createElement("a");
this.uploadDiv.classList.add("file_button"); upb.uploadDiv.classList.add("file_button");
this.uploadDiv.style.opacity = "0"; upb.uploadDiv.style.opacity = "0";
this.uploadDiv.innerText = "Queued\n" + this.file.name; upb.uploadDiv.innerText = "Queued\n" + upb.file.name;
queueDiv.appendChild(this.uploadDiv); queueDiv.appendChild(upb.uploadDiv);
// Start uploading the file // Start uploading the file
let that = this; upb.uploadManager.addFile(
this.uploadManager.addFile( upb.file,
this.file, upb.name,
this.name, function(progress) { upb.onProgress(progress); },
function(progress) { that.onProgress(progress); }, function(id) { upb.onFinished(id); },
function(id) { that.onFinished(id); }, function(val, msg) { upb.onFailure(val, msg); }
function(val, msg) { that.onFailure(val, msg); }
); );
// Browsers don't render the transition if the opacity is set and // Browsers don't render the transition if the opacity is set and
@@ -27,7 +25,7 @@ class UploadProgressBar {
window.setTimeout(function(){d.style.opacity = "1";}, 100) window.setTimeout(function(){d.style.opacity = "1";}, 100)
} }
onProgress(progress){ UploadProgressBar.prototype.onProgress = function(progress){
this.uploadDiv.innerText = "Uploading... " + Math.round(progress*1000)/10 + "%\n" + this.name this.uploadDiv.innerText = "Uploading... " + Math.round(progress*1000)/10 + "%\n" + this.name
this.uploadDiv.style.background = 'linear-gradient(' this.uploadDiv.style.background = 'linear-gradient('
+'to right, ' +'to right, '
@@ -35,7 +33,7 @@ class UploadProgressBar {
+'var(--highlight_color) '+ ((progress*100)) +'%, ' +'var(--highlight_color) '+ ((progress*100)) +'%, '
+'var(--file_background_color) '+ ((progress*100)+1) +'%)' +'var(--file_background_color) '+ ((progress*100)+1) +'%)'
} }
onFinished(id){ UploadProgressBar.prototype.onFinished = function(id){
console.log("Upload finished: "+this.file.name+" "+id); console.log("Upload finished: "+this.file.name+" "+id);
this.uploadDiv.style.background = 'var(--file_background_color)' this.uploadDiv.style.background = 'var(--file_background_color)'
@@ -56,7 +54,7 @@ class UploadProgressBar {
this.uploadDiv.appendChild(document.createElement("br")) this.uploadDiv.appendChild(document.createElement("br"))
this.uploadDiv.appendChild(linkSpan) this.uploadDiv.appendChild(linkSpan)
} }
onFailure(error) { UploadProgressBar.prototype.onFailure = function(error) {
this.uploadDiv.innerHTML = "" // Remove uploading progress this.uploadDiv.innerHTML = "" // Remove uploading progress
this.uploadDiv.style.background = 'var(--danger_color)' this.uploadDiv.style.background = 'var(--danger_color)'
this.uploadDiv.appendChild(document.createTextNode(this.file.name)) this.uploadDiv.appendChild(document.createTextNode(this.file.name))
@@ -65,7 +63,7 @@ class UploadProgressBar {
this.uploadDiv.appendChild(document.createElement("br")) this.uploadDiv.appendChild(document.createElement("br"))
this.uploadDiv.appendChild(document.createTextNode(error)) this.uploadDiv.appendChild(document.createTextNode(error))
} }
}
let uploader = null; let uploader = null;
let shareTitle = ""; let shareTitle = "";
@@ -76,6 +74,10 @@ function handleUploads(files) {
uploader = new UploadManager(apiEndpoint, uploadsFinished); uploader = new UploadManager(apiEndpoint, uploadsFinished);
} }
if (files.length === 0) {
return;
}
for (let i = 0; i < files.length; i++) { for (let i = 0; i < files.length; i++) {
new UploadProgressBar( new UploadProgressBar(
uploader, uploader,
@@ -143,13 +145,10 @@ function createList(title, anonymous) {
} }
function hideShareButtons() { function hideShareButtons() {
document.getElementById("instruction_2").style.display = "";
document.getElementById("instruction_3").style.display = "none";
document.getElementById("instruction_3_after").style.display = "none"; document.getElementById("instruction_3_after").style.display = "none";
} }
function showShareButtons() { function showShareButtons() {
document.getElementById("instruction_3").style.display = "";
document.getElementById("instruction_3_after").style.display = ""; document.getElementById("instruction_3_after").style.display = "";
if (window.navigator && window.navigator.share) { if (window.navigator && window.navigator.share) {
@@ -350,20 +349,19 @@ btnCopyMarkdown.addEventListener("click", function(){
/* /*
* Keyboard shortcuts * Keyboard shortcuts
*/ */
document.addEventListener("keydown", function(event){ document.addEventListener("keydown", function(event){
if (event.ctrlKey || event.altKey) { if (event.ctrlKey || event.altKey) {
return // prevent custom shortcuts from interfering with system shortcuts return // prevent custom shortcuts from interfering with system shortcuts
} }
if (event.which === 67 && !uploader.uploading()) { // c if (event.keyCode === 67) { // c
// Copy links to clipboard // Copy links to clipboard
copyLink(); document.getElementById("btn_copy_link").click();
} else if (event.which === 85) { // u } else if (event.keyCode === 85) { // u
// Click the upload button // Click the upload button
document.getElementById("file_input_field").click(); document.getElementById("file_input_field").click();
} else if (event.which === 84) { // t } else if (event.keyCode === 84) { // t
// Click the text button // Click the text button
document.getElementById("upload_text_button").click(); document.getElementById("upload_text_button").click();
} }
console.log(event.which) console.log(event.keyCode)
}); });

2
res/include/script/textupload.js
View File

@@ -23,7 +23,7 @@ function uploadText() {
// Upload the file when ctrl + s is pressed // Upload the file when ctrl + s is pressed
document.addEventListener("keydown", function(event) { document.addEventListener("keydown", function(event) {
if (event.ctrlKey && (event.which === 83)) { if (event.ctrlKey && (event.keyCode === 83)) {
event.preventDefault(); event.preventDefault();
uploadText(); uploadText();
return false; return false;

80
res/include/style/layout.css
View File

@@ -245,23 +245,6 @@ hr{
margin: 16px 16px 16px 16px; margin: 16px 16px 16px 16px;
} }
::-webkit-scrollbar{
width: 1em; /* for vertical scrollbars */
height: 1em; /* for horizontal scrollbars */
}
::-webkit-scrollbar-track {
background: var(--scrollbar_background_color);
}
::-webkit-scrollbar-thumb {
background-color: var(--scrollbar_foreground_color);
border-radius: 0.5em;
border: 0.22em solid var(--scrollbar_background_color);
}
::-webkit-scrollbar-thumb:hover {
background-color: var(--scrollbar_hover_color);
}
::-webkit-scrollbar-corner{background: var(--scrollbar_background_color);}
a {color: var(--highlight_color); text-decoration: none;} a {color: var(--highlight_color); text-decoration: none;}
a:hover {color: var(--highlight_color); text-decoration: underline;} a:hover {color: var(--highlight_color); text-decoration: underline;}
@@ -477,3 +460,66 @@ input[type=file]{
width: 0; width: 0;
height: 0; height: 0;
} }
/* Webkit Scrollbars */
::-webkit-scrollbar{
width: 18px; /* for vertical scrollbars */
height: 18px; /* for horizontal scrollbars */
}
::-webkit-scrollbar-track {
background: var(--scrollbar_background_color);
}
::-webkit-scrollbar-thumb {
background-color: var(--scrollbar_foreground_color);
border-radius: 10px;
border: 5px solid var(--scrollbar_background_color);
}
::-webkit-scrollbar-thumb:hover {
background-color: var(--scrollbar_hover_color);
}
::-webkit-scrollbar-corner{
background-color: var(--scrollbar_background_color);
}
::-webkit-scrollbar-button:single-button {
background-color: var(--scrollbar_background_color);
display: block;
border-style: solid;
height: 10px;
width: 10px;
}
::-webkit-scrollbar-button:single-button:vertical:decrement {
border-width: 0 8px 8px 8px;
border-color: transparent transparent var(--scrollbar_foreground_color) transparent;
}
::-webkit-scrollbar-button:single-button:vertical:decrement:hover {
border-color: transparent transparent var(--scrollbar_hover_color) transparent;
}
::-webkit-scrollbar-button:single-button:vertical:increment {
border-width: 8px 8px 0 8px;
border-color: var(--scrollbar_foreground_color) transparent transparent transparent;
}
::-webkit-scrollbar-button:vertical:single-button:increment:hover {
border-color: var(--scrollbar_hover_color) transparent transparent transparent;
}
::-webkit-scrollbar-button:single-button:horizontal:decrement {
border-width: 8px 8px 8px 0px;
border-color: transparent var(--scrollbar_foreground_color) transparent transparent;
}
::-webkit-scrollbar-button:single-button:horizontal:decrement:hover {
border-color: transparent var(--scrollbar_hover_color) transparent transparent;
}
::-webkit-scrollbar-button:single-button:horizontal:increment {
border-width: 8px 0px 8px 8px;
border-color: transparent transparent transparent var(--scrollbar_foreground_color);
}
::-webkit-scrollbar-button:horizontal:single-button:increment:hover {
border-color: transparent transparent transparent var(--scrollbar_hover_color);
}
/* Firefox Scrollbar */
* {
/* scrollbar-color: var(--scrollbar_foreground_color) var(--scrollbar_background_color); */
scrollbar-color: dark;
}

6
res/include/style/viewer.css
View File

@@ -48,6 +48,12 @@
.file_viewer > .file_viewer_headerbar > .button_home::after { .file_viewer > .file_viewer_headerbar > .button_home::after {
content: "pixeldrain"; content: "pixeldrain";
} }
.file_viewer > .file_viewer_headerbar > .button_home > svg {
height: 1.7em;
width: 1.7em;
margin: -0.25em;
margin-right: 0.2em;
}
@media (max-width: 500px) { @media (max-width: 500px) {
.file_viewer > .file_viewer_headerbar > .button_home::after { .file_viewer > .file_viewer_headerbar > .button_home::after {
content: "pd"; content: "pd";

9
res/template/file_viewer.html
View File

@@ -24,9 +24,7 @@
<div id="file_viewer_headerbar" class="highlight_1 file_viewer_headerbar"> <div id="file_viewer_headerbar" class="highlight_1 file_viewer_headerbar">
<button id="btn_toggle_toolbar" class="button_toggle_toolbar">☰</button> <button id="btn_toggle_toolbar" class="button_toggle_toolbar">☰</button>
<a href="/" id="button_home" class="button button_home"> <a href="/" id="button_home" class="button button_home">
<img src="{{template `pixeldrain_icon.png`}}" {{template `pixeldrain.svg` .}}
alt="Back to the Home page"
style="height: 1.5em; margin: -0.2em; margin-right: 0.2em;"/>
</a> </a>
<div id="file_viewer_headerbar_title" class="file_viewer_headerbar_title"> <div id="file_viewer_headerbar_title" class="file_viewer_headerbar_title">
<div id="file_viewer_list_title"></div> <div id="file_viewer_list_title"></div>
@@ -153,8 +151,9 @@
<script src="/res/script/Chart.min.js"></script> <script src="/res/script/Chart.min.js"></script>
<script> <script>
var apiEndpoint = '{{.APIEndpoint}}'; 'use strict';
var captchaKey = '{{.Other.CaptchaKey}}'; let apiEndpoint = '{{.APIEndpoint}}';
let captchaKey = '{{.Other.CaptchaKey}}';
{{template `util.js`}} {{template `util.js`}}
{{template `Toolbar.js`}} {{template `Toolbar.js`}}

5
res/template/home.html
View File

@@ -64,14 +64,14 @@
be placed in your web browser. More information on the be placed in your web browser. More information on the
<a href="/about">about</a> page <a href="/about">about</a> page
<p> <p>
<div id="instruction_2" class="instruction_highlight" style="display: none"> <div id="instruction_2" class="instruction_highlight">
<div class="limit_width"> <div class="limit_width">
<span class="big_number">2</span><span class="instruction_text">Wait for the files to finish uploading</span> <span class="big_number">2</span><span class="instruction_text">Wait for the files to finish uploading</span>
</div> </div>
</div> </div>
<div id="uploads_queue"></div> <div id="uploads_queue"></div>
<div id="instruction_3" class="instruction_highlight" style="display: none"> <div id="instruction_3" class="instruction_highlight">
<div class="limit_width"><span class="big_number">3</span><span class="instruction_text">Share the files</span></div> <div class="limit_width"><span class="big_number">3</span><span class="instruction_text">Share the files</span></div>
</div> </div>
<div id="instruction_3_after" style="display: none"> <div id="instruction_3_after" style="display: none">
@@ -150,6 +150,7 @@
{{template "page_bottom"}} {{template "page_bottom"}}
<script> <script>
'use strict';
let apiEndpoint = '{{.APIEndpoint}}'; let apiEndpoint = '{{.APIEndpoint}}';
{{template "util.js"}} {{template "util.js"}}
{{template "UploadManager.js"}} {{template "UploadManager.js"}}

1
webcontroller/viewer.go → webcontroller/file_viewer.go
View File

@@ -35,7 +35,6 @@ func (wc *WebController) serveFileViewer(w http.ResponseWriter, r *http.Request,
var list = strings.Contains(p.ByName("id"), ",") var list = strings.Contains(p.ByName("id"), ",")
var ids []string var ids []string
if list { if list {
ids = strings.Split(p.ByName("id"), ",") ids = strings.Split(p.ByName("id"), ",")
} else { } else {