diff --git a/proxy/ui.coffee b/proxy/ui.coffee
index 0146abc9a007acf9da7690ce11bef9b1bb408c9b..4148ea867a82786dc6e716a8f0764e7be7888c38 100644
--- a/proxy/ui.coffee
+++ b/proxy/ui.coffee
@@ -51,13 +51,26 @@ class DebugUI extends UI
class WebExtUI extends UI
port: null
+ stats: null
constructor: ->
+ @initStats()
chrome.runtime.onConnect.addListener @onConnect
+ initStats: ->
+ @stats = [0]
+ setInterval (() =>
+ @stats.unshift 0
+ @stats.splice 24
+ @postActive()
+ ), 60 * 60 * 1000
+
postActive: ->
@port?.postMessage
active: @active
+ total: @stats.reduce ((t, c) ->
+ t + c
+ ), 0
onConnect: (port) =>
@port = port
@@ -69,6 +82,7 @@ class WebExtUI extends UI
setActive: (connected) ->
super connected
+ if connected then @stats[0] += 1
@postActive()
chrome.browserAction.setIcon
path:
diff --git a/proxy/webext/popup.css b/proxy/webext/popup.css
index 8b3d5dc2b5da579a942a493f78e19f5e8b2540ba..dca805cd115e8fbe308787b51549d6f9517ecf60 100644
--- a/proxy/webext/popup.css
+++ b/proxy/webext/popup.css
@@ -5,6 +5,7 @@ body {
#active {
padding: 2em;
text-align: center;
+ min-width: 128px;
}
.learn {
diff --git a/proxy/webext/popup.html b/proxy/webext/popup.html
index 3619b6c7aeabda4e8d34712f6546d402acc9bb8d..6795b2e07bd4a59f6d7b6044ace38508800015da 100644
--- a/proxy/webext/popup.html
+++ b/proxy/webext/popup.html
@@ -8,7 +8,8 @@
<body>
<div id="active">
<img src="icons/status-off.png" />
- <p>Offline</p>
+ <p></p>
+ <p></p>
</div>
<div class="learn">
<a target="_blank" href="https://snowflake.torproject.org/">Learn more</a>
diff --git a/proxy/webext/popup.js b/proxy/webext/popup.js
index 9b68862ea28863c1e542c9271292bfe916918e7c..3869a5fe40d3b6b585d7b6cf2524b079d36d7777 100644
--- a/proxy/webext/popup.js
+++ b/proxy/webext/popup.js
@@ -7,6 +7,8 @@ port.onMessage.addListener((m) => {
const div = document.getElementById('active');
const img = div.querySelector('img');
img.src = `icons/status-${active ? "on" : "off"}.png`;
- const p = div.querySelector('p');
- p.innerText = active ? "Connected" : "Offline";
+ const ps = div.querySelectorAll('p');
+ const clients = active ? 1 : 0;
+ ps[0].innerText = `${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.`;
});