Guusvanmeerveld
/
Keyzo
Archived
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

More progress on keybind creation menu

Browse Source
master
Guus van Meerveld 4 years ago
parent 02299d39e2
commit 7cf183ec9d
9 changed files with 393 additions and 371 deletions
Show Stats Download Patch File Download Diff File

203
index.js
Unescape View File

@ -1,16 +1,23 @@
const { app, BrowserWindow, globalShortcut, shell, autoUpdater } = require('electron'); const {
const electronLocalshortcut = require('electron-localshortcut'); app,
const Store = require('electron-store'); BrowserWindow,
globalShortcut,
shell,
autoUpdater,
} = require("electron");
const electronLocalshortcut = require("electron-localshortcut");
const Store = require("electron-store");
const store = new Store(); const store = new Store();
function initApp() { function initApp() {
store.set("init", true); store.set("init", true);
store.set("minimize", true); store.set("minimize", true);
store.set("startup", true); store.set("startup", true);
} }
const AutoLaunch = require('auto-launch'); const AutoLaunch = require("auto-launch");
// const server = 'https://cdn.g-vm.nl' // const server = 'https://cdn.g-vm.nl'
// const url = `${server}/update/${process.platform}/${app.getVersion()}` // const url = `${server}/update/${process.platform}/${app.getVersion()}`
@ -19,101 +26,99 @@ const AutoLaunch = require('auto-launch');
let loadingScreen; let loadingScreen;
function createLoadingScreen() { function createLoadingScreen() {
loadingScreen = new BrowserWindow({ loadingScreen = new BrowserWindow({
width: 200, width: 200,
height: 400, height: 400,
frame: false, frame: false,
icon: "public/icon/icon.png", icon: "public/icon/icon.png",
backgroundColor: '#212121' backgroundColor: "#212121",
}); });
loadingScreen.setResizable(false); loadingScreen.setResizable(false);
loadingScreen.on('closed', () => loadingScreen = null); loadingScreen.on("closed", () => (loadingScreen = null));
loadingScreen.loadFile('public/pages/loadscreen.html') loadingScreen.loadFile("public/pages/loadscreen.html");
};
function createWindow() {
let win = new BrowserWindow({
webPreferences: {
nodeIntegration: true,
webviewTag: true,
// enableBlinkFeatures: false,
enableRemoteModule: true
},
frame: false,
show: false,
titleBarStyle: "hidden",
backgroundColor: '#212121',
'minWidth': 600,
'minHeight': 600,
icon: "public/icon/icon.png"
})
// autoUpdater.checkForUpdates()
win.loadFile('public/index.html')
win.webContents.on('new-window', function (e, url) {
e.preventDefault();
shell.openExternal(url);
});
electronLocalshortcut.register(win, 'Ctrl+R', () => {
win.reload()
// app.relaunch()
// app.exit()
});
electronLocalshortcut.register(win, 'Ctrl+Shift+I', () => {
win.webContents.openDevTools()
});
win.on("close", e => {
if (store.get('minimize')) {
e.preventDefault();
if (!app.isQuiting) {
win.hide();
}
}
})
win.once('ready-to-show', () => {
if (loadingScreen) {
loadingScreen.close();
}
win.show()
})
} }
app.on('ready', () => { function createWindow() {
createLoadingScreen() let win = new BrowserWindow({
createWindow() webPreferences: {
nodeIntegration: true,
if (!store.get("init")) { webviewTag: true,
initApp() // enableBlinkFeatures: false,
} enableRemoteModule: true,
},
let autoLaunch = new AutoLaunch({ frame: false,
name: 'Keyzo', show: false,
path: app.getPath('exe'), titleBarStyle: "hidden",
}); backgroundColor: "#212121",
minWidth: 600,
if (store.get("startup")) { minHeight: 600,
autoLaunch.enable(); icon: "public/icon/icon.png",
} else { });
autoLaunch.disable();
// autoUpdater.checkForUpdates()
win.loadFile("public/index.html");
win.webContents.on("new-window", function (e, url) {
e.preventDefault();
shell.openExternal(url);
});
electronLocalshortcut.register(win, "Ctrl+R", () => {
win.reload();
// app.relaunch()
// app.exit()
});
electronLocalshortcut.register(win, "Ctrl+Shift+I", () => {
win.webContents.openDevTools();
});
win.on("close", (e) => {
if (store.get("minimize")) {
e.preventDefault();
if (!app.isQuiting) {
win.hide();
}
} }
}) });
app.on('window-all-closed', () => { win.once("ready-to-show", () => {
if (process.platform !== 'darwin') { if (loadingScreen) {
app.quit() loadingScreen.close();
} }
}) win.show();
});
}
app.on('activate', () => { app.on("ready", () => {
if (BrowserWindow.getAllWindows().length === 0) { createLoadingScreen();
createWindow() createWindow();
}
}) if (!store.get("init")) {
initApp();
}
let autoLaunch = new AutoLaunch({
name: "Keyzo",
path: app.getPath("exe"),
});
if (store.get("startup")) {
autoLaunch.enable();
} else {
autoLaunch.disable();
}
});
app.on("window-all-closed", () => {
if (process.platform !== "darwin") {
app.quit();
}
});
app.on("activate", () => {
if (BrowserWindow.getAllWindows().length === 0) {
createWindow();
}
});

