archives/snowflake
2
0
Fork 0
mirror of https://gitlab.torproject.org/tpo/anti-censorship/pluggable-transports/snowflake.git synced 2025-10-13 20:11:19 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Cleanup popup onMessage handler

Browse source
This commit is contained in:
Arlo Breault 2019-07-05 07:22:20 +02:00
parent 6ab6e489f6
commit 453bf0611c
2 changed files with 50 additions and 24 deletions
Download patch file Download diff file Expand all files Collapse all files

4
proxy/webext/popup.html
View file

@ -11,8 +11,8 @@
<p></p> <p></p>
<p></p> <p></p>
</div> </div>
<div class="b toggle"> <div class="b button">
<label id=toggle>Turn On</label> <label id="toggle">Turn On</label>
<label class="switch"> <label class="switch">
<input id="enabled" type="checkbox" checked/> <input id="enabled" type="checkbox" checked/>
<span class="slider round"></span> <span class="slider round"></span>

70
proxy/webext/popup.js
View file

@ -2,36 +2,62 @@ const port = chrome.runtime.connect({
name: "popup" name: "popup"
}); });
class Popup {
constructor() {
this.div = document.getElementById('active');
this.ps = this.div.querySelectorAll('p');
this.img = this.div.querySelector('img');
}
setImgSrc(src) {
this.img.src = `icons/status-${src}.png`;
}
setStatusText(txt) {
this.ps[0].innerText = txt;
}
setStatusDesc(desc, color) {
this.ps[1].innerText = desc;
this.ps[1].style.color = color || 'black';
}
hideButton() {
document.querySelector('.button').style.display = 'none';
}
setChecked(checked) {
document.getElementById('enabled').checked = checked;
}
setToggleText(txt) {
document.getElementById('toggle').innerText = txt;
}
}
port.onMessage.addListener((m) => { port.onMessage.addListener((m) => {
const div = document.getElementById('active'); const { active, enabled, total, missingFeature } = m;
const ps = div.querySelectorAll('p'); const popup = new Popup();
if (m.missingFeature) {
div.querySelector('img').src = "icons/status-off.png"; if (missingFeature) {
ps[0].innerText = "Snowflake is off"; popup.setImgSrc('off');
ps[1].innerText = "WebRTC feature is not detected."; popup.setStatusText("Snowflake is off");
ps[1].style.color = 'firebrick'; popup.setStatusDesc("WebRTC feature is not detected.", 'firebrick');
document.querySelector('.toggle').style.display = 'none'; popup.hideButton();
return; return;
} }
const active = m.active;
const img = div.querySelector('img');
const enabled = m.enabled;
const clients = active ? 1 : 0; const clients = active ? 1 : 0;
const enabledText = document.getElementById('toggle');
if (enabled) { if (enabled) {
document.getElementById('enabled').checked = true; popup.setChecked(true);
enabledText.innerText = 'Turn Off'; popup.setToggleText('Turn Off');
ps[0].innerText = `${clients} client${(clients !== 1) ? 's' : ''} connected.`; popup.setStatusText(`${clients} client${(clients !== 1) ? 's' : ''} connected.`);
ps[1].innerText = `Your snowflake has helped ${m.total} user${(m.total !== 1) ? 's' : ''} circumvent censorship in the last 24 hours.`; popup.setStatusDesc(`Your snowflake has helped ${total} user${(total !== 1) ? 's' : ''} circumvent censorship in the last 24 hours.`);
} else { } else {
ps[0].innerText = "Snowflake is off"; popup.setChecked(false);
ps[1].innerText = ""; popup.setToggleText('Turn On');
document.getElementById('enabled').checked = false; popup.setStatusText("Snowflake is off");
enabledText.innerText = 'Turn On'; popup.setStatusDesc("");
} }
img.src = `icons/status-${active? "running" : enabled? "on" : "off"}.png`;
popup.setImgSrc(active ? "running" : enabled ? "on" : "off");
}); });
document.addEventListener('change', (event) => { document.addEventListener('change', (event) => {
port.postMessage({enabled: event.target.checked}); port.postMessage({ enabled: event.target.checked });
}) })