Dynamic changelog rendering! + ver stuff

3 years ago · d59a097ff7
parent 4a5f2340b0
commit d59a097ff7
7 changed files with 157 additions and 9 deletions
--- a/index.html
+++ b/index.html
@ -16,7 +16,7 @@
    <body>
        <div id="title-container">
            <div id="title-sub-container">
-                <p id="title" class="nosel">FileKade - Alpha</p>
+                <p id="title" class="nosel">FileKade</p>
            </div>
        </div>

--- a/json/changelogs/1.3.7.json
+++ b/json/changelogs/1.3.7.json
@ -0,0 +1,16 @@
+{
+    "log": {
+        "Changelogs": [
+            "Added this changelog!",
+            "Dynamically displays changelog information from multiple versions"
+        ],
+        "Dev stuff": [
+            "Added a tool to create changelogs for me!",
+            "I'm really lazy :)"
+        ]
+    },
+    "version": {
+        "name": "Alpha",
+        "semver": "1.3.7"
+    }
+}
--- a/newversion.js
+++ b/newversion.js
@ -0,0 +1,44 @@
+const readline = require('readline');
+const fs = require('fs');
+const cp = require('child_process');
+
+const rl = readline.createInterface({input: process.stdin, output: process.stdout});
+const input = async question => {return new Promise(r => {rl.question(question, (ans) => {r(ans);});});};
+
+let cl = {};
+let v;
+
+const ask = async () => {
+    const addGroup = async () => {
+        let conf = await input("\nWould you like to add a new group? ");
+        if (['y', 'ye', 'yes', 'sure'].includes(conf.trim().toLowerCase())) {
+            let gn = await input("What is the group's name? ");
+            cl[gn] = [];
+            const addItem = async () => {
+                let item = await input("Add an item: ");
+                if (item.trim().toLowerCase() !== "done") {
+                    cl[gn].push(item);
+                    await addItem();
+                }
+            };
+            await addItem();
+            await addGroup();
+        }
+    };
+
+    v = await input('What version are you making a changelog for? ');
+    await addGroup();
+
+    fs.writeFileSync(`./json/changelogs/${v.trim().toLowerCase()}.json`, JSON.stringify({log: cl, version: {name: "Alpha", semver: v}}));
+
+    await input("I've made the changelog for you! Press enter when you're ready to create the release tag.");
+
+    cp.exec(`npm version ${v.trim().toLowerCase()}`, function(error, stdout, stderr) {
+        if (error) {console.error(error);}
+        if (stdout) {console.log(stdout);}
+        if (stdout) {console.log(stderr);}
+    });
+
+    console.log('\nDone!');
+};
+ask();
--- a/scripts/contextmenu/newfolder.js
+++ b/scripts/contextmenu/newfolder.js
@ -1,6 +1,6 @@
 const fs = require('fs');
 const path = require('path');
-const mousetrap = require('../dep/mousetrap');
+const Mousetrap = require('../dep/mousetrap');

 const lightRefresh = require('../fileview/lightrefresh');
 const preModal = require('../modal/pre');