16
json/functions.json
Unescape View File

@ -0,0 +1,16 @@
{
"Applications": {
"description": "Open/Close/Modify your applications",
"openApp": {},
"closeApp": {}
},
"System": {
"description": "Interact with your system"
},
"Keys": {
"description": "Output keyboard inputs"
},
"System Functions": {
"description": "Some predefined functions"
}
}

119
package-lock.json generated
Unescape View File

@ -34,14 +34,14 @@
} }
}, },
"@types/node": { "@types/node": {
"version": "12.12.64", "version": "12.19.6",
"resolved": "https://registry.npmjs.org/@types/node/-/node-12.12.64.tgz", "resolved": "https://registry.npmjs.org/@types/node/-/node-12.19.6.tgz",
"integrity": "sha512-UV1/ZJMC+HcP902wWdpC43cAcGu0IQk/I5bXjP2aSuCjsk3cE74mDvFrLKga7oDC170ugOAYBwfT4DSQW3akDA==" "integrity": "sha512-U2VopDdmBoYBmtm8Rz340mvvSz34VgX/K9+XCuckvcLGMkt3rbMX8soqFOikIPlPBc5lmw8By9NUK7bEFSBFlQ=="
}, },
"ajv": { "ajv": {
"version": "6.12.5", "version": "6.12.6",
"resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.5.tgz", "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
"integrity": "sha512-lRF8RORchjpKG50/WFf8xmg7sgCLFiYNNnqdKflk63whMQcWR5ngGjiSXkL9bjxy6B2npOK2HSMN49jEBMSkag==", "integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==",
"requires": { "requires": {
"fast-deep-equal": "^3.1.1", "fast-deep-equal": "^3.1.1",
"fast-json-stable-stringify": "^2.0.0", "fast-json-stable-stringify": "^2.0.0",
@ -55,9 +55,9 @@
"integrity": "sha1-u4evVoytA0pOSMS9r2Bno6JwExc=" "integrity": "sha1-u4evVoytA0pOSMS9r2Bno6JwExc="
}, },
"atomically": { "atomically": {
"version": "1.3.2", "version": "1.7.0",
"resolved": "https://registry.npmjs.org/atomically/-/atomically-1.3.2.tgz", "resolved": "https://registry.npmjs.org/atomically/-/atomically-1.7.0.tgz",
"integrity": "sha512-MAiqx5ir1nOoMeG2vLXJnj4oFROJYB1hMqa2aAo6GQVIkPdkIcrq9W9SR0OaRtvEowO7Y2bsXqKFuDMTO4iOAQ==" "integrity": "sha512-Xcz9l0z7y9yQ9rdDaxlmaI4uJHf/T8g9hOEzJcsEqX2SjCj4J20uK7+ldkDHMbpJDK76wF7xEIgxc/vSlsfw5w=="
}, },
"auto-launch": { "auto-launch": {
"version": "5.0.5", "version": "5.0.5",
@ -71,26 +71,12 @@
"winreg": "1.2.4" "winreg": "1.2.4"
} }
}, },
"balanced-match": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz",
"integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c="
},
"boolean": { "boolean": {
"version": "3.0.1", "version": "3.0.2",
"resolved": "https://registry.npmjs.org/boolean/-/boolean-3.0.1.tgz", "resolved": "https://registry.npmjs.org/boolean/-/boolean-3.0.2.tgz",
"integrity": "sha512-HRZPIjPcbwAVQvOTxR4YE3o8Xs98NqbbL1iEZDCz7CL8ql0Lt5iOyJFxfnAB0oFs8Oh02F/lLlg30Mexv46LjA==", "integrity": "sha512-RwywHlpCRc3/Wh81MiCKun4ydaIFyW5Ea6JbL6sRCVx5q5irDw7pMXBUFYF/jArQ6YrG36q0kpovc9P/Kd3I4g==",
"optional": true "optional": true
}, },
"brace-expansion": {
"version": "1.1.11",
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
"integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
"requires": {
"balanced-match": "^1.0.0",
"concat-map": "0.0.1"
}
},
"buffer-crc32": { "buffer-crc32": {
"version": "0.2.13", "version": "0.2.13",
"resolved": "https://registry.npmjs.org/buffer-crc32/-/buffer-crc32-0.2.13.tgz", "resolved": "https://registry.npmjs.org/buffer-crc32/-/buffer-crc32-0.2.13.tgz",
@ -138,11 +124,6 @@
"mimic-response": "^1.0.0" "mimic-response": "^1.0.0"
} }
}, },
"concat-map": {
"version": "0.0.1",
"resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
"integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s="
},
"concat-stream": { "concat-stream": {
"version": "1.6.2", "version": "1.6.2",
"resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.6.2.tgz", "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.6.2.tgz",
@ -182,9 +163,9 @@
} }
}, },
"core-js": { "core-js": {
"version": "3.6.5", "version": "3.7.0",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-3.6.5.tgz", "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.7.0.tgz",
"integrity": "sha512-vZVEEwZoIsI+vPEuoF9Iqf5H7/M3eeQqWlQnYa8FSKKePuYTf5MWnxb5SDAzCa60b3JBRS5g9b+Dq7b1y/RCrA==", "integrity": "sha512-NwS7fI5M5B85EwpWuIwJN4i/fbisQUwLwiSNUWeXlkAZ0sbBjLEvLvFLf1uzAUV66PcEPt4xCGCmOZSxVf3xzA==",
"optional": true "optional": true
}, },
"core-util-is": { "core-util-is": {
@ -193,9 +174,9 @@
"integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac=" "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac="
}, },
"custom-electron-titlebar": { "custom-electron-titlebar": {
"version": "3.2.4", "version": "3.2.5",
"resolved": "https://registry.npmjs.org/custom-electron-titlebar/-/custom-electron-titlebar-3.2.4.tgz", "resolved": "https://registry.npmjs.org/custom-electron-titlebar/-/custom-electron-titlebar-3.2.5.tgz",
"integrity": "sha512-zjjw8lcn2JwYaqLSLZtPWnP6IjPSix+nr3QNf5OPsNzdFDGORAUsIhU7A6vNg8aWpsjNc8rsvOW6MVcHwPrUDQ==" "integrity": "sha512-9tzTtvrsBec9lFi9Mg8nfwARn82mVgrYiiCYmBwJFYC0YhsyUYZfPyw4fd6hq+XHQbD+f72i9uqhukl5brhZZw=="
}, },
"debounce-fn": { "debounce-fn": {
"version": "4.0.0", "version": "4.0.0",
@ -206,9 +187,9 @@
} }
}, },
"debug": { "debug": {
"version": "4.2.0", "version": "4.3.1",
"resolved": "https://registry.npmjs.org/debug/-/debug-4.2.0.tgz", "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.1.tgz",
"integrity": "sha512-IX2ncY78vDTjZMFUdmsvIRFY2Cf4FnD0wRs+nQwJU8Lu99/tPFdb0VybiiMTPe3I6rQmwsqQqRBvxU+bZ/I8sg==", "integrity": "sha512-doEwdvm4PCeK4K3RQN2ZC2BYUBaxwLARCqZmMjtF8a51J2Rb0xpVloFRnCODwqjpwnAoao4pelN8l3RJdv3gRQ==",
"requires": { "requires": {
"ms": "2.1.2" "ms": "2.1.2"
} }
@ -255,9 +236,9 @@
"integrity": "sha1-7gHdHKwO08vH/b6jfcCo8c4ALOI=" "integrity": "sha1-7gHdHKwO08vH/b6jfcCo8c4ALOI="
}, },
"electron": { "electron": {
"version": "9.3.2", "version": "11.0.2",
"resolved": "https://registry.npmjs.org/electron/-/electron-9.3.2.tgz", "resolved": "https://registry.npmjs.org/electron/-/electron-11.0.2.tgz",
"integrity": "sha512-0lleEf9msAXGDi2GukAuiGdw3VDgSTlONOnJgqDEz1fuSEVsXz5RX+hNPKDsVDerLTFg/C34RuJf4LwHvkKcBA==", "integrity": "sha512-FTYtCm0oj8B8EJhp99BQSW2bd40xYEG/txMj+W3Ed0CNu5zVIIXb5WIrhXLvhcasN5LKy9nkmSZ+u220lCaARg==",
"requires": { "requires": {
"@electron/get": "^1.0.1", "@electron/get": "^1.0.1",
"@types/node": "^12.0.12", "@types/node": "^12.0.12",
@ -280,15 +261,6 @@
"keyboardevents-areequal": "^0.2.1" "keyboardevents-areequal": "^0.2.1"
} }
}, },
"electron-storage": {
"version": "1.0.7",
"resolved": "https://registry.npmjs.org/electron-storage/-/electron-storage-1.0.7.tgz",
"integrity": "sha1-8Ii2idqQQU5PlVUgg4lu7VP9518=",
"requires": {
"mkdirp": "^0.5.1",
"rimraf": "^2.5.4"
}
},
"electron-store": { "electron-store": {
"version": "6.0.1", "version": "6.0.1",
"resolved": "https://registry.npmjs.org/electron-store/-/electron-store-6.0.1.tgz", "resolved": "https://registry.npmjs.org/electron-store/-/electron-store-6.0.1.tgz",
@ -398,11 +370,6 @@
"universalify": "^0.1.0" "universalify": "^0.1.0"
} }
}, },
"fs.realpath": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
"integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
},
"get-stream": { "get-stream": {
"version": "4.1.0", "version": "4.1.0",
"resolved": "https://registry.npmjs.org/get-stream/-/get-stream-4.1.0.tgz", "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-4.1.0.tgz",
@ -411,19 +378,6 @@
"pump": "^3.0.0" "pump": "^3.0.0"
} }
}, },
"glob": {
"version": "7.1.6",
"resolved": "https://registry.npmjs.org/glob/-/glob-7.1.6.tgz",
"integrity": "sha512-LwaxwyZ72Lk7vZINtNNrywX0ZuLyStrdDtabefZKAY5ZGJhVtgdznluResxNmPitE0SAO+O26sWTHeKSI2wMBA==",
"requires": {
"fs.realpath": "^1.0.0",
"inflight": "^1.0.4",
"inherits": "2",
"minimatch": "^3.0.4",
"once": "^1.3.0",
"path-is-absolute": "^1.0.0"
}
},
"global-agent": { "global-agent": {
"version": "2.1.12", "version": "2.1.12",
"resolved": "https://registry.npmjs.org/global-agent/-/global-agent-2.1.12.tgz", "resolved": "https://registry.npmjs.org/global-agent/-/global-agent-2.1.12.tgz",
@ -488,15 +442,6 @@
"resolved": "https://registry.npmjs.org/http-cache-semantics/-/http-cache-semantics-4.1.0.tgz", "resolved": "https://registry.npmjs.org/http-cache-semantics/-/http-cache-semantics-4.1.0.tgz",
"integrity": "sha512-carPklcUh7ROWRK7Cv27RPtdhYhUsela/ue5/jKzjegVvXDqM2ILE9Q2BGn9JZJh1g87cp56su/FgQSzcWS8cQ==" "integrity": "sha512-carPklcUh7ROWRK7Cv27RPtdhYhUsela/ue5/jKzjegVvXDqM2ILE9Q2BGn9JZJh1g87cp56su/FgQSzcWS8cQ=="
}, },
"inflight": {
"version": "1.0.6",
"resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
"integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=",
"requires": {
"once": "^1.3.0",
"wrappy": "1"
}
},
"inherits": { "inherits": {
"version": "2.0.4", "version": "2.0.4",
"resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz", "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
@ -619,14 +564,6 @@
"resolved": "https://registry.npmjs.org/mimic-response/-/mimic-response-1.0.1.tgz", "resolved": "https://registry.npmjs.org/mimic-response/-/mimic-response-1.0.1.tgz",
"integrity": "sha512-j5EctnkH7amfV/q5Hgmoal1g2QHFJRraOtmx0JpIqkxhBhI/lJSl1nMpQ45hVarwNETOoWEimndZ4QK0RHxuxQ==" "integrity": "sha512-j5EctnkH7amfV/q5Hgmoal1g2QHFJRraOtmx0JpIqkxhBhI/lJSl1nMpQ45hVarwNETOoWEimndZ4QK0RHxuxQ=="
}, },
"minimatch": {
"version": "3.0.4",
"resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz",
"integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==",
"requires": {
"brace-expansion": "^1.1.7"
}
},
"minimist": { "minimist": {
"version": "1.2.5", "version": "1.2.5",
"resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.5.tgz", "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.5.tgz",
@ -801,14 +738,6 @@
"lowercase-keys": "^1.0.0" "lowercase-keys": "^1.0.0"
} }
}, },
"rimraf": {
"version": "2.7.1",
"resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
"integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
"requires": {
"glob": "^7.1.3"
}
},
"roarr": { "roarr": {
"version": "2.15.4", "version": "2.15.4",
"resolved": "https://registry.npmjs.org/roarr/-/roarr-2.15.4.tgz", "resolved": "https://registry.npmjs.org/roarr/-/roarr-2.15.4.tgz",

12
package.json
Unescape View File

@ -11,15 +11,9 @@
"license": "ISC", "license": "ISC",
"dependencies": { "dependencies": {
"auto-launch": "^5.0.5", "auto-launch": "^5.0.5",
"custom-electron-titlebar": "^3.2.4", "custom-electron-titlebar": "^3.2.5",
"electron": "^9.3.2", "electron": "^11.0.2",
"electron-json-storage": "^4.2.0",
"electron-localshortcut": "^3.2.1", "electron-localshortcut": "^3.2.1",
"electron-storage": "^1.0.7", "electron-store": "^6.0.1"
"electron-store": "^6.0.1",
"electron-window-state": "^5.0.3",
"material-design-icons": "^3.0.1",
"ndb": "^1.1.5",
"update-electron-app": "^1.5.0"
} }
} }

