Moved to src folder, more progress on keybinds

master
Guus van Meerveld 4 years ago
parent 7cf183ec9d
commit e63af2581c

@ -30,21 +30,20 @@ function createLoadingScreen() {
width: 200,
height: 400,
frame: false,
icon: "public/icon/icon.png",
icon: "src/icon/icon.png",
backgroundColor: "#212121",
});
loadingScreen.setResizable(false);
loadingScreen.on("closed", () => (loadingScreen = null));
loadingScreen.loadFile("public/pages/loadscreen.html");
loadingScreen.loadFile("src/pages/loadscreen.html");
}
function createWindow() {
async function createWindow() {
let win = new BrowserWindow({
webPreferences: {
nodeIntegration: true,
webviewTag: true,
// enableBlinkFeatures: false,
enableRemoteModule: true,
},
frame: false,
@ -53,11 +52,11 @@ function createWindow() {
backgroundColor: "#212121",
minWidth: 600,
minHeight: 600,
icon: "public/icon/icon.png",
icon: "src/icon/icon.png",
});
// autoUpdater.checkForUpdates()
win.loadFile("public/index.html");
win.loadFile("src/index.html");
win.webContents.on("new-window", function (e, url) {
e.preventDefault();
@ -66,8 +65,8 @@ function createWindow() {
electronLocalshortcut.register(win, "Ctrl+R", () => {
win.reload();
// app.relaunch()
// app.exit()
// app.relaunch();
// app.exit();
});
electronLocalshortcut.register(win, "Ctrl+Shift+I", () => {
@ -83,10 +82,11 @@ function createWindow() {
}
});
win.once("ready-to-show", () => {
win.webContents.on("dom-ready", () => {
if (loadingScreen) {
loadingScreen.close();
}
win.maximize();
win.show();
});
}

@ -1,8 +1,12 @@
{
"Applications": {
"description": "Open/Close/Modify your applications",
"openApp": {},
"closeApp": {}
"open app": {
"description": "Open an application"
},
"close app": {
"description": "Close an application"
}
},
"System": {
"description": "Interact with your system"

5
package-lock.json generated

@ -582,6 +582,11 @@
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
"integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
},
"node-fetch": {
"version": "2.6.1",
"resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.1.tgz",
"integrity": "sha512-V4aYg89jEoVRxRb2fJdAg8FHvI7cEyYdVAh94HH0UIK8oJxUfkjlDQN9RbMx+bEjP7+ggMiFRprSti032Oipxw=="
},
"normalize-url": {
"version": "4.5.0",
"resolved": "https://registry.npmjs.org/normalize-url/-/normalize-url-4.5.0.tgz",

@ -14,6 +14,7 @@
"custom-electron-titlebar": "^3.2.5",
"electron": "^11.0.2",
"electron-localshortcut": "^3.2.1",
"electron-store": "^6.0.1"
"electron-store": "^6.0.1",
"node-fetch": "^2.6.1"
}
}

@ -1,96 +0,0 @@
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 index;
// Detect keybinds
$(".keybind-input").on("keyup", (e) => {
keys[e.key.toUpperCase()] = false;
setInput();
});
$(".keybind-input").on("keydown", (e) => {
e.preventDefault();
Object.keys(keys).forEach((g) => {
if (!keys[g]) delete keys[g];
});
keys[e.key.toUpperCase()] = true;
setInput();
});
function setInput() {
$(".keybind-input").val(Object.keys(keys).toString().replace(/,/gi, " + "));
}
// Configure buttons
$(".add-keybind").click(() => {
index = 0;
$(".dark-overlay").show().addClass("d-flex");
$(".keybind-input").focus();
});
$(".cancel-btn").click(() => {
$(".dark-overlay").hide().removeClass("d-flex");
resetKeyAdder();
});
$(".done-btn").click(() => {
switch (index) {
case 0:
$(".keybind-input").hide();
$(".customize").show().addClass("container-fluid");
$(".done-btn").html("Done");
break;
case 1:
$(".dark-overlay").hide().removeClass("d-flex");
resetKeyAdder();
break;
default:
break;
}
index++;
});
function resetKeyAdder() {
$(".keybind-input").show().val("");
$(".customize").hide();
$(".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);
});

@ -1,36 +0,0 @@
const Store = require('electron-store');
const store = new Store();
const $ = require("../javascripts/jquery.min.js");
const settings = [
"minimize",
"startup",
"startup-min"
]
settings.forEach(setting => {
$(`#${setting}-label`).click(() => {
let checked = $(`#${setting}`).prop("checked");
store.set(setting, checked);
if (setting == "startup") {
disabledArea();
}
});
$(`#${setting}`).prop("checked", store.get(setting));
});
function disabledArea() {
if (store.get('startup')) {
$(".startup-min").removeClass("disabled-item");
}
else {
$(".startup-min").addClass("disabled-item");
$("#startup-min").prop("checked", false);
store.set("startup-min", false);
}
}
disabledArea();

Before

Width:  |  Height:  |  Size: 108 KiB

After

Width:  |  Height:  |  Size: 108 KiB

@ -0,0 +1,159 @@
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 + "/src/javascripts/jquery.min.js");
const functions = require(path + "/json/functions.json");
// Predefine some vars
var keys = {},
showsFunctions = {},
keybind;
// Detect keybinds
$(".keybind-input").on("keyup", (e) => {
keys[e.key.toUpperCase()] = false;
setInput();
});
$(".keybind-input").on("keydown", (e) => {
e.preventDefault();
Object.keys(keys).forEach((g) => {
if (!keys[g]) delete keys[g];
});
keys[e.key.toUpperCase()] = true;
setInput();
});
function setInput() {
keybind = Object.keys(keys).join(" + ");
if (Object.values(keys).filter((k) => k).length == 0) {
$(".keybind-input").hide();
$(".customize").show();
}
$(".show-keybind").html(keybind);
$(".keybind-input").val(keybind);
}
// Configure buttons
$(".add-keybind").click(() => {
$(".dark-overlay").show().addClass("d-flex");
$(".keybind-input").show().focus();
});
$(".cancel-btn").click(resetKeyAdder);
$(".done-btn").click(resetKeyAdder);
$(".change-btn").click(() => {
$(".keybind-input").show().focus().val("");
$(".customize").hide();
});
function resetKeyAdder() {
$(".dark-overlay").hide().removeClass("d-flex");
$(".keybind-input").val("");
$(".customize").hide();
$(".done-btn").hide();
keybind = null;
}
// Load functions from json
Object.keys(functions).forEach((cat) => {
let catNoSpace = cat.replace(/ /g, "");
// Select category
let catagoryItem = createCatagoryItem(cat, catNoSpace),
catagoryFunctions = c("div"),
functionItems = createFunctionItem(functions[cat]);
q(".select-category").appendChild(catagoryItem);
catagoryFunctions.classList.add(catNoSpace);
catagoryFunctions.style.display = "none";
functionItems.forEach((item) => {
catagoryFunctions.appendChild(item);
});
q(".select-function").appendChild(catagoryFunctions);
});
function createCatagoryItem(f, noSpace) {
let title = c("div"),
trailing = c("i"),
subtitle = c("div");
title.classList.add("category-item");
title.classList.add("bold");
title.innerHTML = f.toUpperCase();
title.addEventListener("click", () => {
showsFunctions[f] = !showsFunctions[f] ?? true;
Object.keys(showsFunctions).forEach((i) => {
if (f !== i) {
showsFunctions[i] = false;
$("." + i.replace(/ /g, "")).hide();
}
});
if (showsFunctions[f]) {
$(".select-function").show();
$("." + noSpace).show();
} else {
$(".select-function").hide();
$("." + noSpace).hide();
}
});
trailing.classList.add("category-arrow");
trailing.classList.add("material-icons");
trailing.innerHTML = "arrow_forward_ios";
subtitle.classList.add("text-muted");
subtitle.innerHTML = functions[f].description;
title.appendChild(subtitle);
title.appendChild(trailing);
return title;
}
function createFunctionItem(f) {
delete f.description;
var result = [];
Object.keys(f).forEach((func) => {
result.push(createFunctionItem(func, f[func].description));
});
return result;
}
function createListItem(title, subtitle) {
let titleEl = c("div"),
trailing = c("i"),
subtitleEl = c("div");
titleEl.classList.add("category-item");
titleEl.classList.add("bold");
titleEl.innerHTML = title.toUpperCase();
trailing.classList.add("category-arrow");
trailing.classList.add("material-icons");
trailing.innerHTML = "arrow_forward_ios";
subtitleEl.classList.add("text-muted");
subtitleEl.innerHTML = subtitle;
titleEl.appendChild(trailing);
titleEl.appendChild(subtitleEl);
return titleEl;
}

@ -0,0 +1,31 @@
const Store = require("electron-store");
const store = new Store();
const $ = require("./jquery.min.js");
const settings = ["minimize", "startup", "startup-min"];
settings.forEach((setting) => {
$(`#${setting}-label`).click(() => {
let checked = $(`#${setting}`).prop("checked");
store.set(setting, checked);
if (setting == "startup") {
disabledArea();
}
});
$(`#${setting}`).prop("checked", store.get(setting));
});
function disabledArea() {
if (store.get("startup")) {
$(".startup-min").removeClass("disabled-item");
} else {
$(".startup-min").addClass("disabled-item");
$("#startup-min").prop("checked", false);
store.set("startup-min", false);
}
}
disabledArea();

@ -17,13 +17,19 @@
</h1>
<hr class="dark">
<div class="dark-overlay position-absolute w-100 h-100 justify-content-center align-items-center" style="display: none;">
<div class="customize" style="display: none;">
<div class="customize container-fluid" style="display: none;">
<div class="keybind-notify position-absolute">
<p class="show-keybind bold d-inline">
</p>
<button class="change-btn btn btn-info ml-3">Change</button>
</div>
<div class="row h-100">
<div class="select-category right-border custom-function col-md-4">
<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;">
<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;">
@ -31,10 +37,10 @@
</div>
</div>
</div>
<input type="text" readonly class="keybind-input border-0 keybind-input text-center" placeholder="Recording keys">
<input class="keybind-input text-center" placeholder="Recording keys" readonly>
<div class="btn-container position-absolute">
<a href="#" class="cancel-btn mr-3 text-muted">Cancel</a>
<button class="btn btn-info done-btn">Next</button>
<button class="btn btn-info done-btn" style="display: none;"></button>
</div>
</div>
</div>

@ -19,7 +19,7 @@
</head>
<body class="d-flex justify-content-center align-items-center text-center">
<div>
<p>Keyzo is starting...</p>
<h4 class="bold mb-3">STARTING...</h4>
<div class="spinner-border" role="status">
<span class="sr-only">Loading...</span>
</div>

@ -19,6 +19,7 @@
}
.keybind-input {
border: 0;
background-color: transparent;
color: white;
height: 100%;
@ -42,7 +43,14 @@ input {
}
/* Customize functions */
.keybind-notify {
margin: 0;
bottom: 0.5rem;
z-index: 1001;
}
.customize {
position: relative;
width: 75%;
height: 75%;
background-color: #292929;
@ -52,6 +60,12 @@ input {
.custom-function {
height: calc(100% - 2rem);
margin: 1rem 0;
overflow-y: scroll;
overflow-x: hidden;
}
.custom-function::-webkit-scrollbar {
display: none;
}
.right-border {