update screenshots

README.md

@@ -22,6 +22,6 @@ convert -delay 150 -loop 0 pbls.png pbls-roads.png pbls-vs-roads.gif
 
 ### Fetch Data
 ```bash
-./download-map.py Jersey_City_Bike_Network
+./download-map.py -f Jersey_City_Bike_Network
 ```
 See [`download-map.py`](./download-map.py).

screenshots.js

@@ -6,20 +6,35 @@ const { mkdirSync } = require("fs")
 
 const cwd = __dirname
 
+const DEFAULT_WIDTH = 800
+const DEFAULT_HEIGHT = 580
 const DEFAULT_INITIAL_LOAD_SELECTOR = '.leaflet-interactive'
 const DEFAULT_DOWNLOAD_SLEEP = 1000
 const DEFAULT_LOAD_TIMEOUT = 30000
+const DEFAULT_PRE_SCREENSHOT_SLEEP = 1500
 const options =
     program
         .option('-d, --download-sleep <ms>', `Sleep for this many milliseconds while waiting for file downloads; default: ${DEFAULT_DOWNLOAD_SLEEP}`)
-        .option('-h, --host <host or port>', 'Hostname to load screenshots from; numeric <port> is mapped to 127.0.0.1:<port>')
+        .option('-H, --host <host or port>', 'Hostname to load screenshots from; numeric <port> is mapped to 127.0.0.1:<port>')
         .option('-i, --include <regex>', 'Only generate screenshots whose name matches this regex')
         .option('-l, --load-timeout <ms>', `Sleep for this many milliseconds while waiting for initial "${DEFAULT_INITIAL_LOAD_SELECTOR}" selector; default: ${DEFAULT_LOAD_TIMEOUT}`)
+        .option('-p, --pre-screenshot-sleep <ms>', `Sleep for this many milliseconds before taking a screenshot; default: ${DEFAULT_PRE_SCREENSHOT_SLEEP}`)
+        .option('-w, --width <px>', `Width of the screenshot; default: ${DEFAULT_WIDTH}`)
+        .option('-h, --height <px>', `Height of the screenshot; default: ${DEFAULT_HEIGHT}`)
         .parse(process.argv)
         .opts()
 
+console.log("options:", options)
 let scheme
-let {host, include, downloadSleep: defaultDownloadSleep = DEFAULT_DOWNLOAD_SLEEP, loadTimeout: defaultLoadTimeout = DEFAULT_LOAD_TIMEOUT } = options
+let {
+    host,
+    include,
+    width: defaultWidth = DEFAULT_WIDTH,
+    height: defaultHeight = DEFAULT_HEIGHT,
+    downloadSleep: defaultDownloadSleep = DEFAULT_DOWNLOAD_SLEEP,
+    loadTimeout: defaultLoadTimeout = DEFAULT_LOAD_TIMEOUT,
+    preScreenshotSleep: defaultPreScreenshotSleep = DEFAULT_PRE_SCREENSHOT_SLEEP,
+} = options
 if (host) {
     scheme = 'http'
     if (host.match(/^\d+$/)) {
@@ -29,30 +44,39 @@ if (host) {
     host = 'map.bikejc.org'
     scheme = 'https'
 }
-console.log("host:", host, "includes:", include);
+console.log("host:", host, "includes:", include, "defaultPreScreenshotSleep:", defaultPreScreenshotSleep);
 
 (async () => {
     const dir = `${cwd}/public/screenshots`
     mkdirSync(dir, { recursive: true })
     const screens = {
-        'pbls': { query: '?ll=40.72_-74.068&z=14', width: 950, height: 1300, preScreenshotSleep: 500, },
-        'pbls-roads': { query: '?l=wbr&ll=40.72_-74.068&z=14', width: 950, height: 1300, preScreenshotSleep: 500, },
+        'pbls': { query: '?ll=40.72_-74.068&z=14', width: 950, height: 1300, },
+        'pbls-roads': { query: '?l=wbr&ll=40.72_-74.068&z=14', width: 950, height: 1300, },
     }
 
     const browser = await puppeteer.launch({ headless: 'new', });
     const page = await browser.newPage();
 
     const items = Array.from(Object.entries(screens))
-    for (let [ name, { query, width, height, selector, download, loadTimeout, downloadSleep, preScreenshotSleep } ] of items) {
+    for (let [
+        name,
+        item
+    ] of items) {
+        const {
+            query,
+            width = defaultWidth,
+            height = defaultHeight,
+            selector = DEFAULT_INITIAL_LOAD_SELECTOR,
+            download,
+            loadTimeout = defaultLoadTimeout,
+            downloadSleep = defaultDownloadSleep,
+            preScreenshotSleep = defaultPreScreenshotSleep,
+        } = item
+        console.log("item:", item)
         if (include && !name.match(include)) {
             console.log(`Skipping ${name}`)
-            continue
+            return
         }
-        width = width || 800
-        height = height || 580
-        loadTimeout = loadTimeout || defaultLoadTimeout
-        downloadSleep = downloadSleep || defaultDownloadSleep
-        selector = selector || DEFAULT_INITIAL_LOAD_SELECTOR
         const url = `${scheme}://${host}/${query}`
         const path = `${dir}/${name}.png`
         if (download) {
@@ -69,18 +93,19 @@ console.log("host:", host, "includes:", include);
         await page.setViewport({ width, height });
         console.log("setViewport")
         await page.waitForSelector(selector, { timeout: loadTimeout });
-        console.log("selector")
+        console.log(`found selector: ${selector}`)
         if (preScreenshotSleep) {
+            console.log("preScreenshotSleep:", preScreenshotSleep)
             await new Promise(r => setTimeout(r, preScreenshotSleep))
         }
         if (!download) {
+            console.log("screenshot:", path)
             await page.screenshot({path});
         } else {
-            console.log("sleep 1s")
+            console.log(`sleep ${downloadSleep / 1000}s`)
             await new Promise(r => setTimeout(r, downloadSleep))
             console.log("sleep done")
         }
     }
-
     await browser.close();
 })();