diff --git a/res/static/script/compiled/home.js b/res/static/script/compiled/home.js index 08150c8..2bca7a1 100644 --- a/res/static/script/compiled/home.js +++ b/res/static/script/compiled/home.js @@ -52,7 +52,7 @@ var UploadProgressBar = /** @class */ (function () { this.uploadDiv.appendChild(document.createElement("br")); this.uploadDiv.appendChild(linkSpan); }; - UploadProgressBar.prototype.onFailure = function (response, error) { + UploadProgressBar.prototype.onFailure = function (error) { this.uploadDiv.style.background = 'var(--danger_color)'; this.uploadDiv.appendChild(document.createTextNode(this.file.name)); this.uploadDiv.appendChild(document.createElement("br")); @@ -308,7 +308,7 @@ var UploadWorker = /** @class */ (function () { }; UploadWorker.prototype.newFile = function () { var file = this.manager.grabFile(); - if (file === undefined) { + if (file === undefined) { // No more files in the queue. We're finished this.uploading = false; console.debug("No files left in queue"); return; // Stop the thread diff --git a/res/static/style/layout.css b/res/static/style/layout.css index d7dd499..13f9768 100644 --- a/res/static/style/layout.css +++ b/res/static/style/layout.css @@ -202,26 +202,29 @@ body{ .highlight_headerbar, .highlight_green, .highlight_blue, -.highlight_red { +.highlight_red, +.highlight_1, +.highlight_2, +.highlight_3, +.highlight_4 { position: relative; width: auto; height: auto; - /* margin: 0; */ box-sizing: border-box; overflow: hidden; text-align: center; padding: .5em; } -.highlight_dark { +.highlight_dark, .highlight_1 { background-color: var(--layer_1_color); box-shadow: 1px 1px var(--layer_1_shadow) 0 var(--shadow_color);} -.highlight_middle { +.highlight_middle, .highlight_2 { background-color: var(--layer_2_color); box-shadow: 1px 1px var(--layer_2_shadow) 0 var(--shadow_color);} -.highlight_light { +.highlight_light, .highlight_3 { background-color: var(--layer_3_color); box-shadow: 1px 1px var(--layer_3_shadow) 0 var(--shadow_color);} -.highlight_headerbar { +.highlight_headerbar, .highlight_4 { background-color: var(--layer_4_color); box-shadow: 1px 1px var(--layer_4_shadow) 0 var(--shadow_color);} .highlight_green { diff --git a/res/static/style/viewer.css b/res/static/style/viewer.css index ddae3b3..369e333 100644 --- a/res/static/style/viewer.css +++ b/res/static/style/viewer.css @@ -16,24 +16,25 @@ } /* Headerbar (row 1) */ -.file_viewer > .highlight_headerbar { +.file_viewer > .file_viewer_headerbar { flex-grow: 0; flex-shrink: 0; display: flex; flex-direction: row; text-align: left; padding: 8px; + z-index: 10; } /* Headerbar components */ -.file_viewer > .highlight_headerbar > * { +.file_viewer > .file_viewer_headerbar > * { flex-grow: 0; flex-shrink: 0; margin-left: .4em; margin-right: .4em; display: inline-flex; } -.file_viewer > .highlight_headerbar > .file_viewer_headerbar_title { +.file_viewer > .file_viewer_headerbar > .file_viewer_headerbar_title { flex-grow: 1; flex-shrink: 1; display: flex; @@ -43,18 +44,18 @@ line-height: 2em; text-overflow: ellipsis; } -.file_viewer > .highlight_headerbar > .button_home::after { +.file_viewer > .file_viewer_headerbar > .button_home::after { content: "pixeldrain"; } @media (max-width: 500px) { - .file_viewer > .highlight_headerbar > .button_home::after { + .file_viewer > .file_viewer_headerbar > .button_home::after { content: "pd"; } - .file_viewer > .highlight_headerbar > .list_navigator_buttons { + .file_viewer > .file_viewer_headerbar > .list_navigator_buttons { display: none; } } -.file_viewer > .highlight_headerbar > .file_viewer_headerbar_title > span { +.file_viewer > .file_viewer_headerbar > .file_viewer_headerbar_title > span { flex-grow: 0; flex-shrink: 0; margin-right: 1em; @@ -89,6 +90,7 @@ width: auto; height: auto; margin: 0; + z-index: 9; } .file_viewer > .file_viewer_window > .file_viewer_file_preview { position: absolute; @@ -101,7 +103,7 @@ min-width: 100px; text-align: center; vertical-align: middle; - transition: left 1s; + transition: left 0.5s; overflow: hidden; } @@ -118,8 +120,8 @@ top: 0; padding: 0; text-align: left; - box-shadow: 2px 2px 8px var(--shadow_color); - transition: left 1s; + box-shadow: 1px 1px var(--layer_1_shadow) 0 var(--shadow_color); + transition: left 0.5s; } .file_viewer > .file_viewer_window > .file_viewer_sharebar{ position: absolute; @@ -135,7 +137,7 @@ text-align: center; z-index: 48; overflow: hidden; - transition: left 1s; + transition: left 0.5s; } /* ===================== @@ -261,8 +263,8 @@ flex-direction: column; opacity: 0; transition: visibility .5s, opacity .5s; - background-color: var(--layer_1_color); - border-color: var(--layer_1_color_border); + background-color: var(--layer_2_color); + border-color: var(--layer_2_color_border); max-height: 100%; max-width: 100%; top: 20%; diff --git a/res/static/typescript/home/home.ts b/res/static/typescript/home/home.ts index 1b9b2ba..8b556e3 100644 --- a/res/static/typescript/home/home.ts +++ b/res/static/typescript/home/home.ts @@ -67,7 +67,7 @@ class UploadProgressBar implements FileUpload { this.uploadDiv.appendChild(document.createElement("br")) this.uploadDiv.appendChild(linkSpan) } - public onFailure(response: JQuery.Ajax.ErrorTextStatus, error: string) { + public onFailure(error: string) { this.uploadDiv.style.background = 'var(--danger_color)' this.uploadDiv.appendChild(document.createTextNode(this.file.name)) this.uploadDiv.appendChild(document.createElement("br")) diff --git a/res/static/typescript/home/tsconfig.json b/res/static/typescript/home/tsconfig.json index 77bea6c..3d95f26 100644 --- a/res/static/typescript/home/tsconfig.json +++ b/res/static/typescript/home/tsconfig.json @@ -8,4 +8,4 @@ "../lib/jquery.d.ts", "../lib/uploader.ts" ] -} \ No newline at end of file +} diff --git a/res/static/typescript/lib/jquery.d.ts b/res/static/typescript/lib/jquery.d.ts index 1acd88d..c4abf6d 100644 --- a/res/static/typescript/lib/jquery.d.ts +++ b/res/static/typescript/lib/jquery.d.ts @@ -8024,4 +8024,4 @@ interface JQueryEasingFunctions { swing: JQueryEasingFunction; } -// endregion \ No newline at end of file +// endregion diff --git a/res/static/typescript/lib/uploader.ts b/res/static/typescript/lib/uploader.ts index ddc35d6..90aef1b 100644 --- a/res/static/typescript/lib/uploader.ts +++ b/res/static/typescript/lib/uploader.ts @@ -78,12 +78,12 @@ class UploadWorker { private upload(file: FileUpload){ console.debug("Starting upload of " + file.name) + var that = this // jquery changes the definiton of "this" + var formData = new FormData() formData.append("name", file.name) formData.append('file', file.file) - var that = this // jquery changes the definiton of "this" - $.ajax({ type: 'POST', url: apiEndpoint+"/file", diff --git a/res/template/file_viewer.html b/res/template/file_viewer.html index b985f6c..bd4e733 100644 --- a/res/template/file_viewer.html +++ b/res/template/file_viewer.html @@ -23,7 +23,7 @@
-
+