Commit 60bb192e4fd7cd1d216e02babf4182c884bf1b29
Show days active
cel committed on 11/18/2019, 12:59:55 AMParent: a3b6e67a79ab15e9e37b77d0493be9a811e5862e
Files changed
index.html | changed |
index.html | ||
---|---|---|
@@ -18,8 +18,10 @@ | ||
18 | 18 … | </div> |
19 | 19 … | |
20 | 20 … | <div id="user-info" style="visibility:hidden"> |
21 | 21 … | <div>User: <a id="user-link"><code id="user-id"> </code></a></div> |
22 … | + <div>Days active: <ins id="days-active"> </ins></div> | |
23 … | + <div><ins id="first"> </ins> - <ins id="last"> </ins></div> | |
22 | 24 … | </div> |
23 | 25 … | |
24 | 26 … | <script> |
25 | 27 … | var feedBase = 'https://viewer.scuttlebot.io/' |
@@ -32,8 +34,11 @@ | ||
32 | 34 … | var userIdText = document.getElementById('user-id').firstChild |
33 | 35 … | var dayInfo = document.getElementById('day-info') |
34 | 36 … | var dayText = document.getElementById('day').firstChild |
35 | 37 … | var dayUsersText = document.getElementById('day-users').firstChild |
38 … | +var daysActiveText = document.getElementById('days-active').firstChild | |
39 … | +var firstText = document.getElementById('first').firstChild | |
40 … | +var lastText = document.getElementById('last').firstChild | |
36 | 41 … | |
37 | 42 … | var colors = { |
38 | 43 … | yellow: [255, 255, 0, 255], |
39 | 44 … | red: [255, 0, 0, 255], |
@@ -169,8 +174,33 @@ | ||
169 | 174 … | } |
170 | 175 … | return usersAtInterval[x] = count |
171 | 176 … | } |
172 | 177 … | |
178 … | +var extents = {} | |
179 … | +function getUserExtent(id) { | |
180 … | + var extent = extents[id] | |
181 … | + if (extent) return extent | |
182 … | + extent = extents[id] = { | |
183 … | + days: 0 | |
184 … | + } | |
185 … | + var color = idColors[id] | |
186 … | + if (color) { | |
187 … | + for (var x = 0; x < width; x++) { | |
188 … | + for (var y = height-1; y > 0; y--) { | |
189 … | + var c = getPixel(x, y) | |
190 … | + if (colorEquals(c, colors.bg)) break | |
191 … | + if (colorEquals(c, color)) { | |
192 … | + extent.days++ | |
193 … | + if (!extent.first) extent.first = x | |
194 … | + extent.last = x | |
195 … | + break | |
196 … | + } | |
197 … | + } | |
198 … | + } | |
199 … | + } | |
200 … | + return extent | |
201 … | +} | |
202 … | + | |
173 | 203 … | var hoverColor, hoverPoint |
174 | 204 … | var clickedColor, clickedPoint |
175 | 205 … | |
176 | 206 … | function highlight(point) { |
@@ -204,8 +234,12 @@ | ||
204 | 234 … | userInfo.style.visibility = 'hidden' |
205 | 235 … | } else { |
206 | 236 … | userIdText.nodeValue = id |
207 | 237 … | userLink.href = feedBase + encodeURIComponent(id) |
238 … | + var extent = getUserExtent(id) | |
239 … | + daysActiveText.nodeValue = extent.days | |
240 … | + firstText.nodeValue = dayStr(extent.first) | |
241 … | + lastText.nodeValue = dayStr(extent.last) | |
208 | 242 … | userInfo.style.visibility = 'visible' |
209 | 243 … | } |
210 | 244 … | |
211 | 245 … | ctx.putImageData(imgData, 0, 0) |
Built with git-ssb-web