manifest generator working, now on to the app

bin/webstatus-manifest-generator.js

@@ -1,104 +1,134 @@
 #!/usr/bin/env node
 
-'use strict';
+"use strict";
 
-const figlet = require('figlet');
+const figlet = require("figlet");
-const chalk = require('chalk');
+const chalk = require("chalk");
-const fs = require('fs');
+const fs = require("fs");
+const find = require("find");
+const pkg = require("../package.json");
+
+const warnSymbol = "⚠️";
+const headExplode = "🤯";
+const rightArrow = "➡️";
 
 function recFindByExt(base, ext, files, result) {
-    files = files || fs.readdirSync(base)
+    files = files || fs.readdirSync(base);
-    result = result || []
+    result = result || [];
 
-    files.forEach(
+    files.forEach(function(file) {
-        function (file) {
+        var newbase = path.join(base, file);
-            var newbase = path.join(base,file)
         if (fs.statSync(newbase).isDirectory()) {
-                result = recFindByExt(newbase,ext,fs.readdirSync(newbase),result)
+            result = recFindByExt(
+                newbase,
+                ext,
+                fs.readdirSync(newbase),
+                result
+            );
         } else {
-                if ( file.substr(-1*(ext.length+1)) == '.' + ext ) {
+            if (file.substr(-1 * (ext.length + 1)) == "." + ext) {
-                    result.push(newbase)
+                result.push(newbase);
             }
         }
-        }
+    });
-    )
+    return result;
-    return result
 }
 
 function pprint(obj) {
-    console.log("%o", obj)
+    console.log("%o", obj);
 }
 
 function outputManifest(path, fileList) {
     if (!fileList) {
-        l = []
+        l = [];
     }
     const output = {
-        version: 1,
+        $id: "berlin.sneak.ns.webstatus.manifest-v1",
-        '$id': 'berlin.sneak.ns.webstatus.manifest-v1',
         manifest: fileList
-    }
+    };
-    fs.writeFileSync(path + ".tmp", JSON.stringify(output))
+    fs.writeFileSync(path + ".tmp", JSON.stringify(output));
-    fs.renameSync(path + ".tmp", path)
+    fs.renameSync(path + ".tmp", path);
 }
 
 function main() {
-    const commander = require('commander');
+    const commander = require("commander");
     const program = new commander.Command();
-    program.version('0.0.1', '-v --version', 'output current version');
+    program.version(pkg.version, "-v --version", "output current version");
     program
-        .option('-s --source <directory>', 'directory to scan/write', '.')
+        .option("-s --source <directory>", "directory to scan/write", ".")
-        .option('-v --verbose', 'verbose output', false)
+        .option("-v --verbose", "verbose output", false)
-        .option('-q --quiet', 'no output', false)
+        .option("-q --quiet", "no output", false);
 
     program.parse(process.argv);
 
-    const print = (x) => {
+    const print = x => {
         if (program.quiet) {
-            return
+            return;
-        }
-        console.log(x)
         }
+        console.log(x);
+    };
 
-    const log = {}
+    const log = {};
 
-    log.info = (x) => {
+    log.info = x => {
-        print(chalk.blue(x))
+        print(rightArrow + chalk.blue("  " + x));
-    }
+    };
 
-    log.die = (x) => {
+    log.die = x => {
-        print(chalk.bold.red('error: ' + x))
+        print(warnSymbol + chalk.bold.red("  " + x));
-        print(chalk.bold.red('exiting.'))
+        print(headExplode);
-        process.exit(-1)
+        process.exit(-1);
-    }
+    };
 
-    log.huge = (x) => {
+    log.huge = x => {
         var f = figlet.textSync(x, {
-            font: 'Red Phoenix',
+            font: "Red Phoenix",
-            horizontalLayout: 'default',
+            horizontalLayout: "default",
-            verticalLayout: 'default'
+            verticalLayout: "default"
-        })
+        });
-        print(chalk.red(f))
+        print(chalk.red(f));
-    }
+    };
 
