caching the data in global vars just a bit; more verbosity in case of errors;...

caching the data in global vars just a bit; more verbosity in case of errors; preparing for delta charts

caching the data in global vars just a bit; more verbosity in case of errors;...
caching the data in global vars just a bit; more verbosity in case of errors; preparing for delta charts
6e64e3d8 · Michał Woźniak · 05e028aa · 6e64e3d8 · 6e64e3d8
Commit 6e64e3d8 authored Mar 27, 2020 by Michał Woźniak
--- a/covid.js
+++ b/covid.js
 /*
- * yes, hard-coding. shoot me.
- * if you want to go fancy, you can use the getCountries() function below instead.
+ * available sites array and site-to-data mapping 
 */
 var sites = []
-
+var siteData = {}

 /*
 * get the global pandemic data
@@ -57,6 +56,16 @@ let getCovidData = () => {
 * (if all goes well, that is)
 */
 let getSiteCases = (site) => {
+    
+    // if we have the data, use that
+    if ( ( site in siteData )
+      && ( 'data' in siteData[site] )
+      && ( 'source_link' in siteData[site] ) 
+      && ( 'source_title' in siteData[site] ) ) {
+        console.log(`+-- using cached covid data for ${site}`)
+        return Promise.resolve(siteData[site]);
+    }
+    
    // snowflake templates are snowflake
    if (site === "China") {
        site = "Mainland China"
@@ -207,11 +216,27 @@ let getSiteCases = (site) => {
                gaps_filled = data
            }
            
-            return {
-                data: gaps_filled,
+            // calculate the deltas
+            with_deltas = gaps_filled.map((cur, i, d)=>{
+                    if (i==0) {
+                        cur.delta = 0;
+                    } else {
+                        cur.delta = cur.cases - d[i-1].cases
+                    }
+                    return cur;
+                })
+            
+            // we have everything
+            site_data = {
+                data: with_deltas,
                source_link: `https://en.wikipedia.org/?curid=${tdata.pageID}`,
                source_title: tdata.title
-            };
+            }
+            
+            // cache the cases data in case we need it later
+            siteData[site] = site_data
+            // return it
+            return site_data
        })
 }

@@ -222,11 +247,20 @@ let getSiteCases = (site) => {
 * returns a promise that resolves to integer (if all goes well)
 */
 let getSitePopulation = (site) => {
+    
+    // if we have the data, use that
+    if ( ( site in siteData )
+      && ( 'population' in siteData[site] ) ) {
+        console.log(`+-- using cached population data for ${site}`)
+        return Promise.resolve(siteData[site].population);
+    }
+    
    // snowflake site pages are snowflake
    if (site === "Georgia") {
        site = "Georgia (country)"
    }
    console.log(`+-- fetching population data for ${site}`)
+    
    return wtf
        .fetch(site)
        .then((doc)=>{
@@ -244,6 +278,10 @@ let getSitePopulation = (site) => {
            }
            console.log(`+-- got population data for ${site}:`
                    + `\n    population: ${population}`)
+            
+            // cache the population data in case we need it later
+            siteData[site].population = population
+            // return it
            return population
        })
 }
@@ -346,10 +384,12 @@ let selectSite = (e) => {
                        updateChartData(site, data, theSelect.siteNo)
                    })
                    .catch((e)=>{
+                        console.log(e)
                        siteData.innerHTML = `<div class="error">Something went wrong. Either a bug, or no data.</div>`
                    })
            })
            .catch((e)=>{
+                console.log(e)
                siteData.innerHTML = `<div class="error">Something went wrong. Either a bug, or no data.</div>`
            })
    }, 500)

--- a/index.html
+++ b/index.html
@@ -205,6 +205,11 @@
                color:black;
                box-shadow: 0px 0px 2px springgreen;
            }
+            .chart-config-group {
+                display:flex;
+                justify-content: center;
+                margin:0em 1em;
+            }
        </style>
    </head>
    <body>
@@ -230,10 +235,18 @@
        <div id="the-chart-container">
            <canvas id="the-chart"></canvas>
            <div class="chart-config-container">
-                <input type="radio" id="chart-type-logarithmic" name="chart-type" value="logarithmic" checked="checked"/>
-                <label for="chart-type-logarithmic">Logarithmic scale</label>
-                <input type="radio" id="chart-type-linear" value="linear" name="chart-type">
-                <label for="chart-type-linear">Linear scale</label>
+                <div class="chart-config-group">
+                    <input type="radio" id="chart-type-logarithmic" name="chart-type" value="logarithmic" checked="checked"/>
+                    <label for="chart-type-logarithmic">Logarithmic scale</label>
+                    <input type="radio" id="chart-type-linear" name="chart-type" value="linear">
+                    <label for="chart-type-linear">Linear scale</label>
+                </div>
+                <!--div class="chart-config-group">
+                    <input type="radio" id="chart-cases-cumulative" name="chart-cases" value="cumulative" checked="checked"/>
+                    <label for="chart-cases-cumulative">Cumulative cases</label>
+                    <input type="radio" id="chart-cases-new" name="chart-cases" value="new" >
+                    <label for="chart-cases-new">New cases</label>
+                </div-->
            </div>
        </div>
        <div id="disclaimers-container">