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();