From 4bae9b77e476d614dc2d47340b035e854d3418dd Mon Sep 17 00:00:00 2001 From: WubzyGD Date: Fri, 10 Dec 2021 18:15:19 -0700 Subject: [PATCH] modal handling --- .idea/inspectionProfiles/Project_Default.xml | 10 ++++++ scripts/contextmenu/createcontext.js | 4 +-- scripts/contextmenu/newfolder.js | 35 ++++++++++++++------ scripts/modal/clearmodals.js | 11 ++++++ scripts/modal/post.js | 7 ++++ scripts/modal/pre.js | 9 +++++ scripts/modal/transit.js | 4 +++ scripts/startup/preload.js | 4 ++- styles/modal.css | 14 +++++++- 9 files changed, 83 insertions(+), 15 deletions(-) create mode 100644 .idea/inspectionProfiles/Project_Default.xml create mode 100644 scripts/modal/clearmodals.js create mode 100644 scripts/modal/post.js create mode 100644 scripts/modal/pre.js create mode 100644 scripts/modal/transit.js diff --git a/.idea/inspectionProfiles/Project_Default.xml b/.idea/inspectionProfiles/Project_Default.xml new file mode 100644 index 0000000..bbf9206 --- /dev/null +++ b/.idea/inspectionProfiles/Project_Default.xml @@ -0,0 +1,10 @@ + + + + \ No newline at end of file diff --git a/scripts/contextmenu/createcontext.js b/scripts/contextmenu/createcontext.js index fab7b20..a14aaf9 100644 --- a/scripts/contextmenu/createcontext.js +++ b/scripts/contextmenu/createcontext.js @@ -1,7 +1,7 @@ module.exports = (e, target, window) => { window.kade.context = true; let ctx = document.getElementById('ctx'); - ctx.style.left = `${e.pageX}px`; - ctx.style.top = `${e.pageY}px`; ctx.style.display = 'block'; + ctx.style.left = `${Math.min(e.pageX, (window.innerWidth - (ctx.clientWidth + 2)))}px`; + ctx.style.top = `${Math.min(e.pageY, (window.innerHeight - (ctx.clientHeight + 2)))}px`; }; \ No newline at end of file diff --git a/scripts/contextmenu/newfolder.js b/scripts/contextmenu/newfolder.js index 9ad7df7..a73c4f7 100644 --- a/scripts/contextmenu/newfolder.js +++ b/scripts/contextmenu/newfolder.js @@ -2,8 +2,15 @@ const fs = require('fs'); const path = require('path'); const lightRefresh = require('../fileview/lightrefresh'); +const preModal = require('../modal/pre'); +const postModal = require('../modal/post'); +const showError = require('../modal/common/error'); +const clearModals = require('../modal/clearmodals'); module.exports = () => { + console.log('e'); + if (window.kade.modal) {console.log('hboonk'); return;} + preModal('new-folder-modal-container'); let modal = document.createElement('div'); modal.className = 'modal'; modal.id = 'new-folder-modal-container'; @@ -29,19 +36,25 @@ module.exports = () => { let conf = document.createElement('button'); conf.innerHTML = 'Create'; conf.onclick = () => { - input.value.trim(); - if (fs.existsSync(path.join(window.kade.cpath, input.value))) { - if (!input.value.match(/^.+\(\d\)$/gm)) {input.value += ' (1)';} - else { - let tempstr = input.value.split(''); - tempstr[input.value.length - 2] = `${Number(input.value.charAt(input.value.length - 2)) + 1}`; - input.value = tempstr.join(''); + try { + input.value.trim(); + if (fs.existsSync(path.join(window.kade.cpath, input.value))) { + if (!input.value.match(/^.+\(\d\)$/gm)) {input.value += ' (1)';} + else { + let tempstr = input.value.split(''); + tempstr[input.value.length - 2] = `${Number(input.value.charAt(input.value.length - 2)) + 1}`; + input.value = tempstr.join(''); + } + return; } - return; + fs.mkdirSync(path.join(window.kade.cpath, input.value)); + lightRefresh(); + modal.remove(); + postModal(modal.id); + } catch { + clearModals(); + showError("Folder Creation", "There was an unknown error while trying to create that folder. It may be a permissions issue, or the host folder doesn't exist anymore."); } - fs.mkdirSync(path.join(window.kade.cpath, input.value)); - lightRefresh(); - modal.remove(); }; cont.appendChild(conf); } \ No newline at end of file diff --git a/scripts/modal/clearmodals.js b/scripts/modal/clearmodals.js new file mode 100644 index 0000000..03cf928 --- /dev/null +++ b/scripts/modal/clearmodals.js @@ -0,0 +1,11 @@ +const transit = require("./transit"); + +module.exports = (...modals) => { + let tc = modals.length ? modals : window.kade.modals; + tc.forEach(modal => { + if (window.kade.modals.includes(modal)) { + transit(modal, false); + document.getElementById(modal).remove(); + } + }); +}; \ No newline at end of file diff --git a/scripts/modal/post.js b/scripts/modal/post.js new file mode 100644 index 0000000..681d937 --- /dev/null +++ b/scripts/modal/post.js @@ -0,0 +1,7 @@ +const transit = require("./transit"); + +module.exports = (id) => { + document.getElementById('modal-block').remove(); + window.kade.modal = false; + transit(id, false); +}; \ No newline at end of file diff --git a/scripts/modal/pre.js b/scripts/modal/pre.js new file mode 100644 index 0000000..14c8c57 --- /dev/null +++ b/scripts/modal/pre.js @@ -0,0 +1,9 @@ +const transit = require('./transit'); + +module.exports = (id) => { + let bl = document.createElement('div'); + bl.id = 'modal-block'; + document.body.appendChild(bl); + window.kade.modal = true; + transit(id, true); +}; \ No newline at end of file diff --git a/scripts/modal/transit.js b/scripts/modal/transit.js new file mode 100644 index 0000000..c0684e8 --- /dev/null +++ b/scripts/modal/transit.js @@ -0,0 +1,4 @@ +module.exports = (id, open=false) => { + if (open && !window.kade.modals.includes(id)) {window.kade.modals.push(id);} + else if (window.kade.modals.includes(id)) {window.kade.modals.splice(window.kade.modals.indexOf(id), 1);} +}; \ No newline at end of file diff --git a/scripts/startup/preload.js b/scripts/startup/preload.js index 162c137..5da3de9 100644 --- a/scripts/startup/preload.js +++ b/scripts/startup/preload.js @@ -13,7 +13,9 @@ window.addEventListener('DOMContentLoaded', () => { ascend: true, context: false, chdir: [], - ctxFunc: {} + ctxFunc: {}, + modals: [], + modal: false }; const startDir = `${os.homedir}\\Desktop`; diff --git a/styles/modal.css b/styles/modal.css index 7d8822d..7fb8933 100644 --- a/styles/modal.css +++ b/styles/modal.css @@ -9,6 +9,8 @@ border: 1px solid #af2188a4; background-color: #171717da; padding: 6px 8px; + z-index: 3; + max-width: 60%; } .modal h1, .modal h2, .modal h3, .modal h4 { @@ -46,4 +48,14 @@ outline: none; } -.modal .button-container, input, .modal .button-container, button {display: inline-block;} \ No newline at end of file +.modal .button-container, input, .modal .button-container, button {display: inline-block;} + +#modal-block { + position: absolute; + width: 100vw; + height: 100vh; + top: 0; + left: 0; + background-color: #1717176d; + z-index: 2; +} \ No newline at end of file