working api key settings
This commit is contained in:
60
package-lock.json
generated
60
package-lock.json
generated
@@ -859,16 +859,6 @@
|
||||
"to-fast-properties": "^2.0.0"
|
||||
}
|
||||
},
|
||||
"@nuxt/opencollective": {
|
||||
"version": "0.3.0",
|
||||
"resolved": "https://registry.npmjs.org/@nuxt/opencollective/-/opencollective-0.3.0.tgz",
|
||||
"integrity": "sha512-Vf09BxCdj1iT2IRqVwX5snaY2WCTkvM0O4cWWSO1ThCFuc4if0Q/nNwAgCxRU0FeYHJ7DdyMUNSdswCLKlVqeg==",
|
||||
"requires": {
|
||||
"chalk": "^2.4.2",
|
||||
"consola": "^2.10.1",
|
||||
"node-fetch": "^2.6.0"
|
||||
}
|
||||
},
|
||||
"@types/anymatch": {
|
||||
"version": "1.3.1",
|
||||
"resolved": "https://registry.npmjs.org/@types/anymatch/-/anymatch-1.3.1.tgz",
|
||||
@@ -1269,6 +1259,7 @@
|
||||
"version": "3.2.1",
|
||||
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
|
||||
"integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"color-convert": "^1.9.0"
|
||||
}
|
||||
@@ -1724,18 +1715,6 @@
|
||||
"resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.3.1.tgz",
|
||||
"integrity": "sha512-rXqOmH1VilAt2DyPzluTi2blhk17bO7ef+zLLPlWvG494pDxcM234pJ8wTc/6R40UWizAIIMgxjvxZg5kmsbag=="
|
||||
},
|
||||
"bootstrap-vue": {
|
||||
"version": "2.0.4",
|
||||
"resolved": "https://registry.npmjs.org/bootstrap-vue/-/bootstrap-vue-2.0.4.tgz",
|
||||
"integrity": "sha512-/5WXa3ir5uajcs7ze7jz7QXpYuJGWHjvJ8biMq0+e0IIIxw2jSdh4LsiFKD7C7qtgKre28hhXOfx79RmZX4wcQ==",
|
||||
"requires": {
|
||||
"@nuxt/opencollective": "^0.3.0",
|
||||
"bootstrap": ">=4.3.1 <5.0.0",
|
||||
"popper.js": "^1.15.0",
|
||||
"portal-vue": "^2.1.6",
|
||||
"vue-functional-data-merge": "^3.1.0"
|
||||
}
|
||||
},
|
||||
"brace-expansion": {
|
||||
"version": "1.1.11",
|
||||
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
|
||||
@@ -1981,6 +1960,7 @@
|
||||
"version": "2.4.2",
|
||||
"resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
|
||||
"integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"ansi-styles": "^3.2.1",
|
||||
"escape-string-regexp": "^1.0.5",
|
||||
@@ -2161,6 +2141,7 @@
|
||||
"version": "1.9.3",
|
||||
"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
|
||||
"integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"color-name": "1.1.3"
|
||||
}
|
||||
@@ -2168,7 +2149,8 @@
|
||||
"color-name": {
|
||||
"version": "1.1.3",
|
||||
"resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
|
||||
"integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU="
|
||||
"integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=",
|
||||
"dev": true
|
||||
},
|
||||
"colors": {
|
||||
"version": "1.4.0",
|
||||
@@ -2267,11 +2249,6 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"consola": {
|
||||
"version": "2.10.1",
|
||||
"resolved": "https://registry.npmjs.org/consola/-/consola-2.10.1.tgz",
|
||||
"integrity": "sha512-4sxpH6SGFYLADfUip4vuY65f/gEogrzJoniVhNUYkJHtng0l8ZjnDCqxxrSVRHOHwKxsy8Vm5ONZh1wOR3/l/w=="
|
||||
},
|
||||
"console-browserify": {
|
||||
"version": "1.2.0",
|
||||
"resolved": "https://registry.npmjs.org/console-browserify/-/console-browserify-1.2.0.tgz",
|
||||
@@ -2932,7 +2909,8 @@
|
||||
"escape-string-regexp": {
|
||||
"version": "1.0.5",
|
||||
"resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
|
||||
"integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ="
|
||||
"integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=",
|
||||
"dev": true
|
||||
},
|
||||
"eslint": {
|
||||
"version": "5.16.0",
|
||||
@@ -4591,7 +4569,8 @@
|
||||
"has-flag": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
|
||||
"integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0="
|
||||
"integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0=",
|
||||
"dev": true
|
||||
},
|
||||
"has-symbols": {
|
||||
"version": "1.0.0",
|
||||
@@ -5895,11 +5874,6 @@
|
||||
"integrity": "sha512-1nh45deeb5olNY7eX82BkPO7SSxR5SSYJiPTrTdFUVYwAl8CKMA5N9PjTYkHiRjisVcxcQ1HXdLhx2qxxJzLNQ==",
|
||||
"dev": true
|
||||
},
|
||||
"node-fetch": {
|
||||
"version": "2.6.0",
|
||||
"resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.0.tgz",
|
||||
"integrity": "sha512-8dG4H5ujfvFiqDmVu9fQ5bOHUC15JMjMY/Zumv26oOvvVJjM67KF8koCWIabKQ1GJIa9r2mMZscBq/TbdOcmNA=="
|
||||
},
|
||||
"node-gyp": {
|
||||
"version": "3.8.0",
|
||||
"resolved": "https://registry.npmjs.org/node-gyp/-/node-gyp-3.8.0.tgz",
|
||||
@@ -6547,16 +6521,6 @@
|
||||
"find-up": "^3.0.0"
|
||||
}
|
||||
},
|
||||
"popper.js": {
|
||||
"version": "1.16.0",
|
||||
"resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.0.tgz",
|
||||
"integrity": "sha512-+G+EkOPoE5S/zChTpmBSSDYmhXJ5PsW8eMhH8cP/CQHMFPBG/kC9Y5IIw6qNYgdJ+/COf0ddY2li28iHaZRSjw=="
|
||||
},
|
||||
"portal-vue": {
|
||||
"version": "2.1.6",
|
||||
"resolved": "https://registry.npmjs.org/portal-vue/-/portal-vue-2.1.6.tgz",
|
||||
"integrity": "sha512-lvCF85D4e8whd0nN32D8FqKwwkk7nYUI3Ku8UAEx4Z1reomu75dv5evRUTZNaj1EalxxWNXiNl0EHRq36fG8WA=="
|
||||
},
|
||||
"posix-character-classes": {
|
||||
"version": "0.1.1",
|
||||
"resolved": "https://registry.npmjs.org/posix-character-classes/-/posix-character-classes-0.1.1.tgz",
|
||||
@@ -7824,6 +7788,7 @@
|
||||
"version": "5.5.0",
|
||||
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
|
||||
"integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"has-flag": "^3.0.0"
|
||||
}
|
||||
@@ -8477,11 +8442,6 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"vue-functional-data-merge": {
|
||||
"version": "3.1.0",
|
||||
"resolved": "https://registry.npmjs.org/vue-functional-data-merge/-/vue-functional-data-merge-3.1.0.tgz",
|
||||
"integrity": "sha512-leT4kdJVQyeZNY1kmnS1xiUlQ9z1B/kdBFCILIjYYQDqZgLqCLa0UhjSSeRX6c3mUe6U5qYeM8LrEqkHJ1B4LA=="
|
||||
},
|
||||
"vue-hot-reload-api": {
|
||||
"version": "2.3.4",
|
||||
"resolved": "https://registry.npmjs.org/vue-hot-reload-api/-/vue-hot-reload-api-2.3.4.tgz",
|
||||
|
||||
@@ -16,7 +16,6 @@
|
||||
"dependencies": {
|
||||
"axios": "^0.19.0",
|
||||
"bootstrap": "^4.3.1",
|
||||
"bootstrap-vue": "^2.0.4",
|
||||
"vue": "^2.6.10"
|
||||
},
|
||||
"devDependencies": {
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
chrome.runtime.onInstalled.addListener(function() {
|
||||
var data = {
|
||||
apiKey: "the key",
|
||||
apiKey: null,
|
||||
groupings: []
|
||||
};
|
||||
|
||||
|
||||
@@ -1,6 +1,27 @@
|
||||
<template>
|
||||
<div class="fluid-container p-2">
|
||||
<h1>Pinboard Groupings</h1>
|
||||
<div class="app">
|
||||
<div class="fluid-container">
|
||||
<h1>Pinboard Groupings</h1>
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">API key</h5>
|
||||
<form @submit.prevent="save" class="form">
|
||||
<div class="input-group mb-2" v-if="!apiKey">
|
||||
<label class="sr-only" for="apiKey">Pinboard API Key</label>
|
||||
<input type="text" class="form-control" id="apiKey"
|
||||
v-model="form.apiKey"
|
||||
placeholder="Enter Pinboard API key">
|
||||
</div>
|
||||
<p class="card-text" v-else>
|
||||
{{ apiKey }}
|
||||
</p>
|
||||
<button type="submit" class="btn btn-primary btn-sm" v-if="!apiKey">save</button>
|
||||
<button type="button" class="btn btn-secondary btn-sm" @click.prevent="edit" v-else>edit</button>
|
||||
</form>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -8,8 +29,27 @@
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
apiKey: "bob",
|
||||
groupings: []
|
||||
apiKey: null,
|
||||
groupings: [],
|
||||
form: {
|
||||
apiKey: null
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
save(event) {
|
||||
var data = {
|
||||
apiKey: this.form.apiKey,
|
||||
groupings: this.groupings
|
||||
};
|
||||
chrome.storage.sync.set(data, () => {
|
||||
this.apiKey = data.apiKey;
|
||||
this.groupings = data.groupings;
|
||||
});
|
||||
},
|
||||
edit(event) {
|
||||
this.form.apiKey = this.apiKey;
|
||||
this.apiKey = null;
|
||||
}
|
||||
},
|
||||
created() {
|
||||
@@ -22,5 +62,10 @@ export default {
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import 'node_modules/bootstrap/scss/bootstrap';
|
||||
|
||||
.app {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
@@ -4,6 +4,5 @@ import App from './App'
|
||||
/* eslint-disable no-new */
|
||||
new Vue({
|
||||
el: '#app',
|
||||
|
||||
render: h => h(App)
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user