-    log.huge('webstatus')
+    log.huge("webstatus");
     //const dir = program.source
     //pprint(program)
     if (!fs.lstatSync(program.source).isDirectory()) {
-        log.die(`${program.source} is not a directory`)
+        log.die(`${program.source} is not a directory`);
     } else {
-        log.info(`scanning ${program.source} for images...`)
+        process.chdir(program.source);
+        program.source = process.cwd();
+        log.info(`scanning ${program.source} for images...`);
     }
 
-    var fileList = []
+    var fileList = [];
-    var manifestFilename = program.source + '/webstatus.manifest.json'
+    var manifestFilename = program.source + "/webstatus.manifest.json";
 
-    //FIXME scan for files
+    const matchRE = /\.(png|gif|jpg|jpeg|webp)$/i;
-    //
-    log.info(`writing ${fileList.length} entries to manifest ${manifestFilename}`)
-    outputManifest(manifestFilename, fileList)
 
-    log.die("unimplemented")
+    var candidateList = find.fileSync(matchRE, program.source);
+
+    candidateList.forEach(fn => {
+        var stat = fs.statSync(fn);
+        var prefix = new RegExp("^" + program.source + "/");
+        fn = fn.replace(prefix, "");
+        fileList.push({
+            // FIXME read image size from files so that
+            // renderer can scale them more intelligently
+            $id: "berlin.sneak.ns.webstatus.fileitem-v1",
+            path: fn,
+            mtime: stat.mtime
+        });
+    });
+    log.info(
+        `writing ${fileList.length} entries to manifest ${manifestFilename}`
+    );
+    try {
+        outputManifest(manifestFilename, fileList);
+    } catch (err) {
+        program.quiet = false;
+        log.die(`unable to write manifest: ${err}`);
+    }
+    log.info("success");
 }
 
 main();

package.json

@@ -23,7 +23,7 @@
         "build": "react-scripts build",
         "test": "react-scripts test",
         "eject": "react-scripts eject",
-    "fmt": "prettier -- --write bin/**/*.js src/**/*.js package.json"
+        "fmt": "prettier --write --tab-width 4 -- bin/**/*.js src/**/*.js package.json"
     },
     "eslintConfig": {
         "extends": "react-app"

src/WebStatus.js

@@ -1,25 +1,22 @@
-import React from 'react';
+import React from "react";
 //import logo from './logo.svg';
-import './WebStatus.css';
+import "./WebStatus.css";
 
 class WebStatusImage extends React.Component {
     render() {
-        return (
+        return <img className="webstatusimage" src={this.props.url} />;
-            <img className="webstatusimage" src={this.props.url} />
-        )
     }
 }
 
 class WebStatus extends React.Component {
     render() {
-
+        const currentImageUrl = "http://placekitten.com/3840/2160";
-        const currentImageUrl = "http://placekitten.com/3840/2160"
 
         return (
             <div className="webstatus">
                 <WebStatusImage url={currentImageUrl} />
             </div>
-        )
+        );
     }
 }
 

src/index.js

@@ -1,6 +1,6 @@
-import React from 'react';
+import React from "react";
-import ReactDOM from 'react-dom';
+import ReactDOM from "react-dom";
-import './index.css';
+import "./index.css";
-import WebStatus from './WebStatus';
+import WebStatus from "./WebStatus";
 
-ReactDOM.render(<WebStatus />, document.getElementById('root'));
+ReactDOM.render(<WebStatus />, document.getElementById("root"));

src/setupTests.js

@@ -2,4 +2,4 @@
 // allows you to do things like:
 // expect(element).toHaveTextContent(/react/i)
 // learn more: https://github.com/testing-library/jest-dom
-import '@testing-library/jest-dom/extend-expect';
+import "@testing-library/jest-dom/extend-expect";