38
public/javascripts/index.js
Unescape View File

@ -1,28 +1,30 @@
const customTitlebar = require('custom-electron-titlebar'); const customTitlebar = require("custom-electron-titlebar");
const $ = require("./javascripts/jquery.min.js") const { Menu } = require("electron");
const $ = require("./javascripts/jquery.min.js");
var titleBar = new customTitlebar.Titlebar({ var titleBar = new customTitlebar.Titlebar({
backgroundColor: customTitlebar.Color.fromHex('#292929'), menu: null,
icon: "icon/icon.png" backgroundColor: customTitlebar.Color.fromHex("#292929"),
icon: "icon/icon.png",
}); });
function init() { function init() {
document.querySelectorAll(".nav-item").forEach(x => { document.querySelectorAll(".nav-item").forEach((x) => {
x.addEventListener('click', () => { x.addEventListener("click", () => {
if ($("#main-page").prop('src').indexOf(x.id) < 0) { if ($("#main-page").prop("src").indexOf(x.id) < 0) {
$("#main-page").prop('src', `pages/${x.id}.html`); $("#main-page").prop("src", `pages/${x.id}.html`);
document.querySelectorAll(".nav-item").forEach(y => { document.querySelectorAll(".nav-item").forEach((y) => {
y.classList.remove('active') y.classList.remove("active");
})
x.classList.add('active')
};
}); });
x.classList.add("active");
}
}); });
document.querySelectorAll(".nav-item")[0].classList.add("active") });
}; document.querySelectorAll(".nav-item")[0].classList.add("active");
}
document.onreadystatechange = function () { document.onreadystatechange = function () {
if (document.readyState == "complete") { if (document.readyState == "complete") {
init(); init();
} }
}; };

