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

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

@@ -1,5 +1,4 @@
class UploadManager {
constructor(apiAddress, uploadsFinished) {let um = this;
function UploadManager(apiAddress, uploadsFinished) {let um = this;
um.apiAddress = apiAddress;
@@ -34,22 +33,22 @@ class UploadManager {
// Total number of jobs accepted
um.jobCounter = 0;
}
}
finishedUploads() {let um = this;
UploadManager.prototype.finishedUploads = function() {let um = this;
um.uploadLog.sort(function(a, b) {
return a.jobID - b.jobID;
})
return um.uploadLog;
}
}
addFile(
UploadManager.prototype.addFile = function(
file, // Blob
name, // string
onProgress, // func (progress: number)
onFinished, // func (id: string)
onFailure // func (errorID: string, errorMessage: string)
) {let um = this;
) {let um = this;
um.uploadQueue.push({
jobID: um.jobCounter,
file: file,
@@ -67,9 +66,9 @@ class UploadManager {
// Run the upload function
um.startUpload();
}
}
}
startUpload() {let um = this;
UploadManager.prototype.startUpload = function() {let um = this;
if (um.uploadQueue.length === 0) {
return; // Nothing to upload
}
@@ -78,9 +77,9 @@ class UploadManager {
um.activeWorkers++;
um.uploadThread();
}
}
}
finishUpload() {let um = this;
UploadManager.prototype.finishUpload = function() {let um = this;
um.activeWorkers--;
if (
@@ -94,9 +93,9 @@ class UploadManager {
// Run the upload function for the next file
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
console.debug("Starting upload of " + job.name);
@@ -166,5 +165,4 @@ class UploadManager {
}
};
xhr.send(form);
}
}

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

@@ -1,5 +1,4 @@
class DetailsWindow {
constructor(viewer) {let dw = this;
function DetailsWindow(viewer) {let dw = this;
dw.viewer = viewer;
dw.visible = false;
dw.fileID = "";
@@ -12,9 +11,9 @@ class DetailsWindow {
dw.btnDetails.addEventListener("click", () => { dw.toggle(); });
dw.btnCloseDetails.addEventListener("click", () => { dw.toggle(); });
}
}
toggle() {let dw = this;
DetailsWindow.prototype.toggle = function() {let dw = this;
if (dw.visible) {
dw.divPopup.style.opacity = "0";
dw.divPopup.style.visibility = "hidden";
@@ -35,9 +34,9 @@ class DetailsWindow {
}
dw.updateGraph(dw.fileID);
}
}
}
setDetails(file) {let dw = this;
DetailsWindow.prototype.setDetails = function(file) {let dw = this;
let desc = "";
if (dw.viewer.isList) {
desc = file.description;
@@ -57,9 +56,9 @@ class DetailsWindow {
if(dw.visible) {
dw.updateGraph(file.id);
}
}
}
updateGraph(fileID) {let dw = this;
DetailsWindow.prototype.updateGraph = function(fileID) {let dw = this;
console.log("updating graph "+fileID);
fetch(apiEndpoint+"/file/" + fileID + "/timeseries?interval=60?days=14").then(resp => {
if (!resp.ok) {return null;}
@@ -70,9 +69,9 @@ class DetailsWindow {
dw.graph.data.datasets[1].data = resp.views;
dw.graph.update();
})
}
}
renderGraph() {let dw = this;
DetailsWindow.prototype.renderGraph = function() {let dw = this;
console.log("rendering graph");
Chart.defaults.global.defaultFontColor = "#b3b3b3";
Chart.defaults.global.defaultFontSize = 15;
@@ -150,5 +149,4 @@ class DetailsWindow {
}
}
);
}
}

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

@@ -1,5 +1,4 @@
class ListNavigator {
constructor(viewer, data){let ln = this;
function ListNavigator(viewer, data) {let ln = this;
ln.viewer = viewer;
ln.data = data;
ln.length = data.length;
@@ -42,9 +41,9 @@ class ListNavigator {
}else{
ln.setItem(0);
}
}
}
nextItem(){let ln = this;
ListNavigator.prototype.nextItem = function() {let ln = this;
if(ln.shuffle){
ln.randItem();
return;
@@ -57,9 +56,9 @@ class ListNavigator {
}
ln.setItem(ln.position);
}
}
previousItem(){let ln = this;
ListNavigator.prototype.previousItem = function() {let ln = this;
if(ln.position === 0){
ln.position = ln.length - 1;
}else{
@@ -67,9 +66,9 @@ class ListNavigator {
}
ln.setItem(ln.position);
}
}
randItem(){let ln = this;
ListNavigator.prototype.randItem = function() {let ln = this;
// Avoid viewing the same file multiple times
let rand;
do {
@@ -78,9 +77,9 @@ class ListNavigator {
} while(ln.history.indexOf(rand) > -1);
ln.setItem(rand);
}
}
setItem(index){let ln = this;
ListNavigator.prototype.setItem = function(index) {let ln = this;
if(index >= ln.length){
ln.position = 0;
}else{
@@ -119,21 +118,21 @@ class ListNavigator {
}
};
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";
}
}
addToHistory(index){let ln = this;
ListNavigator.prototype.addToHistory = function(index) {let ln = this;
if(ln.history.length >= (ln.length - 6)){
ln.history.shift();
}
ln.history.push(index);
}
}
toggleShuffle(){let ln = this;
ListNavigator.prototype.toggleShuffle = function() {let ln = this;
ln.shuffle = !ln.shuffle; // :P
if(ln.shuffle){
@@ -143,9 +142,9 @@ class ListNavigator {
document.querySelector("#btn_shuffle > span").innerHTML = "Shuffle&nbsp;&#x2610;"; // Empty checkbox
ln.btnShuffle.classList.remove("button_highlight");
}
}
}
loadThumbnails(index){let ln = this;
ListNavigator.prototype.loadThumbnails = function(index) {let ln = this;
let startPos = +index - 50;
let endPos = +index + 50;
// fyi, the + is to let javascript know it's actually a number instead of a string
@@ -174,8 +173,8 @@ class ListNavigator {
navigatorItems[i].innerHTML = itemHtml;
}
}
};
}
// Misc function, don't really know where else to put it

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

@@ -1,5 +1,4 @@
class Toolbar {
constructor(viewer) {let t = this;
function Toolbar(viewer) {let t = this;
t.viewer = viewer;
t.visible = false;
t.sharebarVisible = false;
@@ -22,9 +21,9 @@ class Toolbar {
t.btnDownload.addEventListener("click", () => { t.download(); });
t.btnCopyLink.addEventListener("click", () => { t.copyUrl(); });
t.btnShare.addEventListener("click", () => { t.toggleSharebar(); });
}
}
toggle() {let t = this;
Toolbar.prototype.toggle = function() {let t = this;
if (t.visible) {
if (t.sharebarVisible) { t.toggleSharebar(); }
@@ -38,9 +37,9 @@ class Toolbar {
t.btnToggleToolbar.classList.add("button_highlight");
t.visible = true;
}
}
}
toggleSharebar(){let t = this;
Toolbar.prototype.toggleSharebar = function() {let t = this;
if (navigator.share) {
navigator.share({
title: t.viewer.title,
@@ -59,9 +58,9 @@ class Toolbar {
t.btnShare.classList.add("button_highlight")
t.sharebarVisible = true;
}
}
}
download() {let t = this;
Toolbar.prototype.download = function() {let t = this;
let triggerDL = (captchaResp = "") => {
if (captchaResp === "") {
t.downloadFrame.src = apiEndpoint+"/file/"+
@@ -129,9 +128,9 @@ class Toolbar {
console.warn("fetch availability failed: "+e);
triggerDL();
});
}
}
copyUrl() {let t = this;
Toolbar.prototype.copyUrl = function() {let t = this;
if(copyText(window.location.href)) {
console.log('Text copied');
t.spanCopyLink.innerText = "Copied!";
@@ -147,15 +146,15 @@ class Toolbar {
t.spanCopyLink.innerText = "Copy";
t.btnCopyLink.classList.remove("button_highlight")
}, 60000);
}
}
setStats(file) {let t = this;
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);
}
}
// Called by the google recaptcha script
let recaptchaResponse = "";
function loadCaptcha(){

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

@@ -1,5 +1,4 @@
class Viewer {
constructor(type, viewToken, data) {let v = this;
function Viewer(type, viewToken, data) {let v = this;
// Set defaults
v.toolbar = null;
v.listNavigator = null;
@@ -50,9 +49,9 @@ class Viewer {
document.addEventListener("keydown", e => { v.keyboardEvent(e); });
v.initialized = true;
}
}
setFile(file) {let v = this;
Viewer.prototype.setFile = function(file) {let v = this;
v.currentFile = file.id;
if (v.isList) {
document.getElementById("file_viewer_headerbar_title").style.lineHeight = "1em";
@@ -116,9 +115,9 @@ class Viewer {
} else {
new FileViewer(v, file).render(v.divFilepreview);
}
}
}
renderSponsors() {
Viewer.prototype.renderSponsors = function() {
let scale = 1;
let scaleWidth = 1;
let scaleHeight = 1;
@@ -151,14 +150,14 @@ class Viewer {
document.querySelector(".sponsors > iframe").style.transform = "scale("+scale+")";
document.querySelector(".sponsors").style.height = (scale*90)+"px";
}
}
}
keyboardEvent(evt) {let v = this;
Viewer.prototype.keyboardEvent = function(evt) {let v = this;
if (evt.ctrlKey || evt.altKey) {
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 37:
if (v.listNavigator != null) {
@@ -193,8 +192,8 @@ class Viewer {
window.close();
break;
}
}
};
}
// Against XSS attacks
function escapeHTML(str) {

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

@@ -1,5 +1,4 @@
class AudioViewer {
constructor(viewer, file, next) {let v = this;
function AudioViewer(viewer, file, next) {let v = this;
v.viewer = viewer;
v.file = file;
v.next = next;
@@ -27,9 +26,8 @@ class AudioViewer {
v.source.src = apiEndpoint+"/file/"+v.file.id;
v.element.appendChild(v.source);
v.container.appendChild(v.element);
}
render(parent) {let v = this;
parent.appendChild(v.container);
}
}
AudioViewer.prototype.render = function(parent) {let v = this;
parent.appendChild(v.container);
}

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

@@ -1,5 +1,4 @@
class FileViewer {
constructor(viewer, file, next) {let v = this;
function FileViewer(viewer, file, next) {let v = this;
v.viewer = viewer;
v.file = file;
v.next = next;
@@ -21,9 +20,8 @@ class FileViewer {
v.container.appendChild(document.createTextNode(
"Press the 'Download' button in the menu to download this file"
));
}
render(parent) {let v = this;
parent.appendChild(v.container);
}
}
FileViewer.prototype.render = function(parent) {let v = this;
parent.appendChild(v.container);
}

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

@@ -1,5 +1,4 @@
class ImageViewer {
constructor(viewer, file) {let v = this;
function ImageViewer(viewer, file) {let v = this;
v.viewer = viewer;
v.file = file;
v.zoomed = false;
@@ -21,13 +20,13 @@ class ImageViewer {
document.addEventListener("mouseup", (e) => { return v.mouseup(e); });
v.container.appendChild(v.element);
}
}
render(parent) {let v = this;
ImageViewer.prototype.render = function(parent) {let v = this;
parent.appendChild(v.container);
}
}
doubleclick(e) {let v = this;
ImageViewer.prototype.doubleclick = function(e) {let v = this;
if (v.zoomed) {
v.element.style.maxWidth = "100%";
v.element.style.maxHeight = "100%";
@@ -49,9 +48,9 @@ class ImageViewer {
e.preventDefault();
e.stopPropagation();
return false;
}
}
mousedown(e) {let v = this;
ImageViewer.prototype.mousedown = function(e) {let v = this;
if (!v.dragging && e.which === 1 && v.zoomed) {
v.x = e.pageX;
v.y = e.pageY;
@@ -61,9 +60,9 @@ class ImageViewer {
e.stopPropagation();
return false;
}
}
}
mousemove(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);
@@ -76,9 +75,9 @@ class ImageViewer {
return false;
}
}
}
mouseup(e) {let v = this;
ImageViewer.prototype.mouseup = function(e) {let v = this;
if (v.dragging) {
v.dragging = false;
@@ -86,5 +85,4 @@ class ImageViewer {
e.stopPropagation();
return false;
}
}
}

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

@@ -1,5 +1,4 @@
class PDFViewer {
constructor(viewer, file) {let v = this;
function PDFViewer(viewer, file) {let v = this;
v.viewer = viewer;
v.file = file;
@@ -7,9 +6,8 @@ class PDFViewer {
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;
}
render(parent) {let v = this;
parent.appendChild(v.container);
}
}
PDFViewer.prototype.render = function(parent) {let v = this;
parent.appendChild(v.container);
}

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

@@ -1,5 +1,4 @@
class TextViewer {
constructor(viewer, file) {let v = this;
function TextViewer(viewer, file) {let v = this;
v.viewer = viewer;
v.file = file;
v.pre = null;
@@ -13,9 +12,9 @@ class TextViewer {
} else {
v.getText();
}
}
}
getText() {let v = this;
TextViewer.prototype.getText = function() {let v = this;
v.pre = document.createElement("pre");
v.pre.classList = "pre-container prettyprint linenums";
v.pre.innerText = "Loading...";
@@ -39,9 +38,9 @@ class TextViewer {
}).catch(err => {
v.pre.innerText = "Error loading file: "+err;
});
}
}
getMarkdown() {let v = this;
TextViewer.prototype.getMarkdown = function() {let v = this;
fetch("/u/"+v.file.id+"/preview").then(resp => {
if (!resp.ok) { return Promise.reject(resp.status); }
return resp.text();
@@ -50,9 +49,8 @@ class TextViewer {
}).catch(err => {
v.container.innerText = "Error loading file: "+err;
});
}
render(parent) {let v = this;
parent.appendChild(v.container);
}
}
TextViewer.prototype.render = function(parent) {let v = this;
parent.appendChild(v.container);
}

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

@@ -1,5 +1,4 @@
class VideoViewer {
constructor(viewer, file, next) {let v = this;
function VideoViewer(viewer, file, next) {let v = this;
v.viewer = viewer;
v.file = file;
v.next = next;
@@ -18,9 +17,8 @@ class VideoViewer {
v.vidElement.appendChild(v.videoSource);
v.vidContainer.appendChild(v.vidElement);
}
render(parent) {let v = this;
parent.appendChild(v.vidContainer);
}
}
VideoViewer.prototype.render = function(parent) {let v = this;
parent.appendChild(v.vidContainer);
}

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

@@ -1,23 +1,21 @@
class UploadProgressBar {
constructor(uploadManager, queueDiv, file){
this.uploadManager = uploadManager;
this.file = file;
this.name = file.name;
function UploadProgressBar(uploadManager, queueDiv, file){let upb = this;
upb.uploadManager = uploadManager;
upb.file = file;
upb.name = file.name;
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);
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);
// Start uploading the file
let that = this;
this.uploadManager.addFile(
this.file,
this.name,
function(progress) { that.onProgress(progress); },
function(id) { that.onFinished(id); },
function(val, msg) { that.onFailure(val, msg); }
upb.uploadManager.addFile(
upb.file,
upb.name,
function(progress) { upb.onProgress(progress); },
function(id) { upb.onFinished(id); },
function(val, msg) { upb.onFailure(val, msg); }
);
// Browsers don't render the transition if the opacity is set and
@@ -25,17 +23,17 @@ class UploadProgressBar {
// 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)
}
}
onProgress(progress){
UploadProgressBar.prototype.onProgress = function(progress){
this.uploadDiv.innerText = "Uploading... " + Math.round(progress*1000)/10 + "%\n" + this.name
this.uploadDiv.style.background = 'linear-gradient('
+'to right, '
+'var(--file_background_color) 0%, '
+'var(--highlight_color) '+ ((progress*100)) +'%, '
+'var(--file_background_color) '+ ((progress*100)+1) +'%)'
}
onFinished(id){
}
UploadProgressBar.prototype.onFinished = function(id){
console.log("Upload finished: "+this.file.name+" "+id);
this.uploadDiv.style.background = 'var(--file_background_color)'
@@ -55,8 +53,8 @@ class UploadProgressBar {
this.uploadDiv.appendChild(document.createTextNode(this.file.name))
this.uploadDiv.appendChild(document.createElement("br"))
this.uploadDiv.appendChild(linkSpan)
}
onFailure(error) {
}
UploadProgressBar.prototype.onFailure = function(error) {
this.uploadDiv.innerHTML = "" // Remove uploading progress
this.uploadDiv.style.background = 'var(--danger_color)'
this.uploadDiv.appendChild(document.createTextNode(this.file.name))
@@ -64,9 +62,9 @@ class UploadProgressBar {
this.uploadDiv.appendChild(document.createTextNode("Upload failed after three tries:"))
this.uploadDiv.appendChild(document.createElement("br"))
this.uploadDiv.appendChild(document.createTextNode(error))
}
}
let uploader = null;
let shareTitle = "";
let shareLink = "";
@@ -76,6 +74,10 @@ function handleUploads(files) {
uploader = new UploadManager(apiEndpoint, uploadsFinished);
}
if (files.length === 0) {
return;
}
for (let i = 0; i < files.length; i++) {
new UploadProgressBar(
uploader,
@@ -143,13 +145,10 @@ function createList(title, anonymous) {
}
function hideShareButtons() {
document.getElementById("instruction_2").style.display = "";
document.getElementById("instruction_3").style.display = "none";
document.getElementById("instruction_3_after").style.display = "none";
}
function showShareButtons() {
document.getElementById("instruction_3").style.display = "";
document.getElementById("instruction_3_after").style.display = "";
if (window.navigator && window.navigator.share) {
@@ -350,20 +349,19 @@ btnCopyMarkdown.addEventListener("click", function(){
/*
* Keyboard shortcuts
*/
document.addEventListener("keydown", function(event){
if (event.ctrlKey || event.altKey) {
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
copyLink();
} else if (event.which === 85) { // u
document.getElementById("btn_copy_link").click();
} else if (event.keyCode === 85) { // u
// Click the upload button
document.getElementById("file_input_field").click();
} else if (event.which === 84) { // t
} else if (event.keyCode === 84) { // t
// Click the text button
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
document.addEventListener("keydown", function(event) {
if (event.ctrlKey && (event.which === 83)) {
if (event.ctrlKey && (event.keyCode === 83)) {
event.preventDefault();
uploadText();
return false;

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

@@ -245,23 +245,6 @@ hr{
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:hover {color: var(--highlight_color); text-decoration: underline;}
@@ -477,3 +460,66 @@ input[type=file]{
width: 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 {
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) {
.file_viewer > .file_viewer_headerbar > .button_home::after {
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">
<button id="btn_toggle_toolbar" class="button_toggle_toolbar">☰</button>
<a href="/" id="button_home" class="button button_home">
<img src="{{template `pixeldrain_icon.png`}}"
alt="Back to the Home page"
style="height: 1.5em; margin: -0.2em; margin-right: 0.2em;"/>
{{template `pixeldrain.svg` .}}
</a>
<div id="file_viewer_headerbar_title" class="file_viewer_headerbar_title">
<div id="file_viewer_list_title"></div>
@@ -153,8 +151,9 @@
<script src="/res/script/Chart.min.js"></script>
<script>
var apiEndpoint = '{{.APIEndpoint}}';
var captchaKey = '{{.Other.CaptchaKey}}';
'use strict';
let apiEndpoint = '{{.APIEndpoint}}';
let captchaKey = '{{.Other.CaptchaKey}}';
{{template `util.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
<a href="/about">about</a> page
<p>
<div id="instruction_2" class="instruction_highlight" style="display: none">
<div id="instruction_2" class="instruction_highlight">
<div class="limit_width">
<span class="big_number">2</span><span class="instruction_text">Wait for the files to finish uploading</span>
</div>
</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>
<div id="instruction_3_after" style="display: none">
@@ -150,6 +150,7 @@
{{template "page_bottom"}}
<script>
'use strict';
let apiEndpoint = '{{.APIEndpoint}}';
{{template "util.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 ids []string
if list {
ids = strings.Split(p.ByName("id"), ",")
} else {