@ca-plant-list/ca-plant-list 0.2.17 → 0.3.0

package/lib/sitegenerator.js

@@ -0,0 +1,79 @@
+import { optimize } from "svgo";
+
+import { Config } from "./config.js";
+import { Files } from "./files.js";
+
+class SiteGenerator {
+    #baseDir;
+
+    constructor( baseDir ) {
+        this.#baseDir = baseDir;
+    }
+
+    copyIllustrations( flowerColors ) {
+        function createFlowerColorIcons( outputDir, flowerColors ) {
+            // Read generic input.
+            const inputFileName = Files.join( outputDir, "flower.svg" );
+            const srcSVG = Files.read( inputFileName );
+            for ( const color of flowerColors ) {
+                Files.write(
+                    Files.join( outputDir, "f-" + color.name + ".svg" ),
+                    srcSVG.replace( "#ff0", color.color )
+                );
+            }
+            // Delete input file.
+            Files.rmDir( inputFileName );
+        }
+
+        function optimizeSVG( outputDir ) {
+            const srcDir = Config.getPackageDir() + "/data/illustrations/inkscape";
+            const entries = Files.getDirEntries( srcDir );
+            for ( const entry of entries ) {
+                const srcFile = Files.join( srcDir, entry );
+                const srcSVG = Files.read( srcFile );
+                const result = optimize( srcSVG, {
+                    plugins: [
+                        {
+                            name: "preset-default",
+                            params: {
+                                overrides: {
+                                    // minifyStyles changes font-weight: normal to 400, which keeps it from being removed as a default.
+                                    // Disable it here and run it last.
+                                    minifyStyles: false,
+                                    removeViewBox: false,
+                                },
+                            },
+                        },
+                        "convertStyleToAttrs",
+                        {
+                            name: "removeAttrs",
+                            params: {
+                                attrs: "(style)",
+                            },
+                        },
+                        "removeDimensions",
+                        "minifyStyles",
+                    ],
+                    multipass: true,
+                } );
+                Files.write( Files.join( outputDir, entry ), result.data );
+            }
+        }
+
+        const outputDir = Files.join( this.#baseDir, "i" );
+        Files.mkdir( outputDir );
+
+        optimizeSVG( outputDir );
+        createFlowerColorIcons( outputDir, flowerColors );
+    }
+
+    getBaseDir() {
+        return this.#baseDir;
+    }
+
+    mkdir( path ) {
+        Files.mkdir( Files.join( this.#baseDir, path ) );
+    }
+}
+
+export { SiteGenerator };

package/lib/taxa.js

@@ -4,7 +4,14 @@ import { HTML } from "./html.js";
 import { CSV } from "./csv.js";
 import { RarePlants } from "./rareplants.js";
 
-const FLOWER_COLOR_NAMES = [ "white", "red", "pink", "orange", "yellow", "blue" ];
+const FLOWER_COLORS = [
+    { name: "white", color: "white" },
+    { name: "red", color: "red" },
+    { name: "pink", color: "pink" },
+    { name: "orange", color: "orange" },
+    { name: "yellow", color: "yellow" },
+    { name: "blue", color: "blue" },
+];
 
 const TAXA_LIST_COLS = {
     CESA: {
@@ -73,8 +80,8 @@ class Taxa {
 
         this.#errorLog = errorLog;
 
-        for ( const color of FLOWER_COLOR_NAMES ) {
-            this.#flower_colors[ color ] = new FlowerColor( color );
+        for ( const color of FLOWER_COLORS ) {
+            this.#flower_colors[ color.name ] = new FlowerColor( color.name );
         }
 
         const dataDir = Config.getPackageDir() + "/data";
@@ -130,6 +137,14 @@ class Taxa {
         return this.#flower_colors[ name ];
     }
 
+    static getFlowerColorNames() {
+        return FLOWER_COLORS.map( ( o ) => o.name );
+    }
+
+    static getFlowerColors() {
+        return FLOWER_COLORS;
+    }
+
     getTaxon( name ) {
         return this.#taxa[ name ];
     }
@@ -206,4 +221,4 @@ class Taxa {
 
 }
 
-export { FLOWER_COLOR_NAMES, Taxa, TAXA_LIST_COLS };
+export { Taxa, TAXA_LIST_COLS };

package/lib/taxaprocessor.js

@@ -11,10 +11,6 @@ class TaxaProcessor {
         this.#taxaLoaderClass = taxaLoaderClass;
     }
 
-    async customProcess() {
-        throw new Error( "must be implemented by subclass" );
-    }
-
     getErrorLog() {
         return this.#taxaLoader.getErrorLog();
     }
@@ -27,11 +23,11 @@ class TaxaProcessor {
         return this.#taxaLoader.getTaxa();
     }
 
-    async process() {
+    async process( commandRunner ) {
         console.log( "loading data" );
         this.#taxaLoader = new this.#taxaLoaderClass( this.#options );
         await this.#taxaLoader.load();
-        await this.customProcess();
+        await commandRunner( this );
         this.#taxaLoader.writeErrorLog();
     }
 

package/lib/web/glossarypages.js

@@ -1,49 +1,54 @@
 import { Files, HTML } from "@ca-plant-list/ca-plant-list";
 import { Glossary } from "../plants/glossary.js";
-import { Jekyll } from "../jekyll.js";
+import { Markdown } from "../markdown.js";
+
+const ENTRY_DIR = "g";
 
 class GlossaryPages {
 
-    #outputDir;
-    #entryDir;
+    #siteGenerator;
     #glossary;
 
-    constructor( outputDir ) {
-        this.#outputDir = outputDir;
-        this.#entryDir = outputDir + "/g";
+    constructor( siteGenerator ) {
+        this.#siteGenerator = siteGenerator;
         this.#glossary = new Glossary();
     }
 
     #generateEntryPage( entry ) {
-        const front = Jekyll.getFrontMatter( { title: entry.getTermName() } );
-        const markdown = entry.getMarkdown();
-        Files.write( this.#entryDir + "/" + entry.getTermName() + ".md", front + markdown );
+        const title = entry.getTermName();
+        let html = HTML.textElement( "h1", title );
+        html += HTML.wrap( "div", Markdown.strToHTML( entry.getMarkdown() ), { class: "glossary" } );
+        this.#siteGenerator.writeTemplate( html, { title: title }, Files.join( ENTRY_DIR, title + ".html" ) );
     }
 
     #generateEntryPages() {
+
+        // Make sure output directory exists.
+        this.#siteGenerator.mkdir( ENTRY_DIR );
+
         const entries = this.#glossary.getEntries();
         for ( const entry of entries ) {
             this.#generateEntryPage( entry );
         }
     }
 
-    #generateIncludeFile() {
-
+    #generateIndexPage() {
         const links = [];
         const entries = this.#glossary.getEntries();
         for ( const entry of entries ) {
-            links.push( HTML.getLink( "g/" + entry.getHTMLFileName(), entry.getTermName() ) );
+            links.push( HTML.getLink( Files.join( ENTRY_DIR, entry.getHTMLFileName() ), entry.getTermName() ) );
         }
+        let html = HTML.wrap( "h1", "Glossary" );
+        html += HTML.wrap( "ol", HTML.arrayToLI( links ) );
+        this.#siteGenerator.writeTemplate( html, { title: "Glossary" }, "glossary.html" );
+    }
 
-        Files.write( this.#outputDir + "/_includes/glossary.html", HTML.arrayToLI( links ), true );
-
+    getGlossary() {
+        return this.#glossary;
     }
 
     renderPages() {
-        // Make sure output directory exists.
-        Files.mkdir( this.#entryDir );
-
-        this.#generateIncludeFile();
+        this.#generateIndexPage();
         this.#generateEntryPages();
     }
 

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@ca-plant-list/ca-plant-list",
-    "version": "0.2.17",
+    "version": "0.3.0",
     "description": "Tools to create Jekyll files for a website listing plants in an area of California.",
     "license": "MIT",
     "repository": {
@@ -30,6 +30,7 @@
         "image-size": "^1.0.2",
         "markdown-it": "^13.0.1",
         "sharp": "^0.32.1",
+        "svgo": "^3.0.3",
         "unzipper": "^0.10.11"
     },
     "devDependencies": {
@@ -37,4 +38,4 @@
         "eslint": "^8.26.0",
         "typescript": "^4.9.3"
     }
-}
+}

package/scripts/build-ebook.js

@@ -29,14 +29,10 @@ class BookCommand extends CommandProcessor {
 
 }
 
-class BookGenerator extends TaxaProcessor {
-
-    async customProcess() {
-        const options = this.getOptions();
-        const ebook = new PlantBook( options.outputdir, new Config( options.datadir ), this.getTaxa() );
-        await ebook.create();
-    }
-
+async function commandRunner( tp ) {
+    const options = tp.getOptions();
+    const ebook = new PlantBook( options.outputdir, new Config( options.datadir ), tp.getTaxa() );
+    await ebook.create();
 }
 
 async function generateEBooks( options ) {
@@ -54,14 +50,14 @@ async function generateEBooks( options ) {
             if ( Files.isDir( path ) ) {
                 options.datadir = path;
                 options.outputdir = outputBase + suffix;
-                const gen = new BookGenerator( options );
-                await gen.process( options );
+                const gen = new TaxaProcessor( options );
+                await gen.process( commandRunner );
             }
         }
     } else {
         // Otherwise use the default directory.
-        const gen = new BookGenerator( options );
-        await gen.process( options );
+        const gen = new TaxaProcessor( options );
+        await gen.process( commandRunner );
     }
 
 }

package/scripts/build-site.js

@@ -52,4 +52,4 @@ async function generateSite( taxaProcessor ) {
 }
 
 const gen = new CommandAndTaxaProcessor( "ca-plant-list", "A tool to generate a website with local plant data.", generateSite );
-await gen.process();
+await gen.process( generateSite );

package/data/illustrations/optimized/asteraceae_floret.svg

@@ -1,28 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<!-- Created with Inkscape (http://www.inkscape.org/) -->
-<svg width="82.437mm" height="84.504mm" version="1.1" viewBox="0 0 82.437 84.504" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
- <defs>
-  <marker id="Triangle" overflow="visible" markerHeight="1" markerWidth="1" orient="auto-start-reverse" preserveAspectRatio="xMidYMid" viewBox="0 0 1 1">
-   <path transform="scale(.5)" d="m5.77 0-8.65 5v-10z" fill="context-stroke" fill-rule="evenodd" stroke="context-stroke" stroke-width="1pt"/>
-  </marker>
- </defs>
- <g transform="translate(-48.054 -6.5123)">
-  <g fill="#959595">
-   <path d="m79.276 37.945a8.4667 31.089 0 0 1 1.8353 33.88 8.4667 31.089 0 0 1-7.8222 19.191 8.4667 31.089 0 0 1-7.8222-19.191 8.4667 31.089 0 0 1 1.8353-33.88z"/>
-   <path d="m48.253 13.074 19.05 24.871" stroke="#888" stroke-width=".5"/>
-   <path id="path3" d="m98.326 13.074-19.05 24.871" fill="#959595" stroke="#888" stroke-width=".5"/>
-  </g>
-  <use transform="rotate(-17.226 77.257 49.068)" xlink:href="#path3"/>
-  <path d="m55.686 9.6812 13.798 28.126" fill="#959595" stroke="#888" stroke-width=".5"/>
-  <path d="m62.705 7.5473 8.2896 30.212" fill="#959595" stroke="#888" stroke-width=".5"/>
-  <use transform="rotate(-5.8666 77.05 56.397)" xlink:href="#path3"/>
-  <use transform="rotate(-27.32 76.391 49.027)" xlink:href="#path3"/>
-  <g>
-   <path d="m69.881 6.5376 3.171 31.167" fill="#959595" stroke="#888" stroke-width=".5"/>
-   <text x="114.47877" y="66.073151" fill="#050000" font-family="Arial" font-size="4.9389px" stroke="#020000" stroke-width="0" xml:space="preserve"><tspan x="114.47877" y="66.073151" fill="#050000" font-family="Arial" font-size="4.9389px" stroke="#020000" stroke-width="0">achene</tspan></text>
-   <text x="114.47877" y="28.502281" fill="#050000" font-family="Arial" font-size="4.9389px" stroke="#020000" stroke-width="0" xml:space="preserve"><tspan x="114.47877" y="28.502281" fill="#050000" font-family="Arial" font-size="4.9389px" stroke="#020000" stroke-width="0">pappus</tspan></text>
-   <path d="m88.996 65.009 20.886-0.12554" marker-start="url(#Triangle)" stroke="#000" stroke-width=".42043"/>
-   <path d="m90.584 27.967 20.886-0.12554" marker-start="url(#Triangle)" stroke="#000" stroke-width=".42043"/>
-  </g>
- </g>
-</svg>

package/data/illustrations/optimized/f-blue.svg

@@ -1,11 +0,0 @@
-<svg version="1.1" viewBox="0 0 30 30" xmlns="http://www.w3.org/2000/svg"
-    xmlns:xlink="http://www.w3.org/1999/xlink">
-    <ellipse id="a" cx="15" cy="15" rx="2.5" ry="15" fill="blue" stroke-width="0" />
-    <use xlink:href="#a" />
-    <use transform="rotate(30,15,15)" xlink:href="#a" />
-    <use transform="rotate(60,15,15)" xlink:href="#a" />
-    <use transform="rotate(90,15,15)" xlink:href="#a" />
-    <use transform="rotate(120,15,15)" xlink:href="#a" />
-    <use transform="rotate(150,15,15)" xlink:href="#a" />
-</svg>
-    

package/data/illustrations/optimized/f-orange.svg

@@ -1,11 +0,0 @@
-<svg version="1.1" viewBox="0 0 30 30" xmlns="http://www.w3.org/2000/svg"
-    xmlns:xlink="http://www.w3.org/1999/xlink">
-    <ellipse id="a" cx="15" cy="15" rx="2.5" ry="15" fill="orange" stroke-width="0" />
-    <use xlink:href="#a" />
-    <use transform="rotate(30,15,15)" xlink:href="#a" />
-    <use transform="rotate(60,15,15)" xlink:href="#a" />
-    <use transform="rotate(90,15,15)" xlink:href="#a" />
-    <use transform="rotate(120,15,15)" xlink:href="#a" />
-    <use transform="rotate(150,15,15)" xlink:href="#a" />
-</svg>
-    

package/data/illustrations/optimized/f-pink.svg

@@ -1,11 +0,0 @@
-<svg version="1.1" viewBox="0 0 30 30" xmlns="http://www.w3.org/2000/svg"
-    xmlns:xlink="http://www.w3.org/1999/xlink">
-    <ellipse id="a" cx="15" cy="15" rx="2.5" ry="15" fill="pink" stroke-width="0" />
-    <use xlink:href="#a" />
-    <use transform="rotate(30,15,15)" xlink:href="#a" />
-    <use transform="rotate(60,15,15)" xlink:href="#a" />
-    <use transform="rotate(90,15,15)" xlink:href="#a" />
-    <use transform="rotate(120,15,15)" xlink:href="#a" />
-    <use transform="rotate(150,15,15)" xlink:href="#a" />
-</svg>
-    

package/data/illustrations/optimized/f-red.svg

@@ -1,11 +0,0 @@
-<svg version="1.1" viewBox="0 0 30 30" xmlns="http://www.w3.org/2000/svg"
-    xmlns:xlink="http://www.w3.org/1999/xlink">
-    <ellipse id="a" cx="15" cy="15" rx="2.5" ry="15" fill="red" stroke-width="0" />
-    <use xlink:href="#a" />
-    <use transform="rotate(30,15,15)" xlink:href="#a" />
-    <use transform="rotate(60,15,15)" xlink:href="#a" />
-    <use transform="rotate(90,15,15)" xlink:href="#a" />
-    <use transform="rotate(120,15,15)" xlink:href="#a" />
-    <use transform="rotate(150,15,15)" xlink:href="#a" />
-</svg>
-    

package/data/illustrations/optimized/f-white.svg

@@ -1,11 +0,0 @@
-<svg version="1.1" viewBox="0 0 30 30" xmlns="http://www.w3.org/2000/svg"
-    xmlns:xlink="http://www.w3.org/1999/xlink">
-    <ellipse id="a" cx="15" cy="15" rx="2.5" ry="15" fill="white" stroke-width="0" />
-    <use xlink:href="#a" />
-    <use transform="rotate(30,15,15)" xlink:href="#a" />
-    <use transform="rotate(60,15,15)" xlink:href="#a" />
-    <use transform="rotate(90,15,15)" xlink:href="#a" />
-    <use transform="rotate(120,15,15)" xlink:href="#a" />
-    <use transform="rotate(150,15,15)" xlink:href="#a" />
-</svg>
-    

package/data/illustrations/optimized/f-yellow.svg

@@ -1,11 +0,0 @@
-<svg version="1.1" viewBox="0 0 30 30" xmlns="http://www.w3.org/2000/svg"
-    xmlns:xlink="http://www.w3.org/1999/xlink">
-    <ellipse id="a" cx="15" cy="15" rx="2.5" ry="15" fill="yellow" stroke-width="0" />
-    <use xlink:href="#a" />
-    <use transform="rotate(30,15,15)" xlink:href="#a" />
-    <use transform="rotate(60,15,15)" xlink:href="#a" />
-    <use transform="rotate(90,15,15)" xlink:href="#a" />
-    <use transform="rotate(120,15,15)" xlink:href="#a" />
-    <use transform="rotate(150,15,15)" xlink:href="#a" />
-</svg>
-    

package/data/illustrations/optimized/peduncle.svg

@@ -1,21 +0,0 @@
-<svg version="1.1" viewBox="0 0 102.55 60" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-<defs>
-<marker id="b" overflow="visible" markerHeight="1" markerWidth="1" orient="auto-start-reverse" preserveAspectRatio="xMidYMid" viewBox="0 0 1 1">
-<path transform="scale(.5)" d="m5.77 0-8.65 5v-10z" fill="context-stroke" fill-rule="evenodd" stroke="context-stroke" stroke-width="1pt"/>
-</marker>
-</defs>
-<path d="m15 60v-45" fill="#14140c" stroke="#160707"/>
-<use xlink:href="#a"/>
-<use transform="rotate(30,15,15)" xlink:href="#a"/>
-<use transform="rotate(60,15,15)" xlink:href="#a"/>
-<use transform="rotate(90,15,15)" xlink:href="#a"/>
-<use transform="rotate(120,15,15)" xlink:href="#a"/>
-<use transform="rotate(150,15,15)" xlink:href="#a"/>
-<ellipse id="a" cx="15" cy="15" rx="2.5" ry="15" fill="#ff0" stroke-width="0"/>
-<g fill="#14140c" stroke="#160707">
-<path d="m20 45h25" marker-start="url(#b)" stroke-width=".5"/>
-<text x="50" y="47.068359" font-family="Arial" font-size="8px" letter-spacing=".5px" opacity=".55843" stroke-width=".1" xml:space="preserve"><tspan x="50" y="47.068359" font-family="Arial" font-size="8px" letter-spacing=".5px" stroke-width=".1" style="font-variant-caps:normal;font-variant-east-asian:normal;font-variant-ligatures:normal;font-variant-numeric:normal">peduncle</tspan></text>
-<path d="m35 15h10" marker-start="url(#b)" stroke-width=".5"/>
-<text x="49.696735" y="17.068359" font-family="Arial" font-size="8px" letter-spacing=".5px" opacity=".55843" stroke-width=".1" xml:space="preserve"><tspan x="49.696735" y="17.068359" font-family="Arial" font-size="8px" letter-spacing=".5px" stroke-width=".1" style="font-variant-caps:normal;font-variant-east-asian:normal;font-variant-ligatures:normal;font-variant-numeric:normal">inflorescence</tspan></text>
-</g>
-</svg>

package/jekyll/glossary.md

@@ -1,5 +0,0 @@
----
-title: Glossary
----
-
-{%include glossary.html %}

package/lib/dataloader.js

@@ -1,46 +0,0 @@
-import { CSV } from "./csv.js";
-import { Taxa } from "./taxa.js";
-import { Files } from "./files.js";
-import { ErrorLog } from "./errorlog.js";
-
-class DataLoader {
-
-    static #errorLog = new ErrorLog();
-
-    static getErrorLog() {
-        return DataLoader.#errorLog;
-    }
-
-    static load( options ) {
-
-        function getIncludeList( dataDir ) {
-            // Read inclusion list.
-            const includeFileName = "taxa_include.csv";
-            const includeFilePath = dataDir + "/" + includeFileName;
-            if ( !Files.exists( includeFilePath ) ) {
-                console.log( includeFilePath + " not found; loading all taxa" );
-                return true;
-            }
-            const includeCSV = CSV.parseFile( dataDir, includeFileName );
-            const include = {};
-            for ( const row of includeCSV ) {
-                include[ row[ "taxon_name" ] ] = row;
-            }
-            return include;
-        }
-
-        const showFlowerErrors = options[ "show-flower-errors" ];
-
-        console.log( "loading data" );
-
-        return new Taxa( getIncludeList( options.datadir ), this.getErrorLog(), showFlowerErrors );
-
-    }
-
-    static writeErrorLog() {
-        DataLoader.#errorLog.write();
-    }
-
-}
-
-export { DataLoader };