aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
author0neGal <mail@0negal.com>2022-02-19 14:25:18 +0100
committerGitHub <noreply@github.com>2022-02-19 14:25:18 +0100
commit39da6eeecdb184e05f93ad1a8aaa1a2a95df333a (patch)
tree74b6be3a0edebe8df31c95d337ec63a64433f053
parentee7dab5b056e254bff828a9b9f6d77be2287b935 (diff)
parent9e539d3d3df62df39b9a67ecf1c24734d6f8779b (diff)
downloadViper-39da6eeecdb184e05f93ad1a8aaa1a2a95df333a.tar.gz
Viper-39da6eeecdb184e05f93ad1a8aaa1a2a95df333a.zip
Merge pull request #81 from 0neGal/drag-drop
feat: drag and drop to install mods
-rw-r--r--src/app/icons/download.pngbin0 -> 2200 bytes
-rw-r--r--src/app/index.html6
-rw-r--r--src/app/main.css58
-rw-r--r--src/app/main.js33
-rw-r--r--src/index.js1
-rw-r--r--src/lang/en.json1
-rw-r--r--src/lang/es.json1
-rw-r--r--src/lang/fr.json1
-rw-r--r--src/utils.js62
9 files changed, 132 insertions, 31 deletions
diff --git a/src/app/icons/download.png b/src/app/icons/download.png
new file mode 100644
index 0000000..189c50d
--- /dev/null
+++ b/src/app/icons/download.png
Binary files differ
diff --git a/src/app/index.html b/src/app/index.html
index 8222416..b5fc8cb 100644
--- a/src/app/index.html
+++ b/src/app/index.html
@@ -14,6 +14,12 @@
<div id="close" onclick="ipcRenderer.send('exit')"></div>
</div>
+ <div id="dragUI">
+ <div id="dragitems">
+ <div id="icon"></div>
+ <div id="text">%%gui.mods.dragdrop%%</div>
+ </div>
+ </div>
<div id="overlay" onclick="Browser.toggle(false)"></div>
<div id="browser">
diff --git a/src/app/main.css b/src/app/main.css
index a532490..dcc4e8a 100644
--- a/src/app/main.css
+++ b/src/app/main.css
@@ -38,11 +38,15 @@
body {
margin: 0;
overflow: hidden;
- user-select: none;
}
body, button, input {font-family: "Roboto", sans-serif}
+body, button, img, a {
+ -webkit-user-drag: none;
+ user-select: none;
+}
+
button {outline: none}
b, strong {font-weight: 700}
body, input, button {font-weight: 500}
@@ -612,6 +616,58 @@ code {
font-weight: 600;
}
+#dragUI {
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ color: white;
+ opacity: 0.0;
+ position: fixed;
+ z-index: 1000000;
+ pointer-events: none;
+ background: var(--bg);
+ backdrop-filter: blur(15px);
+ transition: 0.1s ease-in-out;
+}
+
+#dragUI.shown {
+ opacity: 1.0;
+ pointer-events: all;
+}
+
+#dragUI #dragitems {
+ --size: 25vw;
+ top: 50%;
+ left: 50%;
+ opacity: 0.6;
+ position: absolute;
+ text-align: center;
+ width: var(--size);
+ height: var(--size);
+ margin-top: calc(var(--size) / 2 * -1);
+ margin-left: calc(var(--size) / 2 * -1);
+}
+
+#dragUI #dragitems #icon {
+ width: 100%;
+ height: 100%;
+ filter: invert(1);
+ transform: scale(0.45);
+ background-size: cover;
+ background-image: url("icons/download.png");
+ transition: 0.1s ease-in-out;
+}
+
+#dragUI.shown #dragitems #icon {
+ transform: scale(0.5);
+}
+
+#dragUI #dragitems #text {
+ top: -5vw;
+ position: relative;
+}
+
/* drag control */
#bgHolder,
diff --git a/src/app/main.js b/src/app/main.js
index 7c71c9d..97937a9 100644
--- a/src/app/main.js
+++ b/src/app/main.js
@@ -158,12 +158,18 @@ function selected(all) {
}
}
-// Tells the main process to install a mod
+// Tells the main process to install a mod through the file selector
function installmod() {
setButtons(false);
ipcRenderer.send("installmod")
}
+// Tells the main process to directly install a mod from this path
+function installFromPath(path) {
+ setButtons(false);
+ ipcRenderer.send("installfrompath", path)
+}
+
// Tells the main process to install a mod from a URL
function installFromURL(url) {
setButtons(false);
@@ -244,6 +250,31 @@ ipcRenderer.on("wrongpath", () => {
setlang();
+let dragtimer;
+document.addEventListener("dragover", (e) => {
+ e.preventDefault();
+ e.stopPropagation();
+ dragUI.classList.add("shown");
+
+ clearTimeout(dragtimer);
+ dragtimer = setTimeout(() => {
+ dragUI.classList.remove("shown");
+ }, 5000)
+});
+
+document.addEventListener("mouseover", (e) => {
+ clearTimeout(dragtimer);
+ dragUI.classList.remove("shown");
+});
+
+document.addEventListener("drop", (e) => {
+ event.preventDefault();
+ event.stopPropagation();
+
+ dragUI.classList.remove("shown");
+ installFromPath(event.dataTransfer.files[0].path)
+});
+
document.body.addEventListener("click", event => {
if (event.target.tagName.toLowerCase() === "a" && event.target.protocol != "file:") {
event.preventDefault();
diff --git a/src/index.js b/src/index.js
index 344ac6c..95115b4 100644
--- a/src/index.js
+++ b/src/index.js
@@ -43,6 +43,7 @@ function start() {
ipcMain.on("exit", () => {process.exit(0)})
ipcMain.on("minimize", () => {win.minimize()})
+ ipcMain.on("installfrompath", (event, path) => {utils.mods.install(path)})
ipcMain.on("installfromurl", (event, url) => {utils.mods.installFromURL(url)})
ipcMain.on("winLog", (event, ...args) => {win.webContents.send("log", ...args)});
ipcMain.on("winAlert", (event, ...args) => {win.webContents.send("alert", ...args)});
diff --git a/src/lang/en.json b/src/lang/en.json
index 27630ec..45bf7c0 100644
--- a/src/lang/en.json
+++ b/src/lang/en.json
@@ -62,6 +62,7 @@
"gui.mods.extracting": "Extracting mod...",
"gui.mods.installing": "Installing mod...",
"gui.mods.installedmod": "Installed mod!",
+ "gui.mods.dragdrop": "Drag and drop a mod to install",
"gui.browser.info": "Info",
"gui.browser.madeby": "by",
diff --git a/src/lang/es.json b/src/lang/es.json
index 8beabef..3d92d5a 100644
--- a/src/lang/es.json
+++ b/src/lang/es.json
@@ -62,6 +62,7 @@
"gui.mods.extracting": "Extrayendo modificación...",
"gui.mods.installing": "Instalando modificación...",
"gui.mods.installedmod": "¡Modificación instalada!",
+ "gui.mods.dragdrop": "Arrastra y suelta una modificación para instalarla"
"gui.browser.info": "Información",
"gui.browser.madeby": "por",
diff --git a/src/lang/fr.json b/src/lang/fr.json
index 3bdeec6..14bae37 100644
--- a/src/lang/fr.json
+++ b/src/lang/fr.json
@@ -62,6 +62,7 @@
"gui.mods.extracting": "Extraction du mod...",
"gui.mods.installing": "Installation du mod...",
"gui.mods.installedmod": "Mod installé !",
+ "gui.mods.dragdrop": "Glissez/déposez un mod pour l'installer",
"gui.browser.info": "Info",
"gui.browser.madeby": "par",
diff --git a/src/utils.js b/src/utils.js
index 1448007..2ea91cd 100644
--- a/src/utils.js
+++ b/src/utils.js
@@ -544,40 +544,44 @@ const mods = {
}
try {
- fs.createReadStream(mod).pipe(unzip.Extract({path: cache}))
- .on("finish", () => {
- setTimeout(() => {
- let manifest = path.join(cache, "manifest.json");
- if (fs.existsSync(manifest)) {
- files = fs.readdirSync(path.join(cache, "mods"));
- if (fs.existsSync(path.join(cache, "mods/mod.json"))) {
- if (mods.install(path.join(cache, "mods"), require(manifest).name, manifest, true)) {
- return true;
- }
- } else {
- for (let i = 0; i < files.length; i++) {
- let mod = path.join(cache, "mods", files[i]);
- if (fs.statSync(mod).isDirectory()) {
- setTimeout(() => {
- if (mods.install(mod, false, manifest)) {return true};
- }, 1000)
+ if (mod.replace(/.*\./, "").toLowerCase() == "zip") {
+ fs.createReadStream(mod).pipe(unzip.Extract({path: cache}))
+ .on("finish", () => {
+ setTimeout(() => {
+ let manifest = path.join(cache, "manifest.json");
+ if (fs.existsSync(manifest)) {
+ files = fs.readdirSync(path.join(cache, "mods"));
+ if (fs.existsSync(path.join(cache, "mods/mod.json"))) {
+ if (mods.install(path.join(cache, "mods"), require(manifest).name, manifest, true)) {
+ return true;
+ }
+ } else {
+ for (let i = 0; i < files.length; i++) {
+ let mod = path.join(cache, "mods", files[i]);
+ if (fs.statSync(mod).isDirectory()) {
+ setTimeout(() => {
+ if (mods.install(mod, false, manifest)) {return true};
+ }, 1000)
+ }
}
- }
- if (files.length == 0) {
- ipcMain.emit("failedmod");
- return notamod();
+ if (files.length == 0) {
+ ipcMain.emit("failedmod");
+ return notamod();
+ }
}
- }
- return notamod();
- }
+ return notamod();
+ }
- if (mods.install(cache)) {
- installed();
- } else {return notamod()}
- }, 1000)
- });
+ if (mods.install(cache)) {
+ installed();
+ } else {return notamod()}
+ }, 1000)
+ });
+ } else {
+ return notamod();
+ }
}catch(err) {return notamod()}
}
},