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"], "resources": ["nostr.build.js", "popup.build.js"],
"matches": ["<all_urls>"] "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; font-family: system-ui;
} }
@media (prefers-color-scheme: dark) { .profiles label {
/* Dark Mode styles go here. */ 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> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<link rel="stylesheet" href="popup.css"> <link rel="stylesheet" href="popup.css">
<script defer src="popup.build.js"></script>
</head> </head>
<body> <body x-data="popup">
<form id="priv-key-form"> <div class="profiles">
<label for="profile">Profile</label> <label for="profile">Profile</label>
<select id="profile"> <select x-model="profile" name="profile" id="profile" @change="getPrivKeyForProfile()">
<option value="Default">Default</option> <template x-for="prof in profiles">
<option value="Next">Next</option> <option :value="prof" x-text="prof"></option>
</template>
</select> </select>
<br/> </div>
<div class="key">
<label for="priv-key">Private Key</label> <label for="priv-key">Private Key</label>
<input type="password" id="priv-key" name="priv-key" /> <input x-model="privKey" :type="visibleKey ? 'text' : 'password'">
<button type="submit">Save</button> </div>
</form>
<div class="buttons">
<script src="popup.build.js"></script> <button @click="visibleKey = !visibleKey" x-text="visibleKey ? 'Hide' : 'Show'"></button>
<button @click="saveKey()">Save</button>
</div>
</body> </body>
</html> </html>

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

@@ -1,23 +1,30 @@
async function savePrivateKey(event) { import Alpine from "alpinejs";
event.preventDefault(); window.Alpine = Alpine;
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'});
}
async function getPrivateKey() { Alpine.data('popup', () => ({
let key = await browser.storage.local.get("priv-key"); privKey: '',
return key["priv-key"]; profiles: [],
} profile: '',
visibleKey: false,
async function setPrivKeyInput() { async init() {
let privKey = await getPrivateKey(); await this.getProfiles();
await this.getPrivKeyForProfile();
},
if (privKey) { saveKey() {
document.getElementById("priv-key").value = privKey; 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", "version": "1.0.0",
"license": "ISC", "license": "ISC",
"dependencies": { "dependencies": {
"alpinejs": "^3.10.5",
"esbuild": "^0.16.17", "esbuild": "^0.16.17",
"nostr-tools": "^1.1.1" "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": { "node_modules/esbuild": {
"version": "0.16.17", "version": "0.16.17",
"resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.16.17.tgz", "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.16.17.tgz",

1
package.json
View File

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