115
public/javascripts/keybinds.js
Unescape View File

@ -1,59 +1,96 @@
const $ = require("../javascripts/jquery.min.js"); const app = require("electron").remote.app;
const path = app.getAppPath();
const q = document.querySelector.bind(document);
const c = document.createElement.bind(document);
const $ = require(path + "/public/javascripts/jquery.min.js");
const functions = require(path + "/json/functions.json");
// Predefine some vars
var keys = {}; var keys = {};
var index; var index;
$("input[type=text]").on("keyup", e => { // Detect keybinds
keys[e.key.toUpperCase()] = false; $(".keybind-input").on("keyup", (e) => {
setInput(); keys[e.key.toUpperCase()] = false;
setInput();
}); });
$("input[type=text]").on("keydown", e => { $(".keybind-input").on("keydown", (e) => {
Object.keys(keys).forEach(g => { e.preventDefault();
if (!keys[g])
delete keys[g]; Object.keys(keys).forEach((g) => {
}); if (!keys[g]) delete keys[g];
keys[e.key.toUpperCase()] = true; });
setInput();
keys[e.key.toUpperCase()] = true;
setInput();
}); });
function setInput() { function setInput() {
$(".keybind-input").val(Object.keys(keys).toString().replace(/,/gi, " + ")); $(".keybind-input").val(Object.keys(keys).toString().replace(/,/gi, " + "));
} }
// Configure buttons
$(".add-keybind").click(() => { $(".add-keybind").click(() => {
index = 0; index = 0;
resetKeyAdder(); $(".dark-overlay").show().addClass("d-flex");
$(".dark-overlay").show().addClass("d-flex"); $(".keybind-input").focus();
$(".keybind-input").focus();
}); });
$(".cancel-btn").click(() => { $(".cancel-btn").click(() => {
$(".dark-overlay").hide().removeClass("d-flex"); $(".dark-overlay").hide().removeClass("d-flex");
resetKeyAdder() resetKeyAdder();
}) });
$(".done-btn").click(() => { $(".done-btn").click(() => {
switch (index) { switch (index) {
case 0: case 0:
$(".keybind-input").hide(); $(".keybind-input").hide();
$(".select-function").show(); $(".customize").show().addClass("container-fluid");
$(".done-btn").html("Done"); $(".done-btn").html("Done");
break; break;
case 1: case 1:
$(".dark-overlay").hide().removeClass("d-flex"); $(".dark-overlay").hide().removeClass("d-flex");
resetKeyAdder(); resetKeyAdder();
break;
break; default:
default: break;
break; }
} index++;
index++; });
})
function resetKeyAdder() { function resetKeyAdder() {
$(".keybind-input").show().prop("value", ""); $(".keybind-input").show().val("");
$(".select-function").hide(); $(".customize").hide();
$(".done-btn").html("Next"); $(".done-btn").html("Next");
} }
// Load functions from json
Object.keys(functions).forEach((func) => {
let title = c("div");
title.classList.add("category-item");
title.classList.add("bold");
title.innerHTML = func.toUpperCase();
title.addEventListener("click", () => {
$(".select-function").toggle();
});
let trailing = c("i");
trailing.classList.add("category-arrow");
trailing.classList.add("material-icons");
trailing.innerHTML = "arrow_forward_ios";
let subtitle = c("div");
subtitle.classList.add("text-muted");
subtitle.innerHTML = functions[func].description;
title.appendChild(subtitle);
title.appendChild(trailing);
q(".select-category").appendChild(title);
});

