forked from cn-d/browser-painter
-
Notifications
You must be signed in to change notification settings - Fork 0
/
popup.js
70 lines (59 loc) · 2.22 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
function sendCommand(command, color, weight) {
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
chrome.tabs.sendMessage(tabs[0].id, {
drawConfig: {
color: color,
weight: weight
},
command: command
})
});
}
let selectedWeight = () => {
let weight = document.getElementById('weight');
return weight.value
}
let selectedColour = (colours) => {
let colour = colours.find(colour => colour.classList.contains('active'));
return colour.dataset.colour
}
document.addEventListener('DOMContentLoaded', () => {
const colours = Array.from(document.querySelectorAll('.colour-choice'));
const drawIcon = document.querySelector('#draw-button');
const clear = document.querySelector('#clear-button');
const stop = document.querySelector('#stop-button');
const slider = document.querySelector('#weight');
const weightValue = document.querySelector('#weight-value');
stop.addEventListener('click', () => {
let selColour = selectedColour(colours);
let selWeight = selectedWeight();
sendCommand('stop', selColour, selWeight);
})
clear.addEventListener('click', () => {
let selColour = selectedColour(colours);
let selWeight = selectedWeight();
sendCommand('clear', selColour, selWeight);
})
drawIcon.addEventListener('click', () => {
let selColour = selectedColour(colours);
let selWeight = selectedWeight();
sendCommand('updateConfig', selColour, selWeight);
})
colours.forEach((colour) => {
colour.addEventListener('click', () => {
colours.forEach((colour) => {
colour.classList.remove('active')
});
colour.classList.add('active')
let selColour = selectedColour(colours);
let selWeight = selectedWeight();
sendCommand('updateConfig', selColour, selWeight);
});
})
slider.addEventListener("input", function() {
let selColour = selectedColour(colours);
let selWeight = selectedWeight();
weightValue.innerHTML = selWeight
sendCommand('updateConfig', selColour, selWeight);
});
});