summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorMinteck <contact@minteck.org>2022-06-17 15:30:54 +0200
committerMinteck <contact@minteck.org>2022-06-17 15:30:54 +0200
commit27262ca8ab4e9dfc292d6701a93d9e446551a87a (patch)
treef026a79c67ec39714dac9b151ac5a2bb2da9b369
parent8ee11c8c1b2d90184df0d748f4a3ce7f93f12186 (diff)
downloadbits-client-27262ca8ab4e9dfc292d6701a93d9e446551a87a.tar.gz
bits-client-27262ca8ab4e9dfc292d6701a93d9e446551a87a.tar.bz2
bits-client-27262ca8ab4e9dfc292d6701a93d9e446551a87a.zip
Update
Diffstat
-rw-r--r--.DS_Storebin6148 -> 6148 bytes
-rw-r--r--.idea/deployment.xml19
-rw-r--r--assets/black.css35
-rw-r--r--index.html200
-rw-r--r--index.js2
5 files changed, 232 insertions, 24 deletions
diff --git a/.DS_Store b/.DS_Store
index 3ed63fb..e2b4a08 100644
--- a/.DS_Store
+++ b/.DS_Store
Binary files differ
diff --git a/.idea/deployment.xml b/.idea/deployment.xml
new file mode 100644
index 0000000..1be9b5a
--- /dev/null
+++ b/.idea/deployment.xml
@@ -0,0 +1,19 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+ <component name="PublishConfigData" autoUpload="Always" serverName="Minteck" remoteFilesAllowedToDisappearOnAutoupload="false">
+ <serverData>
+ <paths name="Minteck">
+ <serverdata>
+ <mappings>
+ <mapping deploy="/mnt/bits/Mobile" local="$PROJECT_DIR$" web="/" />
+ </mappings>
+ <excludedPaths>
+ <excludedPath local="true" path="$PROJECT_DIR$/build" />
+ <excludedPath local="true" path="$PROJECT_DIR$/node_modules" />
+ </excludedPaths>
+ </serverdata>
+ </paths>
+ </serverData>
+ <option name="myAutoUpload" value="ALWAYS" />
+ </component>
+</project> \ No newline at end of file
diff --git a/assets/black.css b/assets/black.css
new file mode 100644
index 0000000..aca4d03
--- /dev/null
+++ b/assets/black.css
@@ -0,0 +1,35 @@
+#header {
+ border-bottom: 1px solid rgba(255, 255, 255, .25) !important;
+ height: 31px !important;
+}
+
+#view {
+ background: black !important;
+ color: white !important;
+}
+
+.transaction {
+ border-bottom: 1px solid rgba(255, 255, 255, .1) !important;
+}
+
+.transaction:hover, .transaction:active, .transaction:focus {
+ background: rgba(255, 255, 255, .1) !important;
+}
+
+#goal {
+ background: black !important;
+ border-top: 1px solid rgba(255, 255, 255, .25) !important;
+}
+
+#goal-bar {
+ background: rgba(255, 255, 255, .1) !important;
+}
+
+#confirm-modal-inner > h3, #create-modal-inner > h3, #about-modal-inner > h3 {
+ background: rgba(255, 255, 255, .1);
+}
+
+#confirm-modal-inner, #create-modal-inner, #about-modal-inner {
+ color: white;
+ background: rgb(60, 60, 60) !important;
+} \ No newline at end of file
diff --git a/index.html b/index.html
index ad209f2..432c5d0 100644
--- a/index.html
+++ b/index.html
@@ -4,6 +4,9 @@
<head>
<meta charset="UTF-8">
<title>Bits</title>
+ <script>
+ isNodeJS = typeof require === "function";
+ </script>
<style>
:root {
--perc-color: black;
@@ -28,20 +31,30 @@
background-color: rgba(0, 0, 0, .1);
}
</style>
+ <link rel="stylesheet" href="./assets/black.css" disabled id="mobile-css">
</head>
<body style="position:fixed;inset:0;">
<div id="loader" style="background:#222;transition:opacity 500ms;z-index:9999;position:fixed;inset:0;display:flex;align-items: center;justify-content: center;">
<img src="assets/logo.svg" style="width:96px;">
<script>
window.onload = async () => {
+ if (!isNodeJS) {
+ document.getElementById("mobile-css").removeAttribute("disabled");
+ }
+
document.body.innerHTML = document.body.innerHTML.replace(/(\n| {2,})/gm, "");
setTimeout(async () => {
- loginStatus = JSON.parse(await (await window.fetch("https://money.equestria.dev/Authentication/Test")).text()).status;
+ loginStatus = JSON.parse(await (await window.fetch("https://money-v1.equestria.dev/Authentication/Test/")).text()).status;
if (loginStatus === 1) {
- const { ipcRenderer } = require('electron');
- ipcRenderer.send("login");
- console.info("Starting authentication procedure");
+ if (isNodeJS) {
+ console.info("Starting authentication procedure (Electron)");
+ const { ipcRenderer } = require('electron');
+ ipcRenderer.send("login");
+ } else {
+ console.info("Starting authentication procedure (Mobile)");
+ location.href = "https://money-v1.equestria.dev/Authentication/Mobile/"
+ }
} else {
console.info("Authenticated successfully");
@@ -52,10 +65,11 @@
async function refresh() {
document.getElementById("transactions").innerHTML = "";
- document.getElementById("username").innerText = JSON.parse(await (await window.fetch("https://money.equestria.dev/Authentication/Username")).text()).name;
+ document.getElementById("username").innerText = JSON.parse(await (await window.fetch("https://money-v1.equestria.dev/Authentication/Username")).text()).name;
+ document.getElementById("user-profile").src = "https://account.minteck.org/hub/api/rest/avatar/" + JSON.parse(await (await window.fetch("https://money-v1.equestria.dev/Authentication/Username/")).text()).id + "?dpr=2&size=48";
- window.transactions = JSON.parse(await (await window.fetch("https://money.equestria.dev/Application/TransactionsList")).text());
- window.goal = JSON.parse(await (await window.fetch("https://money.equestria.dev/Application/GetGoal")).text());
+ window.transactions = JSON.parse(await (await window.fetch("https://money-v1.equestria.dev/Application/TransactionsList/")).text());
+ window.goal = JSON.parse(await (await window.fetch("https://money-v1.equestria.dev/Application/GetGoal/")).text());
for (let transaction of transactions) {
demo = document.getElementById("demo-transaction");
@@ -155,7 +169,11 @@
document.getElementById('create-button-create').disabled = true;
document.getElementById('create-button-cancel').disabled = true;
- await (await window.fetch("https://money.equestria.dev/Application/AddTransaction/?Currency=" + document.getElementById('create-currency').value + "&Amount=" + document.getElementById('create-amount').value + "&Operation=" + document.getElementById('create-action').value + "&Description=" + Buffer.from(document.getElementById('create-description').value).toString("base64url"))).text();
+ if (isNodeJS) {
+ await (await window.fetch("https://money-v1.equestria.dev/Application/AddTransaction/?Currency=" + document.getElementById('create-currency').value + "&Amount=" + document.getElementById('create-amount').value + "&Operation=" + document.getElementById('create-action').value + "&Description=" + Buffer.from(document.getElementById('create-description').value).toString("base64url"))).text();
+ } else {
+ await (await window.fetch("https://money-v1.equestria.dev/Application/AddTransaction/?Currency=" + document.getElementById('create-currency').value + "&Amount=" + document.getElementById('create-amount').value + "&Operation=" + document.getElementById('create-action').value + "&Description=" + btoa(document.getElementById('create-description').value).replaceAll("+", "-").replaceAll("/", "_"))).text();
+ }
await refresh();
@@ -172,30 +190,72 @@
document.getElementById('create-amount').value = '';
}
+ function showConfirm(text) {
+ document.getElementById("confirm-modal").style.display = isNodeJS ? "flex" : "";
+ document.getElementById("confirm-text").innerText = text;
+ document.getElementById('confirm-button-cancel').disabled = false;
+ document.getElementById('confirm-button-ok').disabled = false;
+ }
+
+ confirmAction = () => {
+ console.log("Confirmed!");
+ document.getElementById('confirm-modal').style.display = 'none';
+ }
+
async function deleteTransaction(id) {
let transaction = transactions.filter(i => i.date.absolute === id)[0];
console.log(transaction);
- if (confirm("This will remove the transaction made by " + transaction.author.name + " " + transaction.date.relative + ".\nIt will be removed from the list and the global balance will be recalculated without this transaction.")) {
- await (await window.fetch("https://money.equestria.dev/Application/RemoveTransaction/?Transaction=" + Buffer.from(id).toString("base64url"))).text();
+ showConfirm("This will remove the transaction made by " + transaction.author.name + " " + transaction.date.relative + ".\nIt will be removed from the list and the global balance will be recalculated without this transaction.");
+ confirmAction = async () => {
+ if (isNodeJS) {
+ await (await window.fetch("https://money-v1.equestria.dev/Application/RemoveTransaction/?Transaction=" + Buffer.from(id).toString("base64url"))).text();
+ } else {
+ await (await window.fetch("https://money-v1.equestria.dev/Application/RemoveTransaction/?Transaction=" + btoa(id).replaceAll("+", "-").replaceAll("/", "_"))).text();
+ }
await refresh();
+ document.getElementById('confirm-modal').style.display = 'none';
}
}
</script>
</div>
+ <script>
+ if (!isNodeJS) {
+ document.getElementById("loader").style.backgroundColor = "#000000";
+ }
+ </script>
<div id="app" style="display:none;position:fixed;z-index:3;">
<div id="header" style="z-index:5;background: #111;position: fixed;top: 0;padding: 8px 30px;left: 0;right: 0;height: 32px;">
<img alt="Bits" src="assets/logo.svg" style="width:32px;vertical-align: middle;">
- <span style="vertical-align: middle;">
- <a class="ln" style="cursor:pointer;margin-left:20px;" onclick="document.getElementById('create-modal').style.display = 'flex';">New transaction</a>
- <a class="ln" style="cursor:pointer;margin-left:20px;">Members</a>
- <a class="ln" style="cursor:pointer;margin-left:20px;">About</a>
+ <span style="vertical-align: middle;" id="menu-desktop">
+ <a class="ln" style="cursor:pointer;margin-left:20px;" onclick="document.getElementById('create-modal').style.display = isNodeJS ? 'flex' : '';">New transaction</a>
+ <a class="ln" onclick="document.getElementById('about-modal').style.display = isNodeJS ? 'flex' : '';" style="cursor:pointer;margin-left:20px;">About</a>
</span>
- <span style="float: right;margin-right: 10px;margin-top: 7px;opacity: .5;">
- <span id="balance-eur">%total_eur%</span>€, £<span id="balance-gbp">%total_gbp%</span> · <span id="username">%user%</span>
+ <span style="vertical-align: middle;display:none;" id="menu-mobile">
+ <a class="ln" style="cursor:pointer;margin-left:20px;" onclick="document.getElementById('create-modal').style.display = isNodeJS ? 'flex' : '';">Add</a>
+ <a class="ln" onclick="document.getElementById('about-modal').style.display = isNodeJS ? 'flex' : '';" style="cursor:pointer;margin-left:20px;">About</a>
+ </span>
+ <span style="float: right;margin-right: 10px;margin-top: 7px;" id="total-data">
+ <span id="balance" style="opacity: .5;">
+ <span id="balance-eur">%total_eur%</span>€, £<span id="balance-gbp">%total_gbp%</span>
+ </span>
+ <span id="username-desktop" style="opacity:.5;"> · <span id="username">%user%</span></span>
+ <span id="username-mobile" style="display:none;vertical-align: middle;"><img id="user-profile" alt="" style="border-radius: 999px;width: 32px;height: 32px;vertical-align: middle;position:relative;top:-6px;display:inline-block;margin-left:7px;" src=""></span>
</span>
</div>
- <div id="view" style="z-index:5;color:black;background:rgb(247, 249, 250);position:fixed;top:48px;left:0;right:0;bottom:0;">
- <div id="list" style="position: fixed;top: 48px;left: 0;bottom: 0;right:0;border-right: 1px solid rgba(0, 0, 0, .25);">
+ <script>
+ if (!isNodeJS) {
+ document.getElementById("menu-desktop").style.display = "none";
+ document.getElementById("menu-mobile").style.display = "";
+ document.getElementById("username-desktop").style.display = "none";
+ document.getElementById("username-mobile").style.display = "";
+ document.getElementById("header").style.padding = "8px";
+ document.getElementById("header").style.backgroundColor = "#000000";
+ document.getElementById("balance").style.position = "relative";
+ document.getElementById("balance").style.top = "-4px";
+ }
+ </script>
+ <div id="view" style="z-index:5;color:black;background:rgb(247, 249, 250);position:fixed;top:48px;left:0;right:0;bottom:64px;">
+ <div id="list" style="position: fixed;top: 48px;left: 0;bottom: 64px;right:0;border-right: 1px solid rgba(0, 0, 0, .25);">
<div id="demo-zone" style="display:none;">
<div class="transaction" data-transaction-id="%transactionId%" id="demo-transaction" style="padding:10px;border-bottom: 1px solid rgba(0, 0, 0, .25);display:grid;grid-template-columns: 48px 1fr;grid-column-gap: 15px;">
<div class="transaction-user" style="display:flex;align-items: center;justify-content: center;">
@@ -208,7 +268,7 @@
</div>
</div>
</div>
- <div id="transactions" style="overflow: scroll;height: calc(100vh - 48px);"></div>
+ <div id="transactions" style="overflow: scroll;height: 100%;"></div>
</div>
</div>
@@ -255,17 +315,99 @@ width:max-content;">
<button id="create-button-create" onclick="createTransaction();">Create</button>&nbsp;<button id="create-button-cancel" onclick="document.getElementById('create-modal').style.display = 'none';document.getElementById('create-action').value='+';document.getElementById('create-currency').value='£';document.getElementById('create-description').value='';document.getElementById('create-amount').value='';">Cancel</button>
</div>
</div></div>
- <div id="goal" style="
+
+ <div id="confirm-modal" style="
+ display: none;
+ position: fixed;
+ z-index: 999;
+ inset: 0;
+ background: rgba(0, 0, 0, .75);
+ backdrop-filter: blur(10px);
+ align-items: center;
+ justify-content: center;
+ color: black;
+"><div id="confirm-modal-inner" style="
+ background: whitesmoke;
+ width: 500px;
+ padding: 10px;
+ border-radius: 5px;
+ box-shadow: 0 0 20px rgba(0, 0, 0, .5);
+">
+ <h3 style="
+ margin: 0;
+ margin-bottom: 20px;
+ margin-left: -10px;
+ margin-right: -10px;
+ text-align: center;
+ margin-top: -10px;
+ padding: 10px;
+ background: rgba(0, 0, 0, .1);
+">Confirm action</h3>
+ <p id="confirm-text">Are you sure you want to do this?</p>
+ <div style="
+ display: block;
+ margin-top: 20px;
+ margin-left: auto;
+ margin-right: auto;
+width:max-content;">
+ <button id="confirm-button-ok" onclick="document.getElementById('confirm-button-cancel').disabled = true;document.getElementById('confirm-button-ok').disabled = true;confirmAction();">OK</button>&nbsp;<button id="confirm-button-cancel" onclick="document.getElementById('confirm-modal').style.display = 'none';">Cancel</button>
+ </div>
+ </div></div>
+
+
+ <div id="about-modal" style="
+ display: none;
position: fixed;
+ z-index: 999;
+ inset: 0;
background: rgba(0, 0, 0, .75);
+ backdrop-filter: blur(10px);
+ align-items: center;
+ justify-content: center;
+ color: black;
+"><div id="about-modal-inner" style="
+ background: whitesmoke;
+ width: 500px;
+ padding: 10px;
+ border-radius: 5px;
+ box-shadow: 0 0 20px rgba(0, 0, 0, .5);
+">
+ <h3 style="
+ margin: 0;
+ margin-bottom: 20px;
+ margin-left: -10px;
+ margin-right: -10px;
+ text-align: center;
+ margin-top: -10px;
+ padding: 10px;
+ background: rgba(0, 0, 0, .1);
+">About Bits</h3>
+ <div id="about-text">
+ <div style="font-weight: bold;text-align:center;margin-bottom:5px;">Bits</div>
+ <b>Server:</b> money-v1.equestria.dev<br>
+ <b>Platform:</b> <span id="about-platform"></span><script>document.getElementById("about-platform").innerText = isNodeJS ? "Desktop (Electron, NodeJS)" : "Android (Chrome, Android WebView)";</script><br>
+ <b>User Agent:</b> <span id="about-useragent"></span><script>document.getElementById("about-useragent").innerText = navigator.userAgent;</script></div>
+ <div style="
+ display: block;
+ margin-top: 20px;
+ margin-left: auto;
+ margin-right: auto;
+width:max-content;">
+ <button id="about-button-cancel" onclick="document.getElementById('about-modal').style.display = 'none';">Close</button>
+ </div>
+ </div></div>
+
+ <div id="goal" style="
+ position: fixed;
+ background: rgb(64, 64, 64);
bottom: 0;
left: 0;
right: 0;
padding: 10px;
- z-index: 9;
+ z-index: 2;
"><b id="goal-name">%goal%</b> <span style="
float: right;
-"><span id="goal-amount-eur">%goal_eur%</span>€, £<span id="goal-amount-gbp">%goal_gbp%</span> · <span id="goal-amount-percentage">%goal_percentage%</span>% completed</span><span style="
+"><span id="goal-amount-eur">%goal_eur%</span>€, £<span id="goal-amount-gbp">%goal_gbp%</span> · <span id="goal-amount-percentage">%goal_percentage%</span>% completed</span><span id="goal-bar" style="
display: block;
height: 16px;
margin-top: 10px;
@@ -274,10 +416,22 @@ width:max-content;">
"><span id="goal-bar-fill" style="
height: 16px;
background: linear-gradient(90deg, rgba(183,153,201,1) 0%, rgba(87,58,152,1) 25%, rgba(204,129,148,1) 50%, rgba(235,186,115,1) 75%, rgba(169,83,144,1) 100%);
- width: 0%;
+ width: 0;
display: block;
border-radius: 999px;
"></span></span></div>
</div>
+<script>
+ if (!isNodeJS) {
+ document.getElementById("create-modal-inner").style.borderRadius = "0";
+ document.getElementById("create-modal-inner").style.borderBottomLeftRadius = "5px";
+ document.getElementById("create-modal-inner").style.borderBottomRightRadius = "5px";
+ document.getElementById("create-modal-inner").style.width = "calc(100% - 30px)";
+ document.getElementById("confirm-modal-inner").style.borderRadius = "0";
+ document.getElementById("confirm-modal-inner").style.width = "calc(100% - 30px)";
+ document.getElementById("confirm-modal-inner").style.borderBottomLeftRadius = "5px";
+ document.getElementById("confirm-modal-inner").style.borderBottomRightRadius = "5px";
+ }
+</script>
</body>
</html> \ No newline at end of file
diff --git a/index.js b/index.js
index 360f3ca..2380604 100644
--- a/index.js
+++ b/index.js
@@ -59,7 +59,7 @@ ipcMain.on("login", () => {
loginWindow.show();
}
- if (url === "https://money.equestria.dev/Authentication/Success/") {
+ if (url === "https://money-v1.equestria.dev/Authentication/Success/" || url === "https://money-v2.equestria.dev/Authentication/Success/") {
clearInterval(authenticationCheckInterval);
global.authenticationSucceeded = true;
loginWindow.close();
© Floofi Systems, Some rights reserved. Powered by cgit.