/
popup.js
113 lines (98 loc) · 3.07 KB
/
popup.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
function setUrl() {
chrome.tabs.query({currentWindow: true, active: true}, function(tabs){
url = new URL(tabs[0].url)
document.getElementById('url').innerHTML = url.host;
document.getElementById('favicon').style.backgroundImage = "url(" + tabs[0].favIconUrl + ")";
});
}
function loadData() {
chrome.tabs.query({currentWindow: true, active: true}, function(tabs){
url = new URL(tabs[0].url)
chrome.storage.sync.get([url.host], function(result) {
if (result != undefined) {
document.getElementById('option-activate-wb').checked = result[url.host]["activated"];
document.getElementById('option-width-setting').value = result[url.host]["width"];
setSelectedMethod(result[url.host]["method"]);
setOverlay();
}
});
});
}
function writeData() {
chrome.tabs.query({currentWindow: true, active: true}, function(tabs){
url = new URL(tabs[0].url)
let obj = {};
obj[url.host] = {
"activated": document.getElementById('option-activate-wb').checked,
"width": Number(document.getElementById('option-width-setting').value),
"method": getSelectedMethod(),
};
chrome.storage.sync.set(obj)
});
}
function getSelectedMethod() {
var radios = document.getElementsByName('option-method');
for (var i = 0, length = radios.length; i < length; i++) {
if (radios[i].checked) {
return radios[i].value;
}
}
}
function setSelectedMethod(value) {
var radios = document.getElementsByName('option-method');
for (var i = 0, length = radios.length; i < length; i++) {
if (radios[i].value == value) {
radios[i].checked = true;
break;
}
}
}
function changeWidthSetting(diff) {
let currval = Number(document.getElementById('option-width-setting').value);
if (currval + diff >= 100) {
document.getElementById('option-width-setting').value = currval + diff;
} else {
document.getElementById('option-width-setting').value = 100;
}
}
function setOverlay() {
let wbActivated = document.getElementById('option-activate-wb').checked;
if (wbActivated) {
document.getElementById('options-wrapper-overlay').style.display = "none";
} else {
document.getElementById('options-wrapper-overlay').style.display = "initial";
}
}
function updatePage() {
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
chrome.tabs.sendMessage(tabs[0].id, {action: "update"}, function(response) {
var lastError = chrome.runtime.lastError;
if (lastError) {
// if message can not be sent, reload (happens directly after installation)
chrome.tabs.reload();
return;
}
});
});
}
function update() {
changeWidthSetting(0);
writeData();
updatePage();
setOverlay();
}
document.addEventListener('DOMContentLoaded', function() {
setUrl();
loadData();
document.getElementsByTagName('body')[0].addEventListener('change', function() {
update();
})
document.getElementById('option-decrease-width').addEventListener('click', function() {
changeWidthSetting(-100);
update();
})
document.getElementById('option-increase-width').addEventListener('click', function() {
changeWidthSetting(100);
update();
})
})