diff --git a/index.html b/index.html index 6c3cbf8..7aa076d 100644 --- a/index.html +++ b/index.html @@ -8,6 +8,7 @@ + FileKade diff --git a/scripts/contextmenu/newfolder.js b/scripts/contextmenu/newfolder.js new file mode 100644 index 0000000..9ad7df7 --- /dev/null +++ b/scripts/contextmenu/newfolder.js @@ -0,0 +1,47 @@ +const fs = require('fs'); +const path = require('path'); + +const lightRefresh = require('../fileview/lightrefresh'); + +module.exports = () => { + let modal = document.createElement('div'); + modal.className = 'modal'; + modal.id = 'new-folder-modal-container'; + document.body.appendChild(modal); + let title = document.createElement('h2'); + title.innerHTML = 'New Folder'; + modal.appendChild(title); + let text = document.createElement('p'); + text.innerHTML = "Please name your new folder."; + modal.appendChild(text); + let cont = document.createElement('div'); + cont.className = 'button-container'; + modal.appendChild(cont); + let input = document.createElement('input'); + input.placeholder = 'New Folder'; + input.id = 'new-folder-input'; + let lastIn = ''; + input.oninput = () => { + if (!input.value.match(/^[a-zA-Z0-9-_() ]*$/gm)) {input.value = lastIn;} + else {lastIn = input.value;} + }; + cont.appendChild(input); + 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(''); + } + return; + } + 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/startup/initcontext.js b/scripts/startup/initcontext.js index 4e555e5..1ba1a0a 100644 --- a/scripts/startup/initcontext.js +++ b/scripts/startup/initcontext.js @@ -3,7 +3,6 @@ const ctxl = require('../../json/ctx.json'); module.exports = () => { document.getElementById('ctx').style.display = 'none'; const ctx = document.getElementById('ctx'); - console.log(ctxl); try { for (let i = 0; i < ctxl.length; i++) { let k = ctxl[i]; diff --git a/scripts/startup/preload.js b/scripts/startup/preload.js index d04d8b4..162c137 100644 --- a/scripts/startup/preload.js +++ b/scripts/startup/preload.js @@ -12,7 +12,8 @@ window.addEventListener('DOMContentLoaded', () => { sort: 'Name', ascend: true, context: false, - chdir: [] + chdir: [], + ctxFunc: {} }; const startDir = `${os.homedir}\\Desktop`; diff --git a/styles/context.css b/styles/context.css index cd800fb..502b0ba 100644 --- a/styles/context.css +++ b/styles/context.css @@ -2,11 +2,11 @@ font-family: 'Nunito', sans-serif; font-size: 16px; color: #d4d4d4; + border: 1px solid #af2188a4; border-radius: 7px 7px; position: absolute; background-color: #101010df; padding: 7px 5px; - border: 1px solid #af2188a4; } #ctx hr { diff --git a/styles/modal.css b/styles/modal.css new file mode 100644 index 0000000..7d8822d --- /dev/null +++ b/styles/modal.css @@ -0,0 +1,49 @@ +.modal { + position: absolute; + width: max-content; + height: max-content; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + border-radius: 7px 7px; + border: 1px solid #af2188a4; + background-color: #171717da; + padding: 6px 8px; +} + +.modal h1, .modal h2, .modal h3, .modal h4 { + color: #af2188; + font-family: 'Nunito', sans-serif; + margin: 10px; +} + +.modal p, .modal b { + color: white; + font-family: 'Montserrat', sans-serif; + margin: 8px 10px; +} + +.modal input, .modal button { + background-color: #1e27423f; + color: white; + border: #5d60ca solid 1px; + border-radius: 3px; + width: auto; + margin: 10px 4px 10px 8px; + font-size: .82em; + padding: 5px 7px; + font-family: "Monsterrat", sans-serif; + transition: background-color .65s ease-in-out, border-color .65s ease-in-out, color .65s ease-in-out; + cursor: pointer; + text-align: left; +} +.modal input:hover { + border-color: #a172a6; +} +.modal input:focus, .modal input:active { + background-color: #171717d8; + color: white; + outline: none; +} + +.modal .button-container, input, .modal .button-container, button {display: inline-block;} \ No newline at end of file