options UI for external source of matchers

This commit is contained in:
Nilesh 2020-08-01 02:49:43 +05:30
parent 0e44a6e2cc
commit af891cb527
4 changed files with 56 additions and 7 deletions

View File

@ -1,10 +1,12 @@
// document.body.style.border = "15px solid red";
/* TODO
- Pop-up should be dismissable
- Once dismissed, popup should not be shown. Use cookies or localStorage for this
- List of alternatives should be loaded from a user-specified external source. Can be modified via extension options.
- Pop-up should be formatted to look better
/*
TODO
- Pop-up should be formatted to look better.
- Pop-up should be dismissable (per URL / per domain).
- Once dismissed, popup should not be shown on the same url/domain. Use cookies or localStorage for this.
- List of alternatives should be loaded from a user-specified external source. Can be modified via options.html/options.js
- Since we're replacing innerHTML, we should protect against XSS attacks.
*/
BETTER_ALTERNATIVES = [

View File

@ -2,7 +2,7 @@
"name": "Better",
"version": "0.1",
"description": "Find better products & services than the one you're currently visiting",
"permissions": ["activeTab"],
"permissions": ["activeTab", "storage"],
"background": {
"scripts": ["background.js"],
"persistent": false
@ -13,5 +13,6 @@
"js": ["contentscript.js"]
}
],
"manifest_version": 2
"manifest_version": 2,
"options_page": "options.html"
}

38
options.html Normal file
View File

@ -0,0 +1,38 @@
<!DOCTYPE html>
<html>
<head>
<style>
body {
margin: 40px auto;
max-width:650px;
line-height:1.6;
font-size:18px;
color:#444;
padding:0 10px
}
h1,h2,h3 {
line-height:1.2
}
input[type=url] {
width: 100%;
padding: 12px 20px;
margin: 8px 0;
box-sizing: border-box;
}
button {
padding: 5px 5px;
font-size: 16px;
}
</style>
</head>
<body>
<div>
<h3>Choose a different source of suggestions!</h3>
<input id="betterSourceText" type="url" placeholder="https://github.com/nileshtrivedi/better/list.json" />
<button id="betterSourceSubmit" value="Save">Save</button>
</div>
</body>
<script src="options.js"></script>
</html>

8
options.js Normal file
View File

@ -0,0 +1,8 @@
let input = document.getElementById('betterSourceText');
let submit = document.getElementById('betterSourceSubmit');
submit.addEventListener('click', function() {
chrome.storage.sync.set({betterSource: input.value}, function() {
console.log('Set betterSource = ' + input.value);
})
});