Initial commit

Signed-off-by: jojobyte <184880+jojobyte@users.noreply.github.com>

.gitignore

@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+public
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

.prettierignore

@@ -0,0 +1,6 @@
+# Files Prettier should not format
+**/*.log
+**/.DS_Store
+*.
+dist
+node_modules

.prettierrc.json

@@ -0,0 +1,9 @@
+{
+    "printWidth": 80,
+    "tabWidth": 2,
+    "singleQuote": true,
+    "bracketSpacing": true,
+    "proseWrap": "always",
+    "semi": false,
+    "trailingComma": "all"
+  }

LICENSE

@@ -0,0 +1,22 @@
+MIT License
+
+Copyright (c) 2022 jojobyte
+Copyright (c) 2022 Dash Incubator
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -0,0 +1,5 @@
+# CrowdNode UI
+### a Graphical User Interface (GUI) for [CrowdNode.js](https://github.com/dashhive/crowdnode.js) using Vanilla HTML, CSS & JS 
+
+Should meet the requirements from https://github.com/dashhive/crowdnode-ui/issues/1 & https://github.com/dashhive/crowdnode.js/issues/47
+

index.css

@@ -0,0 +1,216 @@
+
+:root {
+  color-scheme: light dark;
+  --c: #111; /* base interactive color */
+  --oc: #222; /* off interactive color */
+  --hc: #555; /* highlight color */
+  --d: #242424; /* base bg color */
+  --l: #eee; /* base color */
+  --bgc: var(--d);
+  --fc: var(--l);
+
+  --info: #0bf;
+  --note: #888;
+  --dang: #f55; /* danger */
+  --succ: #5b5; /* success */
+
+  --fb: -apple-system, BlinkMacSystemFont, Avenir, "Avenir Next",
+  "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans",
+  "Droid Sans", "Helvetica Neue", sans-serif;
+  --fm: "IBM Plex Mono", Consolas, "Andale Mono WT", "Andale Mono",
+  "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono",
+  "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco,
+  "Courier New", Courier, monospace;
+  font-family: var(--fb);
+  font-size: 16px;
+  line-height: 24px;
+  font-weight: 400;
+  font-synthesis: none;
+  text-rendering: optimizeLegibility;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-text-size-adjust: 100%;
+}
+
+* { box-sizing: border-box; }
+
+@media (prefers-color-scheme: light) {
+  html:not(.it),img,video { filter: invert(95%) hue-rotate(180deg); }
+}
+@media (prefers-color-scheme: dark) {
+  html.it,img,video { filter: invert(95%) hue-rotate(180deg); }
+}
+
+body {
+  background: var(--bgc);
+  color: var(--fc);
+  margin: 0;
+  display: flex;
+  flex-direction: column;
+  place-items: center;
+  min-width: 320px;
+  min-height: 100vh;
+}
+header {
+  margin: 0 auto;
+  padding: 0 2rem;
+  max-width: 1100px;
+  min-height: 85px;
+  width: 100%;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  flex-direction: column-reverse;
+}
+main {
+  margin: 0 auto;
+  padding: 0 2rem;
+  max-width: 1100px;
+  /* min-height: 70vh; */
+  width: 100%;
+}
+h1 { text-align: center; }
+main form {
+  display: flex;
+  margin: 0 auto 1rem;
+  gap: .5rem;
+}
+form fieldset { border: 0;
+  display: flex;
+  flex-direction: column;
+  min-width: 200px;
+  width: 100%;
+  justify-content: left;
+  gap: .5rem;
+}
+/* label { display: flex;
+  flex-direction: row;
+  min-width: 100px;
+} */
+button {
+  background-color: var(--oc);
+  color: var(--fc);
+  /* border-radius: 8px; */
+  border: 1px solid var(--fc);
+  padding: 0.8rem 1.2rem;
+  font-size: 1.1em;
+  font-weight: 500;
+  font-family: inherit;
+  cursor: pointer;
+  transition: border-color 0.25s;
+}
+button:disabled {
+  background-color: var(--d);
+  color: var(--note);
+  border-color: var(--note);
+  cursor: not-allowed;
+}
+button:not(:disabled):hover {
+  background-color: var(--c);
+  color: var(--info);
+  border-color: var(--info);
+}
+button:not(:disabled):focus,
+button:not(:disabled):focus-visible {
+  outline: 4px auto -webkit-focus-ring-color;
+}
+input, select {
+  background-color: var(--c);
+  color: var(--fc);
+  border: 1px solid var(--hc);
+  text-align: center;
+  line-height: 1;
+  font-size: 1.5rem;
+  width: 100%;
+  height: 3rem;
+  /* max-width: 24rem; */
+}
+table {
+  width: 100%;
+  table-layout: fixed;
+}
+table > tbody td {
+  padding: 1rem;
+  word-break: break-word;
+}
+table th:first-child,
+table td:first-child {
+  width: 120px;
+}
+a {
+  color: var(--info);
+  text-decoration: none;
+}
+a:hover {
+  color: var(--info);
+  text-decoration: dashed;
+  text-decoration-line: underline;
+}
+pre {
+  background-color: var(--c);
+  font-family: var(--fm);
+  font-size: 14px;
+  padding: 1rem;
+  max-width: 100%;
+  /* overflow: auto; */
+}
+pre code {
+  white-space: pre-line;
+}
+pre code > * {
+  display: inline;
+}
+pre code .dem {
+  color: var(--note);
+}
+pre code em {
+  color: var(--dang);
+  font-style: normal;
+}
+pre code address {
+  color: var(--succ);
+  font-style: normal;
+}
+pre code output {
+  color: var(--info);
+  font-style: italic;
+}
+form[name="network"] {
+  justify-content: center;
+}
+
+.hide {
+  display: none;
+}
+.row {
+  flex-direction: row;
+}
+.col {
+  flex-direction: column;
+}
+.msg {
+  display: flex;
+  flex-direction: column;
+}
+.center {
+  align-content: center;
+  justify-items: center;
+  text-align: center;
+}
+.center form {
+  width: 100%;
+  flex-direction: column;
+  margin-bottom: 0;
+}
+.center input {
+  max-width: initial;
+  line-height: 2;
+}
+@media (min-width: 650px) {
+  form {
+    max-width: 60%;
+  }
+  header {
+    flex-direction: row;
+  }
+}

