| author | Alan Dipert
<alan@dipert.org> 2022-12-13 04:10:18 UTC |
| committer | Alan Dipert
<alan@dipert.org> 2022-12-13 04:10:18 UTC |
| parent | 97abb242f4a36ee56a384fc0d1fc38a039255776 |
| hntr2.css | +5 | -0 |
| hntr2.html | +6 | -5 |
| hntr2.mjs | +13 | -13 |
| hntr2.org | +3 | -0 |
| record.mjs | +10 | -8 |
diff --git a/hntr2.css b/hntr2.css index accd84d..7597e91 100644 --- a/hntr2.css +++ b/hntr2.css @@ -1,3 +1,8 @@ +table, th, td { + border: 1px solid black; + border-collapse: collapse; +} + input[type=text] { font-family: monospace; font-weight: bold; diff --git a/hntr2.html b/hntr2.html index 5e893ba..50e8666 100644 --- a/hntr2.html +++ b/hntr2.html @@ -1,8 +1,8 @@ -<html lang="en"> +<!doctype html> +<html> <head> - <meta charset="utf-8"> - <meta name="viewport" content="width=device-width"> - <title>hntr2</title> + <meta charset="UTF-8" /> + <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <script src="https://www.gstatic.com/firebasejs/8.6.7/firebase-app.js"></script> <script src="https://www.gstatic.com/firebasejs/8.6.7/firebase-auth.js"></script> <script src="https://www.gstatic.com/firebasejs/8.6.7/firebase-firestore.js"></script> @@ -20,7 +20,8 @@ <script src="https://cdn.rawgit.com/beautify-web/js-beautify/v1.12.0/js/lib/beautify.js"></script> <script src="randexp-0.4.0.min.js"></script> <script type="module" src="hntr2.mjs"></script> - <link rel="stylesheet" href="hntr2.css"> + <link href="hntr2.css" rel="stylesheet"> + <!-- <link href="https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css" rel="stylesheet"> --> </head> <body> </body> diff --git a/hntr2.mjs b/hntr2.mjs index 797cc48..abb67e6 100644 --- a/hntr2.mjs +++ b/hntr2.mjs @@ -27,35 +27,35 @@ function authed() { h.div( h.table( h.tr( - // h.th("Action"), h.th("Site"), h.th("Username"), h.th("Password"), h.th("Note") ), h.tr( - // h.td(h.input({ - // type: "button", - // value: "Add", - // onclick: () => { - // db.add(rec.asTuples(db.nextEid())); - // rec.clear(); - // } - // })), - ...rec.fieldNames.map(name => h.td(bindTo(h.input({type: "text"}), rec.get[name]))) + ...rec.fields.map(name => { + return h.td(bindTo(h.input({ + type: "text", + id: `input-${name}` + }), rec.get(name))) + }) ), h.tr( h.td( {colspan: 4}, - h.input({type: "button", value: "clr"}), - h.input({type: "button", value: "add"}), + h.button({onclick: () => rec.clear()}, "clr"), + h.button({onclick: () => { + db.add(rec.asTriples(db.nextEid())); + rec.clear(); + }}, "add"), h.input({type: "button", value: "genpw", onclick: () => { - rec.get["password"].set(new RandExp(regex.value).gen()); + rec.get("password").set(new RandExp(regex.value).gen()); }}), bindTo(h.input({type: "text", value: regex}), regex) ) ), entities(db, "_eid", "asc", attrs => { + return h.tr( // h.td(h.input({ // type: "button", diff --git a/hntr2.org b/hntr2.org new file mode 100644 index 0000000..e9e35d7 --- /dev/null +++ b/hntr2.org @@ -0,0 +1,3 @@ +AWS Amplify +AWS Incognito +Stripe Billing diff --git a/record.mjs b/record.mjs index 6443b40..e654524 100644 --- a/record.mjs +++ b/record.mjs @@ -2,19 +2,21 @@ import { input, transaction } from './reactives.mjs'; class Record { constructor(fields) { - this.fieldNames = fields; - this.fields = Object.fromEntries(fields.map(f => [f, input()])) - this.get = new Proxy({}, { - get: (obj, name) => this.fields[name] - }); + this.fields = fields; + this.inputs = Object.fromEntries(fields.map(f => [f, input()])) + } + get(k) { + if (this.fields.indexOf(k) === -1) + throw new Error(`Unknown field: ${k}`); + return this.inputs[k]; } clear() { transaction(() => { - Object.values(this.fields).forEach(c => c.set()); + Object.values(this.inputs).forEach(c => c.set()); }); } - asTuples(eid) { - return Object.entries(this.fields) + asTriples(eid) { + return Object.entries(this.inputs) .filter(([f, c]) => c.value) .map(([f, c]) => [eid, f, c.value]); }