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

Reformat details window

Browse Source
This commit is contained in:
Wim Brand
2021-09-27 21:01:14 +02:00
parent 395bbc0947
commit 4ab8ecdce0
1 changed files with 29 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -1,14 +1,14 @@
function DetailsWindow(viewer) {
this.viewer = viewer
this.viewer = viewer
this.visible = false
this.file = null
this.file = null
this.graphsInitialized = false
this.graphViews = 0
this.graphViews = 0
this.graphDownloads = 0
this.modal = new Modal(
this.modal = new Modal(
document.getElementById("file_viewer"),
() => { this.toggle() },
"File Details", "1500px", "1000px",
"File Details", "1200px", "1000px",
)
let clone = document.getElementById("tpl_details_popup").content.cloneNode(true)
@@ -19,7 +19,7 @@ function DetailsWindow(viewer) {
this.btnDetails.addEventListener("click", () => { this.toggle() })
}
DetailsWindow.prototype.toggle = function() {
DetailsWindow.prototype.toggle = function () {
if (this.visible) {
this.modal.close()
this.btnDetails.classList.remove("button_highlight")
@@ -37,27 +37,27 @@ DetailsWindow.prototype.toggle = function() {
}
}
DetailsWindow.prototype.setFile = function(file) {
DetailsWindow.prototype.setFile = function (file) {
this.file = file
let desc = ""
if (this.viewer.isList) {
desc = file.description
}
this.divFileDetails.innerHTML = "<tr><td>Name<td><td>" + escapeHTML(file.name) + "</td></tr>"
+ "<tr><td>URL<td><td><a href=\""+file.link+"\">"+file.link+"</a></td></tr>"
+ "<tr><td>Mime Type<td><td>" + escapeHTML(file.mime_type) + "</td></tr>"
+ "<tr><td>ID<td><td>" + file.id + "</td></tr>"
+ "<tr><td>Size<td><td>" + formatDataVolume(file.size, 4) + "</td></tr>"
+ "<tr><td>Bandwidth<td><td>" + formatDataVolume(file.bandwidth_used, 4) + "</td></tr>"
+ "<tr><td>Upload Date<td><td>" + printDate(file.date_created, true, true, true) + "</td></tr>"
+ "<tr><td>Description<td><td>" + escapeHTML(desc) + "</td></tr>"
this.divFileDetails.innerHTML = `<tr><td>Name<td><td>${escapeHTML(file.name)}</td></tr>
<tr><td>URL<td><td><a href="${file.link}">${file.link}</a></td></tr>
<tr><td>Mime Type<td><td>${escapeHTML(file.mime_type)}</td></tr>
<tr><td>ID<td><td>${file.id}</td></tr>
<tr><td>Size<td><td>${formatDataVolume(file.size, 4)} ( ${formatThousands(file.size)} B )</td></tr>
<tr><td>Bandwidth<td><td>${formatDataVolume(file.bandwidth_used, 4)}</td></tr>
<tr><td>Upload Date<td><td>${printDate(file.date_created, true, true, true)}</td></tr>
<tr><td>Description<td><td>${escapeHTML(desc)}</td></tr>`
if(this.visible && file.timeseries_href !== "") {
if (this.visible && file.timeseries_href !== "") {
this.updateGraph(file)
}
}
DetailsWindow.prototype.renderGraphs = function() {
DetailsWindow.prototype.renderGraphs = function () {
console.log("rendering graphs")
this.graphDownloads = drawGraph(
document.getElementById("downloads_chart"), "Downloads", "number",
@@ -67,31 +67,31 @@ DetailsWindow.prototype.renderGraphs = function() {
);
}
DetailsWindow.prototype.updateGraph = function(file) {
DetailsWindow.prototype.updateGraph = function (file) {
console.log("updating graph")
let today = new Date()
let start = new Date()
start.setDate(start.getDate()-90)
start.setDate(start.getDate() - 90)
fetch(
file.timeseries_href+
"?start="+start.toISOString() +
"&end="+today.toISOString() +
"&interval="+60
file.timeseries_href +
"?start=" + start.toISOString() +
"&end=" + today.toISOString() +
"&interval=" + 60
).then(resp => {
if (!resp.ok) {return null}
if (!resp.ok) { return null }
return resp.json()
}).then(resp => {
resp.views.timestamps.forEach((val, idx) => {
let date = new Date(val);
let dateStr = ("00"+(date.getMonth()+1)).slice(-2);
dateStr += "-"+("00"+date.getDate()).slice(-2);
dateStr += " "+("00"+date.getHours()).slice(-2)+"h";
resp.views.timestamps[idx] = " "+dateStr+" "; // Poor man's padding
let dateStr = ("00" + (date.getMonth() + 1)).slice(-2);
dateStr += "-" + ("00" + date.getDate()).slice(-2);
dateStr += " " + ("00" + date.getHours()).slice(-2) + "h";
resp.views.timestamps[idx] = " " + dateStr + " "; // Poor man's padding
});
resp.bandwidth.amounts.forEach((val, idx) => {
resp.bandwidth.amounts[idx] = Math.round(val/file.size);
resp.bandwidth.amounts[idx] = Math.round(val / file.size);
});
this.graphDownloads.data.labels = resp.views.timestamps
this.graphViews.data.labels = resp.views.timestamps