@ -10,7 +10,7 @@ const clearModals = require('../modal/clearmodals');
 const newToast = require('../toast/createtoast');

 module.exports = () => {
-    if (window.kade.modal) {console.log('hboonk'); return;}
+    if (window.kade.modal) {return;}
    preModal('new-folder-modal-container');
    let modalOut = document.createElement('div');
    modalOut.className = 'modal';
@ -64,7 +64,7 @@ module.exports = () => {
    };
    cont.appendChild(conf);
    input.focus();
-    let msm = new mousetrap(modal);
+    let msm = new Mousetrap(modal);
    msm.bind('esc', () => {
        lightRefresh();
        modalOut.remove();
--- a/scripts/startup/changelog.js
+++ b/scripts/startup/changelog.js
@ -0,0 +1,73 @@
+const fs = require('fs');
+const Mousetrap = require('../dep/mousetrap');
+
+const preModal = require('../modal/pre');
+const postModal = require('../modal/post');
+
+const changelogs = fs.readdirSync('./json/changelogs').filter(file => file.endsWith('.json'));
+
+module.exports = () => {
+    if (window.kade.modal) {return;}
+    preModal('changelog-modal');
+    let modalOut = document.createElement('div');
+    modalOut.className = 'modal';
+    modalOut.id = 'changelog-modal';
+    document.body.appendChild(modalOut);
+    let modal = document.createElement('div');
+    modal.className = 'modal-wrapper';
+    modalOut.appendChild(modal);
+    let title = document.createElement('h2');
+    title.innerHTML = 'FileKade - Changelog';
+    modal.appendChild(title);
+
+    let clw = document.createElement('div');
+    clw.className = 'changelog-wrapper';
+    modal.appendChild(clw);
+
+    changelogs.forEach(changelog => {
+        changelog = require(`../../json/changelogs/${changelog}`);
+        let w = document.createElement('div');
+        w.className = 'changelog-version-container';
+        clw.appendChild(w);
+        let subtitle = document.createElement('h2');
+        subtitle.className = 'subtitle';
+        subtitle.innerHTML = changelog.version.name + ' ' + changelog.version.semver + (window.kade.version.name === changelog.version.name ? ' (Current)' : '');
+        w.appendChild(subtitle);
+        let cl = changelog.log;
+        Object.keys(cl).forEach(group => {
+            let gc = document.createElement('div');
+            gc.className = 'changelog-group-container';
+            w.appendChild(gc);
+            let gt = document.createElement('p');
+            gt.innerHTML = group;
+            gt.className = 'changelog-group-name';
+            gc.appendChild(gt);
+            let ul = document.createElement('ul');
+            gc.appendChild(ul);
+            cl[group].forEach(item => {
+                let li = document.createElement('li');
+                ul.appendChild(li);
+                let itemp = document.createElement('p');
+                itemp.innerHTML = item;
+                li.appendChild(itemp);
+            });
+        });
+    });
+
+    let msm = new Mousetrap(modal);
+    msm.bind('esc', () => {
+        modalOut.remove();
+        postModal(modalOut.id);
+    });
+
+    let close = document.createElement('a');
+    close.className = 'close-button';
+    close.onclick = () => {
+        modalOut.remove();
+        postModal(modalOut.id);
+    };
+    let closeWrap = document.createElement('div');
+    closeWrap.className = 'close-button-wrapper';
+    modal.appendChild(closeWrap);
+    closeWrap.appendChild(close);
+}
--- a/scripts/startup/preload.js
+++ b/scripts/startup/preload.js
@ -17,7 +17,11 @@ window.addEventListener('DOMContentLoaded', () => {
        chdir: [],
        ctxFunc: {},
        modals: [],
-        modal: false
+        modal: false,
+        version: {
+            name: "Alpha",
+            semver: require('../../package.json').version
+        }
    };

    const startDir = `${os.homedir}\\Desktop`;
@ -41,8 +45,11 @@ window.addEventListener('DOMContentLoaded', () => {

    require('../keybinds/handleKey')();

-    setTimeout(() => {createToast("Welcome", [`Today is ${moment().format('MMMM Do, YYYY')}`, `The time is ${moment().format('h:mma')}`], '#5d60ca', false, 10);}, 1000);
-    setTimeout(() => {createToast("Welcome", ["Welcome to FileKade!", "App by WubzyGD", "Alpha/Pre-release Build"], '#5d60ca', false, 10);}, 1300);
+    setTimeout(() => {createToast("Welcome", ["Welcome to FileKade!", "App by WubzyGD", "Alpha/Pre-release Build"], '#5d60ca', false, 20);}, 1600);
+    setTimeout(() => {createToast("Welcome", [`Today is ${moment().format('MMMM Do, YYYY')}`, `The time is ${moment().format('h:mma')}`], '#5d60ca', false, 20);}, 1300);
+    setTimeout(() => {createToast("Recent Changes", "Click to view changelog", '#5d60ca', false, 10, () => {require('./changelog')();});}, 1000);
+
+    document.getElementById('title').innerHTML = `FileKade - ${window.kade.version.name} ${window.kade.version.semver}`;
 });

 window.addEventListener('contextmenu', e => {
--- a/styles/modal.css
+++ b/styles/modal.css
@ -10,7 +10,7 @@
    background-color: #171717da;
    padding: 6px 8px;
    z-index: 3;
-    max-width: 60%;
+    max-width: 50%;
 }

 .modal h1, .modal h2, .modal h3, .modal h4 {
@ -19,12 +19,20 @@
    margin: 10px;
 }

+.modal .subtitle {
+    font-size: 18px;
+    margin-top: 0;
+    color: #afafaf;
+}
+
 .modal p, .modal b {
    color: white;
    font-family: 'Montserrat', sans-serif;
    margin: 8px 10px;
 }

+.modal li, .modal ul {margin: 0 0;}
+
 .modal input, .modal button {
    background-color: #1e27423f;
    color: white;
@ -48,7 +56,7 @@
    outline: none;
 }

-.modal .button-container, input, .modal .button-container, button {display: inline-block;}
+.button-container input, .button-container button {display: inline-block;}

 #modal-block {
    position: absolute;