17
public/pages/keybinds.html
Unescape View File

@ -17,10 +17,19 @@
</h1> </h1>
<hr class="dark"> <hr class="dark">
<div class="dark-overlay position-absolute w-100 h-100 justify-content-center align-items-center" style="display: none;"> <div class="dark-overlay position-absolute w-100 h-100 justify-content-center align-items-center" style="display: none;">
<div class="select-function" style="display: none;"> <div class="customize" style="display: none;">
<nav> <div class="row h-100">
<div class="nav-item"></div> <div class="select-category right-border custom-function col-md-4">
</nav> <h4 class="bold text-muted mb-3 text-center">CATEGORIES</h4>
</div>
<div class="select-function right-border custom-function col-md-4" style="display: none;">
<h4 class="bold text-muted mb-3 text-center">FUNCTIONS</h4>
</div>
<div class="select-sub-function custom-function col-md-4" style="display: none;">
</div>
</div>
</div> </div>
<input type="text" readonly class="keybind-input border-0 keybind-input text-center" placeholder="Recording keys"> <input type="text" readonly class="keybind-input border-0 keybind-input text-center" placeholder="Recording keys">
<div class="btn-container position-absolute"> <div class="btn-container position-absolute">

150
public/stylesheets/index.css
Unescape View File

@ -1,96 +1,96 @@
.wrapper { .wrapper {
position: absolute; position: absolute;
height: calc(100vh - 30px); height: calc(100vh - 30px);
right: 0; right: 0;
border-radius: 5px 0 0 0;
} }
#main-page { #main-page {
width: 100%; width: 100%;
height: 100%; height: 100%;
border: 0; border: 0;
} }
.nav-left { .nav-left {
user-select: none; user-select: none;
background-color: #292929; background-color: #292929;
} }
@media (max-width:749px) { @media (max-width: 749px) {
.nav-left { .nav-left {
width: 100vw; width: 100vw;
bottom: 0; bottom: 0;
height: 5rem; height: 5rem;
} }
.nav-list li { .nav-list li {
margin-right: 2rem; margin-right: 2rem;
margin-bottom: 1rem; margin-bottom: 1rem;
} }
.nav-list-top { .nav-list-top {
left: 2rem; left: 2rem;
} }
.nav-list-bottom { .nav-list-bottom {
right: 2rem; right: 2rem;
} }
.wrapper { .wrapper {
width: 100vw; width: 100vw;
height: calc(100vh - 7.5rem); height: calc(100vh - 7.5rem);
} }
} }
@media (min-width:750px) { @media (min-width: 750px) {
.wrapper { .wrapper {
min-width: calc(100vw - 6rem); min-width: calc(100vw - 6rem);
width: 96vw; width: 96vw;
max-width: calc(100vw - 3.5rem); max-width: calc(100vw - 3.5rem);
} }
.nav-left { .nav-left {
top: 0; top: 0;
height: calc(100vh - 30px); height: calc(100vh - 30px);
min-width: 3.5rem; min-width: 3.5rem;
width: 4vw; width: 4vw;
max-width: 6rem; max-width: 6rem;
} }
.nav-item:hover { .nav-item:hover {
border-left: #a6a6a6 3px solid; border-left: #a6a6a6 3px solid;
padding-right: 3px; padding-right: 3px;
} }
.nav-item.active { .nav-item.active {
border-left: 3px solid #efefef!important; border-left: 3px solid #efefef !important;
padding-right: 3px; padding-right: 3px;
} }
.nav-list-top { .nav-list-top {
top: 2rem; top: 2rem;
} }
.nav-list li { .nav-list li {
width: 100%; width: 100%;
margin-bottom: 2rem; margin-bottom: 2rem;
} }
.nav-list {
width: 100%;
}
}
.nav-list {
width: 100%;
}
}
.nav-list { .nav-list {
list-style-type: none; list-style-type: none;
bottom: 0; bottom: 0;
} }
.nav-list li { .nav-list li {
float: left; float: left;
cursor: pointer; cursor: pointer;
} }
.nav-list li i { .nav-list li i {
font-size: 2rem; font-size: 2rem;
} }