index.html

@@ -0,0 +1,56 @@
+<!DOCTYPE html>
+<html lang="en" dir="ltr">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>CrowdNode.js UI</title>
+  <script>
+  if (localStorage.getItem('invert')){document.documentElement.classList.add('it')}
+  </script>
+  <link rel="stylesheet" type="text/css" media="screen" href="index.css">
+</head>
+<body>
+
+<main>
+  <h1>CrowdNode.js UI</h1>
+
+  <form name="privKeyForm">
+    <fieldset>
+      <input name="privateKey" placeholder="Ðash Private Key (WIF)" />
+      <button type="submit">Use or Generate Private Key</button>
+    </fieldset>
+  </form>
+
+  <form name="initCrowdNodeForm">
+    <fieldset>
+      <button type="submit" disabled>Initiate CrowdNode for Private Key</button>
+    </fieldset>
+  </form>
+
+  <form name="balanceForm">
+    <fieldset>
+      <!-- <input name="address" placeholder="Ðash CrowdNode Address" /> -->
+      <button type="submit" disabled>Get Balance</button>
+    </fieldset>
+  </form>
+
+  <p class="balance">Enter a valid Ðash address above to get the CrowdNode balance.</p>
+</main>
+
+<!-- <script src="./node_modules/dash/dist/dash.min.js"></script> -->
+<script src="https://unpkg.com/@root/request@1.x/urequest.js"></script>
+<script src="https://unpkg.com/dashsight@1.x/dashrequest.js"></script>
+<script src="https://unpkg.com/dashsight@1.x/dashsight.js"></script>
+<script src="https://unpkg.com/dashsight@1.x/dashsocket.js"></script>
+<script src="https://unpkg.com/@dashevo/dashcore-lib@0.19.x"></script>
+<script src="https://unpkg.com/@dashincubator/base58check/base58check.js"></script>
+<script src="https://unpkg.com/@dashincubator/secp256k1/secp256k1.js"></script>
+<script src="https://unpkg.com/@dashincubator/ripemd160/ripemd160.js"></script>
+<script src="https://unpkg.com/dashkeys/dashkeys.js"></script>
+<!-- <script src="https://unpkg.com/dashwallet@0.x/wallet.js"></script> -->
+<script src="https://unpkg.com/crowdnode@1.x/dashapi.js"></script>
+<script src="https://unpkg.com/crowdnode@1.x/crowdnode.js"></script>
+<script src="./utils.js" type="module" async></script>
+<script src="./main.js" type="module" async></script>
+</body>
+</html>

jsconfig.json

@@ -0,0 +1,41 @@
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "target": "esnext",
+    "module": "esnext",
+    "moduleResolution": "node",
+    "maxNodeModuleJsDepth": 20,
+    "allowSyntheticDefaultImports": true,
+    "lib": [
+      "DOM",
+      "DOM.Iterable",
+      "ESNext",
+      "WebWorker"
+    ],
+    "declaration": true,
+    "declarationDir": ".",
+    "declarationMap": true,
+    "allowJs": true,
+    "checkJs": true,
+    "noEmit": true,
+    "esModuleInterop": true,
+    // "forceConsistentCasingInFileNames": true,
+    // "strict": true,
+    // "strictNullChecks": true,
+    // "strictFunctionTypes": true,
+    // "noImplicitAny": true,
+    // "alwaysStrict": true,
+    "skipLibCheck": true,
+    // "types": ["bun-types"],
+    "types": ["node"],
+    "typeRoots": [
+      "typings",
+      "node_modules/@types",
+      // "node_modules/dash"
+    ]
+  },
+  "include": ["*.js", "bin/**/*.js", "lib/**/*.js", "src/**/*.js"],
+  "exclude": [
+    "node_modules"
+  ]
+}