From 68da9a962d50b68c6d2ac1023385f754fba839ad Mon Sep 17 00:00:00 2001 From: "Glitch (glitch-hello-node)" Date: Sun, 14 Nov 2021 16:26:33 +0000 Subject: [PATCH] =?UTF-8?q?=F0=9F=8C=8D=F0=9F=9A=89=20Checkpoint=20./publi?= =?UTF-8?q?c/index.js:1954897/158649?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- db.csv | 47 +++++++++++++++++++++++++++++++++++++++++++++++ public/index.js | 28 +++++++++++++++++----------- 2 files changed, 64 insertions(+), 11 deletions(-) diff --git a/db.csv b/db.csv index c67438b..57d8673 100644 --- a/db.csv +++ b/db.csv @@ -388,3 +388,50 @@ ECSW,1636906463056,5 ECSW,1636906476863,6 ECSW,1636906490469,4 ECSW,1636906504649,6 +ECSW,1636906540848,6 +ECSW,1636906554507,4 +ECSW,1636906600840,6 +ECSW,1636906614155,6 +ECSW,1636906629486,2 +ECSW,1636906642637,2 +ECSW,1636906655866,2 +ECSW,1636906669395,2 +ECSW,1636906682466,2 +ECSW,1636906695661,2 +ECSW,1636906709339,2 +ECSW,1636906722837,2 +ECSW,1636906736324,2 +ECSW,1636906749666,2 +ECSW,1636906762902,2 +ECSW,1636906776813,2 +ECSW,1636906790058,2 +ECSW,1636906803281,2 +ECSW,1636906816349,2 +ECSW,1636906829838,2 +ECSW,1636906843057,2 +ECSW,1636906856221,2 +ECSW,1636906870056,2 +ECSW,1636906883624,2 +ECSW,1636906897729,2 +ECSW,1636906911357,2 +ECSW,1636906924554,2 +ECSW,1636906937665,2 +ECSW,1636906950757,2 +ECSW,1636906964104,2 +ECSW,1636906977738,2 +ECSW,1636906991093,2 +ECSW,1636907005284,2 +ECSW,1636907018373,2 +ECSW,1636907031963,2 +ECSW,1636907045187,2 +ECSW,1636907059045,2 +ECSW,1636907072114,2 +ECSW,1636907085301,2 +ECSW,1636907098712,2 +ECSW,1636907112432,2 +ECSW,1636907125754,2 +ECSW,1636907138866,2 +ECSW,1636907151813,2 +ECSW,1636907165563,2 +ECSW,1636907179017,2 +ECSW,1636907193061,2 diff --git a/public/index.js b/public/index.js index f3b475c..6210779 100644 --- a/public/index.js +++ b/public/index.js @@ -35,6 +35,8 @@ const map = L.map('map', { maxZoom: 18 }).setView([32.98613, -96.75042], 18) +const INTERVAL = 10 * 60 * 1000 +const STEP = 2 * 60 * 1000 L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw', { maxZoom: 18, @@ -71,7 +73,7 @@ setTimeout(drawRegions, 60 * 1000) async function drawRegions() { const data = await getData() - const ecsw = data.filter(d => d.loc === 'ECSW' && Date.now() - d.time < 60 * 60 * 1000) + const ecsw = data.filter(d => d.loc === 'ECSW' && Date.now() - d.time < INTERVAL) console.log(ecsw) @@ -89,17 +91,15 @@ async function drawRegions() { console.log({current, max, min}) const color = red.interpolate(green, current / (max - min)) - console.log(color) - - buildings.ECSW.poly.setStyle({ color }) + buildings.ECSW.poly.setStyle({ color: color.asRgbCss() }) console.log({avg, current, delta, color}) } class Color { constructor(r, g, b) { - this.r = Math.ceil(0, Math.floor(255, r)) - this.g = Math.ceil(0, Math.floor(255, g)) - this.b = Math.ceil(0, Math.floor(255, b)) + this.r = Math.max(0, Math.min(255, r)) + this.g = Math.max(0, Math.min(255, g)) + this.b = Math.max(0, Math.min(255, b)) } asRgbCss() { return "rgb("+this.r+", "+this.g+", "+this.b+")" @@ -129,7 +129,7 @@ function lerp(v0, v1, x) { async function displayCard(id) { - const data = (await getData()).filter(d => d.loc === id && Date.now() - d.time < 60 * 60 * 1000) + const data = (await getData()).filter(d => d.loc === id && Date.now() - d.time < INTERVAL) const card = document.getElementById("card") await card.animate([ { transform: 'translateY(50px)', opacity: "0" }, @@ -152,6 +152,8 @@ async function displayCard(id) { // const green = new Color(0, 255, 0) // const color = red.interpolate(green, current / (max - min)) + console.log(delta) + const msg = Number.isNaN(delta) ? "No data..." : (busy ? "Busier than usual": "Not as busy :)") @@ -175,9 +177,8 @@ async function displayCard(id) { function updateChart(data) { const parsed = data.map(d => { - const TEN_MINUTES = 10 * 60 * 1000 // this is 0-5 - let ago = Math.floor((Date.now() - d.time) / TEN_MINUTES) + let ago = Math.floor((Date.now() - d.time) / STEP) // if (20 < ago) ago = 20 return {time: d.time, ago, count: d.count} }).reduce((acc, v) => { @@ -192,7 +193,12 @@ function updateChart(data) { }) const ctx = document.getElementById('myChart').getContext('2d') - const labels = ['Now', '10m ago', '20m ago', '30m ago', '40m ago', '50m ago'].reverse() + + const min = STEP / 1000 / 60 + + const labels = [ + 'Now', `${min}m ago`, `${min * 2}m ago`, `${min * 3}m ago`, `${min * 4}m ago`, `${min * 5}m ago` + ].reverse() new Chart(ctx, { type: 'line',