mirror of
https://github.com/kkapsner/CanvasBlocker
synced 2024-09-24 02:11:42 +02:00
Added options page for webextension.
This commit is contained in:
kkapsner
parent
59f5fc39e1
commit
6c3b27e7e4
@ -1 +0,0 @@
|
||||
{"locales": ["de-DE", "en-US"]}
|
||||
190
options/buildPrefInputs.js
Normal file
190
options/buildPrefInputs.js
Normal file
@ -0,0 +1,190 @@
|
||||
var table = document.createElement("table");
|
||||
table.className = "settings";
|
||||
document.body.appendChild(table);
|
||||
|
||||
[
|
||||
{
|
||||
"name": "whiteList",
|
||||
"title": "White list",
|
||||
"type": "string",
|
||||
"value": ""
|
||||
},
|
||||
{
|
||||
"name": "blackList",
|
||||
"title": "Black list",
|
||||
"type": "string",
|
||||
"value": ""
|
||||
},
|
||||
{
|
||||
"name": "blockMode",
|
||||
"title": "block mode",
|
||||
"type": "menulist",
|
||||
"value": "fakeReadout",
|
||||
"options": [
|
||||
{
|
||||
"value": "blockReadout",
|
||||
"label": "block readout API"
|
||||
},
|
||||
{
|
||||
"value": "fakeReadout",
|
||||
"label": "fake readout API"
|
||||
},
|
||||
{
|
||||
"value": "fakeInput",
|
||||
"label": "fake input API"
|
||||
},
|
||||
{
|
||||
"value": "askReadout",
|
||||
"label": "ask for readout API permission"
|
||||
},
|
||||
{
|
||||
"value": "",
|
||||
"label": ""
|
||||
},
|
||||
{
|
||||
"value": "blockEverything",
|
||||
"label": "block everything"
|
||||
},
|
||||
{
|
||||
"value": "block",
|
||||
"label": "allow only white list"
|
||||
},
|
||||
{
|
||||
"value": "ask",
|
||||
"label": "ask for permission"
|
||||
},
|
||||
{
|
||||
"value": "allow",
|
||||
"label": "block only black list"
|
||||
},
|
||||
{
|
||||
"value": "allowEverything",
|
||||
"label": "allow everything"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"name": "maxFakeSize",
|
||||
"title": "Maximal fake size",
|
||||
"type": "integer",
|
||||
"value": 0
|
||||
},
|
||||
{
|
||||
"name": "rng",
|
||||
"title": "Random number generator",
|
||||
"type": "menulist",
|
||||
"value": "nonPersistent",
|
||||
"options": [
|
||||
{
|
||||
"value": "nonPersistent",
|
||||
"label": "non persistent"
|
||||
},
|
||||
{
|
||||
"value": "persistent",
|
||||
"label": "persistent"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"name": "storePersistentRnd",
|
||||
"title": "Store persistent data",
|
||||
"type": "bool",
|
||||
"value": false
|
||||
},
|
||||
{
|
||||
"name": "clearPersistentRnd",
|
||||
"title": "Clear persistent random storage",
|
||||
"type": "control",
|
||||
"label": "Clear"
|
||||
},
|
||||
{
|
||||
"name": "askOnlyOnce",
|
||||
"title": "Ask only once",
|
||||
"type": "bool",
|
||||
"value": true
|
||||
},
|
||||
{
|
||||
"name": "showNotifications",
|
||||
"title": "Show notifications",
|
||||
"type": "bool",
|
||||
"value": true
|
||||
},
|
||||
{
|
||||
"name": "notificationDisplayTime",
|
||||
"title": "notification display time",
|
||||
"type": "integer",
|
||||
"value": 30
|
||||
},
|
||||
{
|
||||
"name": "ignoreList",
|
||||
"title": "Ignore list",
|
||||
"type": "string",
|
||||
"value": ""
|
||||
},
|
||||
{
|
||||
"name": "showCallingFile",
|
||||
"title": "Display calling file",
|
||||
"type": "bool",
|
||||
"value": false
|
||||
},
|
||||
{
|
||||
"name": "showCompleteCallingStack",
|
||||
"title": "Display complete calling stack",
|
||||
"type": "bool",
|
||||
"value": false
|
||||
},{
|
||||
"name": "enableStackList",
|
||||
"title": "Use file specific scoped white list",
|
||||
"type": "bool",
|
||||
"value": false
|
||||
},
|
||||
{
|
||||
"name": "stackList",
|
||||
"title": "File specific white list",
|
||||
"type": "string",
|
||||
"value": ""
|
||||
},
|
||||
{
|
||||
"name": "showReleaseNotes",
|
||||
"title": "Release notes",
|
||||
"type": "control",
|
||||
"label": "Show"
|
||||
}
|
||||
].forEach(function(pref){
|
||||
var html = '<td><span class="title">__MSG_' + pref.name + '_title__</span><div class="description">__MSG_' + pref.name + '_description__</div></td><td>';
|
||||
var inputAttributes = ' data-storage-name="' + pref.name + '" data-storage-type="' + pref.type + '" class="setting"'
|
||||
switch (pref.type){
|
||||
case "integer":
|
||||
html += '<input type="number"' + inputAttributes + ' value="' + pref.value + '">';
|
||||
break;
|
||||
case "string":
|
||||
html += '<input type="text"' + inputAttributes + ' value="' + pref.value + '">';
|
||||
break;
|
||||
case "bool":
|
||||
html += '<input type="checkbox"' + inputAttributes + (pref.value? ' checked="checked"': "") + '>';
|
||||
break;
|
||||
case "menulist":
|
||||
html += '<select' + inputAttributes + '>' +
|
||||
pref.options.map(function(option){
|
||||
if (option.value){
|
||||
return '<option value="' + option.value + '"' + (option.value === pref.value? " selected": "") + '>__MSG_' + pref.name + '_options.' + option.label + '__</option>';
|
||||
}
|
||||
else {
|
||||
return '<option disabled>----------------</option>';
|
||||
}
|
||||
}).join("") +
|
||||
'</select>';
|
||||
break;
|
||||
case "control":
|
||||
html += '<button' + inputAttributes + '">__MSG_' + pref.name + '_label__</button>';
|
||||
break;
|
||||
default:
|
||||
console.log("Unknown preference type: " + pref.type);
|
||||
}
|
||||
html += "</td>";
|
||||
var tr = document.createElement("tr");
|
||||
tr.className = "settingRow";
|
||||
tr.innerHTML = html;
|
||||
console.log(html);
|
||||
table.appendChild(tr);
|
||||
});
|
||||
23
options/options.css
Normal file
23
options/options.css
Normal file
@ -0,0 +1,23 @@
|
||||
.settings {
|
||||
table-layout: fixed;
|
||||
width: 100%;
|
||||
border-spacing: 0;
|
||||
}
|
||||
.settings * {
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.settings .settingRow td{
|
||||
padding: 0.5em 0;
|
||||
border-top: 1px solid #c1c1c1;
|
||||
}
|
||||
|
||||
.settings .settingRow .description {
|
||||
color: graytext;
|
||||
margin-inline-start: 2em;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
input[type=""], input[type="text"], input[type="number"], select {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
11
options/options.html
Normal file
11
options/options.html
Normal file
@ -0,0 +1,11 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>CanvasBlocker Settings</title>
|
||||
<link href="options.css" rel="stylesheet" type="text/css">
|
||||
</head>
|
||||
<body>
|
||||
<script src="buildPrefInputs.js"></script>
|
||||
<script src="options.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
68
options/options.js
Normal file
68
options/options.js
Normal file
@ -0,0 +1,68 @@
|
||||
(function(){
|
||||
function traverse(node, func){
|
||||
func(node);
|
||||
Array.from(node.childNodes).forEach(function(child){traverse(child, func);});
|
||||
}
|
||||
|
||||
// getting the translation of all the messages
|
||||
traverse(document.body, function(node){
|
||||
if (node.nodeType == 3){
|
||||
node.nodeValue = node.nodeValue.replace(/\b__MSG_(.+)__\b/g, function(m, key){
|
||||
try {
|
||||
return browser.i18n.getMessage(key);
|
||||
}
|
||||
catch (e){
|
||||
return "Unknown i18n key: " + key;
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
Array.from(document.querySelectorAll("input.setting, select.setting")).forEach(function(input){
|
||||
var storageName = input.dataset.storageName;
|
||||
browser.storage.local.get(storageName).then(function(value){
|
||||
// console.log(storageName, "got storage value", value);
|
||||
if (value.hasOwnProperty(storageName)){
|
||||
input.value = value[storageName];
|
||||
}
|
||||
});
|
||||
|
||||
input.addEventListener("change", function(){
|
||||
var value;
|
||||
if (this.type === "checkbox"){
|
||||
value = this.checked;
|
||||
}
|
||||
else {
|
||||
value = this.value;
|
||||
}
|
||||
var obj = {};
|
||||
obj[storageName] = value;
|
||||
browser.storage.local.set(obj);
|
||||
});
|
||||
});
|
||||
|
||||
var callbacks = {
|
||||
showReleaseNotes: function(){
|
||||
console.log("sdsdsdsd");
|
||||
window.open("../releaseNotes.txt", "_blank");
|
||||
},
|
||||
clearPersistentRnd: function(){
|
||||
browser.runtime.sendMessage({"canvasBlocker-clear-domain-rnd": true});
|
||||
browser.storage.local.set({persistentRndStorage: ""});
|
||||
}
|
||||
};
|
||||
Array.from(document.querySelectorAll("button.setting")).forEach(function(button){
|
||||
var storageName = button.dataset.storageName;
|
||||
button.addEventListener("click", function(){
|
||||
if (callbacks[storageName]){
|
||||
callbacks[storageName]();
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
browser.storage.onChanged.addListener(function(data){
|
||||
Object.keys(data).forEach(function(storageName){
|
||||
|
||||
});
|
||||
});
|
||||
}());
|
||||
@ -6,7 +6,7 @@ Version 0.4.0:
|
||||
-
|
||||
|
||||
fixes:
|
||||
-
|
||||
- ask mode did not work for input types
|
||||
|
||||
Version 0.3.8:
|
||||
changes:
|
||||
|
||||
Loading…
Reference in New Issue
Block a user