From a26a7d2e609e3977e3762e59e24dafdf67f9dce3 Mon Sep 17 00:00:00 2001 From: Henrique Dias Date: Sat, 31 Dec 2016 21:04:47 +0000 Subject: [PATCH] updates Former-commit-id: ae54ba4ce48c1e4bb374894acc11c07bc3edfd65 --- _embed/public/css/styles.css | 38 ++++++++++++++++++++++++++----- _embed/public/js/common.js | 44 ++++++++++++++++++++++++++++++------ _embed/public/js/listing.js | 20 ++++++++++++++-- _embed/templates/base.tmpl | 29 ++++++++++++++++-------- 4 files changed, 106 insertions(+), 25 deletions(-) diff --git a/_embed/public/css/styles.css b/_embed/public/css/styles.css index 3d2201a7..7f223d9b 100644 --- a/_embed/public/css/styles.css +++ b/_embed/public/css/styles.css @@ -859,14 +859,16 @@ header .actions { * * * * * * * * * * * * * * * */ .overlay, -.prompt { +.prompt, +.help { opacity: 0; z-index: -1; transition: .1s ease opacity, z-index; } .overlay.active, -.prompt.active { +.prompt.active, +.help.active { z-index: 9999999; opacity: 1; } @@ -885,7 +887,8 @@ header .actions { width: 100%; } -.prompt { +.prompt, +.help { position: fixed; top: 50%; left: 50%; @@ -899,13 +902,15 @@ header .actions { width: 95%; } -.prompt h3 { +.prompt h3, +.help h3 { margin: 0; font-weight: 500; font-size: 1.5em; } -.prompt p { +.prompt p, +.help p { font-size: .9em; color: rgba(0, 0, 0, 0.8); margin: .5em 0 1em; @@ -918,7 +923,8 @@ header .actions { padding: .3em; } -.prompt div { +.prompt div, +.help div { margin-top: 1em; display: flex; justify-content: flex-start; @@ -935,6 +941,26 @@ header .actions { } +/* * * * * * * * * * * * * * * * + * HELP * + * * * * * * * * * * * * * * * */ + +.help { + max-width: 24em; + visibility: hidden; +} + +.help.active { + visibility: visible; +} + +.help ul{ + padding: 0; + margin: 0; + list-style: none; +} + + /* * * * * * * * * * * * * * * * * FOOTER * * * * * * * * * * * * * * * * */ diff --git a/_embed/public/js/common.js b/_embed/public/js/common.js index 94804a69..6d944a7d 100644 --- a/_embed/public/js/common.js +++ b/_embed/public/js/common.js @@ -108,7 +108,9 @@ var removeLastDirectoryPartOf = function(url) { * * * * * * * * * * * * * * * * * */ function closePrompt(event) { - let prompt = document.querySelector('.prompt:not(.help)'); + let prompt = document.querySelector('.prompt'); + + if (!prompt) return; event.preventDefault(); document.querySelector('.overlay').classList.remove('active'); @@ -214,7 +216,13 @@ function deleteEvent(event) { let clone = document.importNode(templates.question.content, true); clone.querySelector('h3').innerHTML = 'Delete files'; - clone.querySelector('p').innerHTML = `Are you sure you want to delete ${selectedItems.length} file(s)?`; + + if (single) { + clone.querySelector('p').innerHTML = `Are you sure you want to delete this file/folder?`; + } else { + clone.querySelector('p').innerHTML = `Are you sure you want to delete ${selectedItems.length} file(s)?`; + } + clone.querySelector('input').remove(); clone.querySelector('.ok').innerHTML = 'Delete'; clone.querySelector('form').addEventListener('submit', deleteSelected(single)); @@ -350,17 +358,34 @@ function setupSearch() { searchInput.addEventListener('keyup', searchEvent); } -function closeHelp() { +function closeHelp(event) { + event.preventDefault(); + document.querySelector('.help').classList.remove('active'); document.querySelector('.overlay').classList.remove('active'); } -document.addEventListener('keydown', (event) => { +function openHelp(event) { + closePrompt(event); + + document.querySelector('.help').classList.add('active'); + document.querySelector('.overlay').classList.add('active'); +} + +window.addEventListener('keydown', (event) => { + if (event.keyCode == 27) { + if (document.querySelector('.help.active')) { + closeHelp(event); + } + } + + if (event.keyCode == 46) { + deleteEvent(event); + } + if (event.keyCode == 112) { event.preventDefault(); - - document.querySelector('.help').classList.add('active'); - document.querySelector('.overlay').classList.add('active'); + openHelp(event); } }); @@ -395,6 +420,11 @@ document.addEventListener("DOMContentLoaded", function(event) { } document.querySelector('.overlay').addEventListener('click', event => { + if (document.querySelector('.help.active')) { + closeHelp(event); + return; + } + closePrompt(event); }) diff --git a/_embed/public/js/listing.js b/_embed/public/js/listing.js index 1bca8859..38bbdf57 100644 --- a/_embed/public/js/listing.js +++ b/_embed/public/js/listing.js @@ -217,7 +217,12 @@ listing.handleSelectionChange = function(event) { } if (selectedNumber == 1) { - buttons.open.classList.remove("disabled"); + if (document.getElementById(selectedItems[0]).dataset.dir == "true") { + buttons.open.classList.add("disabled"); + } else { + buttons.open.classList.remove("disabled"); + } + buttons.rename.classList.remove("disabled"); } @@ -310,18 +315,28 @@ listing.updateColumns = function(event) { } // Keydown events -document.addEventListener('keydown', (event) => { +window.addEventListener('keydown', (event) => { if (event.keyCode == 27) { listing.unselectAll(); if (document.querySelectorAll('.prompt').length) { closePrompt(event); } + } if (event.keyCode == 113) { listing.rename(); } + + if (event.ctrlKey || event.metaKey) { + console.log("hey") + switch (String.fromCharCode(event.which).toLowerCase()) { + case 's': + event.preventDefault(); + window.location = "?download=true" + } + } }); window.addEventListener("resize", () => { @@ -334,6 +349,7 @@ document.addEventListener('DOMContentLoaded', event => { buttons.rename = document.getElementById("rename"); buttons.upload = document.getElementById("upload"); buttons.new = document.getElementById('new'); + buttons.download = document.getElementById('download'); if (user.AllowEdit) { buttons.rename.addEventListener("click", listing.rename); diff --git a/_embed/templates/base.tmpl b/_embed/templates/base.tmpl index e6f229b4..0d829bfc 100644 --- a/_embed/templates/base.tmpl +++ b/_embed/templates/base.tmpl @@ -148,7 +148,7 @@

- +
@@ -164,21 +164,30 @@ -

Help

+

+ +

Not available yet

+ +

+

+

+