86
public/stylesheets/keybinds.css
Unescape View File

@ -1,49 +1,79 @@
.card-dark { .card-dark {
background-color: rgb(39, 39, 39); background-color: rgb(39, 39, 39);
width: 100%; width: 100%;
border-radius: 5px; border-radius: 5px;
box-sizing: border-box; box-sizing: border-box;
} }
.add-keybind { .add-keybind {
font-size: 3rem; font-size: 3rem;
user-select: none; user-select: none;
cursor: pointer; cursor: pointer;
} }
.dark-overlay { .dark-overlay {
background-color: rgba(0, 0, 0, 0.5); background-color: rgba(0, 0, 0, 0.5);
z-index: 1000; z-index: 1000;
top: 0; top: 0;
left: 0; left: 0;
} }
.keybind-input { .keybind-input {
background-color: transparent; background-color: transparent;
color: white; color: white;
height: 100%; height: 100%;
cursor: default; cursor: default;
width: 100%; width: 100%;
user-select: none; user-select: none;
font-size: 5rem; font-size: 5rem;
} }
.btn-container { .btn-container {
bottom: 1.5rem; bottom: 1.5rem;
right: 1.5rem; right: 1.5rem;
} }
.keybind-input:focus { .keybind-input:focus {
outline: 0; outline: 0;
} }
.select-function { input {
width: 50%; cursor: pointer;
height: 50%;
background-color: #292929;
border-radius: 5px;
} }
input { /* Customize functions */
cursor: pointer; .customize {
width: 75%;
height: 75%;
background-color: #292929;
border-radius: 5px;
}
.custom-function {
height: calc(100% - 2rem);
margin: 1rem 0;
}
.right-border {
border-right: 3px solid #333333;
}
.category-arrow {
position: absolute;
display: none;
top: 1rem;
right: 1rem;
width: 1rem;
}
.category-item:hover .category-arrow {
display: block;
}
.category-item {
user-select: none;
position: relative;
cursor: pointer;
border-top: 3px solid #333333;
padding: 1rem;
} }