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

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

@@ -1,35 +1,33 @@
class AudioViewer {
constructor(viewer, file, next) {let v = this;
v.viewer = viewer;
v.file = file;
v.next = next;
function AudioViewer(viewer, file, next) {let v = this;
v.viewer = viewer;
v.file = file;
v.next = next;
v.container = document.createElement("div");
v.container.classList = "image-container";
v.container.appendChild(document.createElement("br"));
v.container = document.createElement("div");
v.container.classList = "image-container";
v.container.appendChild(document.createElement("br"));
v.icon = document.createElement("img");
v.icon.src = "/res/img/mime/audio.png";
v.container.appendChild(v.icon);
v.icon = document.createElement("img");
v.icon.src = "/res/img/mime/audio.png";
v.container.appendChild(v.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"));
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"));
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);
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);
v.source = document.createElement("source");
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);
}
v.source = document.createElement("source");
v.source.src = apiEndpoint+"/file/"+v.file.id;
v.element.appendChild(v.source);
v.container.appendChild(v.element);
}
AudioViewer.prototype.render = function(parent) {let v = this;
parent.appendChild(v.container);
}

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

@@ -1,29 +1,27 @@
class FileViewer {
constructor(viewer, file, next) {let v = this;
v.viewer = viewer;
v.file = file;
v.next = next;
function FileViewer(viewer, file, next) {let v = this;
v.viewer = viewer;
v.file = file;
v.next = next;
v.container = document.createElement("div");
v.container.classList = "image-container";
v.container.appendChild(document.createElement("br"));
v.container = document.createElement("div");
v.container.classList = "image-container";
v.container.appendChild(document.createElement("br"));
v.icon = document.createElement("img");
v.icon.src = apiEndpoint+"/"+file.thumbnail_href;
v.container.appendChild(v.icon);
v.icon = document.createElement("img");
v.icon.src = apiEndpoint+"/"+file.thumbnail_href;
v.container.appendChild(v.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(
"Press the 'Download' button in the menu to download this file"
));
}
render(parent) {let v = this;
parent.appendChild(v.container);
}
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(
"Press the 'Download' button in the menu to download this file"
));
}
FileViewer.prototype.render = function(parent) {let v = this;
parent.appendChild(v.container);
}

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

@@ -1,90 +1,88 @@
class ImageViewer {
constructor(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) {let v = this;
v.viewer = viewer;
v.file = file;
v.zoomed = false;
v.x = 0;
v.y = 0;
v.dragging = false;
v.container = document.createElement("dv");
v.container.classList = "image-container";
// v.container.style.lineHeight = "0";
v.container = document.createElement("dv");
v.container.classList = "image-container";
// v.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); });
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); });
v.container.appendChild(v.element);
v.container.appendChild(v.element);
}
ImageViewer.prototype.render = function(parent) {let v = this;
parent.appendChild(v.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;
} 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;
}
render(parent) {let v = this;
parent.appendChild(v.container);
}
e.preventDefault();
e.stopPropagation();
return false;
}
doubleclick(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;
} 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;
}
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;
e.preventDefault();
e.stopPropagation();
return false;
}
}
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);
v.x = e.pageX;
v.y = e.pageY;
e.preventDefault();
e.stopPropagation();
return false;
}
mousedown(e) {let v = this;
if (!v.dragging && e.which === 1 && v.zoomed) {
v.x = e.pageX;
v.y = e.pageY;
v.dragging = true;
}
e.preventDefault();
e.stopPropagation();
return false;
}
}
ImageViewer.prototype.mouseup = function(e) {let v = this;
if (v.dragging) {
v.dragging = false;
mousemove(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);
v.x = e.pageX;
v.y = e.pageY;
e.preventDefault();
e.stopPropagation();
return false;
}
}
mouseup(e) {let v = this;
if (v.dragging) {
v.dragging = false;
e.preventDefault();
e.stopPropagation();
return false;
}
e.preventDefault();
e.stopPropagation();
return false;
}
}

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

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

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

@@ -1,58 +1,56 @@
class TextViewer {
constructor(viewer, file) {let v = this;
v.viewer = viewer;
v.file = file;
v.pre = null;
v.prettyprint = null;
function TextViewer(viewer, file) {let v = this;
v.viewer = viewer;
v.file = file;
v.pre = null;
v.prettyprint = null;
v.container = document.createElement("div");
v.container.classList = "text-container";
v.container = document.createElement("div");
v.container.classList = "text-container";
if (file.name.endsWith(".md") || file.name.endsWith(".markdown") || file.id === "demo") {
v.getMarkdown();
} else {
v.getText();
}
}
getText() {let v = this;
v.pre = document.createElement("pre");
v.pre.classList = "pre-container prettyprint linenums";
v.pre.innerText = "Loading...";
v.container.appendChild(v.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.";
return;
}
fetch(apiEndpoint+"/file/"+v.file.id).then(resp => {
if (!resp.ok) { return Promise.reject(resp.status); }
return resp.text();
}).then(resp => {
v.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);
}).catch(err => {
v.pre.innerText = "Error loading file: "+err;
});
}
getMarkdown() {let v = this;
fetch("/u/"+v.file.id+"/preview").then(resp => {
if (!resp.ok) { return Promise.reject(resp.status); }
return resp.text();
}).then(resp => {
v.container.innerHTML = resp;
}).catch(err => {
v.container.innerText = "Error loading file: "+err;
});
}
render(parent) {let v = this;
parent.appendChild(v.container);
if (file.name.endsWith(".md") || file.name.endsWith(".markdown") || file.id === "demo") {
v.getMarkdown();
} else {
v.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);
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.";
return;
}
fetch(apiEndpoint+"/file/"+v.file.id).then(resp => {
if (!resp.ok) { return Promise.reject(resp.status); }
return resp.text();
}).then(resp => {
v.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);
}).catch(err => {
v.pre.innerText = "Error loading file: "+err;
});
}
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();
}).then(resp => {
v.container.innerHTML = resp;
}).catch(err => {
v.container.innerText = "Error loading file: "+err;
});
}
TextViewer.prototype.render = function(parent) {let v = this;
parent.appendChild(v.container);
}

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

@@ -1,26 +1,24 @@
class VideoViewer {
constructor(viewer, file, next) {let v = this;
v.viewer = viewer;
v.file = file;
v.next = next;
function VideoViewer(viewer, file, next) {let v = this;
v.viewer = viewer;
v.file = file;
v.next = next;
v.vidContainer = document.createElement("div");
v.vidContainer.classList = "image-container";
v.vidContainer = document.createElement("div");
v.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);
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);
v.videoSource = document.createElement("source");
v.videoSource.src = apiEndpoint+"/file/"+v.file.id;
v.videoSource = document.createElement("source");
v.videoSource.src = apiEndpoint+"/file/"+v.file.id;
v.vidElement.appendChild(v.videoSource);
v.vidContainer.appendChild(v.vidElement);
}
render(parent) {let v = this;
parent.appendChild(v.vidContainer);
}
v.vidElement.appendChild(v.videoSource);
v.vidContainer.appendChild(v.vidElement);
}
VideoViewer.prototype.render = function(parent) {let v = this;
parent.appendChild(v.vidContainer);
}