tyiu/nostash
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 2 Wiki Activity

alpine in popup. some logic is closer now, with visible changes

Browse Source
This commit is contained in:
Ryan Breen
2023-01-13 22:39:55 -05:00
parent d93fa1aacc
commit 6f7eafc296
6 changed files with 83 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
Shared (Extension)/Resources/manifest.json
View File

@@ -43,5 +43,9 @@
"resources": ["nostr.build.js", "popup.build.js"],
"matches": ["<all_urls>"]
}
]
],
"content_security_policy": {
"extension_pages": "script-src 'self' 'unsafe-eval'"
}
}

15
Shared (Extension)/Resources/popup.css
View File

@@ -9,6 +9,17 @@ body {
font-family: system-ui;
}
@media (prefers-color-scheme: dark) {
/* Dark Mode styles go here. */
.profiles label {
width: 80px;
display: inline-block;
}
.profiles {
margin-bottom: 15px;
}
.key {
margin-bottom: 15px;
}
/* @media (prefers-color-scheme: dark) {} */

28
Shared (Extension)/Resources/popup.html
View File

@@ -3,20 +3,26 @@
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="popup.css">
<script defer src="popup.build.js"></script>
</head>
<body>
<form id="priv-key-form">
<body x-data="popup">
<div class="profiles">
<label for="profile">Profile</label>
<select id="profile">
<option value="Default">Default</option>
<option value="Next">Next</option>
<select x-model="profile" name="profile" id="profile" @change="getPrivKeyForProfile()">
<template x-for="prof in profiles">
<option :value="prof" x-text="prof"></option>
</template>
</select>
<br/>
</div>
<div class="key">
<label for="priv-key">Private Key</label>
<input type="password" id="priv-key" name="priv-key" />
<button type="submit">Save</button>
</form>
<script src="popup.build.js"></script>
<input x-model="privKey" :type="visibleKey ? 'text' : 'password'">
</div>
<div class="buttons">
<button @click="visibleKey = !visibleKey" x-text="visibleKey ? 'Hide' : 'Show'"></button>
<button @click="saveKey()">Save</button>
</div>
</body>
</html>

43
Shared (Extension)/Resources/popup.js
View File

@@ -1,23 +1,30 @@
async function savePrivateKey(event) {
event.preventDefault();
let privKey = document.getElementById('priv-key');
browser.storage.local.set({ "priv-key": privKey.value });
console.log('setting private key');
await browser.runtime.sendMessage({greeting: 'hello'});
}
import Alpine from "alpinejs";
window.Alpine = Alpine;
async function getPrivateKey() {
let key = await browser.storage.local.get("priv-key");
return key["priv-key"];
}
Alpine.data('popup', () => ({
privKey: '',
profiles: [],
profile: '',
visibleKey: false,
async function setPrivKeyInput() {
let privKey = await getPrivateKey();
async init() {
await this.getProfiles();
await this.getPrivKeyForProfile();
},
if (privKey) {
document.getElementById("priv-key").value = privKey;
saveKey() {
console.log(`Saving key ${this.privKey}`);
},
async getProfiles() {
this.profiles = ['Default', 'Extra'];
this.profile = 'Default';
},
async getPrivKeyForProfile() {
this.privKey = this.profile;
}
}
}));
document.getElementById("priv-key-form").addEventListener("submit", savePrivateKey);
setPrivKeyInput();
Alpine.start();

22
package-lock.json generated
View File

@@ -9,6 +9,7 @@
"version": "1.0.0",
"license": "ISC",
"dependencies": {
"alpinejs": "^3.10.5",
"esbuild": "^0.16.17",
"nostr-tools": "^1.1.1"
}
@@ -423,6 +424,27 @@
}
]
},
"node_modules/@vue/reactivity": {
"version": "3.1.5",
"resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.1.5.tgz",
"integrity": "sha512-1tdfLmNjWG6t/CsPldh+foumYFo3cpyCHgBYQ34ylaMsJ+SNHQ1kApMIa8jN+i593zQuaw3AdWH0nJTARzCFhg==",
"dependencies": {
"@vue/shared": "3.1.5"
}
},
"node_modules/@vue/shared": {
"version": "3.1.5",
"resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.1.5.tgz",
"integrity": "sha512-oJ4F3TnvpXaQwZJNF3ZK+kLPHKarDmJjJ6jyzVNDKH9md1dptjC7lWR//jrGuLdek/U6iltWxqAnYOu8gCiOvA=="
},
"node_modules/alpinejs": {
"version": "3.10.5",
"resolved": "https://registry.npmjs.org/alpinejs/-/alpinejs-3.10.5.tgz",
"integrity": "sha512-qlvnal44Gof2XVfm/lef8fYpXKxR9fjdSki7aFB/9THyFvbsRKZ6lM5SjxXpIs7B0faJt7bgpK2K25gzrraXJw==",
"dependencies": {
"@vue/reactivity": "~3.1.1"
}
},
"node_modules/esbuild": {
"version": "0.16.17",
"resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.16.17.tgz",

1
package.json
View File

@@ -16,6 +16,7 @@
"author": "",
"license": "ISC",
"dependencies": {
"alpinejs": "^3.10.5",
"esbuild": "^0.16.17",
"nostr-tools": "^1.1.1"
}