Bump to 1.6.1

config.xml

@@ -1,6 +1,6 @@
 <?xml version='1.0' encoding='utf-8'?>
-<widget id="com.netsyms.PackageHelper" version="1.3.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
-    <name>PackageHelper</name>
+<widget id="com.netsyms.PackageHelper" version="1.6.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
+    <name short="PH">PackageHelper</name>
     <description>
         Assistant app for door-to-door package delivery.
     </description>
@@ -19,6 +19,7 @@
     <access launch-external="yes" origin="geo:*" />
     <platform name="android">
         <allow-intent href="market:*" />
+        <preference name="HeaderColor" value="#2196F3" />
         <resource-file src="/res/android/drawable/ic_launcher_background.xml" target="/app/src/main/res/drawable/ic_launcher_background.xml" />
         <resource-file src="/res/android/drawable/ic_launcher_foreground.xml" target="/app/src/main/res/drawable/ic_launcher_foreground.xml" />
         <resource-file src="res/android/mipmap-anydpi-v26/ic_launcher.xml" target="app/src/main/res/mipmap-anydpi-v26/ic_launcher.xml" />

package.json

@@ -1,9 +1,16 @@
 {
   "name": "com.netsyms.packagehelper",
   "displayName": "PackageHelper",
-  "version": "1.3.0",
+  "version": "1.6.1",
   "description": "Assistant app for door-to-door package delivery.",
+  "product_string": "PackageHelper",
   "main": "www/index.html",
+  "window": {
+    "icon": "res/logo.png",
+    "id": "com.netsyms.packagehelper_window_main_00001",
+    "frame": true
+  },
+  "user_agent": "Mozilla/5.0 (%osinfo) %name/%ver NW.js/%nwver WebKit/%webkit_ver Chromium/%chromium_ver",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"
   },
@@ -19,19 +26,25 @@
       "cordova-plugin-powermanagement-netsyms": {},
       "cordova-plugin-whitelist": {},
       "phonegap-plugin-barcodescanner": {},
-      "cordova-plugin-device": {}
+      "cordova-plugin-device": {},
+      "cordova-plugin-battery-status": {},
+      "cordova-plugin-statusbar": {},
+      "cordova-plugin-headercolor": {}
     },
     "platforms": [
-      "android",
-      "browser"
+      "browser",
+      "android"
     ]
   },
   "dependencies": {
-    "cordova-android": "^8.1.0",
+    "cordova-android": "^9.0.0",
     "cordova-browser": "^6.0.0",
+    "cordova-plugin-battery-status": "^2.0.3",
     "cordova-plugin-device": "^2.0.3",
+    "cordova-plugin-headercolor": "^1.0.0",
     "cordova-plugin-inappbrowser": "^3.1.0",
     "cordova-plugin-powermanagement-netsyms": "git+https://source.netsyms.com/Netsyms/cordova-plugin-powermanagement",
+    "cordova-plugin-statusbar": "^2.4.3",
     "cordova-plugin-whitelist": "^1.3.4"
   },
   "devDependencies": {}

scripts/generate_credits.sh

@@ -1,4 +1,7 @@
 #!/bin/bash
+
+echo "Generating credits files..."
+
 cd www
 yarn licenses generate-disclaimer > ../license-credits.md
 cd ..

scripts/remove_bloat.sh

@@ -4,13 +4,15 @@
 
 echo "Removing bloat in node_modules..."
 
-pwd
+set -e
 
-cd www/node_modules
-rm -rf {ansicolors,buffer-from,cardinal,concat-stream,core-util-is,csscolorparser}
-rm -rf {dom7,earcut,esprima,geojson-vt,gl-matrix,grid-index,ieee754,inherits,isarray}
-rm -rf {kdbush,leaflet-geometryutil,@mapbox,minimist,murmurhash-js}
-rm -rf {path-to-regexp,pbf,potpack,process-nextick-args}
+DIR="$(pwd)/www/node_modules"
+
+cd $DIR
+rm -rf {ansicolors,buffer-from,cardinal,chartjs-color,chartjs-color-string,color-convert,color-name}
+rm -rf {concat-stream,core-util-is,csscolorparser,dom7,earcut,esprima,geojson-vt}
+rm -rf {gl-matrix,grid-index,ieee754,inherits,isarray,kdbush,leaflet-geometryutil,@mapbox,minimist}
+rm -rf {moment,murmurhash-js,path-to-regexp,pbf,potpack,process-nextick-args}
 rm -rf {protocol-buffers-schema,quickselect,readable-stream,redeyed,resolve-protobuf-schema}
 rm -rf {rw,safe-buffer,sharkdown,split,ssr-window,string_decoder,supercluster}
 rm -rf {template7,text-encoding,through,tinyqueue,ts-custom-error,typedarray}
@@ -19,11 +21,22 @@ rm -rf {util-deprecate,vt-pbf,wgs84}
 # Make npm stop complaining that these don't exist by actually removing them
 rm -rf .bin/*
 
+cd $DIR
+
+cd bwip-js
+rm -rf {bin,examples,src,barcode.ps,demo.html,stb_truetype.h}
+rm -rf dist/bwip-js.js
+rm -rf dist/node-bwipjs.js
+cd $DIR
+
+cd chart.js/dist
+rm -rf {Chart.bundle.js,Chart.css,Chart.min.js,Chart.js}
+cd $DIR
 
 cd @fortawesome/fontawesome-free
 rm -rf {js,less,metadata,scss,sprites,svgs}
 find css -type f -not -name 'all.min.css' -delete
-cd ../..
+cd $DIR
 
 cd framework7
 rm -rf components
@@ -35,52 +48,57 @@ rm -f framework7.*
 rm -f framework7-lite.*
 find css -type f -not -name 'framework7.bundle.min.css' -delete
 find js -type f -not -name 'framework7.bundle.min.js' -delete
-cd ..
+cd $DIR
 
 cd jquery
 rm -rf src
 rm -rf external
 find dist -type f -not -name 'jquery.min.js' -delete
-cd ..
+cd $DIR
 
 cd jsbarcode
 rm -rf .dockerignore .eslintignore .eslintrcautomation bower.json CONTRIBUTING.md docker-compose.yml Dockerfile example gulpfile.js jsbarcode.d.ts README.md src test .travis.yml
 rm -rf {automation,bin}
 rm -rf dist/barcodes
 rm -rf dist/JsBarcode.all.js
-cd ..
+cd $DIR
 
 cd leaflet
 rm -rf {CHANGELOG.md,src}
 find dist -type f -not -name 'leaflet.css' -not -name 'leaflet.js' -delete
-cd ..
+cd $DIR
 
 cd leaflet.locatecontrol
 rm -rf {CHANGELOG.md,README.md,src}
 find dist -type f -not -name 'L.Control.Locate.min.css' -not -name 'L.Control.Locate.min.js' -delete
-cd ..
+cd $DIR
 
 cd leaflet.markercluster
 rm -rf {build,example,spec,src,CHANGELOG.md}
 find dist -type f -not -name 'leaflet.markercluster.js' -not -name 'MarkerCluster.css' -not -name 'MarkerCluster.Default.css' -delete
-cd ..
+cd $DIR
 
 cd material-design-icons
 # Remove everything except the icon font and license, but also exclude the
 # current and parent folder (. , ..) so rm won't complain about refusing
 # to delete the whole filesystem
 find . -maxdepth 1 -not -name '.' -not -name 'LICENSE' -not -name 'iconfont' -exec rm -rf {} \;
-cd ..
+cd $DIR
 
 cd mapbox-gl
 rm -rf {build,flow-typed,src}
 find dist -type f -not -name 'mapbox-gl.css' -not -name 'mapbox-gl.js' -delete
 rm -rf dist/style-spec
-cd ..
+cd $DIR
+
+cd onscan.js
+find . -type f -not -name 'onscan.min.js' -delete
+rm -rf {.github,.settings}
+cd $DIR
 
 cd @zxing/library
 rm -rf {esm,esm5}
 rm -f umd/index.min.js.map
-cd ../..
+cd $DIR
 
 echo "Cleanup finished"

scripts/www_npm_install.sh

@@ -1,5 +1,7 @@
 #!/bin/bash
 
-cd www 
+echo "Installing node modules in www/..."
+
+cd www
 npm install
 cd ..

www/assets/css/app.css

@@ -19,6 +19,21 @@ Framework7 and FontAwesome both have a .fab class
     line-height: var(--f7-line-height);
 }
 
+.page-content-fab-pad {
+    padding-bottom: var(--f7-fab-size);
+}
+
+.navbar, .item-link .item-title, .item-media, .item-divider, .item-label, .fab, .button, .noselect {
+    user-select: none;
+}
+
+.navbar-inner {
+    -webkit-app-region: drag;
+}
+.navbar-inner > * {
+    -webkit-app-region: no-drag;
+}
+
 /*
  * Material icons are too big and disrupt the flow of text
  */
@@ -34,16 +49,64 @@ Framework7 and FontAwesome both have a .fab class
     font-size: var(--f7-block-font-size);
 }
 
-#mapbox .package-marker {
+#mapbox .package-marker.selected {
+    border: 4px solid #2196F3;
+    border-radius: 50%;
+}
+
+#mapbox .package-marker.alerted {
+    border: 4px solid #FF9800;
+    border-radius: 50%;
+}
+
+#mapbox .package-marker.selected.alerted {
+    border: 4px solid #4CAF50 !important;
+    border-radius: 50%;
+}
+
+#mapbox .package-marker-mapbox {
     width: 25px;
     height: 25px;
     background-image: url(../images/box.png);
     background-size: contain;
 }
 
+#mapbox .package-marker-leaflet {
+
+}
+
+#mapbox .package-marker-leaflet.selected {
+    /* Keep the icons from shifting when they have a border */
+    margin-top: -16.5px !important;
+    margin-left: -16.5px !important;
+}
+
 /* Allow tapping/clicking on package markers
  * when the location dot is overlapping them
  */
 #mapbox .mapboxgl-user-location-dot {
     pointer-events: none;
+}
+
+.no-animation * {
+    -webkit-transition: 10ms !important;
+    -moz-transition: 10ms !important;
+    -o-transition: 10ms !important;
+    -ms-transition: 10ms !important;
+    transition: 10ms !important;
+}
+
+/*
+ Allow easily changing help text to reflect finger/mouse usage.
+*/
+.clicktext {
+    display: none;
+}
+@media (pointer:fine) {
+    .taptext {
+        display: none;
+    }
+    .clicktext {
+        display: initial;
+    }
 }

www/assets/css/oled.css

@@ -9,8 +9,43 @@
  */
 
 :root #app.theme-dark {
-    --f7-page-bg-color: #020202;
-    --f7-list-bg-color: #020202;
-    --f7-popover-bg-color: #020202;
-    --f7-sheet-bg-color: #020202;
+    --f7-page-bg-color: #111;
+    --f7-list-bg-color: #111;
+    --f7-popover-bg-color: #111;
+    --f7-sheet-bg-color: #111;
+}
+
+#app.oled-burn-in .navbar .navbar-inner .title {
+    color: rgba(255,255,255,0.3);
+}
+
+#app.oled-burn-in .navbar .link {
+    color: rgba(100,100,255,0.5);
+}
+
+#app.oled-burn-in .navbar .link.text-color-red {
+    color: rgba(255,100,100,0.3) !important;
+}
+
+#app.oled-burn-in .mapboxgl-ctrl-group {
+    background: #222;
+}
+
+#app.oled-burn-in .mapboxgl-ctrl-group .mapboxgl-ctrl-icon {
+    filter: invert(69%) sepia(0%) saturate(28%) hue-rotate(215deg) brightness(88%) contrast(91%);
+}
+
+#app.oled-burn-in .mapboxgl-ctrl-scale {
+    background-color: #222;
+    color: #ccc;
+    border: 2px solid #333;
+    border-top: none;
+}
+
+#app.oled-burn-in .mapboxgl-ctrl-group .mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-active-error .mapboxgl-ctrl-icon {
+    filter: contrast(30%);
+}
+
+#app.oled-burn-in .mapboxgl-ctrl-group .mapboxgl-ctrl-geolocate.mapboxgl-ctrl-geolocate-active .mapboxgl-ctrl-icon {
+    filter: contrast(30%);
 }

www/assets/css/tablet.css

@@ -0,0 +1,89 @@
+/*
+This Source Code Form is subject to the terms of the Mozilla Public
+License, v. 2.0. If a copy of the MPL was not distributed with this
+file, You can obtain one at http://mozilla.org/MPL/2.0/.
+*/
+/*
+    Created on : Apr 3, 2020, 11:55:50 AM
+    Author     : Skylar Ittner
+*/
+
+.only-tablet {
+    display: none;
+}
+
+@media all and (min-width: 768px) {
+    .only-tablet {
+        display: inherit;
+    }
+    .no-tablet {
+        display: none;
+    }
+    .page[data-name="add"] .tabbar {
+        /* Remove tab switcher at bottom of page */
+        display: none;
+        height: 0;
+    }
+    .page[data-name="add"] .tabs {
+        /* Put tabs next to each other */
+        display: flex;
+    }
+    .page[data-name="add"] .tabs .tab {
+        /* un-hide "non-active" tabs */
+        display: block;
+    }
+    .page[data-name="add"] .tabs #add-tab {
+        width: 66.67% !important;
+        position: relative; /* Make the FAB stay where it should */
+    }
+    .page[data-name="add"] .tabs #history-tab {
+        width: 33.33% !important;
+    }
+    .page[data-name="add"] #history-empty-swipe-prompt {
+        display: none;
+    }
+    .page[data-name="add"] .page-content {
+        padding-top: 0;
+        padding-bottom: 0;
+    }
+
+    .elevation-tablet {
+        /* .elevation-3 */
+        box-shadow: var(--f7-elevation-3)!important;
+    }
+
+    .page[data-name="add"] #history-tab {
+        /*box-shadow: inset 5px 0 9px -5px rgba(0,0,0,0.3);*/
+        border-left: 1px solid rgba(0,0,0,0.1);
+    }
+
+    .page[data-name="add"] .fab {
+        margin-bottom: 0;
+    }
+
+    .sheet-backdrop.backdrop-in {
+        visibility: hidden;
+    }
+
+    #package-info-sheet {
+        left: 25%;
+        width: 50%;
+    }
+
+    .padding-bottom-tablet {
+        padding-bottom: 3rem !important;
+    }
+}
+
+@media all and (min-width: 768px) and (min-height: 700px) {
+    .margin-top-tablet {
+        margin-top: 1rem;
+    }
+}
+
+@media all and (min-width: 1024px) {
+    #package-info-sheet {
+        left: 33%;
+        width: 33%;
+    }
+}

www/assets/fonts/roboto/Roboto.css

@@ -0,0 +1,60 @@
+@font-face {
+    font-family: 'Roboto';
+    font-style: normal;
+    font-weight: 400;
+    src:
+        local('Roboto'),
+        local('Roboto-Regular'),
+        url('Roboto_400.woff') format('woff'),
+        url('Roboto_400.woff2') format('woff2');
+}
+@font-face {
+    font-family: 'Roboto';
+    font-style: italic;
+    font-weight: 400;
+    src:
+        local('Roboto Italic'),
+        local('Roboto-Italic'),
+        url('Roboto_400i.woff') format('woff'),
+        url('Roboto_400i.woff2') format('woff2');
+}
+@font-face {
+    font-family: 'Roboto';
+    font-style: normal;
+    font-weight: 500;
+    src:
+        local('Roboto Medium'),
+        local('Roboto-Medium'),
+        url('Roboto_500.woff') format('woff'),
+        url('Roboto_500.woff2') format('woff2');
+}
+@font-face {
+    font-family: 'Roboto';
+    font-style: italic;
+    font-weight: 500;
+    src:
+        local('Roboto Medium Italic'),
+        local('Roboto-MediumItalic'),
+        url('Roboto_500i.woff') format('woff'),
+        url('Roboto_500i.woff2') format('woff2');
+}
+@font-face {
+    font-family: 'Roboto';
+    font-style: normal;
+    font-weight: 700;
+    src:
+        local('Roboto Bold'),
+        local('Roboto-Bold'),
+        url('Roboto_700.woff') format('woff'),
+        url('Roboto_700.woff2') format('woff2');
+}
+@font-face {
+    font-family: 'Roboto';
+    font-style: italic;
+    font-weight: 700;
+    src:
+        local('Roboto Bold Italic'),
+        local('Roboto-BoldItalic'),
+        url('Roboto_700i.woff') format('woff'),
+        url('Roboto_700i.woff2') format('woff2');
+}

www/assets/iframeloading.html

@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<!--
+This Source Code Form is subject to the terms of the Mozilla Public
+License, v. 2.0. If a copy of the MPL was not distributed with this
+file, You can obtain one at http://mozilla.org/MPL/2.0/.
+-->
+<html>
+    <head>
+        <title>Loading</title>
+        <meta charset="UTF-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <style>
+            *,html,body {
+                background-color: #fff;
+                font-family: Roboto, Ubuntu, sans-serif;
+                text-align: center;
+            }
+            div {
+                margin-top: 1rem;
+            }
+        </style>
+    </head>
+    <body>
+        <div>Loading...</div>
+
+        <script src="../settings.js"></script>
+        <script>
+            window.location.href = SETTINGS.loginurl;
+        </script>
+    </body>
+</html>

www/assets/images/bgs/add.svg

@@ -0,0 +1,2 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="500" height="500" version="1.1" viewBox="0 0 132.29 132.29" xmlns="http://www.w3.org/2000/svg"><g transform="translate(0 -164.71)" fill-opacity=".49804"><rect y="164.71" width="132.29" height="132.29" fill="#4caf50"/><g fill="#43a047" stroke-width=".26458"><path d="m43.103 267.27h-9.4683v-9.4683c0-0.58125-0.47078-1.052-1.052-1.052h-2.1041c-0.58125 0-1.052 0.47079-1.052 1.052v9.4683h-9.4683c-0.58125 0-1.052 0.47079-1.052 1.052v2.1041c0 0.58125 0.47078 1.052 1.052 1.052h9.4683v9.4683c0 0.58125 0.47078 1.052 1.052 1.052h2.1041c0.58125 0 1.052-0.47078 1.052-1.052v-9.4683h9.4683c0.58125 0 1.052-0.47078 1.052-1.052v-2.1041c0-0.58125-0.47078-1.052-1.052-1.052z"/><path d="m113.14 196.62h-8.4761v-8.4761c0-0.52034-0.42145-0.9418-0.94179-0.9418h-1.8836c-0.52034 0-0.94179 0.42146-0.94179 0.9418v8.4761h-8.4761c-0.52034 0-0.94179 0.42145-0.94179 0.94179v1.8836c0 0.52034 0.42145 0.94179 0.94179 0.94179h8.4761v8.4761c0 0.52034 0.42145 0.94179 0.94179 0.94179h1.8836c0.52034 0 0.94179-0.42145 0.94179-0.94179v-8.4761h8.4761c0.52034 0 0.94179-0.42145 0.94179-0.94179v-1.8836c0-0.52034-0.42145-0.94179-0.94179-0.94179z"/><path d="m63.135 223.53h-8.8203v-8.8203c0-1.0823-0.87775-1.9601-1.9601-1.9601h-1.9601c-1.0823 0-1.9601 0.87774-1.9601 1.9601v8.8203h-8.8203c-1.0823 0-1.9601 0.87775-1.9601 1.9601v1.9601c0 1.0823 0.87775 1.9601 1.9601 1.9601h8.8203v8.8203c0 1.0823 0.87775 1.9601 1.9601 1.9601h1.9601c1.0823 0 1.9601-0.87775 1.9601-1.9601v-8.8203h8.8203c1.0823 0 1.9601-0.87776 1.9601-1.9601v-1.9601c0-1.0823-0.87775-1.9601-1.9601-1.9601z"/><path d="m98.241 241.28h-6.4917v-6.4917c0-0.39852-0.32278-0.72131-0.7213-0.72131h-1.4426c-0.39852 0-0.7213 0.32279-0.7213 0.72131v6.4917h-6.4917c-0.39852 0-0.7213 0.32278-0.7213 0.72131v1.4426c0 0.39852 0.32278 0.7213 0.7213 0.7213h6.4917v6.4918c0 0.39852 0.32278 0.7213 0.7213 0.7213h1.4426c0.39852 0 0.7213-0.32278 0.7213-0.7213v-6.4918h6.4917c0.39852 0 0.7213-0.32278 0.7213-0.7213v-1.4426c0-0.39853-0.32278-0.72131-0.7213-0.72131z"/><path d="m115.38 282.24h-6.755v-6.755c0-0.8289-0.67221-1.5011-1.5011-1.5011h-1.5011c-0.82889 0-1.5011 0.67221-1.5011 1.5011v6.755h-6.755c-0.82889 0-1.5011 0.67222-1.5011 1.5011v1.5011c0 0.82889 0.67221 1.5011 1.5011 1.5011h6.755v6.755c0 0.82889 0.67221 1.5011 1.5011 1.5011h1.5011c0.82889 0 1.5011-0.67221 1.5011-1.5011v-6.755h6.755c0.82889 0 1.5011-0.67222 1.5011-1.5011v-1.5011c0-0.82889-0.67221-1.5011-1.5011-1.5011z"/><path d="m38.898 183.83h-6.4917v-6.4917c0-0.39852-0.32278-0.72131-0.7213-0.72131h-1.4426c-0.39852 0-0.7213 0.32279-0.7213 0.72131v6.4917h-6.4917c-0.39852 0-0.7213 0.32278-0.7213 0.72131v1.4426c0 0.39852 0.32278 0.7213 0.7213 0.7213h6.4917v6.4918c0 0.39852 0.32278 0.7213 0.7213 0.7213h1.4426c0.39852 0 0.7213-0.32278 0.7213-0.7213v-6.4918h6.4917c0.39852 0 0.7213-0.32278 0.7213-0.7213v-1.4426c0-0.39853-0.32278-0.72131-0.7213-0.72131z"/></g></g></svg>

www/assets/images/bgs/inkscape/add.svg

@@ -0,0 +1,97 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="500"
+   height="500"
+   viewBox="0 0 132.29166 132.29167"
+   version="1.1"
+   id="svg8"
+   inkscape:version="0.92.3 (2405546, 2018-03-11)"
+   sodipodi:docname="add.svg">
+  <defs
+     id="defs2" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.7"
+     inkscape:cx="250.07653"
+     inkscape:cy="321.61508"
+     inkscape:document-units="px"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     units="px"
+     borderlayer="true"
+     inkscape:pagecheckerboard="true"
+     inkscape:window-width="1680"
+     inkscape:window-height="1021"
+     inkscape:window-x="1920"
+     inkscape:window-y="30"
+     inkscape:window-maximized="1" />
+  <metadata
+     id="metadata5">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-164.70831)">
+    <rect
+       style="opacity:1;fill:#4caf50;fill-opacity:0.49803922;stroke:none;stroke-width:1.26999998;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385"
+       id="rect836"
+       width="132.29167"
+       height="132.29166"
+       x="0"
+       y="164.7083" />
+    <path
+       id="path926"
+       d="m 43.103329,267.26948 h -9.468304 v -9.4683 c 0,-0.58125 -0.470785,-1.05204 -1.052033,-1.05204 h -2.104068 c -0.581249,0 -1.052034,0.47079 -1.052034,1.05204 v 9.4683 h -9.468303 c -0.581249,0 -1.052034,0.47079 -1.052034,1.05204 v 2.10406 c 0,0.58125 0.470785,1.05203 1.052034,1.05203 h 9.468303 v 9.46831 c 0,0.58125 0.470785,1.05203 1.052034,1.05203 h 2.104068 c 0.581248,0 1.052033,-0.47078 1.052033,-1.05203 v -9.46831 h 9.468304 c 0.581249,0 1.052033,-0.47078 1.052033,-1.05203 v -2.10406 c 0,-0.58125 -0.470784,-1.05204 -1.052033,-1.05204 z"
+       inkscape:connector-curvature="0"
+       style="fill:#43a047;fill-opacity:0.49803922;stroke-width:0.26458332" />
+    <path
+       style="fill:#43a047;fill-opacity:0.49803922;stroke-width:0.26458332"
+       inkscape:connector-curvature="0"
+       d="m 113.13917,196.61941 h -8.47611 v -8.47611 c 0,-0.52034 -0.42145,-0.9418 -0.94179,-0.9418 h -1.88359 c -0.52034,0 -0.94179,0.42146 -0.94179,0.9418 v 8.47611 h -8.476118 c -0.520339,0 -0.94179,0.42145 -0.94179,0.94179 v 1.88358 c 0,0.52034 0.421451,0.94179 0.94179,0.94179 h 8.476118 v 8.47612 c 0,0.52034 0.42145,0.94179 0.94179,0.94179 h 1.88359 c 0.52034,0 0.94179,-0.42145 0.94179,-0.94179 v -8.47612 h 8.47611 c 0.52034,0 0.94179,-0.42145 0.94179,-0.94179 v -1.88358 c 0,-0.52034 -0.42145,-0.94179 -0.94179,-0.94179 z"
+       id="path937" />
+    <path
+       id="path997"
+       d="m 63.135168,223.53312 h -8.820344 v -8.82034 c 0,-1.08233 -0.877748,-1.96007 -1.960077,-1.96007 h -1.960076 c -1.08233,0 -1.960077,0.87774 -1.960077,1.96007 v 8.82034 h -8.820343 c -1.08233,0 -1.960077,0.87775 -1.960077,1.96008 v 1.96007 c 0,1.08233 0.877747,1.96009 1.960077,1.96009 h 8.820343 v 8.82034 c 0,1.08232 0.877747,1.96007 1.960077,1.96007 h 1.960076 c 1.082329,0 1.960077,-0.87775 1.960077,-1.96007 v -8.82034 h 8.820344 c 1.082329,0 1.960075,-0.87776 1.960075,-1.96009 v -1.96007 c 0,-1.08233 -0.877746,-1.96008 -1.960075,-1.96008 z"
+       inkscape:connector-curvature="0"
+       style="fill:#43a047;fill-opacity:0.49803922;stroke-width:0.26458332" />
+    <path
+       style="fill:#43a047;fill-opacity:0.49803922;stroke-width:0.26458332"
+       inkscape:connector-curvature="0"
+       d="m 98.240607,241.28362 h -6.491742 v -6.49174 c 0,-0.39852 -0.322783,-0.72131 -0.721304,-0.72131 h -1.442609 c -0.398521,0 -0.721305,0.32279 -0.721305,0.72131 v 6.49174 h -6.491741 c -0.398521,0 -0.721305,0.32278 -0.721305,0.72131 v 1.4426 c 0,0.39852 0.322784,0.7213 0.721305,0.7213 h 6.491741 v 6.49175 c 0,0.39852 0.322784,0.7213 0.721305,0.7213 h 1.442609 c 0.398521,0 0.721304,-0.32278 0.721304,-0.7213 v -6.49175 h 6.491742 c 0.398521,0 0.721304,-0.32278 0.721304,-0.7213 v -1.4426 c 0,-0.39853 -0.322783,-0.72131 -0.721304,-0.72131 z"
+       id="path3110" />
+    <path
+       style="fill:#43a047;fill-opacity:0.49803922;stroke-width:0.26458332"
+       inkscape:connector-curvature="0"
+       d="m 115.37688,282.24092 h -6.75498 v -6.75496 c 0,-0.8289 -0.67221,-1.50111 -1.5011,-1.50111 h -1.50111 c -0.82889,0 -1.5011,0.67221 -1.5011,1.50111 v 6.75496 h -6.754975 c -0.828892,0 -1.501106,0.67222 -1.501106,1.50111 v 1.50111 c 0,0.82889 0.672214,1.50111 1.501106,1.50111 h 6.754975 v 6.75497 c 0,0.82889 0.67221,1.5011 1.5011,1.5011 h 1.50111 c 0.82889,0 1.5011,-0.67221 1.5011,-1.5011 v -6.75497 h 6.75498 c 0.82889,0 1.5011,-0.67222 1.5011,-1.50111 v -1.50111 c 0,-0.82889 -0.67221,-1.50111 -1.5011,-1.50111 z"
+       id="path3112" />
+    <path
+       id="path3114"
+       d="m 38.898346,183.83124 h -6.491742 v -6.49174 c 0,-0.39852 -0.322783,-0.72131 -0.721304,-0.72131 h -1.442609 c -0.398521,0 -0.721305,0.32279 -0.721305,0.72131 v 6.49174 h -6.491741 c -0.398521,0 -0.721305,0.32278 -0.721305,0.72131 v 1.4426 c 0,0.39852 0.322784,0.7213 0.721305,0.7213 h 6.491741 v 6.49175 c 0,0.39852 0.322784,0.7213 0.721305,0.7213 H 31.6853 c 0.398521,0 0.721304,-0.32278 0.721304,-0.7213 v -6.49175 h 6.491742 c 0.398521,0 0.721304,-0.32278 0.721304,-0.7213 v -1.4426 c 0,-0.39853 -0.322783,-0.72131 -0.721304,-0.72131 z"
+       inkscape:connector-curvature="0"
+       style="fill:#43a047;fill-opacity:0.49803922;stroke-width:0.26458332" />
+  </g>
+</svg>

www/assets/images/bgs/inkscape/list.svg

@@ -0,0 +1,121 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="500"
+   height="500"
+   viewBox="0 0 132.29166 132.29167"
+   version="1.1"
+   id="svg8"
+   inkscape:version="0.92.3 (2405546, 2018-03-11)"
+   sodipodi:docname="list.svg">
+  <defs
+     id="defs2" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="1.979899"
+     inkscape:cx="292.10204"
+     inkscape:cy="244.36683"
+     inkscape:document-units="px"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     units="px"
+     borderlayer="true"
+     inkscape:pagecheckerboard="true"
+     inkscape:window-width="1680"
+     inkscape:window-height="1021"
+     inkscape:window-x="1920"
+     inkscape:window-y="30"
+     inkscape:window-maximized="1" />
+  <metadata
+     id="metadata5">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-164.70831)">
+    <rect
+       style="opacity:1;fill:#2196f3;fill-opacity:0.49803922;stroke:none;stroke-width:1.26999998;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385"
+       id="rect836"
+       width="132.29167"
+       height="132.29166"
+       x="0"
+       y="164.7083" />
+    <rect
+       style="opacity:1;fill:#1976d2;fill-opacity:0.49803922;stroke:none;stroke-width:1.26999998;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385"
+       id="rect1385"
+       width="73.327377"
+       height="10.961308"
+       x="-0.7559486"
+       y="172.72136"
+       ry="1.349375"
+       rx="1.3229166" />
+    <rect
+       rx="1.3229166"
+       ry="1.349375"
+       y="193.88805"
+       x="-0.7559486"
+       height="10.961308"
+       width="73.327377"
+       id="rect1387"
+       style="opacity:1;fill:#1976d2;fill-opacity:0.49803922;stroke:none;stroke-width:1.26999998;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385" />
+    <rect
+       style="opacity:1;fill:#1976d2;fill-opacity:0.49803922;stroke:none;stroke-width:1.26999998;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385"
+       id="rect1389"
+       width="73.327377"
+       height="10.961308"
+       x="-0.7559486"
+       y="215.05473"
+       ry="1.349375"
+       rx="1.3229166" />
+    <rect
+       rx="1.3229166"
+       ry="1.349375"
+       y="236.22142"
+       x="-0.7559486"
+       height="10.961308"
+       width="73.327377"
+       id="rect1391"
+       style="opacity:1;fill:#1976d2;fill-opacity:0.49803922;stroke:none;stroke-width:1.26999998;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385" />
+    <rect
+       style="opacity:1;fill:#1976d2;fill-opacity:0.49803922;stroke:none;stroke-width:1.26999998;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385"
+       id="rect1393"
+       width="73.327377"
+       height="10.961308"
+       x="-0.7559486"
+       y="257.38812"
+       ry="1.349375"
+       rx="1.3229166" />
+    <rect
+       rx="1.3229166"
+       ry="1.349375"
+       y="278.55475"
+       x="-0.7559486"
+       height="10.961308"
+       width="73.327377"
+       id="rect1395"
+       style="opacity:1;fill:#1976d2;fill-opacity:0.49803922;stroke:none;stroke-width:1.26999998;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385" />
+  </g>
+</svg>

www/assets/images/bgs/inkscape/notes.svg

@@ -0,0 +1,90 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="500"
+   height="500"
+   viewBox="0 0 132.29166 132.29167"
+   version="1.1"
+   id="svg8"
+   inkscape:version="0.92.3 (2405546, 2018-03-11)"
+   sodipodi:docname="notes.svg">
+  <defs
+     id="defs2">
+    <style
+       id="style1751">.fa-secondary{opacity:.4}</style>
+  </defs>
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.7"
+     inkscape:cx="-56.578959"
+     inkscape:cy="244.30241"
+     inkscape:document-units="px"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     units="px"
+     borderlayer="true"
+     inkscape:pagecheckerboard="true"
+     inkscape:window-width="1920"
+     inkscape:window-height="1013"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1" />
+  <metadata
+     id="metadata5">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-164.70831)">
+    <rect
+       style="opacity:1;fill:#ffc107;fill-opacity:0.49803922;stroke:none;stroke-width:1.26999998;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385"
+       id="rect836"
+       width="132.29167"
+       height="132.29166"
+       x="0"
+       y="164.7083" />
+    <path
+       id="path2052"
+       d="m 53.962878,191.64389 -2.282353,-2.28143 c -1.117763,-1.1178 -2.927083,-1.11798 -4.045098,-4e-5 l -13.448847,13.36096 -1.041616,6.31369 c -0.113353,0.6871 0.481716,1.2823 1.168995,1.16899 l 6.313641,-1.04165 13.361892,-13.44885 c 1.115723,-1.11578 1.126358,-2.91874 -0.02665,-4.07167 z m -15.719584,9.67736 7.214701,-7.16793 3.73962,3.73963 -7.167873,7.2147 v -1.75242 h -2.033993 v -2.03398 z m -1.63194,6.61606 -1.197641,-1.19764 0.51443,-3.11823 0.779697,-0.77471 h 1.762414 v 2.034 h 2.033993 v 1.76237 l -0.774697,0.77974 z m 16.059429,-13.54016 -0.0023,0.002 -0.0023,0.002 -2.035258,2.04857 -3.730258,-3.73026 2.048565,-2.03526 0.0023,-0.002 0.0023,-0.002 c 0.387603,-0.38756 1.016065,-0.39235 1.408372,-4e-5 l 2.282048,2.28205 c 0.418587,0.41854 0.421175,1.04026 0.02664,1.43486 z"
+       inkscape:connector-curvature="0"
+       style="fill:#ffa000;fill-opacity:0.49803922;stroke-width:0.26458332" />
+    <path
+       id="path2161"
+       d="m 94.157277,212.40451 c -5.201424,0 -9.417004,3.4247 -9.417004,7.65131 0,1.82455 0.787202,3.49459 2.096755,4.80782 -0.459815,1.85397 -1.997436,3.50563 -2.015829,3.52403 -0.08093,0.0846 -0.102998,0.20967 -0.05518,0.32002 0.04782,0.11036 0.15082,0.17657 0.268532,0.17657 2.438857,0 4.26708,-1.16977 5.171996,-1.89075 1.20287,0.45245 2.53818,0.71363 3.95073,0.71363 5.20142,0 9.417003,-3.4247 9.417003,-7.65132 0,-4.22661 -4.215583,-7.65131 -9.417003,-7.65131 z"
+       inkscape:connector-curvature="0"
+       style="fill:#ffa000;fill-opacity:0.49803922;stroke-width:0.26458332" />
+    <path
+       id="path2231"
+       d="m 88.388848,268.5164 a 4.649108,4.649108 0 0 0 -4.649107,4.64911 v 6.71537 a 1.0331351,1.0331351 0 0 0 1.033136,1.03314 h 8.265081 v -7.74851 a 4.649108,4.649108 0 0 0 -4.64911,-4.64911 z m 2.58284,5.68224 a 0.51656756,0.51656756 0 0 1 -0.516568,0.51657 h -4.132542 a 0.51656756,0.51656756 0 0 1 -0.516567,-0.51657 v -1.03313 a 0.51656756,0.51656756 0 0 1 0.516567,-0.51657 h 4.132542 a 0.51656756,0.51656756 0 0 1 0.516568,0.51657 z m 6.715373,-5.68224 h -6.041578 c 1.46447,1.02894 2.425608,2.72748 2.425608,4.64911 v 7.74851 h 7.231959 a 1.0331351,1.0331351 0 0 0 1.03313,-1.03314 v -6.71537 a 4.649108,4.649108 0 0 0 -4.649119,-4.64911 z m 2.582849,6.71538 a 0.51656756,0.51656756 0 0 1 -0.516575,0.51656 h -1.03313 a 0.51656756,0.51656756 0 0 1 -0.516574,-0.51656 v -1.5497 h -1.80799 a 0.25828377,0.25828377 0 0 1 -0.25828,-0.25829 v -0.51657 a 0.25828377,0.25828377 0 0 1 0.25828,-0.25828 h 3.357694 a 0.51656756,0.51656756 0 0 1 0.516575,0.51657 z"
+       inkscape:connector-curvature="0"
+       style="fill:#ffa000;fill-opacity:0.49803922;stroke-width:0.26458332" />
+    <path
+       id="path4604"
+       d="m 37.797624,247.63629 c -5.762917,0 -10.432145,4.66922 -10.432145,10.43213 0,5.76292 4.669228,10.43215 10.432145,10.43215 5.762916,0 10.432139,-4.66923 10.432139,-10.43215 0,-5.76291 -4.669223,-10.43213 -10.432139,-10.43213 z m -0.673042,13.79735 c 0,0.37017 -0.302872,0.67303 -0.673042,0.67303 h -2.019121 c -0.370176,0 -0.673048,-0.30286 -0.673048,-0.67303 v -6.73042 c 0,-0.37018 0.302872,-0.67304 0.673048,-0.67304 h 2.019121 c 0.37017,0 0.673042,0.30286 0.673042,0.67304 z m 4.711289,0 c 0,0.37017 -0.302866,0.67303 -0.673042,0.67303 h -2.019121 c -0.370176,0 -0.673042,-0.30286 -0.673042,-0.67303 v -6.73042 c 0,-0.37018 0.302866,-0.67304 0.673042,-0.67304 h 2.019121 c 0.370176,0 0.673042,0.30286 0.673042,0.67304 z"
+       inkscape:connector-curvature="0"
+       style="fill:#ffa000;fill-opacity:0.49803922;stroke-width:0.26458332" />
+  </g>
+</svg>

www/assets/images/bgs/inkscape/settings.svg

@@ -0,0 +1,87 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="500"
+   height="500"
+   viewBox="0 0 132.29166 132.29167"
+   version="1.1"
+   id="svg8"
+   inkscape:version="0.92.3 (2405546, 2018-03-11)"
+   sodipodi:docname="settings.svg">
+  <defs
+     id="defs2" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.9899495"
+     inkscape:cx="88.990572"
+     inkscape:cy="234.28819"
+     inkscape:document-units="px"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     units="px"
+     borderlayer="true"
+     inkscape:pagecheckerboard="true"
+     inkscape:window-width="1680"
+     inkscape:window-height="1021"
+     inkscape:window-x="1920"
+     inkscape:window-y="30"
+     inkscape:window-maximized="1" />
+  <metadata
+     id="metadata5">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-164.70831)">
+    <rect
+       style="opacity:1;fill:#607d8b;fill-opacity:0.39215687;stroke:none;stroke-width:1.26999998;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385"
+       id="rect836"
+       width="132.29167"
+       height="132.29166"
+       x="0"
+       y="164.7083" />
+    <path
+       id="path6001"
+       d="M 93.874723,233.42475 H 84.63513 c -5.101024,0 -9.239587,4.13856 -9.239587,9.23958 0,5.10103 4.138563,9.23959 9.239587,9.23959 h 9.239593 c 5.10101,0 9.239577,-4.13856 9.239577,-9.23959 0,-5.10102 -4.138567,-9.23958 -9.239577,-9.23958 z m 0,16.16928 c -3.83058,0 -6.929693,-3.09912 -6.929693,-6.9297 0,-3.83058 3.099113,-6.92969 6.929693,-6.92969 3.83057,0 6.929677,3.09911 6.929677,6.92969 0,3.83058 -3.099107,6.9297 -6.929677,6.9297 z"
+       inkscape:connector-curvature="0"
+       style="fill:#455a64;fill-opacity:0.58823532;stroke-width:0.26458332" />
+    <path
+       id="path6091"
+       d="m 40.688088,212.47296 h -8.705049 c -4.807682,0 -8.705053,3.89737 -8.705053,8.70505 0,4.80768 3.897371,8.70505 8.705053,8.70505 h 8.705049 c 4.807684,0 8.70505,-3.89737 8.70505,-8.70505 0,-4.80768 -3.897366,-8.70505 -8.70505,-8.70505 z m -15.233836,8.70505 c 0,-3.6082 2.919997,-6.52879 6.528787,-6.52879 3.60815,0 6.528788,2.92 6.528788,6.52879 0,3.60815 -2.920002,6.52879 -6.528788,6.52879 -3.608154,0 -6.528787,-2.92 -6.528787,-6.52879 z m 15.233836,6.52879 h -2.947929 c 3.931057,-3.4691 3.930103,-9.58934 0,-13.05758 h 2.947929 c 3.608155,0 6.528789,2.92 6.528789,6.52879 0,3.60815 -2.920002,6.52879 -6.528789,6.52879 z"
+       inkscape:connector-curvature="0"
+       style="fill:#455a64;fill-opacity:0.58823532;stroke-width:0.26458332" />
+    <path
+       id="path6370"
+       d="m 33.462414,268.93401 c 2.762578,0 5.001557,-2.23898 5.001557,-5.00156 0,-2.76258 -2.238979,-5.00156 -5.001557,-5.00156 -2.76258,0 -5.001557,2.23898 -5.001557,5.00156 0,2.76258 2.238977,5.00156 5.001557,5.00156 z m 3.50109,1.25039 h -0.652547 c -0.867458,0.39856 -1.832602,0.62519 -2.848543,0.62519 -1.015942,0 -1.977178,-0.22663 -2.848543,-0.62519 h -0.652547 c -2.89934,0 -5.251635,2.35229 -5.251635,5.25163 v 1.62551 c 0,1.03547 0.840105,1.87558 1.875584,1.87558 h 13.754281 c 1.035479,0 1.875584,-0.84011 1.875584,-1.87558 v -1.62551 c 0,-2.89934 -2.352294,-5.25163 -5.251634,-5.25163 z"
+       inkscape:connector-curvature="0"
+       style="fill:#455a64;fill-opacity:0.58823532;stroke-width:0.26458332" />
+    <path
+       id="path6550"
+       d="m 87.999192,192.91497 c -1.379188,0.0887 -2.630839,0.61396 -3.341058,2.48543 -0.08078,0.21347 -0.275013,0.34307 -0.501555,0.34307 -0.381923,0 -1.562759,-0.9512 -1.899305,-1.18083 3.9e-4,2.8309 1.304247,5.31908 4.400545,5.31908 2.607806,0 4.400201,-1.50466 4.400201,-4.13172 0,-0.10691 -0.02235,-0.20901 -0.03335,-0.31385 z m 9.999111,-10.63405 c -0.52115,0 -1.00964,0.23067 -1.38228,0.56549 -7.026914,6.27717 -7.758103,6.42464 -7.758103,8.27238 0,0.47096 0.111723,0.91992 0.300107,1.33038 l 2.193912,1.82814 c 0.247856,0.0619 0.503274,0.10416 0.769692,0.10416 2.135128,0 3.372682,-1.5631 7.258952,-8.81621 0.2537,-0.49331 0.47784,-1.02614 0.47784,-1.58098 0,-0.99383 -0.89379,-1.70336 -1.86012,-1.70336 z"
+       inkscape:connector-curvature="0"
+       style="fill:#455a64;fill-opacity:0.58823532;stroke-width:0.26458329" />
+  </g>
+</svg>

www/assets/images/bgs/inkscape/toolbox.svg

@@ -0,0 +1,87 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="500"
+   height="500"
+   viewBox="0 0 132.29166 132.29167"
+   version="1.1"
+   id="svg8"
+   inkscape:version="0.92.3 (2405546, 2018-03-11)"
+   sodipodi:docname="toolbox.svg">
+  <defs
+     id="defs2" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.9899495"
+     inkscape:cx="88.990572"
+     inkscape:cy="234.28819"
+     inkscape:document-units="px"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     units="px"
+     borderlayer="true"
+     inkscape:pagecheckerboard="true"
+     inkscape:window-width="1680"
+     inkscape:window-height="1021"
+     inkscape:window-x="1920"
+     inkscape:window-y="30"
+     inkscape:window-maximized="1" />
+  <metadata
+     id="metadata5">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-164.70831)">
+    <rect
+       style="opacity:1;fill:#f44336;fill-opacity:0.49803922;stroke:none;stroke-width:1.26999998;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385"
+       id="rect836"
+       width="132.29167"
+       height="132.29166"
+       x="0"
+       y="164.7083" />
+    <path
+       id="path4703"
+       d="m 102.53594,267.93476 -2.11907,-2.11907 c -0.28099,-0.28098 -0.662184,-0.4388 -1.059774,-0.4388 h -2.37664 V 261.63 c 0,-1.24146 -1.00638,-2.24785 -2.24785,-2.24785 h -7.492841 c -1.241473,0 -2.247853,1.00639 -2.247853,2.24785 v 3.74643 h -2.376638 c -0.397587,0 -0.77832,0.15781 -1.059771,0.4388 l -2.119067,2.11953 c -0.280984,0.28099 -0.4388,0.66218 -0.4388,1.05977 v 3.87474 h 5.994276 v -0.74928 c 0,-0.41398 0.335302,-0.74929 0.749282,-0.74929 h 1.498571 c 0.41398,0 0.749282,0.33531 0.749282,0.74929 v 0.74928 h 5.994279 v -0.74928 c 0,-0.41398 0.3353,-0.74929 0.74928,-0.74929 h 1.49856 c 0.41398,0 0.74929,0.33531 0.74929,0.74929 v 0.74928 h 5.994274 v -3.87521 c 0,-0.39712 -0.15781,-0.77831 -0.43879,-1.0593 z m -8.552614,-2.55833 h -5.994279 v -2.99714 h 5.994279 z m 2.99713,9.74069 c 0,0.41398 -0.33531,0.74929 -0.74929,0.74929 h -1.49856 c -0.41398,0 -0.74928,-0.33531 -0.74928,-0.74929 v -0.74928 h -5.994279 v 0.74928 c 0,0.41398 -0.335302,0.74929 -0.749282,0.74929 h -1.498571 c -0.41398,0 -0.749282,-0.33531 -0.749282,-0.74929 v -0.74928 h -5.994276 v 4.4957 c 0,0.8275 0.671077,1.49857 1.49857,1.49857 h 20.979964 c 0.82749,0 1.49856,-0.67107 1.49856,-1.49857 v -4.4957 h -5.994274 z"
+       inkscape:connector-curvature="0"
+       style="fill:#d32f2f;fill-opacity:0.49803922;stroke-width:0.26458332" />
+    <path
+       id="path5013"
+       d="m 30.826992,241.84005 h -1.97581 c -0.181117,0 -0.329302,0.14818 -0.329302,0.3293 v 9.87905 c 0,0.18112 0.148185,0.32931 0.329302,0.32931 h 1.97581 c 0.181115,0 0.3293,-0.14819 0.3293,-0.32931 v -9.87905 c 0,-0.18112 -0.148185,-0.3293 -0.3293,-0.3293 z m -1.646509,13.17207 h -3.293016 v -3.29302 c 0,-0.36223 -0.296372,-0.6586 -0.658605,-0.6586 h -1.317206 c -0.362232,0 -0.658604,0.29637 -0.658604,0.6586 v 5.26883 c 0,0.36223 0.296372,0.6586 0.658604,0.6586 h 5.268827 c 0.362233,0 0.658604,-0.29637 0.658604,-0.6586 v -1.31721 c 0,-0.36223 -0.296371,-0.6586 -0.658604,-0.6586 z m 4.280922,-13.17207 h -0.658603 c -0.181116,0 -0.329302,0.14818 -0.329302,0.3293 v 9.87905 c 0,0.18112 0.148186,0.32931 0.329302,0.32931 h 0.658603 c 0.181116,0 0.329301,-0.14819 0.329301,-0.32931 v -9.87905 c 0,-0.18112 -0.148185,-0.3293 -0.329301,-0.3293 z m -9.549749,1.31721 h 1.317206 c 0.362233,0 0.658605,-0.29637 0.658605,-0.6586 v -3.29302 h 3.293016 c 0.362233,0 0.658604,-0.29637 0.658604,-0.6586 v -1.31721 c 0,-0.36223 -0.296371,-0.65861 -0.658604,-0.65861 h -5.268827 c -0.362232,0 -0.658604,0.29638 -0.658604,0.65861 v 5.26883 c 0,0.36223 0.296372,0.6586 0.658604,0.6586 z m 16.135783,-1.31721 h -1.97581 c -0.181116,0 -0.329302,0.14818 -0.329302,0.3293 v 9.87905 c 0,0.18112 0.148186,0.32931 0.329302,0.32931 h 1.97581 c 0.181116,0 0.329303,-0.14819 0.329303,-0.32931 v -9.87905 c 0,-0.18112 -0.148187,-0.3293 -0.329303,-0.3293 z m -3.951621,0 h -0.658602 c -0.181117,0 -0.329302,0.14818 -0.329302,0.3293 v 9.87905 c 0,0.18112 0.148185,0.32931 0.329302,0.32931 h 0.658602 c 0.181117,0 0.329302,-0.14819 0.329302,-0.32931 v -9.87905 c 0,-0.18112 -0.148185,-0.3293 -0.329302,-0.3293 z m 12.842767,-5.26883 h -5.268827 c -0.362232,0 -0.658603,0.29638 -0.658603,0.65861 v 1.31721 c 0,0.36223 0.296371,0.6586 0.658603,0.6586 h 3.293017 v 3.29302 c 0,0.36223 0.296371,0.6586 0.658603,0.6586 h 1.317207 c 0.362232,0 0.658603,-0.29637 0.658603,-0.6586 v -5.26883 c 0,-0.36223 -0.296371,-0.65861 -0.658603,-0.65861 z m 0,14.48928 h -1.317207 c -0.362232,0 -0.658603,0.29637 -0.658603,0.6586 v 3.29302 h -3.293017 c -0.362232,0 -0.658603,0.29637 -0.658603,0.6586 v 1.31721 c 0,0.36223 0.296371,0.6586 0.658603,0.6586 h 5.268827 c 0.362232,0 0.658603,-0.29637 0.658603,-0.6586 v -5.26883 c 0,-0.36223 -0.296371,-0.6586 -0.658603,-0.6586 z m -4.610225,0.9879 v -9.87905 c 0,-0.18112 -0.148185,-0.3293 -0.3293,-0.3293 h -1.975811 c -0.181116,0 -0.329302,0.14818 -0.329302,0.3293 v 9.87905 c 0,0.18112 0.148186,0.32931 0.329302,0.32931 h 1.975811 c 0.181115,0 0.3293,-0.14819 0.3293,-0.32931 z"
+       inkscape:connector-curvature="0"
+       style="fill:#d32f2f;fill-opacity:0.49803922;stroke-width:0.26458332" />
+    <path
+       id="path5093"
+       d="m 108.06784,223.13 -4.15639,-4.15555 c -0.18758,-0.18758 -0.44185,-0.29179 -0.70864,-0.29179 h -0.67946 c 1.1505,-1.47147 1.83413,-3.32186 1.83413,-5.33523 0,-4.78916 -3.88126,-8.66959 -8.670838,-8.66959 -4.789575,0 -8.671257,3.88043 -8.671257,8.66959 0,4.78916 3.881265,8.66959 8.671257,8.66959 2.013373,0 3.864589,-0.68363 5.336058,-1.83413 v 0.67946 c 0,0.26679 0.10421,0.52106 0.2918,0.70864 l 4.15638,4.15555 c 0.39184,0.39184 1.02544,0.39184 1.41311,0 l 1.17967,-1.17968 c 0.39184,-0.39183 0.39184,-1.02502 0.004,-1.41686 z m -12.381198,-3.78081 c -3.315603,0 -6.0026,-2.68199 -6.0026,-6.00176 0,-3.31519 2.682412,-6.00177 6.0026,-6.00177 3.315603,0 6.002598,2.682 6.002598,6.00177 0,3.31519 -2.682409,6.00176 -6.002598,6.00176 z m 8.45e-4,-10.00266 c -1.699903,0 -3.078,1.37768 -3.078,3.07758 0,1.37393 2.011705,3.87877 2.782456,4.78791 a 0.38516689,0.38516689 0 0 0 0.591089,0 c 0.770751,-0.90914 2.782455,-3.41357 2.782455,-4.78791 0,-1.6999 -1.378097,-3.07758 -3.078,-3.07758 z m 0,4.00173 c -0.55274,0 -1.000434,-0.44811 -1.000434,-1.00043 0,-0.55274 0.448112,-1.00044 1.000434,-1.00044 0.552323,0 1.000434,0.4477 1.000434,1.00044 0,0.55232 -0.448111,1.00043 -1.000434,1.00043 z"
+       inkscape:connector-curvature="0"
+       style="fill:#d32f2f;fill-opacity:0.49803922;stroke-width:0.26458332" />
+    <path
+       id="path5593"
+       d="m 56.575279,194.78631 c 0.0079,-0.0753 0.03171,-0.14667 0.03171,-0.22198 0,-1.39932 -1.137686,-2.537 -2.537,-2.537 -0.49947,0 -0.959302,0.15063 -1.351745,0.3964 -0.697674,-1.53806 -2.239693,-2.61628 -4.039376,-2.61628 -2.44979,0 -4.439748,1.98599 -4.439748,4.43975 0,0.11892 0.02775,0.22991 0.03568,0.34487 -1.966173,0.14667 -3.524048,1.77194 -3.524048,3.77775 0,2.10095 1.704545,3.8055 3.805497,3.8055 H 55.33849 c 2.100952,0 3.805498,-1.70455 3.805498,-3.8055 0,-1.66886 -1.078225,-3.06818 -2.568712,-3.58351 z m -17.061317,-0.89587 c -1.732295,-1.7323 -1.732295,-4.54678 0,-6.27512 1.732295,-1.73229 4.546778,-1.73229 6.279072,0 0.384514,0.38452 0.669927,0.82849 0.883986,1.29626 0.388478,-0.14668 0.796776,-0.23785 1.216967,-0.29731 l 1.18129,-3.52405 c 0.158562,-0.47173 -0.289376,-0.9157 -0.7611,-0.7611 l -3.480445,1.16147 -1.645086,-3.28225 c -0.218023,-0.44397 -0.852272,-0.44397 -1.074261,0 l -1.641121,3.28225 -3.484408,-1.16147 c -0.46776,-0.1546 -0.915699,0.29334 -0.7611,0.7611 l 1.16147,3.48044 -3.282243,1.64509 c -0.443975,0.22198 -0.443975,0.85227 0,1.07426 l 3.282243,1.64112 -1.16147,3.48044 c -0.158563,0.47173 0.289377,0.91571 0.7611,0.76111 l 3.01665,-1.00291 c 0.241808,-0.49155 0.554969,-0.93949 0.935518,-1.32796 -0.519292,-0.21406 -1.006871,-0.53119 -1.427062,-0.95137 z m -0.190275,-3.13954 c 0,1.61734 1.16147,2.96512 2.691597,3.26242 0.317125,-0.18631 0.646142,-0.34884 0.998943,-0.46379 0.214059,-1.75609 1.228859,-3.27035 2.671778,-4.16227 -0.523256,-1.15354 -1.684726,-1.96221 -3.032506,-1.96221 -1.835361,0 -3.329812,1.49049 -3.329812,3.32585 z"
+       inkscape:connector-curvature="0"
+       style="fill:#d32f2f;fill-opacity:0.49803922;stroke-width:0.26458332" />
+  </g>
+</svg>

www/assets/images/bgs/inkscape/toolbox_addrlookup.svg

@@ -0,0 +1,842 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   sodipodi:docname="toolbox_addrlookup.svg"
+   inkscape:version="0.92.3 (2405546, 2018-03-11)"
+   id="svg8"
+   version="1.1"
+   viewBox="0 0 132.29166 132.29167"
+   height="500"
+   width="500">
+  <sodipodi:namedview
+     inkscape:window-maximized="1"
+     inkscape:window-y="0"
+     inkscape:window-x="0"
+     inkscape:window-height="1013"
+     inkscape:window-width="1920"
+     inkscape:pagecheckerboard="true"
+     borderlayer="true"
+     units="px"
+     showgrid="false"
+     inkscape:current-layer="layer1"
+     inkscape:document-units="px"
+     inkscape:cy="342.53041"
+     inkscape:cx="244.80152"
+     inkscape:zoom="0.98994949"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     borderopacity="1.0"
+     bordercolor="#666666"
+     pagecolor="#ffffff"
+     id="base" />
+  <defs
+     id="defs2">
+    <inkscape:path-effect
+       effect="spiro"
+       id="path-effect8593"
+       is_visible="true" />
+    <inkscape:path-effect
+       is_visible="true"
+       id="path-effect8582"
+       effect="spiro" />
+    <inkscape:path-effect
+       effect="spiro"
+       id="path-effect8578"
+       is_visible="true" />
+    <inkscape:path-effect
+       is_visible="true"
+       id="path-effect8574"
+       effect="spiro" />
+    <inkscape:path-effect
+       effect="spiro"
+       id="path-effect8570"
+       is_visible="true" />
+    <inkscape:path-effect
+       is_visible="true"
+       id="path-effect8566"
+       effect="spiro" />
+    <inkscape:path-effect
+       is_visible="true"
+       id="path-effect8562"
+       effect="spiro" />
+    <inkscape:path-effect
+       simplifyJustCoalesce="false"
+       simplifyindividualpaths="false"
+       simplify_just_coalesce="false"
+       simplify_individual_paths="false"
+       helper_size="0"
+       smooth_angles="360"
+       threshold="0.00159091"
+       steps="1"
+       is_visible="true"
+       id="path-effect8560"
+       effect="simplify" />
+    <inkscape:path-effect
+       is_visible="true"
+       id="path-effect8556"
+       effect="spiro" />
+    <inkscape:path-effect
+       effect="lattice2"
+       gridpoint0="-221.28795,-36.830902"
+       gridpoint1="62.363609,-36.830902"
+       gridpoint2="-221.28795,128.83216"
+       gridpoint3="62.363609,128.83216"
+       gridpoint4="-150.37506,-36.830902"
+       gridpoint5="-8.549282,-36.830902"
+       gridpoint6="-150.37506,128.83216"
+       gridpoint7="-8.549282,128.83216"
+       gridpoint8x9="-79.462173,-36.830902"
+       gridpoint10x11="-79.462173,128.83216"
+       gridpoint12="-221.28795,4.5848636"
+       gridpoint13="62.363609,4.5848636"
+       gridpoint14="-221.28795,87.416395"
+       gridpoint15="62.363609,87.416395"
+       gridpoint16="-150.37506,4.5848636"
+       gridpoint17="-8.549282,4.5848636"
+       gridpoint18="-150.37506,87.416395"
+       gridpoint19="-8.549282,87.416395"
+       gridpoint20x21="-79.462173,4.5848636"
+       gridpoint22x23="-79.462173,87.416395"
+       gridpoint24x26="-221.28795,46.000629"
+       gridpoint25x27="62.363609,46.000629"
+       gridpoint28x30="-150.37506,46.000629"
+       gridpoint29x31="-8.549282,46.000629"
+       gridpoint32x33x34x35="-79.462173,46.000629"
+       id="path-effect8425"
+       is_visible="true"
+       horizontal_mirror="true"
+       vertical_mirror="false"
+       live_update="false" />
+    <inkscape:path-effect
+       effect="envelope"
+       id="path-effect8423"
+       is_visible="true"
+       yy="true"
+       xx="true"
+       bendpath1="M -221.28795,3.2010469 62.363609,-36.830902"
+       bendpath2="M 13.589051,-36.830902 62.363609,128.83216"
+       bendpath3="M -221.28795,128.83216 H 62.363609"
+       bendpath4="M -181.256,-36.830902 -221.28795,128.83216"
+       bendpath4-nodetypes="cc"
+       bendpath2-nodetypes="cc"
+       bendpath1-nodetypes="cc" />
+    <inkscape:path-effect
+       effect="bspline"
+       id="path-effect8421"
+       is_visible="true"
+       weight="33.333333"
+       steps="2"
+       helper_size="0"
+       apply_no_weight="true"
+       apply_with_weight="true"
+       only_selected="false" />
+    <inkscape:path-effect
+       effect="bend_path"
+       id="path-effect8419"
+       is_visible="true"
+       bendpath="M -221.28795,46.000629 H 62.363609"
+       prop_scale="1"
+       scale_y_rel="false"
+       vertical="false" />
+    <inkscape:path-effect
+       effect="transform_2pts"
+       start="-221.28795,46.000629"
+       end="62.363609,46.000629"
+       id="path-effect4714"
+       is_visible="true"
+       first_knot="1"
+       last_knot="2"
+       helper_size="3"
+       stretch="1"
+       offset="0"
+       elastic="false"
+       from_original_width="true"
+       flip_vertical="false"
+       flip_horizontal="false"
+       lock_lenght="true"
+       lock_angle="false" />
+    <filter
+       style="color-interpolation-filters:sRGB;"
+       inkscape:label="Drop Shadow"
+       id="filter1558">
+      <feFlood
+         flood-opacity="0.717647"
+         flood-color="rgb(0,0,0)"
+         result="flood"
+         id="feFlood1548" />
+      <feComposite
+         in="SourceGraphic"
+         in2="flood"
+         operator="in"
+         result="composite1"
+         id="feComposite1550" />
+      <feGaussianBlur
+         in="composite1"
+         stdDeviation="2"
+         result="blur"
+         id="feGaussianBlur1552" />
+      <feOffset
+         dx="0"
+         dy="0"
+         result="offset"
+         id="feOffset1554" />
+      <feComposite
+         in="offset"
+         in2="offset"
+         operator="atop"
+         result="composite2"
+         id="feComposite1556" />
+    </filter>
+    <style
+       id="style10992">.fa-secondary{opacity:.4}</style>
+    <style
+       id="style11044">.fa-secondary{opacity:.4}</style>
+  </defs>
+  <metadata
+     id="metadata5">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-164.70831)">
+    <rect
+       style="opacity:1;fill:#ff5252;fill-opacity:0.49803922;stroke:none;stroke-width:1.26999998;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385"
+       id="rect836"
+       width="132.29167"
+       height="132.29166"
+       x="0"
+       y="164.7083" />
+    <g
+       id="g10858"
+       style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+       transform="matrix(0.6258936,0,0,0.6258936,-26.833537,225.53405)">
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="0"
+         y="0"
+         id="rect10694"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="4"
+         y="6"
+         id="rect10696"
+         width="2"
+         height="5" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="8"
+         y="6"
+         id="rect10698"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="12"
+         y="0"
+         id="rect10700"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="16"
+         y="0"
+         id="rect10702"
+         width="2"
+         height="17" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="20"
+         y="6"
+         id="rect10704"
+         width="2"
+         height="5" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="24"
+         y="6"
+         id="rect10706"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="28"
+         y="0"
+         id="rect10708"
+         width="2"
+         height="17" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="32"
+         y="0"
+         id="rect10710"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="36"
+         y="6"
+         id="rect10712"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="40"
+         y="6"
+         id="rect10714"
+         width="2"
+         height="5" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="44"
+         y="0"
+         id="rect10716"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="48"
+         y="0"
+         id="rect10718"
+         width="2"
+         height="17" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="52"
+         y="6"
+         id="rect10720"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="56"
+         y="6"
+         id="rect10722"
+         width="2"
+         height="5" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="60"
+         y="0"
+         id="rect10724"
+         width="2"
+         height="17" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="64"
+         y="0"
+         id="rect10726"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="68"
+         y="6"
+         id="rect10728"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="72"
+         y="6"
+         id="rect10730"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="76"
+         y="0"
+         id="rect10732"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="80"
+         y="0"
+         id="rect10734"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="84"
+         y="6"
+         id="rect10736"
+         width="2"
+         height="5" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="88"
+         y="0"
+         id="rect10738"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="92"
+         y="6"
+         id="rect10740"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="96"
+         y="0"
+         id="rect10742"
+         width="2"
+         height="17" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="100"
+         y="6"
+         id="rect10744"
+         width="2"
+         height="5" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="104"
+         y="0"
+         id="rect10746"
+         width="2"
+         height="17" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="108"
+         y="6"
+         id="rect10748"
+         width="2"
+         height="5" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="112"
+         y="0"
+         id="rect10750"
+         width="2"
+         height="17" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="116"
+         y="6"
+         id="rect10752"
+         width="2"
+         height="5" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="120"
+         y="0"
+         id="rect10754"
+         width="2"
+         height="17" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="124"
+         y="6"
+         id="rect10756"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="128"
+         y="0"
+         id="rect10758"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="132"
+         y="6"
+         id="rect10760"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="136"
+         y="0"
+         id="rect10762"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="140"
+         y="6"
+         id="rect10764"
+         width="2"
+         height="5" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="144"
+         y="0"
+         id="rect10766"
+         width="2"
+         height="17" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="148"
+         y="6"
+         id="rect10768"
+         width="2"
+         height="5" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="152"
+         y="6"
+         id="rect10770"
+         width="2"
+         height="5" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="156"
+         y="0"
+         id="rect10772"
+         width="2"
+         height="17" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="160"
+         y="0"
+         id="rect10774"
+         width="2"
+         height="17" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="164"
+         y="6"
+         id="rect10776"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="168"
+         y="0"
+         id="rect10778"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="172"
+         y="6"
+         id="rect10780"
+         width="2"
+         height="5" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="176"
+         y="0"
+         id="rect10782"
+         width="2"
+         height="17" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="180"
+         y="6"
+         id="rect10784"
+         width="2"
+         height="5" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="184"
+         y="0"
+         id="rect10786"
+         width="2"
+         height="17" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="188"
+         y="6"
+         id="rect10788"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="192"
+         y="0"
+         id="rect10790"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="196"
+         y="6"
+         id="rect10792"
+         width="2"
+         height="5" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="200"
+         y="0"
+         id="rect10794"
+         width="2"
+         height="17" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="204"
+         y="6"
+         id="rect10796"
+         width="2"
+         height="5" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="208"
+         y="0"
+         id="rect10798"
+         width="2"
+         height="17" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="212"
+         y="6"
+         id="rect10800"
+         width="2"
+         height="5" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="216"
+         y="0"
+         id="rect10802"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="220"
+         y="6"
+         id="rect10804"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="224"
+         y="0"
+         id="rect10806"
+         width="2"
+         height="17" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="228"
+         y="6"
+         id="rect10808"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="232"
+         y="6"
+         id="rect10810"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="236"
+         y="0"
+         id="rect10812"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="240"
+         y="0"
+         id="rect10814"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="244"
+         y="6"
+         id="rect10816"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="248"
+         y="6"
+         id="rect10818"
+         width="2"
+         height="5" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="252"
+         y="0"
+         id="rect10820"
+         width="2"
+         height="17" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="256"
+         y="0"
+         id="rect10822"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="260"
+         y="6"
+         id="rect10824"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="264"
+         y="6"
+         id="rect10826"
+         width="2"
+         height="5" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="268"
+         y="0"
+         id="rect10828"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="272"
+         y="0"
+         id="rect10830"
+         width="2"
+         height="17" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="276"
+         y="6"
+         id="rect10832"
+         width="2"
+         height="5" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="280"
+         y="6"
+         id="rect10834"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="284"
+         y="0"
+         id="rect10836"
+         width="2"
+         height="17" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="288"
+         y="0"
+         id="rect10838"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="292"
+         y="6"
+         id="rect10840"
+         width="2"
+         height="5" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="296"
+         y="6"
+         id="rect10842"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="300"
+         y="0"
+         id="rect10844"
+         width="2"
+         height="11" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="304"
+         y="0"
+         id="rect10846"
+         width="2"
+         height="17" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="308"
+         y="6"
+         id="rect10848"
+         width="2"
+         height="5" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="312"
+         y="0"
+         id="rect10850"
+         width="2"
+         height="17" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="316"
+         y="0"
+         id="rect10852"
+         width="2"
+         height="17" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="320"
+         y="6"
+         id="rect10854"
+         width="2"
+         height="5" />
+      <rect
+         style="fill:#d43d3d;fill-opacity:0.78431374;stroke-width:0.42272839"
+         x="324"
+         y="0"
+         id="rect10856"
+         width="2"
+         height="17" />
+    </g>
+    <g
+       id="g11061"
+       transform="matrix(0.0406407,0,0,0.0406407,83.044961,191.62426)"
+       style="fill:#512da8;fill-opacity:0.49803922;stroke-width:6.51030397">
+      <path
+         id="path11048"
+         class="fa-secondary"
+         d="M 116,352 H 76 a 12,12 0 0 0 -12,12 v 40 a 12,12 0 0 0 12,12 h 40 a 12,12 0 0 0 12,-12 v -40 a 12,12 0 0 0 -12,-12 z m 0,-96 H 76 a 12,12 0 0 0 -12,12 v 40 a 12,12 0 0 0 12,12 h 40 a 12,12 0 0 0 12,-12 v -40 a 12,12 0 0 0 -12,-12 z m 0,-96 H 76 a 12,12 0 0 0 -12,12 v 40 a 12,12 0 0 0 12,12 h 40 a 12,12 0 0 0 12,-12 v -40 a 12,12 0 0 0 -12,-12 z m 128,192 h -40 a 12,12 0 0 0 -12,12 v 40 a 12,12 0 0 0 12,12 h 40 a 12,12 0 0 0 12,-12 v -40 a 12,12 0 0 0 -12,-12 z m 0,-96 h -40 a 12,12 0 0 0 -12,12 v 40 a 12,12 0 0 0 12,12 h 40 a 12,12 0 0 0 12,-12 v -40 a 12,12 0 0 0 -12,-12 z m 0,-96 h -40 a 12,12 0 0 0 -12,12 v 40 a 12,12 0 0 0 12,12 h 40 a 12,12 0 0 0 12,-12 v -40 a 12,12 0 0 0 -12,-12 z m 320,192 h -40 a 12,12 0 0 0 -12,12 v 40 a 12,12 0 0 0 12,12 h 40 a 12,12 0 0 0 12,-12 v -40 a 12,12 0 0 0 -12,-12 z m 0,-96 h -40 a 12,12 0 0 0 -12,12 v 40 a 12,12 0 0 0 12,12 h 40 a 12,12 0 0 0 12,-12 v -40 a 12,12 0 0 0 -12,-12 z"
+         inkscape:connector-curvature="0"
+         style="opacity:0.4;fill:#512da8;fill-opacity:0.49803922;stroke-width:6.51030397" />
+      <path
+         id="path11050"
+         class="fa-primary"
+         d="M 616,192 H 480 V 24 A 24,24 0 0 0 456,0 H 312 A 24,24 0 0 0 288,24 V 96 H 224 V 16 A 16,16 0 0 0 208,0 H 192 A 16,16 0 0 0 176,16 V 96 H 112 V 16 A 16,16 0 0 0 96,0 H 80 A 16,16 0 0 0 64,16 V 96 H 24 A 24,24 0 0 0 0,120 v 360 a 32,32 0 0 0 32,32 h 576 a 32,32 0 0 0 32,-32 V 216 A 24,24 0 0 0 616,192 Z M 128,404 a 12,12 0 0 1 -12,12 H 76 A 12,12 0 0 1 64,404 v -40 a 12,12 0 0 1 12,-12 h 40 a 12,12 0 0 1 12,12 z m 0,-96 a 12,12 0 0 1 -12,12 H 76 A 12,12 0 0 1 64,308 v -40 a 12,12 0 0 1 12,-12 h 40 a 12,12 0 0 1 12,12 z m 0,-96 a 12,12 0 0 1 -12,12 H 76 A 12,12 0 0 1 64,212 v -40 a 12,12 0 0 1 12,-12 h 40 a 12,12 0 0 1 12,12 z m 128,192 a 12,12 0 0 1 -12,12 h -40 a 12,12 0 0 1 -12,-12 v -40 a 12,12 0 0 1 12,-12 h 40 a 12,12 0 0 1 12,12 z m 0,-96 a 12,12 0 0 1 -12,12 h -40 a 12,12 0 0 1 -12,-12 v -40 a 12,12 0 0 1 12,-12 h 40 a 12,12 0 0 1 12,12 z m 0,-96 a 12,12 0 0 1 -12,12 h -40 a 12,12 0 0 1 -12,-12 v -40 a 12,12 0 0 1 12,-12 h 40 a 12,12 0 0 1 12,12 z m 160,96 a 12,12 0 0 1 -12,12 h -40 a 12,12 0 0 1 -12,-12 v -40 a 12,12 0 0 1 12,-12 h 40 a 12,12 0 0 1 12,12 z m 0,-96 a 12,12 0 0 1 -12,12 h -40 a 12,12 0 0 1 -12,-12 v -40 a 12,12 0 0 1 12,-12 h 40 a 12,12 0 0 1 12,12 z m 0,-96 a 12,12 0 0 1 -12,12 H 364 A 12,12 0 0 1 352,116 V 76 a 12,12 0 0 1 12,-12 h 40 a 12,12 0 0 1 12,12 z m 160,288 a 12,12 0 0 1 -12,12 h -40 a 12,12 0 0 1 -12,-12 v -40 a 12,12 0 0 1 12,-12 h 40 a 12,12 0 0 1 12,12 z m 0,-96 a 12,12 0 0 1 -12,12 h -40 a 12,12 0 0 1 -12,-12 v -40 a 12,12 0 0 1 12,-12 h 40 a 12,12 0 0 1 12,12 z"
+         inkscape:connector-curvature="0"
+         style="fill:#512da8;fill-opacity:0.49803922;stroke-width:6.51030397" />
+    </g>
+    <g
+       id="g11133"
+       class="fa-group"
+       transform="matrix(0.04487476,0,0,0.04487476,24.384695,247.63731)"
+       style="fill:#512da8;fill-opacity:0.49803922;stroke-width:5.89603806">
+      <path
+         id="path11129"
+         d="M 288,72 64,269.85 V 480 a 32,32 0 0 0 32,32 h 384 a 32,32 0 0 0 32,-32 V 269.85 Z m 64,258.66 A 21.4,21.4 0 0 1 330.63,352 H 245.34 A 21.4,21.4 0 0 1 224,330.66 V 245.32 A 21.4,21.4 0 0 1 245.34,224 h 85.29 A 21.4,21.4 0 0 1 352,245.32 Z"
+         class="fa-secondary"
+         inkscape:connector-curvature="0"
+         style="opacity:0.4;fill:#512da8;fill-opacity:0.49803922;stroke-width:5.89603806" />
+      <path
+         id="path11131"
+         d="m 571.9,258.87 -21.41,23.81 c -1.8,2 -12.46,10.23 -22.59,1.22 L 288,72 48.12,283.9 c -9.3,8.37 -19.81,1.9 -22.59,-1.2 L 4.12,258.9 c -8.37,-9.3 -1.9,-19.81 1.2,-22.6 l 256,-226 C 267.59,4.61 279.57,0 288,0 c 8.43,0 20.44,4.61 26.72,10.3 L 416,99.67 V 48 a 16,16 0 0 1 16,-16 h 64 a 16,16 0 0 1 16,16 v 136.44 l 58.69,51.83 c 3.1,2.79 9.54,13.27 1.21,22.6 z"
+         class="fa-primary"
+         inkscape:connector-curvature="0"
+         style="fill:#512da8;fill-opacity:0.49803922;stroke-width:5.89603806" />
+    </g>
+  </g>
+</svg>

www/assets/images/bgs/inkscape/toolbox_log.svg

@@ -0,0 +1,106 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="500"
+   height="500"
+   viewBox="0 0 132.29166 132.29167"
+   version="1.1"
+   id="svg8"
+   inkscape:version="0.92.3 (2405546, 2018-03-11)"
+   sodipodi:docname="toolbox_log.svg">
+  <defs
+     id="defs2">
+    <style
+       id="style12744">.fa-secondary{opacity:.4}</style>
+    <style
+       id="style12852">.fa-secondary{opacity:.4}</style>
+  </defs>
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.7"
+     inkscape:cx="-28.494899"
+     inkscape:cy="321.61508"
+     inkscape:document-units="px"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     units="px"
+     borderlayer="true"
+     inkscape:pagecheckerboard="true"
+     inkscape:window-width="1920"
+     inkscape:window-height="1013"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1" />
+  <metadata
+     id="metadata5">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-164.70831)">
+    <rect
+       style="opacity:1;fill:#ffc107;fill-opacity:0.49803922;stroke:none;stroke-width:1.26999998;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385"
+       id="rect836"
+       width="132.29167"
+       height="132.29166"
+       x="0"
+       y="164.7083" />
+    <g
+       id="g12761"
+       transform="matrix(0.0641645,0,0,0.0641645,21.560493,187.40273)"
+       style="fill:#ff5722;fill-opacity:0.49803922;stroke-width:4.12351561">
+      <path
+         id="path12748"
+         class="fa-secondary"
+         d="M 256,8 C 119,8 8,119 8,256 8,393 119,504 256,504 393,504 504,393 504,256 504,119 393,8 256,8 Z m 92.49,313 v 0 l -20,25 A 16,16 0 0 1 306,348.5 v 0 L 239,298.78 A 40,40 0 0 1 224,267.55 V 112 a 16,16 0 0 1 16,-16 h 32 a 16,16 0 0 1 16,16 v 144 l 58,42.5 a 16,16 0 0 1 2.49,22.5 z"
+         inkscape:connector-curvature="0"
+         style="opacity:0.4;fill:#ff5722;fill-opacity:0.49803922;stroke-width:4.12351561" />
+      <path
+         id="path12750"
+         class="fa-primary"
+         d="m 348.49,321 v 0 l -20,25 A 16,16 0 0 1 306,348.5 v 0 L 239,298.78 A 40,40 0 0 1 224,267.55 V 112 a 16,16 0 0 1 16,-16 h 32 a 16,16 0 0 1 16,16 v 144 l 58,42.5 a 16,16 0 0 1 2.49,22.5 z"
+         inkscape:connector-curvature="0"
+         style="fill:#ff5722;fill-opacity:0.49803922;stroke-width:4.12351561" />
+    </g>
+    <g
+       id="g12869"
+       transform="matrix(0.05281542,0,0,0.05281542,78.921428,232.26345)"
+       style="fill:#ff5722;fill-opacity:0.49803922;stroke-width:5.00958443">
+      <path
+         id="path12856"
+         class="fa-secondary"
+         d="m 512,224 v 64 a 16,16 0 0 1 -16,16 H 80 A 16,16 0 0 1 64,288 v -64 a 16,16 0 0 1 16,-16 h 416 a 16,16 0 0 1 16,16 z"
+         inkscape:connector-curvature="0"
+         style="opacity:0.4;fill:#ff5722;fill-opacity:0.49803922;stroke-width:5.00958443" />
+      <path
+         id="path12858"
+         class="fa-primary"
+         d="M 432,32 H 16 A 16,16 0 0 0 0,48 v 64 a 16,16 0 0 0 16,16 h 416 a 16,16 0 0 0 16,-16 V 48 A 16,16 0 0 0 432,32 Z m 0,352 H 16 A 16,16 0 0 0 0,400 v 64 a 16,16 0 0 0 16,16 h 416 a 16,16 0 0 0 16,-16 v -64 a 16,16 0 0 0 -16,-16 z"
+         inkscape:connector-curvature="0"
+         style="fill:#ff5722;fill-opacity:0.49803922;stroke-width:5.00958443" />
+    </g>
+  </g>
+</svg>

www/assets/images/bgs/inkscape/toolbox_scanner.svg

@@ -0,0 +1,236 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="500"
+   height="500"
+   viewBox="0 0 132.29166 132.29167"
+   version="1.1"
+   id="svg8"
+   inkscape:version="0.92.3 (2405546, 2018-03-11)"
+   sodipodi:docname="toolbox_scanner.svg">
+  <defs
+     id="defs2">
+    <filter
+       style="color-interpolation-filters:sRGB;"
+       inkscape:label="Drop Shadow"
+       id="filter1558">
+      <feFlood
+         flood-opacity="0.717647"
+         flood-color="rgb(0,0,0)"
+         result="flood"
+         id="feFlood1548" />
+      <feComposite
+         in="SourceGraphic"
+         in2="flood"
+         operator="in"
+         result="composite1"
+         id="feComposite1550" />
+      <feGaussianBlur
+         in="composite1"
+         stdDeviation="2"
+         result="blur"
+         id="feGaussianBlur1552" />
+      <feOffset
+         dx="0"
+         dy="0"
+         result="offset"
+         id="feOffset1554" />
+      <feComposite
+         in="offset"
+         in2="offset"
+         operator="atop"
+         result="composite2"
+         id="feComposite1556" />
+    </filter>
+  </defs>
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.98994949"
+     inkscape:cx="43.142291"
+     inkscape:cy="322.6139"
+     inkscape:document-units="px"
+     inkscape:current-layer="g1656"
+     showgrid="false"
+     units="px"
+     borderlayer="true"
+     inkscape:pagecheckerboard="true"
+     inkscape:window-width="1920"
+     inkscape:window-height="1013"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1" />
+  <metadata
+     id="metadata5">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-164.70831)">
+    <rect
+       style="opacity:1;fill:#e1f5fe;fill-opacity:0.49803922;stroke:none;stroke-width:1.26999998;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385"
+       id="rect836"
+       width="132.29167"
+       height="132.29166"
+       x="0"
+       y="164.7083" />
+    <g
+       id="g1590"
+       transform="matrix(0.41955654,-0.24213739,0.24223108,0.41939426,-42.31954,139.17989)"
+       style="stroke-width:2.06454396">
+      <g
+         transform="matrix(0,1,1,0,-170.07558,170.07557)"
+         style="stroke-width:2.06454396;filter:url(#filter1558)"
+         id="g1472">
+        <circle
+           style="opacity:1;fill:#0095ff;fill-opacity:0.58823529;stroke:none;stroke-width:2.62197089;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385"
+           id="path1460"
+           cx="47.813988"
+           cy="217.81396"
+           r="7.7485118" />
+        <circle
+           r="7.7485118"
+           cy="217.81396"
+           cx="70.719345"
+           id="circle1462"
+           style="opacity:1;fill:#ff0900;fill-opacity:0.58823529;stroke:none;stroke-width:2.62197089;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385" />
+        <circle
+           style="opacity:1;fill:#ffef00;fill-opacity:0.58823529;stroke:none;stroke-width:2.62197089;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385"
+           id="circle1464"
+           cx="47.813988"
+           cy="240.87051"
+           r="7.7485118" />
+        <circle
+           r="7.7485118"
+           cy="240.87051"
+           cx="70.719345"
+           id="circle1466"
+           style="opacity:1;fill:#00ff00;fill-opacity:0.58823529;stroke:none;stroke-width:2.62197089;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385" />
+      </g>
+    </g>
+    <g
+       transform="matrix(-0.28112418,-0.0754425,0.07519362,-0.28105749,100.63823,258.94479)"
+       id="g1612"
+       style="stroke-width:3.43634796">
+      <g
+         id="g1600"
+         style="stroke-width:3.43634796;filter:url(#filter1558)"
+         transform="matrix(0,1,1,0,-170.07558,170.07557)">
+        <circle
+           r="7.7485118"
+           cy="217.81396"
+           cx="47.813988"
+           id="circle1592"
+           style="opacity:1;fill:#0095ff;fill-opacity:0.58823529;stroke:none;stroke-width:4.36416197;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385" />
+        <circle
+           style="opacity:1;fill:#ff0900;fill-opacity:0.58823529;stroke:none;stroke-width:4.36416197;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385"
+           id="circle1594"
+           cx="70.719345"
+           cy="217.81396"
+           r="7.7485118" />
+        <circle
+           r="7.7485118"
+           cy="240.87051"
+           cx="47.813988"
+           id="circle1596"
+           style="opacity:1;fill:#ffef00;fill-opacity:0.58823529;stroke:none;stroke-width:4.36416197;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385" />
+        <circle
+           style="opacity:1;fill:#00ff00;fill-opacity:0.58823529;stroke:none;stroke-width:4.36416197;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385"
+           id="circle1598"
+           cx="70.719345"
+           cy="240.87051"
+           r="7.7485118" />
+      </g>
+    </g>
+    <g
+       style="stroke-width:2.50497127"
+       transform="matrix(0.12006389,0.38079162,-0.38061594,0.1201877,170.43155,209.05727)"
+       id="g1634">
+      <g
+         id="g1622"
+         style="stroke-width:2.50497127;filter:url(#filter1558)"
+         transform="matrix(0,1,1,0,-170.07558,170.07557)">
+        <circle
+           r="7.7485118"
+           cy="217.81396"
+           cx="47.813988"
+           id="circle1614"
+           style="opacity:1;fill:#0095ff;fill-opacity:0.58823529;stroke:none;stroke-width:3.18131375;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385" />
+        <circle
+           style="opacity:1;fill:#ff0900;fill-opacity:0.58823529;stroke:none;stroke-width:3.18131375;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385"
+           id="circle1616"
+           cx="70.719345"
+           cy="217.81396"
+           r="7.7485118" />
+        <circle
+           r="7.7485118"
+           cy="240.87051"
+           cx="47.813988"
+           id="circle1618"
+           style="opacity:1;fill:#ffef00;fill-opacity:0.58823529;stroke:none;stroke-width:3.18131375;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385" />
+        <circle
+           style="opacity:1;fill:#00ff00;fill-opacity:0.58823529;stroke:none;stroke-width:3.18131375;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385"
+           id="circle1620"
+           cx="70.719345"
+           cy="240.87051"
+           r="7.7485118" />
+      </g>
+    </g>
+    <g
+       style="stroke-width:3.43634796"
+       id="g1656"
+       transform="matrix(0.0754425,0.28112418,0.28105749,-0.07519362,-40.278995,280.17935)">
+      <g
+         transform="matrix(0,1,1,0,-170.07558,170.07557)"
+         style="stroke-width:3.43634796;filter:url(#filter1558)"
+         id="g1644">
+        <circle
+           style="opacity:1;fill:#0095ff;fill-opacity:0.58823529;stroke:none;stroke-width:4.36416197;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385"
+           id="circle1636"
+           cx="47.813988"
+           cy="217.81396"
+           r="7.7485118" />
+        <circle
+           r="7.7485118"
+           cy="217.81396"
+           cx="70.719345"
+           id="circle1638"
+           style="opacity:1;fill:#ff0900;fill-opacity:0.58823529;stroke:none;stroke-width:4.36416197;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385" />
+        <circle
+           style="opacity:1;fill:#ffef00;fill-opacity:0.58823529;stroke:none;stroke-width:4.36416197;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385"
+           id="circle1640"
+           cx="47.813988"
+           cy="240.87051"
+           r="7.7485118" />
+        <circle
+           r="7.7485118"
+           cy="240.87051"
+           cx="70.719345"
+           id="circle1642"
+           style="opacity:1;fill:#00ff00;fill-opacity:0.58823529;stroke:none;stroke-width:4.36416197;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385" />
+      </g>
+    </g>
+  </g>
+</svg>

www/assets/images/bgs/inkscape/toolbox_sharelist.svg

@@ -0,0 +1,114 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="500"
+   height="500"
+   viewBox="0 0 132.29166 132.29167"
+   version="1.1"
+   id="svg8"
+   inkscape:version="0.92.3 (2405546, 2018-03-11)"
+   sodipodi:docname="toolbox_sharelist.svg">
+  <defs
+     id="defs2">
+    <style
+       id="style12744">.fa-secondary{opacity:.4}</style>
+    <style
+       id="style12852">.fa-secondary{opacity:.4}</style>
+    <style
+       id="style12923">.fa-secondary{opacity:.4}</style>
+    <style
+       id="style12975">.fa-secondary{opacity:.4}</style>
+  </defs>
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.98994949"
+     inkscape:cx="102.47753"
+     inkscape:cy="263.58076"
+     inkscape:document-units="px"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     units="px"
+     borderlayer="true"
+     inkscape:pagecheckerboard="true"
+     inkscape:window-width="1920"
+     inkscape:window-height="1013"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1" />
+  <metadata
+     id="metadata5">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-164.70831)">
+    <rect
+       style="opacity:1;fill:#4caf50;fill-opacity:0.49803922;stroke:none;stroke-width:1.26999998;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385"
+       id="rect836"
+       width="132.29167"
+       height="132.29166"
+       x="0"
+       y="164.7083" />
+    <path
+       id="path13255"
+       d="m -91.210999,206.76137 h -12.898441 c -1.52593,0 -2.76395,1.23802 -2.76395,2.76395 v 23.95425 c 0,1.52593 1.23802,2.76395 2.76395,2.76395 h 12.898441 c 1.52593,0 2.76395,-1.23802 2.76395,-2.76395 v -23.95425 c 0,-1.52593 -1.23802,-2.76395 -2.76395,-2.76395 z m -6.44922,27.63952 c -1.01921,0 -1.84264,-0.82343 -1.84264,-1.84264 0,-1.0192 0.82343,-1.84263 1.84264,-1.84263 1.01921,0 1.84263,0.82343 1.84263,1.84263 0,1.01921 -0.82342,1.84264 -1.84263,1.84264 z"
+       inkscape:connector-curvature="0"
+       style="fill:#03a9f4;fill-opacity:0.49803922;stroke-width:0.26458332" />
+    <path
+       id="path13266"
+       d="M 45.79673,185.71283 H 32.898286 c -1.525931,0 -2.763951,1.23802 -2.763951,2.76395 v 23.95425 c 0,1.52593 1.23802,2.76395 2.763951,2.76395 H 45.79673 c 1.52592,0 2.76394,-1.23802 2.76394,-2.76395 v -23.95425 c 0,-1.52593 -1.23802,-2.76395 -2.76394,-2.76395 z m -3.685273,26.02721 c 0,0.38004 -0.31095,0.69099 -0.69099,0.69099 h -4.145924 c -0.380043,0 -0.690988,-0.31095 -0.690988,-0.69099 v -0.46066 c 0,-0.38004 0.310945,-0.69098 0.690988,-0.69098 h 4.145924 c 0.38004,0 0.69099,0.31094 0.69099,0.69098 z"
+       inkscape:connector-curvature="0"
+       style="fill:#03a9f4;fill-opacity:0.49803922;stroke-width:0.26458332" />
+    <path
+       id="path13459"
+       d="m -102.81315,203.08521 c -0.004,0.52005 0.42089,0.94162 0.9409,0.93462 l 7.835581,-0.1224 -18.151221,17.9081 0.22805,-7.83321 c 0.0141,-0.51993 -0.40174,-0.94996 -0.92186,-0.95342 l -2.14741,-0.0145 c -0.51272,-0.003 -0.9312,0.4094 -0.93471,0.9222 l -0.10286,13.60943 c -0.003,0.51272 0.40941,0.9312 0.9222,0.93472 l 13.60958,0.0805 c 0.51273,0.003 0.9312,-0.40942 0.93472,-0.92219 l 0.0145,-2.14741 c 0.004,-0.52005 -0.42089,-0.94163 -0.94091,-0.93463 l -7.83563,0.12247 18.151221,-17.90812 -0.228047,7.83321 c -0.01407,0.51994 0.401743,0.94998 0.921856,0.95343 l 2.147407,0.0145 c 0.512728,0.003 0.931202,-0.40941 0.934715,-0.92218 l 0.102912,-13.60949 c 0.0035,-0.51273 -0.409415,-0.93121 -0.922191,-0.93472 l -13.609643,-0.0805 c -0.51273,-0.003 -0.93121,0.4094 -0.93472,0.9222 z"
+       inkscape:connector-curvature="0"
+       style="fill:#00c853;fill-opacity:0.49803922;stroke-width:0.26458332" />
+    <g
+       id="g9729"
+       class="fa-group"
+       transform="matrix(0.06830728,0,0,0.06830728,78.812948,213.36748)"
+       style="stroke-width:3.87342834">
+      <path
+         id="path9725"
+         d="M 96,128 A 64,64 0 1 0 32,64 64,64 0 0 0 96,128 Z m 32,32 H 64 A 64,64 0 0 0 0,224 v 96 a 32,32 0 0 0 32,32 v 128 a 32,32 0 0 0 32,32 h 64 a 32,32 0 0 0 32,-32 v -96.39 l -50.36,-47.53 a 44.37,44.37 0 0 1 0,-64 L 181.77,204 c 1.65,-1.55 3.77,-2.31 5.61,-3.57 A 63.91,63.91 0 0 0 128,160 Z m 352,-32 a 64,64 0 1 0 -64,-64 64,64 0 0 0 64,64 z m 32,32 h -64 a 63.91,63.91 0 0 0 -59.38,40.42 c 1.84,1.27 4,2 5.62,3.59 l 72.12,68.06 a 44.37,44.37 0 0 1 0,64 L 416,383.62 V 480 a 32,32 0 0 0 32,32 h 64 a 32,32 0 0 0 32,-32 V 352 a 32,32 0 0 0 32,-32 v -96 a 64,64 0 0 0 -64,-64 z"
+         class="fa-secondary"
+         inkscape:connector-curvature="0"
+         style="opacity:1;fill:#02a9f3;fill-opacity:0.49803922;stroke-width:3.87342834" />
+      <path
+         id="path9727"
+         d="m 444.4,310.44 -72.12,68.07 A 12,12 0 0 1 352,369.77 V 333.63 H 224 v 36.14 a 12,12 0 0 1 -20.28,8.74 L 131.6,310.44 a 12.4,12.4 0 0 1 0,-17.47 l 72.12,-68.07 a 12,12 0 0 1 20.28,8.74 v 36 h 128 v -36 a 12,12 0 0 1 20.28,-8.74 L 444.4,293 a 12.4,12.4 0 0 1 0,17.44 z"
+         class="fa-primary"
+         inkscape:connector-curvature="0"
+         style="fill:#00c752;fill-opacity:0.49803922;stroke-width:3.87342834" />
+    </g>
+    <path
+       id="path9830"
+       d="m 53.482263,262.48395 h -1.317206 a 0.6586032,0.6586032 0 0 0 -0.658603,0.6586 v 4.61022 H 38.33439 v -13.17206 h 5.927428 a 0.6586032,0.6586032 0 0 0 0.658604,-0.65861 v -1.3172 a 0.6586032,0.6586032 0 0 0 -0.658604,-0.65861 h -6.586032 a 1.9758096,1.9758096 0 0 0 -1.975809,1.97581 v 14.48927 a 1.9758096,1.9758096 0 0 0 1.975809,1.97581 h 14.489271 a 1.9758096,1.9758096 0 0 0 1.975809,-1.97581 v -5.26882 a 0.6586032,0.6586032 0 0 0 -0.658603,-0.6586 z m 2.305113,-13.17207 h -5.268827 c -0.879647,0 -1.319265,1.06652 -0.699766,1.68767 l 1.470742,1.47074 -10.032583,10.02888 a 0.98790477,0.98790477 0 0 0 0,1.39953 l 0.933158,0.93152 a 0.98790477,0.98790477 0 0 0 1.399532,0 l 10.027644,-10.03053 1.470333,1.46869 c 0.617441,0.61743 1.687669,0.18523 1.687669,-0.69977 v -5.26882 a 0.98790477,0.98790477 0 0 0 -0.987902,-0.98791 z"
+       inkscape:connector-curvature="0"
+       style="fill:#19bf51;fill-opacity:0.74901961;stroke-width:0.26458332" />
+  </g>
+</svg>

www/assets/images/bgs/inkscape/toolbox_weather.svg

@@ -0,0 +1,247 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   sodipodi:docname="toolbox_weather.svg"
+   inkscape:version="0.92.3 (2405546, 2018-03-11)"
+   id="svg8"
+   version="1.1"
+   viewBox="0 0 132.29166 132.29167"
+   height="500"
+   width="500">
+  <sodipodi:namedview
+     inkscape:window-maximized="1"
+     inkscape:window-y="0"
+     inkscape:window-x="0"
+     inkscape:window-height="1013"
+     inkscape:window-width="1920"
+     inkscape:pagecheckerboard="true"
+     borderlayer="true"
+     units="px"
+     showgrid="false"
+     inkscape:current-layer="layer1"
+     inkscape:document-units="px"
+     inkscape:cy="342.53041"
+     inkscape:cx="3.3750531"
+     inkscape:zoom="0.98994949"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     borderopacity="1.0"
+     bordercolor="#666666"
+     pagecolor="#ffffff"
+     id="base" />
+  <defs
+     id="defs2">
+    <inkscape:path-effect
+       is_visible="true"
+       id="path-effect8593"
+       effect="spiro" />
+    <inkscape:path-effect
+       effect="spiro"
+       id="path-effect8582"
+       is_visible="true" />
+    <inkscape:path-effect
+       is_visible="true"
+       id="path-effect8578"
+       effect="spiro" />
+    <inkscape:path-effect
+       effect="spiro"
+       id="path-effect8574"
+       is_visible="true" />
+    <inkscape:path-effect
+       is_visible="true"
+       id="path-effect8570"
+       effect="spiro" />
+    <inkscape:path-effect
+       effect="spiro"
+       id="path-effect8566"
+       is_visible="true" />
+    <inkscape:path-effect
+       effect="spiro"
+       id="path-effect8562"
+       is_visible="true" />
+    <inkscape:path-effect
+       effect="simplify"
+       id="path-effect8560"
+       is_visible="true"
+       steps="1"
+       threshold="0.00159091"
+       smooth_angles="360"
+       helper_size="0"
+       simplify_individual_paths="false"
+       simplify_just_coalesce="false"
+       simplifyindividualpaths="false"
+       simplifyJustCoalesce="false" />
+    <inkscape:path-effect
+       effect="spiro"
+       id="path-effect8556"
+       is_visible="true" />
+    <inkscape:path-effect
+       live_update="false"
+       vertical_mirror="false"
+       horizontal_mirror="true"
+       is_visible="true"
+       id="path-effect8425"
+       gridpoint32x33x34x35="-79.462173,46.000629"
+       gridpoint29x31="-8.549282,46.000629"
+       gridpoint28x30="-150.37506,46.000629"
+       gridpoint25x27="62.363609,46.000629"
+       gridpoint24x26="-221.28795,46.000629"
+       gridpoint22x23="-79.462173,87.416395"
+       gridpoint20x21="-79.462173,4.5848636"
+       gridpoint19="-8.549282,87.416395"
+       gridpoint18="-150.37506,87.416395"
+       gridpoint17="-8.549282,4.5848636"
+       gridpoint16="-150.37506,4.5848636"
+       gridpoint15="62.363609,87.416395"
+       gridpoint14="-221.28795,87.416395"
+       gridpoint13="62.363609,4.5848636"
+       gridpoint12="-221.28795,4.5848636"
+       gridpoint10x11="-79.462173,128.83216"
+       gridpoint8x9="-79.462173,-36.830902"
+       gridpoint7="-8.549282,128.83216"
+       gridpoint6="-150.37506,128.83216"
+       gridpoint5="-8.549282,-36.830902"
+       gridpoint4="-150.37506,-36.830902"
+       gridpoint3="62.363609,128.83216"
+       gridpoint2="-221.28795,128.83216"
+       gridpoint1="62.363609,-36.830902"
+       gridpoint0="-221.28795,-36.830902"
+       effect="lattice2" />
+    <inkscape:path-effect
+       bendpath1-nodetypes="cc"
+       bendpath2-nodetypes="cc"
+       bendpath4-nodetypes="cc"
+       bendpath4="M -181.256,-36.830902 -221.28795,128.83216"
+       bendpath3="M -221.28795,128.83216 H 62.363609"
+       bendpath2="M 13.589051,-36.830902 62.363609,128.83216"
+       bendpath1="M -221.28795,3.2010469 62.363609,-36.830902"
+       xx="true"
+       yy="true"
+       is_visible="true"
+       id="path-effect8423"
+       effect="envelope" />
+    <inkscape:path-effect
+       only_selected="false"
+       apply_with_weight="true"
+       apply_no_weight="true"
+       helper_size="0"
+       steps="2"
+       weight="33.333333"
+       is_visible="true"
+       id="path-effect8421"
+       effect="bspline" />
+    <inkscape:path-effect
+       vertical="false"
+       scale_y_rel="false"
+       prop_scale="1"
+       bendpath="M -221.28795,46.000629 H 62.363609"
+       is_visible="true"
+       id="path-effect8419"
+       effect="bend_path" />
+    <inkscape:path-effect
+       lock_angle="false"
+       lock_lenght="true"
+       flip_horizontal="false"
+       flip_vertical="false"
+       from_original_width="true"
+       elastic="false"
+       offset="0"
+       stretch="1"
+       helper_size="3"
+       last_knot="2"
+       first_knot="1"
+       is_visible="true"
+       id="path-effect4714"
+       end="62.363609,46.000629"
+       start="-221.28795,46.000629"
+       effect="transform_2pts" />
+    <filter
+       id="filter1558"
+       inkscape:label="Drop Shadow"
+       style="color-interpolation-filters:sRGB;">
+      <feFlood
+         id="feFlood1548"
+         result="flood"
+         flood-color="rgb(0,0,0)"
+         flood-opacity="0.717647" />
+      <feComposite
+         id="feComposite1550"
+         result="composite1"
+         operator="in"
+         in2="flood"
+         in="SourceGraphic" />
+      <feGaussianBlur
+         id="feGaussianBlur1552"
+         result="blur"
+         stdDeviation="2"
+         in="composite1" />
+      <feOffset
+         id="feOffset1554"
+         result="offset"
+         dy="0"
+         dx="0" />
+      <feComposite
+         id="feComposite1556"
+         result="composite2"
+         operator="atop"
+         in2="offset"
+         in="offset" />
+    </filter>
+  </defs>
+  <metadata
+     id="metadata5">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     transform="translate(0,-164.70831)"
+     id="layer1"
+     inkscape:groupmode="layer"
+     inkscape:label="Layer 1">
+    <rect
+       y="164.7083"
+       x="0"
+       height="132.29166"
+       width="132.29167"
+       id="rect836"
+       style="opacity:1;fill:#2196f3;fill-opacity:0.49803922;stroke:none;stroke-width:1.26999998;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385" />
+    <g
+       id="g8662"
+       class="fa-group"
+       transform="matrix(-0.05943309,0,0,0.05943309,54.278717,232.07571)"
+       style="fill:#37474f;fill-opacity:0.49803922;stroke-width:4.45178461">
+      <path
+         id="path8658"
+         d="M 161.6,288 H 96 A 96,96 0 0 1 96,96 c 0.6,0 1.1,0.2 1.6,0.2 C 105.3,41.9 151.6,0 208,0 A 111.61,111.61 0 0 1 312.5,72.7 95.07,95.07 0 0 1 352,64 a 96,96 0 0 1 96,96 93,93 0 0 1 -7,34.7 110.5,110.5 0 0 0 -31.6,11.8 A 142.54,142.54 0 0 0 304,160 c -73.9,0 -134.3,56.2 -142.4,128 z"
+         class="fa-secondary"
+         inkscape:connector-curvature="0"
+         style="opacity:0.4;fill:#37474f;fill-opacity:0.49803922;stroke-width:4.45178461" />
+      <path
+         id="path8660"
+         d="m 640,416 a 96,96 0 0 1 -96,96 H 224 a 96,96 0 0 1 -96,-96 c 0,-42.5 27.8,-78.2 66.1,-90.8 A 113.72,113.72 0 0 1 192,304 111.94,111.94 0 0 1 304,192 c 43.2,0 80.4,24.9 99,60.8 14.7,-17.5 36.4,-28.8 61,-28.8 a 80,80 0 0 1 80,80 78.09,78.09 0 0 1 -1.6,16.2 c 0.5,0 1,-0.2 1.6,-0.2 a 96,96 0 0 1 96,96 z"
+         class="fa-primary"
+         inkscape:connector-curvature="0"
+         style="fill:#37474f;fill-opacity:0.49803922;stroke-width:4.45178461" />
+    </g>
+    <path
+       id="path8838"
+       d="m 101.85647,203.49637 c -2.702182,0 -4.90377,2.20158 -4.90377,4.90377 0,2.70218 2.201588,4.90377 4.90377,4.90377 2.70218,0 4.90377,-2.20159 4.90377,-4.90377 0,-2.70219 -2.20159,-4.90377 -4.90377,-4.90377 z m 12.58634,4.11201 -4.83736,-2.41612 1.71121,-5.12853 c 0.22987,-0.69469 -0.42908,-1.35364 -1.11867,-1.11867 l -5.12853,1.71121 -2.42124,-4.84247 c -0.32691,-0.65383 -1.25659,-0.65383 -1.5835,0 l -2.41613,4.83737 -5.133634,-1.71122 c -0.694699,-0.22986 -1.353642,0.42909 -1.118671,1.11867 l 1.711211,5.12853 -4.837361,2.42123 c -0.653836,0.32692 -0.653836,1.25659 0,1.58351 l 4.837361,2.41613 -1.711211,5.13364 c -0.229864,0.69469 0.429079,1.35363 1.118671,1.11867 l 5.128527,-1.71122 2.416127,4.83737 c 0.32692,0.65383 1.25659,0.65383 1.58351,0 l 2.41612,-4.83737 5.12853,1.71122 c 0.6947,0.22986 1.35365,-0.42908 1.11868,-1.11867 l -1.71122,-5.12853 4.83737,-2.41613 c 0.66405,-0.33203 0.66405,-1.2617 0.0102,-1.58862 z m -7.96351,5.41458 c -2.54894,2.54894 -6.696717,2.54894 -9.245653,0 -2.548938,-2.54894 -2.548938,-6.69671 0,-9.24564 2.548936,-2.54894 6.696713,-2.54894 9.245653,0 2.54893,2.54893 2.54893,6.6967 0,9.24564 z"
+       inkscape:connector-curvature="0"
+       style="fill:#fffde7;fill-opacity:0.49803922;stroke-width:0.26458332" />
+  </g>
+</svg>

www/assets/images/bgs/list.svg

@@ -0,0 +1,2 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="500" height="500" version="1.1" viewBox="0 0 132.29 132.29" xmlns="http://www.w3.org/2000/svg"><g transform="translate(0 -164.71)" fill-opacity=".49804"><rect y="164.71" width="132.29" height="132.29" fill="#2196f3"/><g fill="#1976d2"><rect x="-.75595" y="172.72" width="73.327" height="10.961" rx="1.3229" ry="1.3494"/><rect x="-.75595" y="193.89" width="73.327" height="10.961" rx="1.3229" ry="1.3494"/><rect x="-.75595" y="215.05" width="73.327" height="10.961" rx="1.3229" ry="1.3494"/><rect x="-.75595" y="236.22" width="73.327" height="10.961" rx="1.3229" ry="1.3494"/><rect x="-.75595" y="257.39" width="73.327" height="10.961" rx="1.3229" ry="1.3494"/><rect x="-.75595" y="278.55" width="73.327" height="10.961" rx="1.3229" ry="1.3494"/></g></g></svg>

www/assets/images/bgs/notes.svg

@@ -0,0 +1,2 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="500" height="500" version="1.1" viewBox="0 0 132.29 132.29" xmlns="http://www.w3.org/2000/svg"><defs><style>.fa-secondary{opacity:.4}</style></defs><g transform="translate(0 -164.71)" fill-opacity=".49804"><rect y="164.71" width="132.29" height="132.29" fill="#ffc107"/><g fill="#ffa000" stroke-width=".26458"><path d="m53.963 191.64-2.2824-2.2814c-1.1178-1.1178-2.9271-1.118-4.0451-4e-5l-13.449 13.361-1.0416 6.3137c-0.11335 0.6871 0.48172 1.2823 1.169 1.169l6.3136-1.0416 13.362-13.449c1.1157-1.1158 1.1264-2.9187-0.02665-4.0717zm-15.72 9.6774 7.2147-7.1679 3.7396 3.7396-7.1679 7.2147v-1.7524h-2.034v-2.034zm-1.6319 6.6161-1.1976-1.1976 0.51443-3.1182 0.7797-0.77471h1.7624v2.034h2.034v1.7624l-0.7747 0.77974zm16.059-13.54-0.0046 4e-3 -2.0353 2.0486-3.7303-3.7303 2.0486-2.0353 0.0046-4e-3c0.3876-0.38756 1.0161-0.39235 1.4084-4e-5l2.282 2.282c0.41859 0.41854 0.42118 1.0403 0.02664 1.4349z"/><path d="m94.157 212.4c-5.2014 0-9.417 3.4247-9.417 7.6513 0 1.8246 0.7872 3.4946 2.0968 4.8078-0.45982 1.854-1.9974 3.5056-2.0158 3.524-0.08093 0.0846-0.103 0.20967-0.05518 0.32002 0.04782 0.11036 0.15082 0.17657 0.26853 0.17657 2.4389 0 4.2671-1.1698 5.172-1.8908 1.2029 0.45245 2.5382 0.71363 3.9507 0.71363 5.2014 0 9.417-3.4247 9.417-7.6513 0-4.2266-4.2156-7.6513-9.417-7.6513z"/><path d="m88.389 268.52a4.6491 4.6491 0 0 0-4.6491 4.6491v6.7154a1.0331 1.0331 0 0 0 1.0331 1.0331h8.2651v-7.7485a4.6491 4.6491 0 0 0-4.6491-4.6491zm2.5828 5.6822a0.51657 0.51657 0 0 1-0.51657 0.51657h-4.1325a0.51657 0.51657 0 0 1-0.51657-0.51657v-1.0331a0.51657 0.51657 0 0 1 0.51657-0.51657h4.1325a0.51657 0.51657 0 0 1 0.51657 0.51657zm6.7154-5.6822h-6.0416c1.4645 1.0289 2.4256 2.7275 2.4256 4.6491v7.7485h7.232a1.0331 1.0331 0 0 0 1.0331-1.0331v-6.7154a4.6491 4.6491 0 0 0-4.6491-4.6491zm2.5828 6.7154a0.51657 0.51657 0 0 1-0.51658 0.51656h-1.0331a0.51657 0.51657 0 0 1-0.51657-0.51656v-1.5497h-1.808a0.25828 0.25828 0 0 1-0.25828-0.25829v-0.51657a0.25828 0.25828 0 0 1 0.25828-0.25828h3.3577a0.51657 0.51657 0 0 1 0.51658 0.51657z"/><path d="m37.798 247.64c-5.7629 0-10.432 4.6692-10.432 10.432 0 5.7629 4.6692 10.432 10.432 10.432 5.7629 0 10.432-4.6692 10.432-10.432 0-5.7629-4.6692-10.432-10.432-10.432zm-0.67304 13.797c0 0.37017-0.30287 0.67303-0.67304 0.67303h-2.0191c-0.37018 0-0.67305-0.30286-0.67305-0.67303v-6.7304c0-0.37018 0.30287-0.67304 0.67305-0.67304h2.0191c0.37017 0 0.67304 0.30286 0.67304 0.67304zm4.7113 0c0 0.37017-0.30287 0.67303-0.67304 0.67303h-2.0191c-0.37018 0-0.67304-0.30286-0.67304-0.67303v-6.7304c0-0.37018 0.30287-0.67304 0.67304-0.67304h2.0191c0.37018 0 0.67304 0.30286 0.67304 0.67304z"/></g></g></svg>

www/assets/images/bgs/settings.svg

@@ -0,0 +1,2 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="500" height="500" version="1.1" viewBox="0 0 132.29 132.29" xmlns="http://www.w3.org/2000/svg"><g transform="translate(0 -164.71)"><rect y="164.71" width="132.29" height="132.29" fill="#607d8b" fill-opacity=".39216"/><g fill="#455a64" fill-opacity=".58824"><g stroke-width=".26458"><path d="m93.875 233.42h-9.2396c-5.101 0-9.2396 4.1386-9.2396 9.2396 0 5.101 4.1386 9.2396 9.2396 9.2396h9.2396c5.101 0 9.2396-4.1386 9.2396-9.2396 0-5.101-4.1386-9.2396-9.2396-9.2396zm0 16.169c-3.8306 0-6.9297-3.0991-6.9297-6.9297s3.0991-6.9297 6.9297-6.9297c3.8306 0 6.9297 3.0991 6.9297 6.9297s-3.0991 6.9297-6.9297 6.9297z"/><path d="m40.688 212.47h-8.705c-4.8077 0-8.7051 3.8974-8.7051 8.705s3.8974 8.705 8.7051 8.705h8.705c4.8077 0 8.705-3.8974 8.705-8.705s-3.8974-8.705-8.705-8.705zm-15.234 8.705c0-3.6082 2.92-6.5288 6.5288-6.5288 3.6082 0 6.5288 2.92 6.5288 6.5288 0 3.6082-2.92 6.5288-6.5288 6.5288-3.6082 0-6.5288-2.92-6.5288-6.5288zm15.234 6.5288h-2.9479c3.9311-3.4691 3.9301-9.5893 0-13.058h2.9479c3.6082 0 6.5288 2.92 6.5288 6.5288 0 3.6082-2.92 6.5288-6.5288 6.5288z"/><path d="m33.462 268.93c2.7626 0 5.0016-2.239 5.0016-5.0016s-2.239-5.0016-5.0016-5.0016c-2.7626 0-5.0016 2.239-5.0016 5.0016s2.239 5.0016 5.0016 5.0016zm3.5011 1.2504h-0.65255c-0.86746 0.39856-1.8326 0.62519-2.8485 0.62519-1.0159 0-1.9772-0.22663-2.8485-0.62519h-0.65255c-2.8993 0-5.2516 2.3523-5.2516 5.2516v1.6255c0 1.0355 0.8401 1.8756 1.8756 1.8756h13.754c1.0355 0 1.8756-0.84011 1.8756-1.8756v-1.6255c0-2.8993-2.3523-5.2516-5.2516-5.2516z"/></g><path d="m87.999 192.91c-1.3792 0.0887-2.6308 0.61396-3.3411 2.4854-0.08078 0.21347-0.27501 0.34307-0.50156 0.34307-0.38192 0-1.5628-0.9512-1.8993-1.1808 3.9e-4 2.8309 1.3042 5.3191 4.4005 5.3191 2.6078 0 4.4002-1.5047 4.4002-4.1317 0-0.10691-0.02235-0.20901-0.03335-0.31385zm9.9991-10.634c-0.52115 0-1.0096 0.23067-1.3823 0.56549-7.0269 6.2772-7.7581 6.4246-7.7581 8.2724 0 0.47096 0.11172 0.91992 0.30011 1.3304l2.1939 1.8281c0.24786 0.0619 0.50327 0.10416 0.76969 0.10416 2.1351 0 3.3727-1.5631 7.259-8.8162 0.2537-0.49331 0.47784-1.0261 0.47784-1.581 0-0.99383-0.89379-1.7034-1.8601-1.7034z" stroke-width=".26458"/></g></g></svg>

www/assets/images/bgs/toolbox_log.svg

@@ -0,0 +1,2 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="500" height="500" version="1.1" viewBox="0 0 132.29 132.29" xmlns="http://www.w3.org/2000/svg"><defs><style>.fa-secondary{opacity:.4}</style><style>.fa-secondary{opacity:.4}</style></defs><g transform="translate(0 -164.71)" fill-opacity=".49804"><rect y="164.71" width="132.29" height="132.29" fill="#ffc107"/><g transform="matrix(.064164 0 0 .064164 21.56 187.4)" fill="#ff5722" stroke-width="4.1235"><path class="fa-secondary" d="m256 8c-137 0-248 111-248 248s111 248 248 248 248-111 248-248-111-248-248-248zm92.49 313-20 25a16 16 0 0 1-22.49 2.5l-67-49.72a40 40 0 0 1-15-31.23v-155.55a16 16 0 0 1 16-16h32a16 16 0 0 1 16 16v144l58 42.5a16 16 0 0 1 2.49 22.5z" opacity=".4"/><path class="fa-primary" d="m348.49 321-20 25a16 16 0 0 1-22.49 2.5l-67-49.72a40 40 0 0 1-15-31.23v-155.55a16 16 0 0 1 16-16h32a16 16 0 0 1 16 16v144l58 42.5a16 16 0 0 1 2.49 22.5z"/></g><g transform="matrix(.052815 0 0 .052815 78.921 232.26)" fill="#ff5722" stroke-width="5.0096"><path class="fa-secondary" d="m512 224v64a16 16 0 0 1-16 16h-416a16 16 0 0 1-16-16v-64a16 16 0 0 1 16-16h416a16 16 0 0 1 16 16z" opacity=".4"/><path class="fa-primary" d="m432 32h-416a16 16 0 0 0-16 16v64a16 16 0 0 0 16 16h416a16 16 0 0 0 16-16v-64a16 16 0 0 0-16-16zm0 352h-416a16 16 0 0 0-16 16v64a16 16 0 0 0 16 16h416a16 16 0 0 0 16-16v-64a16 16 0 0 0-16-16z"/></g></g></svg>

www/assets/images/bgs/toolbox_scanner.svg

@@ -0,0 +1,2 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="500" height="500" version="1.1" viewBox="0 0 132.29 132.29" xmlns="http://www.w3.org/2000/svg"><defs><filter id="a" color-interpolation-filters="sRGB"><feFlood flood-color="rgb(0,0,0)" flood-opacity=".71765" result="flood"/><feComposite in="SourceGraphic" in2="flood" operator="in" result="composite1"/><feGaussianBlur in="composite1" result="blur" stdDeviation="2"/><feOffset dx="0" dy="0" result="offset"/><feComposite in="offset" in2="offset" operator="atop" result="composite2"/></filter></defs><g transform="translate(0 -164.71)"><rect y="164.71" width="132.29" height="132.29" fill="#e1f5fe" fill-opacity=".49804"/><g transform="matrix(.41956 -.24214 .24223 .41939 -42.32 139.18)" stroke-width="2.0645"><g transform="matrix(0 1 1 0 -170.08 170.08)" fill-opacity=".58824" filter="url(#a)" stroke-width="2.0645"><circle cx="47.814" cy="217.81" r="7.7485" fill="#0095ff"/><circle cx="70.719" cy="217.81" r="7.7485" fill="#ff0900"/><circle cx="47.814" cy="240.87" r="7.7485" fill="#ffef00"/><circle cx="70.719" cy="240.87" r="7.7485" fill="#0f0"/></g></g><g transform="matrix(-.28112 -.075442 .075194 -.28106 100.64 258.94)" stroke-width="3.4363"><g transform="matrix(0 1 1 0 -170.08 170.08)" fill-opacity=".58824" filter="url(#a)" stroke-width="3.4363"><circle cx="47.814" cy="217.81" r="7.7485" fill="#0095ff"/><circle cx="70.719" cy="217.81" r="7.7485" fill="#ff0900"/><circle cx="47.814" cy="240.87" r="7.7485" fill="#ffef00"/><circle cx="70.719" cy="240.87" r="7.7485" fill="#0f0"/></g></g><g transform="matrix(.12006 .38079 -.38062 .12019 170.43 209.06)" stroke-width="2.505"><g transform="matrix(0 1 1 0 -170.08 170.08)" fill-opacity=".58824" filter="url(#a)" stroke-width="2.505"><circle cx="47.814" cy="217.81" r="7.7485" fill="#0095ff"/><circle cx="70.719" cy="217.81" r="7.7485" fill="#ff0900"/><circle cx="47.814" cy="240.87" r="7.7485" fill="#ffef00"/><circle cx="70.719" cy="240.87" r="7.7485" fill="#0f0"/></g></g><g transform="matrix(.075442 .28112 .28106 -.075194 -40.279 280.18)" stroke-width="3.4363"><g transform="matrix(0 1 1 0 -170.08 170.08)" fill-opacity=".58824" filter="url(#a)" stroke-width="3.4363"><circle cx="47.814" cy="217.81" r="7.7485" fill="#0095ff"/><circle cx="70.719" cy="217.81" r="7.7485" fill="#ff0900"/><circle cx="47.814" cy="240.87" r="7.7485" fill="#ffef00"/><circle cx="70.719" cy="240.87" r="7.7485" fill="#0f0"/></g></g></g></svg>

www/assets/images/bgs/toolbox_sharelist.svg

@@ -0,0 +1,114 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="500"
+   height="500"
+   viewBox="0 0 132.29166 132.29167"
+   version="1.1"
+   id="svg8"
+   inkscape:version="0.92.3 (2405546, 2018-03-11)"
+   sodipodi:docname="toolbox_sharelist.svg">
+  <defs
+     id="defs2">
+    <style
+       id="style12744">.fa-secondary{opacity:.4}</style>
+    <style
+       id="style12852">.fa-secondary{opacity:.4}</style>
+    <style
+       id="style12923">.fa-secondary{opacity:.4}</style>
+    <style
+       id="style12975">.fa-secondary{opacity:.4}</style>
+  </defs>
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.98994949"
+     inkscape:cx="102.47753"
+     inkscape:cy="263.58076"
+     inkscape:document-units="px"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     units="px"
+     borderlayer="true"
+     inkscape:pagecheckerboard="true"
+     inkscape:window-width="1920"
+     inkscape:window-height="1013"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1" />
+  <metadata
+     id="metadata5">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-164.70831)">
+    <rect
+       style="opacity:1;fill:#4caf50;fill-opacity:0.49803922;stroke:none;stroke-width:1.26999998;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.99492385"
+       id="rect836"
+       width="132.29167"
+       height="132.29166"
+       x="0"
+       y="164.7083" />
+    <path
+       id="path13255"
+       d="m -91.210999,206.76137 h -12.898441 c -1.52593,0 -2.76395,1.23802 -2.76395,2.76395 v 23.95425 c 0,1.52593 1.23802,2.76395 2.76395,2.76395 h 12.898441 c 1.52593,0 2.76395,-1.23802 2.76395,-2.76395 v -23.95425 c 0,-1.52593 -1.23802,-2.76395 -2.76395,-2.76395 z m -6.44922,27.63952 c -1.01921,0 -1.84264,-0.82343 -1.84264,-1.84264 0,-1.0192 0.82343,-1.84263 1.84264,-1.84263 1.01921,0 1.84263,0.82343 1.84263,1.84263 0,1.01921 -0.82342,1.84264 -1.84263,1.84264 z"
+       inkscape:connector-curvature="0"
+       style="fill:#03a9f4;fill-opacity:0.49803922;stroke-width:0.26458332" />
+    <path
+       id="path13266"
+       d="M 45.79673,185.71283 H 32.898286 c -1.525931,0 -2.763951,1.23802 -2.763951,2.76395 v 23.95425 c 0,1.52593 1.23802,2.76395 2.763951,2.76395 H 45.79673 c 1.52592,0 2.76394,-1.23802 2.76394,-2.76395 v -23.95425 c 0,-1.52593 -1.23802,-2.76395 -2.76394,-2.76395 z m -3.685273,26.02721 c 0,0.38004 -0.31095,0.69099 -0.69099,0.69099 h -4.145924 c -0.380043,0 -0.690988,-0.31095 -0.690988,-0.69099 v -0.46066 c 0,-0.38004 0.310945,-0.69098 0.690988,-0.69098 h 4.145924 c 0.38004,0 0.69099,0.31094 0.69099,0.69098 z"
+       inkscape:connector-curvature="0"
+       style="fill:#03a9f4;fill-opacity:0.49803922;stroke-width:0.26458332" />
+    <path
+       id="path13459"
+       d="m -102.81315,203.08521 c -0.004,0.52005 0.42089,0.94162 0.9409,0.93462 l 7.835581,-0.1224 -18.151221,17.9081 0.22805,-7.83321 c 0.0141,-0.51993 -0.40174,-0.94996 -0.92186,-0.95342 l -2.14741,-0.0145 c -0.51272,-0.003 -0.9312,0.4094 -0.93471,0.9222 l -0.10286,13.60943 c -0.003,0.51272 0.40941,0.9312 0.9222,0.93472 l 13.60958,0.0805 c 0.51273,0.003 0.9312,-0.40942 0.93472,-0.92219 l 0.0145,-2.14741 c 0.004,-0.52005 -0.42089,-0.94163 -0.94091,-0.93463 l -7.83563,0.12247 18.151221,-17.90812 -0.228047,7.83321 c -0.01407,0.51994 0.401743,0.94998 0.921856,0.95343 l 2.147407,0.0145 c 0.512728,0.003 0.931202,-0.40941 0.934715,-0.92218 l 0.102912,-13.60949 c 0.0035,-0.51273 -0.409415,-0.93121 -0.922191,-0.93472 l -13.609643,-0.0805 c -0.51273,-0.003 -0.93121,0.4094 -0.93472,0.9222 z"
+       inkscape:connector-curvature="0"
+       style="fill:#00c853;fill-opacity:0.49803922;stroke-width:0.26458332" />
+    <g
+       id="g9729"
+       class="fa-group"
+       transform="matrix(0.06830728,0,0,0.06830728,78.812948,213.36748)"
+       style="stroke-width:3.87342834">
+      <path
+         id="path9725"
+         d="M 96,128 A 64,64 0 1 0 32,64 64,64 0 0 0 96,128 Z m 32,32 H 64 A 64,64 0 0 0 0,224 v 96 a 32,32 0 0 0 32,32 v 128 a 32,32 0 0 0 32,32 h 64 a 32,32 0 0 0 32,-32 v -96.39 l -50.36,-47.53 a 44.37,44.37 0 0 1 0,-64 L 181.77,204 c 1.65,-1.55 3.77,-2.31 5.61,-3.57 A 63.91,63.91 0 0 0 128,160 Z m 352,-32 a 64,64 0 1 0 -64,-64 64,64 0 0 0 64,64 z m 32,32 h -64 a 63.91,63.91 0 0 0 -59.38,40.42 c 1.84,1.27 4,2 5.62,3.59 l 72.12,68.06 a 44.37,44.37 0 0 1 0,64 L 416,383.62 V 480 a 32,32 0 0 0 32,32 h 64 a 32,32 0 0 0 32,-32 V 352 a 32,32 0 0 0 32,-32 v -96 a 64,64 0 0 0 -64,-64 z"
+         class="fa-secondary"
+         inkscape:connector-curvature="0"
+         style="opacity:1;fill:#02a9f3;fill-opacity:0.49803922;stroke-width:3.87342834" />
+      <path
+         id="path9727"
+         d="m 444.4,310.44 -72.12,68.07 A 12,12 0 0 1 352,369.77 V 333.63 H 224 v 36.14 a 12,12 0 0 1 -20.28,8.74 L 131.6,310.44 a 12.4,12.4 0 0 1 0,-17.47 l 72.12,-68.07 a 12,12 0 0 1 20.28,8.74 v 36 h 128 v -36 a 12,12 0 0 1 20.28,-8.74 L 444.4,293 a 12.4,12.4 0 0 1 0,17.44 z"
+         class="fa-primary"
+         inkscape:connector-curvature="0"
+         style="fill:#00c752;fill-opacity:0.49803922;stroke-width:3.87342834" />
+    </g>
+    <path
+       id="path9830"
+       d="m 53.482263,262.48395 h -1.317206 a 0.6586032,0.6586032 0 0 0 -0.658603,0.6586 v 4.61022 H 38.33439 v -13.17206 h 5.927428 a 0.6586032,0.6586032 0 0 0 0.658604,-0.65861 v -1.3172 a 0.6586032,0.6586032 0 0 0 -0.658604,-0.65861 h -6.586032 a 1.9758096,1.9758096 0 0 0 -1.975809,1.97581 v 14.48927 a 1.9758096,1.9758096 0 0 0 1.975809,1.97581 h 14.489271 a 1.9758096,1.9758096 0 0 0 1.975809,-1.97581 v -5.26882 a 0.6586032,0.6586032 0 0 0 -0.658603,-0.6586 z m 2.305113,-13.17207 h -5.268827 c -0.879647,0 -1.319265,1.06652 -0.699766,1.68767 l 1.470742,1.47074 -10.032583,10.02888 a 0.98790477,0.98790477 0 0 0 0,1.39953 l 0.933158,0.93152 a 0.98790477,0.98790477 0 0 0 1.399532,0 l 10.027644,-10.03053 1.470333,1.46869 c 0.617441,0.61743 1.687669,0.18523 1.687669,-0.69977 v -5.26882 a 0.98790477,0.98790477 0 0 0 -0.987902,-0.98791 z"
+       inkscape:connector-curvature="0"
+       style="fill:#19bf51;fill-opacity:0.74901961;stroke-width:0.26458332" />
+  </g>
+</svg>

www/assets/images/bgs/toolbox_weather.svg

@@ -0,0 +1,2 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="500" height="500" version="1.1" viewBox="0 0 132.29 132.29" xmlns="http://www.w3.org/2000/svg"><g transform="translate(0 -164.71)" fill-opacity=".49804"><rect y="164.71" width="132.29" height="132.29" fill="#2196f3"/><g class="fa-group" transform="matrix(-.059433 0 0 .059433 54.279 232.08)" fill="#37474f" stroke-width="4.4518"><path class="fa-secondary" d="m161.6 288h-65.6a96 96 0 0 1 0-192c0.6 0 1.1 0.2 1.6 0.2 7.7-54.3 54-96.2 110.4-96.2a111.61 111.61 0 0 1 104.5 72.7 95.07 95.07 0 0 1 39.5-8.7 96 96 0 0 1 96 96 93 93 0 0 1-7 34.7 110.5 110.5 0 0 0-31.6 11.8 142.54 142.54 0 0 0-105.4-46.5c-73.9 0-134.3 56.2-142.4 128z" opacity=".4"/><path class="fa-primary" d="m640 416a96 96 0 0 1-96 96h-320a96 96 0 0 1-96-96c0-42.5 27.8-78.2 66.1-90.8a113.72 113.72 0 0 1-2.1-21.2 111.94 111.94 0 0 1 112-112c43.2 0 80.4 24.9 99 60.8 14.7-17.5 36.4-28.8 61-28.8a80 80 0 0 1 80 80 78.09 78.09 0 0 1-1.6 16.2c0.5 0 1-0.2 1.6-0.2a96 96 0 0 1 96 96z"/></g><path d="m101.86 203.5c-2.7022 0-4.9038 2.2016-4.9038 4.9038 0 2.7022 2.2016 4.9038 4.9038 4.9038 2.7022 0 4.9038-2.2016 4.9038-4.9038 0-2.7022-2.2016-4.9038-4.9038-4.9038zm12.586 4.112-4.8374-2.4161 1.7112-5.1285c0.22987-0.69469-0.42908-1.3536-1.1187-1.1187l-5.1285 1.7112-2.4212-4.8425c-0.32691-0.65383-1.2566-0.65383-1.5835 0l-2.4161 4.8374-5.1336-1.7112c-0.6947-0.22986-1.3536 0.42909-1.1187 1.1187l1.7112 5.1285-4.8374 2.4212c-0.65384 0.32692-0.65384 1.2566 0 1.5835l4.8374 2.4161-1.7112 5.1336c-0.22986 0.69469 0.42908 1.3536 1.1187 1.1187l5.1285-1.7112 2.4161 4.8374c0.32692 0.65383 1.2566 0.65383 1.5835 0l2.4161-4.8374 5.1285 1.7112c0.6947 0.22986 1.3536-0.42908 1.1187-1.1187l-1.7112-5.1285 4.8374-2.4161c0.66405-0.33203 0.66405-1.2617 0.0102-1.5886zm-7.9635 5.4146c-2.5489 2.5489-6.6967 2.5489-9.2457 0-2.5489-2.5489-2.5489-6.6967 0-9.2456 2.5489-2.5489 6.6967-2.5489 9.2457 0 2.5489 2.5489 2.5489 6.6967 0 9.2456z" fill="#fffde7" stroke-width=".26458"/></g></svg>

www/assets/images/box-open-dashed.svg

@@ -1 +1,61 @@
-<svg class="svg-inline--fa fa-box-open fa-w-19" aria-hidden="true" data-icon="box-open" data-prefix="fal" focusable="false" role="img" version="1.1" viewBox="0 0 608 512" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"><metadata><rdf:RDF><cc:Work rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"/><dc:title/></cc:Work></rdf:RDF></metadata><path d="M606.4 143.8L557.5 41c-2.7-5.6-8.1-9-13.9-9C543 32 304 64 304 64S65 32 64.4 32c-5.8 0-11.2 3.5-13.9 9L1.6 143.8c-4.4 9.2.3 20.2 9.6 23l49.5 14.9V393c0 14.7 9.5 27.5 23 31l205.4 54.1c13 3.4 23.7 1.5 29.5 0L524.2 424c13.5-3.6 23-16.4 23-31V181.7l49.5-14.9c9.4-2.8 14-13.8 9.7-23zM73 65.3l180.9 24.3-57.1 99.8-159.9-48.1 36.1-76zm18.2 125.6C208.3 226.1 200.5 224 203.6 224c5.4 0 10.5-2.9 13.3-7.9l71.9-125.5V445L91.2 393V190.9zM516.8 393l-197.6 52V90.5L391.1 216c2.9 5 8 7.9 13.3 7.9 3.1 0-5 2.1 112.4-33.1V393zM411.3 189.3l-57.1-99.8L535 65.3l36.1 76-159.8 48z" fill="none" stroke="#9e9e9e" stroke-dasharray="5, 5" stroke-width="10"/></svg>
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   class="svg-inline--fa fa-box-open fa-w-19"
+   aria-hidden="true"
+   data-icon="box-open"
+   data-prefix="fal"
+   focusable="false"
+   role="img"
+   version="1.1"
+   viewBox="0 0 608 512"
+   id="svg879"
+   sodipodi:docname="box-open-dashed.svg"
+   inkscape:version="0.92.3 (2405546, 2018-03-11)">
+  <defs
+     id="defs883" />
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1015"
+     id="namedview881"
+     showgrid="false"
+     height="1"
+     inkscape:zoom="1.3037281"
+     inkscape:cx="241.86287"
+     inkscape:cy="228.99761"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg879" />
+  <metadata
+     id="metadata875">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <path
+     d="M 598.3861,153.84429 550.9386,54.115498 c -2.61984,-5.432698 -7.85943,-8.731118 -13.48716,-8.731118 -0.58218,0 -232.4831,31.043977 -232.4831,31.043977 0,0 -231.900991,-31.043977 -232.48317,-31.043977 -5.627722,0 -10.867325,3.395437 -13.487128,8.731118 L 11.550524,153.84429 c -4.2693062,8.92517 0.291089,19.59653 9.314845,22.31285 l 48.029702,14.45485 v 204.98726 c 0,14.26083 9.217821,26.67839 22.31683,30.07381 L 290.51092,478.1568 c 12.61384,3.29842 22.99601,1.45522 28.62375,0 l 199.49302,-52.48374 c 13.09902,-3.49238 22.31682,-15.90999 22.31682,-30.07381 V 190.61199 l 48.0297,-14.45485 c 9.1208,-2.71632 13.58418,-13.38768 9.41189,-22.31285 z M 80.829724,77.68952 256.35645,101.26354 200.95251,198.08199 45.802004,151.41893 Z m 17.659403,121.84763 c 113.621753,34.14839 106.053493,32.11104 109.061403,32.11104 5.23958,0 10.18807,-2.81336 12.90492,-7.66393 l 69.76438,-121.7506 V 446.04572 L 98.489127,395.59925 Z M 511.44748,395.59925 319.71687,446.04572 V 102.13665 l 69.76429,121.75064 c 2.8139,4.85059 7.76242,7.66395 12.90497,7.66395 3.00794,0 -4.85147,2.03721 109.06135,-32.1111 z M 409.08115,197.98489 353.67719,101.16653 529.10691,77.68952 l 35.02771,73.72941 z"
+     id="path877"
+     inkscape:connector-curvature="0"
+     style="fill:none;stroke:#9e9e9e;stroke-width:10.00000095;stroke-dasharray:4.9999999, 4.9999999" />
+</svg>

www/assets/images/icons/logo.svg

@@ -0,0 +1,153 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="512"
+   height="512"
+   viewBox="0 0 135.46666 135.46667"
+   version="1.1"
+   id="svg7166"
+   inkscape:version="0.92.3 (2405546, 2018-03-11)"
+   sodipodi:docname="logo.svg"
+   inkscape:export-filename="/home/skylar/Documents/Projects/Assets/PackageHelper/logo.png"
+   inkscape:export-xdpi="96.000008"
+   inkscape:export-ydpi="96.000008">
+  <defs
+     id="defs7160">
+    <clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath7298">
+      <rect
+         style="fill:#000000;fill-opacity:1;stroke-width:0.49260601"
+         id="rect7300"
+         width="252.21428"
+         height="252.21428"
+         x="108.23811"
+         y="62.791664"
+         rx="14.778181"
+         ry="14.778181" />
+    </clipPath>
+  </defs>
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.7"
+     inkscape:cx="-35.714286"
+     inkscape:cy="502.85714"
+     inkscape:document-units="mm"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     units="px"
+     inkscape:window-width="1920"
+     inkscape:window-height="1015"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1" />
+  <metadata
+     id="metadata7163">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-161.53332)">
+    <g
+       id="g7294"
+       transform="matrix(0.5371094,0,0,0.5371094,-58.135705,127.80733)"
+       clip-path="url(#clipPath7298)">
+      <g
+         inkscape:label="Layer 1"
+         id="layer1-7"
+         transform="translate(98.878579,27.365487)">
+        <rect
+           style="opacity:1;fill:#2196f3;fill-opacity:1;stroke:none;stroke-width:2;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
+           id="rect930"
+           width="270.93332"
+           height="270.93332"
+           x="2.9541011e-06"
+           y="26.06665" />
+        <path
+           sodipodi:type="star"
+           style="opacity:1;fill:#1976d2;fill-opacity:1;stroke:none;stroke-width:1;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
+           id="path932"
+           sodipodi:sides="3"
+           sodipodi:cx="37.468803"
+           sodipodi:cy="275.44373"
+           sodipodi:r1="43.112488"
+           sodipodi:r2="21.556244"
+           sodipodi:arg1="0.52359878"
+           sodipodi:arg2="1.5707963"
+           inkscape:flatsided="true"
+           inkscape:rounded="0"
+           inkscape:randomized="0"
+           d="m 74.805313,296.99997 -74.67301934,0 37.33651034,-64.66873 z"
+           inkscape:transform-center-y="-25.330169"
+           transform="matrix(2.1686357,0,0,2.3501502,1.4459442,-410.066)" />
+        <path
+           transform="matrix(1.6940182,0,0,1.3303796,116.31992,-124.58106)"
+           inkscape:transform-center-y="-14.338981"
+           d="m 74.805313,296.99997 -74.67301934,0 37.33651034,-64.66873 z"
+           inkscape:randomized="0"
+           inkscape:rounded="0"
+           inkscape:flatsided="true"
+           sodipodi:arg2="1.5707963"
+           sodipodi:arg1="0.52359878"
+           sodipodi:r2="21.556244"
+           sodipodi:r1="43.112488"
+           sodipodi:cy="275.44373"
+           sodipodi:cx="37.468803"
+           sodipodi:sides="3"
+           id="path934"
+           style="opacity:0.5;fill:#1976d2;fill-opacity:1;stroke:none;stroke-width:1;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
+           sodipodi:type="star" />
+        <path
+           inkscape:connector-curvature="0"
+           style="fill:#acd6ff;fill-opacity:0.46733668;stroke-width:0.06555524"
+           d="m 203.06397,109.73197 c 0.26877,-0.70144 0.41955,-1.46844 0.41955,-2.26821 0,-3.47443 -2.81888,-6.29331 -6.2933,-6.29331 -1.29145,0 -2.49766,0.39334 -3.4941,1.062 -1.81588,-3.146647 -5.20509,-5.257527 -9.09252,-5.257527 -5.79508,0 -10.48885,4.693747 -10.48885,10.488837 0,0.177 0.007,0.354 0.0131,0.531 -3.67109,1.29144 -6.30641,4.79209 -6.30641,8.90895 0,5.21164 4.22832,9.43996 9.43996,9.43996 h 24.12433 c 4.63476,0 8.39108,-3.75631 8.39108,-8.39107 0,-4.05787 -2.88443,-7.44708 -6.71286,-8.22063 z"
+           id="path2" />
+      </g>
+      <g
+         inkscape:label="Layer 1"
+         id="layer1-3"
+         transform="matrix(0.82142858,0,0,0.82142858,178.59848,0.5726301)">
+        <g
+           transform="matrix(0.26458333,0,0,0.26458333,8.5989574,161.53331)"
+           class="fa-group"
+           id="g6">
+          <path
+             style="opacity:1;fill:#7ac0f8;fill-opacity:1"
+             inkscape:connector-curvature="0"
+             class="fa-secondary"
+             d="m 256,32 32,128 v 112 a 16,16 0 0 1 -16,16 H 176 A 16,16 0 0 1 160,272 V 160 L 192,32 Z"
+             id="path2-5" />
+          <path
+             style="fill:#f7fbff;fill-opacity:1"
+             inkscape:connector-curvature="0"
+             class="fa-primary"
+             d="m 446.7,160 c 0.4,-0.5 0.5,-0.7 0.9,-1.2 L 391.3,53.9 A 32,32 0 0 0 360.9,32 H 256 l 32,128 z M 160,160 192,32 H 87.1 A 32,32 0 0 0 56.7,53.9 L 0.4,158.8 c 0.4,0.5 0.5,0.7 0.9,1.2 z m 128,32 v 80 a 16,16 0 0 1 -16,16 H 176 A 16,16 0 0 1 160,272 V 192 H 0 v 256 a 32,32 0 0 0 32,32 h 384 a 32,32 0 0 0 32,-32 V 192 Z"
+             id="path4" />
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>

www/assets/images/note-dashed.svg

@@ -0,0 +1,61 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   class="svg-inline--fa fa-box-open fa-w-19"
+   aria-hidden="true"
+   data-icon="box-open"
+   data-prefix="fal"
+   focusable="false"
+   role="img"
+   version="1.1"
+   viewBox="0 0 608 512"
+   id="svg879"
+   sodipodi:docname="note-dashed.svg"
+   inkscape:version="0.92.3 (2405546, 2018-03-11)">
+  <defs
+     id="defs883" />
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1015"
+     id="namedview881"
+     showgrid="false"
+     height="1"
+     inkscape:zoom="1.3037281"
+     inkscape:cx="241.86287"
+     inkscape:cy="228.99761"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg879" />
+  <metadata
+     id="metadata875">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <path
+     d="M 392,320 H 528 V 56.000003 c 0,-13.3 -10.7,-24 -24,-24 H 104 c -13.3,0 -24,10.7 -24,24 V 456 c 0,13.3 10.7,24 24,24 H 368 V 344 c 0,-13.2 10.8,-24 24,-24 z m 129,55 -98,98 c -4.5,4.5 -10.6,7 -17,7 h -6 V 352 h 128 v 6.1 c 0,6.3 -2.5,12.4 -7,16.9 z"
+     id="path2"
+     style="fill:none;stroke:#9e9e9e;stroke-width:10;stroke-miterlimit:4;stroke-dasharray:5, 5;stroke-dashoffset:0;stroke-opacity:1"
+     inkscape:connector-curvature="0" />
+</svg>

www/assets/images/weather-fog.svg

@@ -0,0 +1,106 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="512"
+   height="512"
+   viewBox="0 0 135.46666 135.46667"
+   version="1.1"
+   id="svg8"
+   inkscape:version="0.92.3 (2405546, 2018-03-11)"
+   sodipodi:docname="weather-fog.svg">
+  <defs
+     id="defs2" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.7"
+     inkscape:cx="-178.85714"
+     inkscape:cy="388.57143"
+     inkscape:document-units="px"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     units="px"
+     inkscape:window-width="1920"
+     inkscape:window-height="1013"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1" />
+  <metadata
+     id="metadata5">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-161.53332)">
+    <g
+       id="g877"
+       class="fa-group"
+       transform="matrix(0.15119047,0,0,0.15119047,33.866667,216.0375)"
+       style="fill:#8d6e63">
+      <path
+         id="path873"
+         d="m 256,32 32,128 v 112 a 16,16 0 0 1 -16,16 H 176 A 16,16 0 0 1 160,272 V 160 L 192,32 Z"
+         class="fa-secondary"
+         inkscape:connector-curvature="0"
+         style="opacity:0.4;fill:#8d6e63;fill-opacity:1" />
+      <path
+         id="path875"
+         d="m 446.7,160 c 0.4,-0.5 0.5,-0.7 0.9,-1.2 L 391.3,53.9 A 32,32 0 0 0 360.9,32 H 256 l 32,128 z M 160,160 192,32 H 87.1 A 32,32 0 0 0 56.7,53.9 L 0.4,158.8 c 0.4,0.5 0.5,0.7 0.9,1.2 z m 128,32 v 80 a 16,16 0 0 1 -16,16 H 176 A 16,16 0 0 1 160,272 V 192 H 0 v 256 a 32,32 0 0 0 32,32 h 384 a 32,32 0 0 0 32,-32 V 192 Z"
+         class="fa-primary"
+         inkscape:connector-curvature="0"
+         style="fill:#8d6e63;fill-opacity:1" />
+    </g>
+    <g
+       transform="matrix(0.19282692,0,0,0.19282692,6.0287181,157.15353)"
+       class="fa-group"
+       id="g6"
+       style="stroke-width:1.37212861">
+      <path
+         style="opacity:1;fill:#91a5af;stroke-width:1.37212861;fill-opacity:0.40000001"
+         inkscape:connector-curvature="0"
+         class="fa-secondary"
+         d="M 208,464 H 80 a 16,16 0 0 0 -16,16 v 16 a 16,16 0 0 0 16,16 h 128 a 16,16 0 0 0 16,-16 v -16 a 16,16 0 0 0 -16,-16 z m 416,0 H 288 a 16,16 0 0 0 -16,16 v 16 a 16,16 0 0 0 16,16 h 336 a 16,16 0 0 0 16,-16 V 480 A 16,16 0 0 0 624,464 Z M 576,400 V 384 A 16,16 0 0 0 560,368 H 16 A 16,16 0 0 0 0,384 v 16 a 16,16 0 0 0 16,16 h 544 a 16,16 0 0 0 16,-16 z"
+         id="path2" />
+    </g>
+    <path
+       style="fill:#90a4ae;fill-opacity:1;stroke-width:0.26458335"
+       inkscape:connector-curvature="0"
+       class="fa-primary"
+       d="m 20.713092,200.56399 c 0,-3.93448 2.573616,-7.23944 6.119271,-8.40589 a 10.527733,10.527733 0 0 1 -0.19441,-1.96261 10.362947,10.362947 0 0 1 10.368499,-10.36851 c 4.008539,0 7.443101,2.29588 9.165014,5.62862 1.360867,-1.62008 3.369767,-2.66618 5.647133,-2.66618 a 7.406073,7.406073 0 0 1 7.406074,7.40607 7.2292527,7.2292527 0 0 1 -0.148121,1.49973 c 0.04631,0 0.09262,-0.0186 0.148121,-0.0186 a 8.8872882,8.8872882 0 0 1 0,17.77457 H 29.600378 a 8.8872873,8.8872873 0 0 1 -8.887286,-8.88726 z"
+       id="path4" />
+    <g
+       id="g958-9"
+       class="fa-group"
+       transform="matrix(-0.05876348,0,0,0.05876348,121.21697,162.54441)"
+       style="fill:#90a4ae">
+      <path
+         id="path956-1"
+         d="m 640,416 a 96,96 0 0 1 -96,96 H 224 a 96,96 0 0 1 -96,-96 c 0,-42.5 27.8,-78.2 66.1,-90.8 A 113.72,113.72 0 0 1 192,304 111.94,111.94 0 0 1 304,192 c 43.2,0 80.4,24.9 99,60.8 14.7,-17.5 36.4,-28.8 61,-28.8 a 80,80 0 0 1 80,80 78.09,78.09 0 0 1 -1.6,16.2 c 0.5,0 1,-0.2 1.6,-0.2 a 96,96 0 0 1 96,96 z"
+         class="fa-primary"
+         inkscape:connector-curvature="0"
+         style="opacity:0.4;fill:#90a4ae" />
+    </g>
+  </g>
+</svg>

www/assets/images/weather-hazard.svg

@@ -0,0 +1,196 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="512"
+   height="512"
+   viewBox="0 0 135.46666 135.46667"
+   version="1.1"
+   id="svg8"
+   inkscape:version="0.92.3 (2405546, 2018-03-11)"
+   sodipodi:docname="weather-hazard.svg">
+  <defs
+     id="defs2" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.7"
+     inkscape:cx="73.336749"
+     inkscape:cy="274.28572"
+     inkscape:document-units="px"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     units="px"
+     inkscape:window-width="1920"
+     inkscape:window-height="1013"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1" />
+  <metadata
+     id="metadata5">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-161.53332)">
+    <g
+       id="g877"
+       class="fa-group"
+       transform="matrix(0.15119047,0,0,0.15119047,35.000596,217.17143)"
+       style="fill:#8d6e63">
+      <path
+         id="path873"
+         d="m 256,32 32,128 v 112 a 16,16 0 0 1 -16,16 H 176 A 16,16 0 0 1 160,272 V 160 L 192,32 Z"
+         class="fa-secondary"
+         inkscape:connector-curvature="0"
+         style="opacity:0.4;fill:#8d6e63;fill-opacity:1" />
+      <path
+         id="path875"
+         d="m 446.7,160 c 0.4,-0.5 0.5,-0.7 0.9,-1.2 L 391.3,53.9 A 32,32 0 0 0 360.9,32 H 256 l 32,128 z M 160,160 192,32 H 87.1 A 32,32 0 0 0 56.7,53.9 L 0.4,158.8 c 0.4,0.5 0.5,0.7 0.9,1.2 z m 128,32 v 80 a 16,16 0 0 1 -16,16 H 176 A 16,16 0 0 1 160,272 V 192 H 0 v 256 a 32,32 0 0 0 32,32 h 384 a 32,32 0 0 0 32,-32 V 192 Z"
+         class="fa-primary"
+         inkscape:connector-curvature="0"
+         style="fill:#8d6e63;fill-opacity:1" />
+    </g>
+    <g
+       transform="matrix(0.0897699,0,0,0.08938396,74.876531,229.03828)"
+       class="fa-group"
+       id="g6"
+       style="fill:#ff9800;stroke-width:2.95370626">
+      <path
+         style="opacity:1;fill:#ff9800;stroke-width:2.95370626"
+         inkscape:connector-curvature="0"
+         class="fa-secondary"
+         d="M 569.52,440 329.58,24 C 311.14,-8 264.89,-8 246.42,24 L 6.48,440 c -18.42,31.94 4.64,72 41.57,72 h 479.89 c 36.87,0 60.06,-40 41.58,-72 z M 288,448 a 32,32 0 1 1 32,-32 32,32 0 0 1 -32,32 z m 38.24,-238.41 -12.8,128 A 16,16 0 0 1 297.52,352 h -19 A 16,16 0 0 1 262.6,337.59 l -12.8,-128 A 16,16 0 0 1 265.68,192 h 44.64 a 16,16 0 0 1 15.92,17.59 z"
+         id="path2" />
+      <path
+         style="fill:#ffe0b2;stroke-width:2.95370626"
+         inkscape:connector-curvature="0"
+         class="fa-primary"
+         d="m 310.32,192 h -44.64 a 16,16 0 0 0 -15.92,17.59 l 12.8,128 A 16,16 0 0 0 278.48,352 h 19 a 16,16 0 0 0 15.92,-14.41 l 12.8,-128 A 16,16 0 0 0 310.32,192 Z M 288,384 a 32,32 0 1 0 32,32 32,32 0 0 0 -32,-32 z"
+         id="path4" />
+    </g>
+    <g
+       id="g1513"
+       transform="translate(-1.6176729)">
+      <g
+         transform="translate(-5.875014)"
+         id="g1483">
+        <g
+           transform="matrix(0.03675131,0,0,0.03675131,38.949062,195.59312)"
+           class="fa-group"
+           id="g6-6"
+           style="fill:#2196f3;stroke-width:7.1992898">
+          <path
+             style="opacity:0.4;fill:#2196f3;stroke-width:7.1992898"
+             inkscape:connector-curvature="0"
+             class="fa-secondary"
+             d="m 562.2,447.85 c -21.51,-2.4 -42.11,-10.5 -57.91,-22.9 a 38.79,38.79 0 0 0 -48.21,0 c -37.91,30.4 -107.22,30.4 -145.73,-1.5 -13.5,-11.2 -33,-9.1 -46.7,1.8 -38,30.1 -106.92,30 -145.23,-1.7 -13.5,-11.2 -33.31,-8.9 -47.11,2 -15.5,12.2 -36,20.1 -57.71,22.4 -7.9,0.8 -13.6,7.8 -13.6,15.7 v 32.2 c 0,9.1 7.6,16.8 16.7,16 28.81,-2.5 56.11,-11.4 79.42,-25.9 56.51,34.6 137,34.1 192,0 56.51,34.6 137,34.1 192,0 a 185,185 0 0 0 79.12,25.8 c 9.1,0.8 16.7,-6.9 16.7,-16 v -31.6 c 0.16,-8 -5.64,-15.4 -13.74,-16.3 z m 0,-144 c -21.51,-2.4 -42.11,-10.5 -57.91,-22.9 a 38.79,38.79 0 0 0 -48.21,0 c -37.91,30.4 -107.22,30.4 -145.73,-1.5 -13.5,-11.2 -33,-9.1 -46.7,1.8 -38,30.1 -106.92,30 -145.23,-1.7 -13.5,-11.2 -33.31,-8.9 -47.11,2 -15.5,12.2 -36,20.1 -57.71,22.4 -7.9,0.8 -13.6,7.8 -13.6,15.7 v 32.2 c 0,9.1 7.6,16.8 16.7,16 28.81,-2.5 56.11,-11.4 79.42,-25.9 56.51,34.6 137,34.1 192,0 56.51,34.6 137,34.1 192,0 a 185,185 0 0 0 79.12,25.8 c 9.1,0.8 16.7,-6.9 16.7,-16 v -31.6 c 0.16,-8 -5.64,-15.4 -13.74,-16.3 z"
+             id="path2-2" />
+          <path
+             style="fill:#2196f3;stroke-width:7.1992898"
+             inkscape:connector-curvature="0"
+             class="fa-primary"
+             d="M 385.19,128 H 320 v 80 a 16,16 0 0 1 -16,16 h -32 a 16,16 0 0 1 -16,-16 v -80 h -65.2 c -14.2,0 -21.4,-17.31 -11.2,-27.31 L 276,5 a 17,17 0 0 1 24,0 l 96.4,95.62 c 10.19,10.05 3.09,27.38 -11.21,27.38 z"
+             id="path4-9" />
+        </g>
+        <g
+           transform="matrix(0.03307292,0,0,0.03307292,90.336308,196.53385)"
+           class="fa-group"
+           id="g6-1"
+           style="fill:#8bc34a;stroke-width:7.99999952">
+          <path
+             style="opacity:0.4;fill:#8bc34a;stroke-width:7.99999952"
+             inkscape:connector-curvature="0"
+             class="fa-secondary"
+             d="m 496,240 c 0,3.14648 -0.30469,6.21484 -0.46875,9.32227 C 441.94531,273.66016 382.79688,288 320,288 257.20312,288 198.05469,273.66016 144.46875,249.32227 144.30469,246.21484 144,243.14648 144,240 a 176,176 0 0 1 352,0 z"
+             id="path2-27" />
+          <path
+             style="fill:#8bc34a;stroke-width:7.99999952"
+             inkscape:connector-curvature="0"
+             class="fa-primary"
+             d="M 493.65234,212.582 A 176.66471,176.66471 0 0 1 496,240 c 0,3.14648 -0.30469,6.21484 -0.46875,9.32227 C 441.94531,273.66016 382.79688,288 320,288 257.20312,288 198.05469,273.66016 144.46875,249.32227 144.30469,246.21484 144,243.14648 144,240 a 176.66471,176.66471 0 0 1 2.34766,-27.418 C 58.35547,235.39062 0,274.93555 0,320 0,390.69141 143.26953,448 320,448 496.73047,448 640,390.69141 640,320 640,274.93555 581.64453,235.39062 493.65234,212.582 Z M 128,360 a 24,24 0 1 1 24,-24 24.00118,24.00118 0 0 1 -24,24 z m 192,32 a 24,24 0 1 1 24,-24 24.00118,24.00118 0 0 1 -24,24 z m 192,-32 a 24,24 0 1 1 24,-24 24.00118,24.00118 0 0 1 -24,24 z"
+             id="path4-0" />
+        </g>
+      </g>
+      <g
+         transform="translate(0,-4.2333332)"
+         id="g1494">
+        <g
+           transform="matrix(0.04133922,0,0,0.04133922,6.7128304,173.07045)"
+           class="fa-group"
+           id="g6-3"
+           style="fill:#9c27b0;stroke-width:6.4002986">
+          <path
+             style="opacity:0.4;fill:#9c27b0;stroke-width:6.4002986"
+             inkscape:connector-curvature="0"
+             class="fa-secondary"
+             d="M 393.42,96 H 11.9 c 9.64,34.16 24.49,62.05 42.71,85.3 H 404.39 C 390.32,158.16 383.71,131.08 393.42,96 Z m 36.31,117.3 H 84.64 c 45.05,40.43 101.1,63.6 150.27,85.3 H 504.52 C 490,266.41 456.82,241.74 429.73,213.3 Z M 429.11,25.2 c 7.4,-10.6 0,-25.2 -12.9,-25.2 h -400 A 16.2,16.2 0 0 0 0,16.5 369.9,369.9 0 0 0 4.76,64 h 401.12 a 302.21,302.21 0 0 1 23.23,-38.8 z m -97.4,463.9 A 16,16 0 0 0 346,512 h 27.4 a 32.82,32.82 0 0 0 21.7,-8.3 c 22.58,-20.2 41.3,-38.69 56.63,-55.7 H 347.4 a 248.42,248.42 0 0 1 -15.69,41.1 z M 512,330.6 H 299 c 33,20.58 54.66,45.71 53.54,85.4 H 478 c 25.13,-34.44 34.53,-62 34,-85.4 z"
+             id="path2-6" />
+          <path
+             style="fill:#9c27b0;stroke-width:6.4002986"
+             inkscape:connector-curvature="0"
+             class="fa-primary"
+             d="M 405.88,64 H 4.76 a 302.42,302.42 0 0 0 7.14,32 h 381.52 a 181.86,181.86 0 0 1 12.46,-32 z m -1.49,117.3 H 54.61 a 250.81,250.81 0 0 0 30,32 h 345.12 c -9.56,-10.03 -18.36,-20.53 -25.34,-32 z M 347.4,448 H 451.74 A 406.12,406.12 0 0 0 478,416 H 352.51 a 135.56,135.56 0 0 1 -5.11,32 z M 504.52,298.6 H 234.91 c 23.6,10.42 45.61,20.5 64.06,32 H 512 a 81.4,81.4 0 0 0 -7.48,-32 z"
+             id="path4-7" />
+        </g>
+        <g
+           transform="matrix(0.04134065,0,0,0.04134065,62.075054,173.06994)"
+           class="fa-group"
+           id="g6-9"
+           style="fill:#009688;stroke-width:6.40007639">
+          <path
+             style="opacity:0.4;fill:#009688;stroke-width:6.40007639"
+             inkscape:connector-curvature="0"
+             class="fa-secondary"
+             d="M 176,96 200.5,21.21 A 16.22,16.22 0 0 0 183.1,0.12 C 80,12.42 0,101.61 0,208 0,322.9 93.1,416 208,416 l -24.5,74.79 a 16.24,16.24 0 0 0 17.4,21.1 C 304,499.58 384,410.39 384,304 384,189.1 290.9,96 176,96 Z m 16,256 a 96,96 0 1 1 96,-96 96,96 0 0 1 -96,96 z"
+             id="path2-3" />
+          <path
+             style="fill:#009688;stroke-width:6.40007639"
+             inkscape:connector-curvature="0"
+             class="fa-primary"
+             d="m 236,256 a 44,44 0 1 1 -44,-44 44,44 0 0 1 44,44 z"
+             id="path4-6" />
+        </g>
+        <g
+           class="fa-group"
+           id="g6-0"
+           transform="matrix(0.04134115,0,0,0.04134115,113.46846,173.06996)"
+           style="fill:#f44336;stroke-width:6.4000001">
+          <path
+             style="opacity:0.4;fill:#f44336;stroke-width:6.4000001"
+             inkscape:connector-curvature="0"
+             class="fa-secondary"
+             d="m 323.56,51.2 a 597.38,597.38 0 0 0 -56.22,60 C 240.08,73.62 206.28,35.53 168,0 69.74,91.17 0,210 0,281.6 0,408.85 100.29,512 224,512 347.71,512 448,408.85 448,281.6 448,228.33 396,118.46 323.56,51.2 Z m -1.12,366.87 A 165.81,165.81 0 0 1 226.86,448 C 182.93,448 142.43,433.11 112.8,406.08 A 146.18,146.18 0 0 1 76.92,355.69 C 68.35,335.82 64,314 64,290.75 c 0,-59.43 42.8,-106.39 104.3,-180.12 30,34.59 18.49,19.78 100.7,124.59 l 62,-70.74 c 24.32,40.25 27.78,45.59 34.84,59.1 a 157.93,157.93 0 0 1 15,104.62 c -7.49,36.85 -28.24,68.8 -58.4,89.87 z"
+             id="path2-62" />
+          <path
+             style="fill:#f44336;stroke-width:6.4000001"
+             inkscape:connector-curvature="0"
+             class="fa-primary"
+             d="M 304.09,391.85 A 134.39,134.39 0 0 1 226.86,416 C 154.71,416 96,368.26 96,290.75 96,252.14 120.31,218.12 168.79,160 c 6.93,8 98.83,125.34 98.83,125.34 l 58.63,-66.88 c 4.14,6.85 7.91,13.55 11.27,20 27.35,52.19 15.81,119 -33.43,153.42 z"
+             id="path4-61" />
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>

www/assets/images/weather-heat.svg

@@ -0,0 +1,103 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="512"
+   height="512"
+   viewBox="0 0 135.46666 135.46667"
+   version="1.1"
+   id="svg8"
+   inkscape:version="0.92.3 (2405546, 2018-03-11)"
+   sodipodi:docname="weather-heat.svg">
+  <defs
+     id="defs2" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.98994949"
+     inkscape:cx="185.98306"
+     inkscape:cy="204.76"
+     inkscape:document-units="px"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     units="px"
+     inkscape:window-width="1920"
+     inkscape:window-height="1013"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1" />
+  <metadata
+     id="metadata5">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-161.53332)">
+    <g
+       id="g877"
+       class="fa-group"
+       transform="matrix(0.15119047,0,0,0.15119047,33.866667,216.0375)"
+       style="fill:#8d6e63">
+      <path
+         id="path873"
+         d="m 256,32 32,128 v 112 a 16,16 0 0 1 -16,16 H 176 A 16,16 0 0 1 160,272 V 160 L 192,32 Z"
+         class="fa-secondary"
+         inkscape:connector-curvature="0"
+         style="opacity:0.4;fill:#8d6e63;fill-opacity:1" />
+      <path
+         id="path875"
+         d="m 446.7,160 c 0.4,-0.5 0.5,-0.7 0.9,-1.2 L 391.3,53.9 A 32,32 0 0 0 360.9,32 H 256 l 32,128 z M 160,160 192,32 H 87.1 A 32,32 0 0 0 56.7,53.9 L 0.4,158.8 c 0.4,0.5 0.5,0.7 0.9,1.2 z m 128,32 v 80 a 16,16 0 0 1 -16,16 H 176 A 16,16 0 0 1 160,272 V 192 H 0 v 256 a 32,32 0 0 0 32,32 h 384 a 32,32 0 0 0 32,-32 V 192 Z"
+         class="fa-primary"
+         inkscape:connector-curvature="0"
+         style="fill:#8d6e63;fill-opacity:1" />
+    </g>
+    <path
+       id="path941"
+       d="m 33.226771,181.53848 c -4.35002,0 -7.894177,3.54415 -7.894177,7.89418 0,4.35002 3.544157,7.89418 7.894177,7.89418 4.350022,0 7.894179,-3.54416 7.894179,-7.89418 0,-4.35003 -3.544157,-7.89418 -7.894179,-7.89418 z m 20.261728,6.61959 -7.787281,-3.88952 2.754742,-8.25599 c 0.370039,-1.11835 -0.69074,-2.17913 -1.800861,-1.80086 l -8.255996,2.75473 -3.89775,-7.79549 c -0.526279,-1.05257 -2.022884,-1.05257 -2.549162,0 l -3.889528,7.78727 -8.264218,-2.75473 c -1.11834,-0.37005 -2.179122,0.69073 -1.80086,1.80085 l 2.75474,8.256 -7.78728,3.89774 c -1.052558,0.52628 -1.052558,2.02289 0,2.54917 l 7.78728,3.88954 -2.75474,8.26421 c -0.370038,1.11834 0.690742,2.17911 1.80086,1.80085 l 8.255994,-2.75473 3.889529,7.78727 c 0.526278,1.05256 2.022883,1.05256 2.549161,0 l 3.889529,-7.78727 8.255994,2.75473 c 1.118344,0.37004 2.179122,-0.69073 1.80086,-1.80085 l -2.754738,-8.256 7.787278,-3.88952 c 1.069002,-0.53451 1.069002,-2.03112 0.01644,-2.5574 z m -12.819819,8.7165 c -4.103328,4.10333 -10.780488,4.10333 -14.883816,0 -4.103328,-4.10332 -4.103328,-10.78048 0,-14.88382 4.103328,-4.10333 10.780488,-4.10333 14.883816,0 4.103327,4.10334 4.103327,10.7805 0,14.88382 z"
+       inkscape:connector-curvature="0"
+       style="fill:#ff9800;stroke-width:0.08223102" />
+    <g
+       id="g2261"
+       transform="matrix(1.0404313,0,0,1.0404313,3.576078,-34.645711)"
+       style="stroke-width:0.96113992">
+      <g
+         id="g830"
+         transform="translate(35.151785,9.4494046)"
+         style="stroke-width:0.96113992">
+        <path
+           inkscape:connector-curvature="0"
+           style="fill:#ff0000;fill-opacity:0.58823529;stroke-width:0.25430158"
+           d="m 75.115703,283.73301 c 0,3.38829 -2.74674,6.13503 -6.13502,6.13503 -3.38829,0 -6.135032,-2.74674 -6.135032,-6.13503 0,-2.44721 1.43319,-4.55909 3.505732,-5.54387 v -26.00768 c 0,-1.45213 1.17716,-2.62929 2.6293,-2.62929 1.45213,0 2.62929,1.17716 2.62929,2.62929 v 26.00768 c 2.07254,0.98478 3.50573,3.09666 3.50573,5.54387 z"
+           id="path2-5"
+           sodipodi:nodetypes="ssscssscs" />
+        <path
+           id="path2257"
+           d="m 79.497845,252.18146 c 0,-5.80844 -4.70874,-10.51718 -10.51718,-10.51718 -5.80845,0 -10.51719,4.70874 -10.51719,10.51718 v 22.27748 c -2.16643,2.45499 -3.48754,5.67369 -3.50551,9.20099 -0.0393,7.70198 6.22124,14.0422 13.92311,14.09567 0.0328,2.2e-4 0.0668,3.2e-4 0.0996,3.2e-4 7.74525,0 14.0229,-6.27788 14.0229,-14.02291 0,-3.55601 -1.32429,-6.80221 -3.50572,-9.27407 z m -10.51718,41.1923 -0.0692,-2.2e-4 c -5.28883,-0.0367 -9.59847,-4.40078 -9.57141,-9.69125 0.0206,-4.02972 2.30305,-6.2035 3.50562,-7.56624 v -23.93459 c 0,-3.38281 2.75211,-6.13502 6.13503,-6.13502 3.3828,0 6.13502,2.75221 6.13502,6.13502 v 23.93459 c 1.18844,1.34664 3.50573,3.54528 3.50573,7.61696 -1.1e-4,5.31589 -4.32487,9.64075 -9.64087,9.64075 z"
+           style="fill:#90a4ae;fill-opacity:1;stroke-width:0.25430158"
+           inkscape:connector-curvature="0"
+           sodipodi:nodetypes="ssscccsscsccccssscccc" />
+      </g>
+    </g>
+  </g>
+</svg>

www/assets/images/weather-mostly-sunny.svg

@@ -0,0 +1,93 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="512"
+   height="512"
+   viewBox="0 0 135.46666 135.46667"
+   version="1.1"
+   id="svg8"
+   inkscape:version="0.92.3 (2405546, 2018-03-11)"
+   sodipodi:docname="weather-mostly-sunny.svg">
+  <defs
+     id="defs2" />
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.7"
+     inkscape:cx="-72.224488"
+     inkscape:cy="287.2296"
+     inkscape:document-units="px"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     units="px"
+     inkscape:window-width="1920"
+     inkscape:window-height="1013"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1" />
+  <metadata
+     id="metadata5">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-161.53332)">
+    <g
+       id="g877"
+       class="fa-group"
+       transform="matrix(0.15119047,0,0,0.15119047,33.866667,216.0375)"
+       style="fill:#8d6e63">
+      <path
+         id="path873"
+         d="m 256,32 32,128 v 112 a 16,16 0 0 1 -16,16 H 176 A 16,16 0 0 1 160,272 V 160 L 192,32 Z"
+         class="fa-secondary"
+         inkscape:connector-curvature="0"
+         style="opacity:0.4;fill:#8d6e63;fill-opacity:1" />
+      <path
+         id="path875"
+         d="m 446.7,160 c 0.4,-0.5 0.5,-0.7 0.9,-1.2 L 391.3,53.9 A 32,32 0 0 0 360.9,32 H 256 l 32,128 z M 160,160 192,32 H 87.1 A 32,32 0 0 0 56.7,53.9 L 0.4,158.8 c 0.4,0.5 0.5,0.7 0.9,1.2 z m 128,32 v 80 a 16,16 0 0 1 -16,16 H 176 A 16,16 0 0 1 160,272 V 192 H 0 v 256 a 32,32 0 0 0 32,32 h 384 a 32,32 0 0 0 32,-32 V 192 Z"
+         class="fa-primary"
+         inkscape:connector-curvature="0"
+         style="fill:#8d6e63;fill-opacity:1" />
+    </g>
+    <g
+       id="g958"
+       class="fa-group"
+       transform="matrix(-0.05876348,0,0,0.05876348,121.12338,164.9729)"
+       style="fill:#90a4ae">
+      <path
+         id="path956"
+         d="m 640,416 a 96,96 0 0 1 -96,96 H 224 a 96,96 0 0 1 -96,-96 c 0,-42.5 27.8,-78.2 66.1,-90.8 A 113.72,113.72 0 0 1 192,304 111.94,111.94 0 0 1 304,192 c 43.2,0 80.4,24.9 99,60.8 14.7,-17.5 36.4,-28.8 61,-28.8 a 80,80 0 0 1 80,80 78.09,78.09 0 0 1 -1.6,16.2 c 0.5,0 1,-0.2 1.6,-0.2 a 96,96 0 0 1 96,96 z"
+         class="fa-primary"
+         inkscape:connector-curvature="0"
+         style="opacity:0.4;fill:#90a4ae" />
+    </g>
+    <path
+       id="path941"
+       d="m 38.713321,182.43253 c -3.998547,0 -7.256342,3.25779 -7.256342,7.25635 0,3.99854 3.257795,7.25634 7.256342,7.25634 3.998547,0 7.256344,-3.2578 7.256344,-7.25634 0,-3.99856 -3.257797,-7.25635 -7.256344,-7.25635 z m 18.624618,6.08474 -7.158083,-3.57525 2.532163,-7.58892 c 0.34014,-1.02799 -0.634929,-2.00307 -1.655354,-1.65536 l -7.588928,2.53215 -3.582819,-7.16562 c -0.483756,-0.96753 -1.859438,-0.96753 -2.343194,0 l -3.575262,7.15807 -7.596484,-2.53215 c -1.027981,-0.34016 -2.003053,0.63492 -1.655354,1.65534 l 2.532162,7.58893 -7.158083,3.58281 c -0.967513,0.48376 -0.967513,1.85945 0,2.3432 l 7.158083,3.57528 -2.532162,7.59647 c -0.34014,1.02798 0.634931,2.00304 1.655354,1.65535 l 7.588925,-2.53216 3.575262,7.15808 c 0.483757,0.96751 1.859438,0.96751 2.343195,0 l 3.575261,-7.15808 7.588926,2.53216 c 1.027984,0.34014 2.003053,-0.63492 1.655354,-1.65535 l -2.53216,-7.58893 7.158079,-3.57525 c 0.982629,-0.49132 0.982629,-1.86701 0.0151,-2.35077 z m -11.784002,8.01222 c -3.771786,3.77179 -9.909445,3.77179 -13.681231,0 -3.771788,-3.77178 -3.771788,-9.90943 0,-13.68123 3.771786,-3.77179 9.909445,-3.77179 13.681231,0 3.771787,3.7718 3.771787,9.90945 0,13.68123 z"
+       inkscape:connector-curvature="0"
+       style="fill:#ff9800;stroke-width:0.08223102" />
+  </g>
+</svg>

www/assets/js/activitylog.js

@@ -0,0 +1,108 @@
+/*
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+
+
+function appendActivityLog(title, subtitle, content, icon, timestamp) {
+    if (typeof timestamp == "undefined") {
+        timestamp = time();
+    }
+    let entry = {
+        title: title,
+        subtitle: subtitle,
+        content: content,
+        icon: icon,
+        timestamp: timestamp
+    };
+
+    let log = getStorage("activitylog");
+    if (log == null) {
+        log = [];
+    } else {
+        try {
+            log = JSON.parse(log);
+        } catch (ex) {
+            log = [];
+        }
+    }
+
+    let pushed = false;
+    let datestr = formatTimestamp("Y-m-d", timestamp);
+    for (var i = 0; i < log.length; i++) {
+        if (formatTimestamp("Y-m-d", log[i].date) == datestr) {
+            log[i].entries.push(entry);
+            pushed = true;
+            break;
+        }
+    }
+    if (!pushed) {
+        log.push({
+            date: timestamp,
+            entries: [
+                entry
+            ]
+        });
+    }
+
+    console.log("Added activity log entry", entry);
+    console.log(log);
+
+    setStorage("activitylog", JSON.stringify(log));
+
+    // Trim the log soon but don't block for it
+    setTimeout(trimActivityLog, 100);
+}
+
+function clearActivityLog() {
+    setStorage("activitylog", "[]");
+}
+
+function trimActivityLog() {
+    let log = JSON.parse(getStorage("activitylog"));
+
+    log.sort(function (x, y) {
+        if (x.date < y.date) {
+            return 1;
+        } else if (x.date > y.date) {
+            return -1;
+        }
+        return 0;
+    });
+
+    let entries = 0;
+    let allowed = SETTINGS.activitylog_maxlength;
+
+    let newlog = [];
+
+    for (var i = 0; i < log.length; i++) {
+        let logdate = {
+            date: log[i].date,
+            entries: []
+        };
+        for (var j = 0; j < log[i].entries.length; j++) {
+            if (entries < allowed) {
+                logdate.entries.push(log[i].entries[j]);
+            }
+            entries++;
+        }
+        if (logdate.entries.length > 0) {
+            newlog.push(logdate);
+        }
+    }
+
+    if (entries - allowed > 0) {
+        newlog[newlog.length - 1].entries.push({
+            title: "Log Trimmed",
+            subtitle: "",
+            content: (entries - allowed) + " older " + ((entries - allowed) == 1 ? "entry was" : "entries were") + " removed from the log.",
+            icon: "fas fa-cut",
+            timestamp: newlog[newlog.length - 1].date
+        });
+    }
+
+    console.log(log);
+    console.log(newlog);
+    setStorage("activitylog", JSON.stringify(newlog));
+}

www/assets/js/add.js

@@ -0,0 +1,183 @@
+/*
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+
+$(".addpackagebtn").click(function () {
+    if ($("input[name=number]").val().trim() == "") {
+        playSound("error");
+        app.toast.show({
+            text: "Please fill in a street number.",
+            position: "bottom",
+            destroyOnClose: true,
+            closeTimeout: 1000 * 10
+        });
+        return;
+    }
+    if ($("input[name=street]").val().trim() == "") {
+        playSound("error");
+        app.toast.show({
+            text: "Please fill in a street name.",
+            position: "bottom",
+            destroyOnClose: true,
+            closeTimeout: 1000 * 10
+        });
+        return;
+    }
+    if ($("input[name=citystate]").val().trim() == "") {
+        playSound("error");
+        app.toast.show({
+            text: "Please fill in a city and state.",
+            position: "bottom",
+            destroyOnClose: true,
+            closeTimeout: 1000 * 10
+        });
+        return;
+    }
+    if ($("input[name=zipcode]").val().trim() == "") {
+        playSound("error");
+        app.toast.show({
+            text: "Please fill in a ZIP code.",
+            position: "bottom",
+            destroyOnClose: true,
+            closeTimeout: 1000 * 10
+        });
+        return;
+    }
+
+    // Save city/state if changed
+    if (getStorage("citystate") != $("input[name=citystate]").val().trim()) {
+        setStorage("citystate", $("input[name=citystate]").val().trim());
+    }
+
+    if (getStorage("zipcode") != $("input[name=zipcode]").val().trim()) {
+        setStorage("zipcode", $("input[name=zipcode]").val().trim());
+    }
+
+    var address = ($("input[name=number]").val() + " " + $("input[name=street]").val()).toUpperCase();
+    $("#no-history").addClass("display-none");
+    addPackageByAddress(
+            $("input[name=number]").val().toUpperCase(),
+            $("input[name=unit]").val().toUpperCase(),
+            $("input[name=street]").val().toUpperCase(),
+            $("input[name=citystate]").val().toUpperCase(),
+            $("input[name=zipcode]").val().toUpperCase(),
+            $("input[name=itemtype]:checked").val(),
+            function (ids) {
+                var packageObj = getPackage(ids.packageID);
+                // Reset item type to default
+                $("input[name=itemtype][data-default=1]").prop("checked", true);
+                $("#historylist").prepend('<li class="history-list-item item-content" data-package="' + ids.packageID + '">'
+                        + '  <div class="item-media">'
+                        + '    <i class="icon ' + getIconForType(packageObj.type) + '"></i>'
+                        + '  </div>'
+                        + '  <div class="item-inner">'
+                        + '    <div class="item-title">'
+                        + '      ' + packageObj.address
+                        + '    </div>'
+                        + '  </div>'
+                        + '</li>');
+                $("#tap-to-remove-history-prompt").removeClass("display-none");
+            });
+});
+
+// Remove any pre-existing click handlers from the history list,
+// otherwise the user will see a number of confirm prompts equal to the number
+// of times they've opened the add items page
+$(".view-main").off("click", "#historylist .history-list-item");
+
+$(".view-main").on("click", "#historylist .history-list-item", function () {
+    console.log("Info", "Asking to delete ", $(this).data("package"));
+    confirmDeletePackage(getPackage($(this).data("package")), function (id) {
+        console.log("Info", "Removing history item", id);
+        $('#historylist .history-list-item[data-package="' + id + '"]').remove();
+        if ($('#historylist .history-list-item').length == 0) {
+            $("#no-history").removeClass("display-none");
+            $("#tap-to-remove-history-prompt").addClass("display-none");
+        }
+    });
+});
+
+document.getElementById("housenumberinput").onfocus = function () {
+    document.getElementById("housenumberinput").value = "";
+}
+
+document.getElementById("unitinput").onfocus = function () {
+    document.getElementById("unitinput").value = "";
+}
+
+// Restore user's last entered city/state combo
+if (inStorage("citystate")) {
+    $("input[name=citystate]").val(getStorage("citystate").replace(/\s*[0-9]{5}$/, ""));
+}
+if (inStorage("zipcode") && getStorage("zipcode").trim() != "") {
+    $("input[name=zipcode]").val(getStorage("zipcode"));
+} else {
+    if (inStorage("citystate") && /^.+ [0-9]{5}$/.test(getStorage("citystate"))) {
+        $("input[name=zipcode]").val(getStorage("citystate").split(" ").pop());
+    }
+}
+
+function toggleLettersInAddressNumber() {
+    if ($("#address-has-letters-checkbox").prop("checked")) {
+        // disallow
+        $("#address-has-letters-checkbox").prop("checked", false);
+        $("#housenumberinput").attr("type", "number");
+        $("#housenumberinput").attr("placeholder", "1234");
+    } else {
+        // allow
+        $("#address-has-letters-checkbox").prop("checked", true);
+        $("#housenumberinput").attr("type", "text");
+        $("#housenumberinput").attr("placeholder", "1A2B3");
+    }
+}
+
+
+function setTabSwipable() {
+    var page = $(".page[data-name=add]");
+
+    // If the page has grown larger, refresh to disable swiping tabs
+    if (page.width() >= 768 && $(".tabs-swipeable-wrap")[0]) {
+        router.refreshPage();
+    }
+}
+
+function addPackageBarcode(code) {
+    playSound("scan");
+    if (code != "") {
+        addPackageByBarcode(code, $("input[name=itemtype]:checked").val(),
+                function (ids) {
+                    var packageObj = getPackage(ids.packageID);
+                    // Reset item type to default
+                    $("input[name=itemtype][data-default=1]").prop("checked", true);
+                    $("#historylist").prepend('<li class="history-list-item item-content" data-package="' + ids.packageID + '">'
+                            + '  <div class="item-media">'
+                            + '    <i class="icon ' + getIconForType(packageObj.type) + '"></i>'
+                            + '  </div>'
+                            + '  <div class="item-inner">'
+                            + '    <div class="item-title">'
+                            + '      ' + packageObj.address
+                            + '    </div>'
+                            + '  </div>'
+                            + '</li>');
+                    $("#tap-to-remove-history-prompt").removeClass("display-none");
+                    $("#no-history").addClass("display-none");
+                });
+    } else {
+        app.dialog.alert("Invalid barcode.", "Error");
+    }
+}
+
+$(".scanbarcodebtn").click(function () {
+    scanBarcode(function (code) {
+        addPackageBarcode(code);
+    }, function (error) {
+        app.dialog.alert(error, "Error");
+    });
+});
+
+
+$(window).on('resize', setTabSwipable);
+
+setTabSwipable();

www/assets/js/audio.js

@@ -7,15 +7,15 @@
 var sfx = {};
 
 function initSFX() {
-    if (localStorage.getItem("alertsound") == null) {
-        localStorage.setItem("alertsound", "sonar");
+    if (getStorage("alertsound") == null) {
+        setStorage("alertsound", "sonar");
     }
-    if (localStorage.getItem("alertvolume") == null) {
-        localStorage.setItem("alertvolume", 100);
+    if (getStorage("alertvolume") == null) {
+        setStorage("alertvolume", 100);
     }
 
-    var alertNoiseFile = SETTINGS.alertsounds[localStorage.getItem("alertsound")].file;
-    var alertVolume = localStorage.getItem("alertvolume");
+    var alertNoiseFile = SETTINGS.alertsounds[getStorage("alertsound")].file;
+    var alertVolume = getStorage("alertvolume");
 
     sfx = {
         "alert": new Audio("assets/audio/" + alertNoiseFile),

www/assets/js/autofill.js

@@ -7,12 +7,12 @@
 var autofillDB = {};
 var autofillStreetDB = [];
 
-if (localStorage.getItem("autofill_db") != null) {
-    autofillDB = JSON.parse(localStorage.getItem("autofill_db"));
+if (getStorage("autofill_db") != null) {
+    autofillDB = JSON.parse(getStorage("autofill_db"));
 }
 
-if (localStorage.getItem("autofill_streetdb") != null) {
-    autofillStreetDB = JSON.parse(localStorage.getItem("autofill_streetdb"));
+if (getStorage("autofill_streetdb") != null) {
+    autofillStreetDB = JSON.parse(getStorage("autofill_streetdb"));
 }
 
 function addressToNumberAndStreet(address) {
@@ -54,7 +54,7 @@ function addAutofillEntry(address) {
         }
     }
 
-    localStorage.setItem("autofill_db", JSON.stringify(autofillDB));
+    setStorage("autofill_db", JSON.stringify(autofillDB));
 
 
     var found = false;
@@ -70,7 +70,7 @@ function addAutofillEntry(address) {
         autofillStreetDB.push([street, 1]);
     }
 
-    localStorage.setItem("autofill_streetdb", JSON.stringify(autofillStreetDB));
+    setStorage("autofill_streetdb", JSON.stringify(autofillStreetDB));
 }
 
 function searchAutofill(q, number) {
@@ -132,4 +132,21 @@ function searchAutofillByStreet(q) {
     }
 
     return streets;
+}
+
+function setupStreetAutofill(streetBox, numberBox) {
+    app.autocomplete.create({
+        inputEl: streetBox,
+        openIn: 'dropdown',
+        /* If we set valueProperty to "id" then input value on select will be set according to this property */
+        valueProperty: 'name', //object's "value" property name
+        textProperty: 'name', //object's "text" property name
+        limit: 10, //limit to 10 results
+        typeahead: true,
+        dropdownPlaceholderText: '',
+        source: function (query, render) {
+            var streets = searchAutofill(query, $(numberBox).val());
+            render(streets);
+        }
+    });
 }

www/assets/js/hardscan.js

@@ -0,0 +1,56 @@
+/*
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+
+function setupHardwareScanner() {
+    try {
+        onScan.detachFrom(document);
+    } catch (ex) {
+        // do nothing
+    }
+
+    if (getStorage("hardwarescanner") == "true") {
+        onScan.attachTo(document, {
+            suffixKeyCodes: [13], // enter-key expected at the end of a scan
+            reactToKeyDown: true,
+            reactToPaste: true, // Compatibility to built-in scanners in paste-mode (as opposed to keyboard-mode)
+            ignoreIfFocusOn: 'input',
+            stopPropagation: true,
+            preventDefault: true,
+            keyCodeMapper: function (evt) {
+                // Handle special char codes
+                switch (evt.which) {
+                    case 119: // F8, separates 42012345 from actual tracking barcode
+                        return "";
+                }
+
+                var char = String.fromCharCode(evt.which);
+                // Handle special characters
+                switch (char) {
+                    case "\u0010": // In some fields in UPS MI codes but pointless
+                        return "";
+                }
+                // Return everything that gets through the special cases above
+                return char;
+            },
+            onScan: function (code, qty) { // Alternative to document.addEventListener('scan')
+                console.log("Scanned: ", code);
+                switch (router.currentRoute.name) {
+                    case "add":
+                        addPackageBarcode(code);
+                        break;
+                    case "track":
+                        openTrackingHistory(code);
+                        break;
+                    case "scanner":
+                        addCodeToScannerList(code);
+                        break;
+                }
+            }
+        });
+    }
+}
+
+setupHardwareScanner();

www/assets/js/list.js

@@ -10,19 +10,17 @@ $(".view-main").on("click", "#addresslist .package-list-item .deliver-btn", func
     loadPackageList();
 });
 
-// Open geo: url
-$(".view-main").on("click", "#addresslist .package-list-item .directions-btn", function () {
-    window.open($(this).attr("href"), "_system");
-});
-
-$(".view-main").on("swipeout:delete", "#addresslist .package-list-item", function () {
-    console.log("Info", "Deleting package", $(this).data("packageid"));
-    deletePackage($(this).data("packageid"));
+$(".view-main").on("click", "#addresslist .package-list-item .delete-btn", function () {
+    var id = $(this).parents(".package-list-item").data("packageid");
+    console.log("Info", "Deleting package", id);
+    deletePackage(id);
 });
 
 // Searchbar is setup in routes.js, this is for forcing a wider scope
 var searchbar = null;
 
+var itemVirtualList = null;
+
 /**
  * Update package distances relative to the passed coordinates.
  * @param {type} latitude
@@ -41,13 +39,13 @@ function updateDistances(latitude, longitude) {
 function loadPackageList(sortType) {
     // If no sort type is specified, use the saved pref or a default one
     if (typeof sortType == 'undefined') {
-        if (localStorage.getItem("sorttype") == null) {
-            localStorage.setItem("sorttype", "distance_asc");
+        if (getStorage("sorttype") == null) {
+            setStorage("sorttype", "distance_asc");
         }
-        sortType = localStorage.getItem("sorttype");
+        sortType = getStorage("sorttype");
     } else {
         // save the current sorting order so it'll stay consistent next time the list is refreshed
-        localStorage.setItem("sorttype", sortType);
+        setStorage("sorttype", sortType);
     }
 
     updateDistances(userPosition.coords.latitude, userPosition.coords.longitude);
@@ -92,7 +90,7 @@ function loadPackageList(sortType) {
 
     });
 
-    $("#addresslist").html("");
+    $("#addresslist ul").html("");
 
     if (packages.length == 0) {
         $("#no-packages-display").removeClass("display-none");
@@ -100,46 +98,101 @@ function loadPackageList(sortType) {
         $("#no-packages-display").addClass("display-none");
     }
 
+    var items = [];
     for (var i = 0; i < sortedPackages.length; i++) {
         for (var j = 0; j < sortedPackages[i].value.items.length; j++) {
             var item = sortedPackages[i].value.items[j];
-            var icon = getIconForType(item.type);
+            var icon1 = getIconForType(item.type);
+            var icon2 = "";
             var classes = "";
             var delivered = false;
             if (item.delivered) {
                 delivered = true;
-                icon = "far fa-check-circle";
+                icon2 = icon1;
+                icon1 = "far fa-check-circle fa-fw";
                 classes = "text-color-green";
-            } else if (typeof sortedPackages[i].value.distance != 'undefined' && sortedPackages[i].value.distance * 1 < localStorage.getItem("alertradius") * 1) {
+            } else if (typeof sortedPackages[i].value.distance != 'undefined' && sortedPackages[i].value.distance * 1 < getStorage("alertradius") * 1) {
                 classes = "text-color-deeporange";
             }
-            $("#addresslist").append(
-                    '<li class="swipeout package-list-item" data-packageid="' + item.id + '" data-coordid=' + sortedPackages[i].value.id + '>'
-                    + '<div class="item-content swipeout-content ' + classes + '" data-packageid="' + item.id + '" data-latitude="' + sortedPackages[i].value.coords[0] + '" data-longitude="' + sortedPackages[i].value.coords[1] + '">'
-                    + '  <div class="item-media ' + classes + '">'
-                    + '    <i class="icon ' + icon + '"></i>'
-                    + '  </div>'
-                    + '  <div class="item-inner">'
-                    + '    <div class="item-title">'
-                    + '       ' + item.address
-                    + '    </div>'
-                    + '    <div class="item-footer">'
-                    + '      <span class="distance">' + (typeof sortedPackages[i].value.distance != 'undefined' ? getDisplayDistance(sortedPackages[i].value.distance) : '...') + '</span>'
-                    + '    </div>'
-                    + '  </div>'
-                    + '</div>'
-                    + '<div class="swipeout-actions-left">'
-                    + '  <a href="#" class="color-green deliver-btn" data-packageid="' + item.id + '">' + (delivered ? "<i class='fas fa-undo'></i>&nbsp; Undeliver" : "<i class='fas fa-check'></i>&nbsp; Deliver") + '</a>'
-                    + '  <a href="geo:' + sortedPackages[i].value.coords[0] + ',' + sortedPackages[i].value.coords[1] + '" class="color-blue directions-btn"><i class="material-icons">directions</i></a>'
-                    + '</div>'
-                    + '<div class="swipeout-actions-right">'
-                    + '  <a href="#" class="swipeout-delete"><i class="material-icons">delete</i>&nbsp; Delete</a>'
-                    + '</div>'
-                    + '</li>'
-                    );
+            items.push({
+                id: item.id,
+                coordid: sortedPackages[i].value.id,
+                classes: classes,
+                latitude: sortedPackages[i].value.coords[0],
+                longitude: sortedPackages[i].value.coords[1],
+                icon1: icon1,
+                icon2: icon2,
+                address: item.address,
+                distance: (typeof sortedPackages[i].value.distance != 'undefined' ? getDisplayDistance(sortedPackages[i].value.distance) : '...'),
+                delivered: delivered,
+                geolink: 'geo:' + sortedPackages[i].value.coords[0] + ',' + sortedPackages[i].value.coords[1]
+            });
         }
     }
 
+    itemTemplateAccordion = '<li class="package-list-item accordion-item" data-packageid="{{id}}" data-coordid="{{coordid}}">'
+            + '<div class="item-content item-link {{classes}}" data-packageid="{{id}}" data-latitude="{{latitude}}" data-longitude="{{longitude}}">'
+            + '  <div class="item-inner">'
+            + '    <div class="item-title">'
+            + '       <i class="{{icon1}}"></i>'
+            + '       {{address}}'
+            + '    </div>'
+            + '    <div class="item-footer">'
+            + '      <i class="{{icon2}}"></i>'
+            + '      <span class="distance">{{distance}}</span>'
+            + '    </div>'
+            + '  </div>'
+            + '</div>'
+            + '<div class="accordion-item-content">'
+            + '  <div class="row padding-horizontal">'
+            + '    <a href="#" class="col deliver-btn button button-outline color-green" data-packageid="{{id}}">{{#if delivered}}<i class="fas fa-undo"></i> Undeliver{{else}}<i class="fas fa-check"></i>&nbsp; Deliver{{/if}}</a>'
+            + '    <a href="{{geolink}}" class="col geolink directions-btn button button-outline"><i class="fas fa-directions"></i> Directions</a>'
+            + '    <a href="#" class="col delete-btn color-red button button-outline"><i class="fas fa-trash"></i> Delete</a>'
+            + '  </div>'
+            + '  </div>'
+            + '</div>'
+            + '</li>';
+
+    itemTemplateSwipe = '<li class="swipeout package-list-item" data-packageid="{{id}}" data-coordid="{{coordid}}">'
+            + '<div class="item-content swipeout-content {{classes}}" data-packageid="{{id}}" data-latitude="{{latitude}}" data-longitude="{{longitude}}">'
+            + '  <div class="item-media {{classes}}">'
+            + '    <i class="icon {{icon1}}"></i>'
+            + '  </div>'
+            + '  <div class="item-inner">'
+            + '    <div class="item-title">'
+            + '       {{address}}'
+            + '    </div>'
+            + '    <div class="item-footer">'
+            + '      <span class="distance">{{distance}}</span>'
+            + '    </div>'
+            + '  </div>'
+            + '</div>'
+            + '<div class="swipeout-actions-left">'
+            + '  <a href="#" class="color-green deliver-btn" data-packageid="{{id}}">{{#if delivered}}<i class="fas fa-undo"></i> &nbsp; Undeliver{{else}}<i class="fas fa-check"></i>&nbsp; Deliver{{/if}}</a>'
+            + '  <a href="{{geolink}}" class="color-blue directions-btn"><i class="material-icons">directions</i></a>'
+            + '</div>'
+            + '<div class="swipeout-actions-right">'
+            + '  <a href="#" class="color-red delete-btn"><i class="material-icons">delete</i>&nbsp; Delete</a>'
+            + '</div>'
+            + '</li>';
+
+
+    itemVirtualList = app.virtualList.create({
+        el: "#addresslist",
+        items: items,
+        searchAll: function (query, items) {
+            query = query.toLowerCase();
+            var found = [];
+            for (var i = 0; i < items.length; i++) {
+                if (items[i].address.toLowerCase().indexOf(query) >= 0 || query.trim() === '') {
+                    found.push(i);
+                }
+            }
+            return found; //return array with mathced indexes
+        },
+        itemTemplate: (getStorage("liststyle") == "swipe" ? itemTemplateSwipe : itemTemplateAccordion)
+    });
+
     // If there was a search open when the reload was triggered
     if (router.currentRoute.name == "list") {
         var searchboxVal = $(".package-list-searchbar input[type=search]").val();
@@ -156,8 +209,11 @@ function confirmDeleteAllPackages() {
             "Clear Packages",
             function () {
                 // clear
+                let count = countPackages();
+                let remaining = countRemainingPackages();
                 packages = [];
-                localStorage.setItem("packages", JSON.stringify(packages));
+                setStorage("packages", JSON.stringify(packages));
+                appendActivityLog("Cleared List", count + " " + (count != 1 ? "items" : "item") + " removed.", (remaining > 0 ? remaining + " " + (remaining != 1 ? "were" : "was") + " not delivered." : ""), "fas fa-trash");
                 loadPackageList();
                 if (map != null) {
                     map.updatePackageLayer(packages);

www/assets/js/location.js

@@ -11,13 +11,14 @@ var userPosition = {
         latitude: 0.0,
         longitude: 0.0,
         accuracy: 999999
-    }
+    },
+    updated: 0
 };
 
 // Preload last known location while GPS warms up
-if (localStorage.getItem("user_latitude") != null && localStorage.getItem("user_longitude") != null) {
-    userPosition.coords.latitude = localStorage.getItem("user_latitude");
-    userPosition.coords.longitude = localStorage.getItem("user_longitude");
+if (getStorage("user_latitude") != null && getStorage("user_longitude") != null) {
+    userPosition.coords.latitude = getStorage("user_latitude");
+    userPosition.coords.longitude = getStorage("user_longitude");
 }
 
 // Request the user's IP geolocation as a poor substitute for an actual location
@@ -31,6 +32,7 @@ $.ajax({
             userPosition.coords.latitude = resp.location.latitude;
             userPosition.coords.longitude = resp.location.longitude;
             userPosition.coords.accuracy = 99999;
+            userPosition.updated = time();
         }
     }
 });
@@ -41,16 +43,17 @@ var mapLocationControlStarted = false;
 
 if ("geolocation" in navigator) {
     navigator.geolocation.watchPosition(function (position) {
-        userPosition = position;
-        localStorage.setItem("user_latitude", userPosition.coords.latitude);
-        localStorage.setItem("user_longitude", userPosition.coords.longitude);
+        userPosition.coords = position.coords;
+        userPosition.updated = time();
+        setStorage("user_latitude", userPosition.coords.latitude);
+        setStorage("user_longitude", userPosition.coords.longitude);
         if (mapLocationControlStarted) {
             // Don't refresh at an interval less than ten seconds
             var currentTimestamp = Math.floor(Date.now() / 1000);
             if (lastGpsUpdateTimestamp < (currentTimestamp - 10)) {
                 updateDistances(position.coords.latitude, position.coords.longitude);
 
-                var alertinterval = localStorage.getItem("alertinterval");
+                var alertinterval = getStorage("alertinterval");
                 if (alertinterval == null) {
                     alertinterval = 30;
                 } else {
@@ -59,7 +62,7 @@ if ("geolocation" in navigator) {
 
                 lastGpsUpdateTimestamp = currentTimestamp;
                 for (var i = 0; i < packages.length; i++) {
-                    if (packages[i].distance * 1 < localStorage.getItem("alertradius") * 1) {
+                    if (packages[i].distance * 1 < getStorage("alertradius") * 1) {
 
                         if (packages[i].lastAlert > currentTimestamp - alertinterval) {
                             continue;
@@ -178,7 +181,7 @@ function getDisplayDistance(meters, space) {
     if (typeof space == 'undefined') {
         space = true;
     }
-    var units = localStorage.getItem("units");
+    var units = getStorage("units");
 
     if (units == null) {
         units = "metric";

www/assets/js/login.js

@@ -0,0 +1,37 @@
+/*
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+
+
+$(window).on("message", function (e) {
+    var data = e.originalEvent.data;
+    var parts = data.split("&");
+    var u = "";
+    var p = "";
+
+    for (var i = 0; i < parts.length; i++) {
+        if (parts[i].startsWith("user:")) {
+            u = parts[i].replace("user:", "");
+        } else if (parts[i].startsWith("password:")) {
+            p = parts[i].replace("password:", "");
+        }
+    }
+
+    if (u != "" && p != "") {
+        setStorage("username", u);
+        setStorage("password", p);
+        // Reset last change so we won't overwrite server settings
+        setStorage("lastchange", 0, true);
+        app.toast.show({
+            text: "You are now logged in!",
+            position: "bottom",
+            destroyOnClose: true,
+            closeTimeout: 1000 * 3
+        });
+        restartApplication();
+    } else {
+        app.dialog.alert("There was a problem. Try again later.", "Error");
+    }
+});

www/assets/js/main.js

@@ -28,7 +28,8 @@ var app = new Framework7({
 });
 
 var mainView = app.views.create('.view-main', {
-    url: "/"
+    url: "/",
+    animate: true
 });
 
 var router = mainView.router;
@@ -37,18 +38,6 @@ function restartApplication() {
     window.location = "index.html";
 }
 
-/**
- * Generate a UUID.
- * From https://stackoverflow.com/a/2117523
- * @returns {String}
- */
-function uuidv4() {
-    return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
-        var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);
-        return v.toString(16);
-    });
-}
-
 
 router.on("pageInit", function (pagedata) {
     pagedata.$el.find('script').each(function (el) {
@@ -60,6 +49,42 @@ router.on("pageInit", function (pagedata) {
             eval($$(this).text());
         }
     });
+    // Stop text selection from popping a system toolbar even after changing pages
+    if (window.getSelection) {
+        window.getSelection().removeAllRanges();
+    } else if (document.selection) {
+        document.selection.empty();
+    }
+});
+
+/**
+ * Perform back button behavior.
+ * Call this function whenever the equivalent to the Android back button is pressed.
+ * @returns {undefined}
+ */
+function handleBackButton() {
+    // Close map sheet if it's open
+    if ($(".sheet-modal").hasClass("modal-in")) {
+        app.sheet.close();
+    } else if ($(".searchbar-enabled")[0]) {
+        app.searchbar.disable();
+    } else if (scanningBarcode) {
+        return;
+    } else {
+        router.back({force: true, ignoreCache: true});
+    }
+    // Stop text selection from popping a system toolbar even after changing pages
+    if (window.getSelection) {
+        window.getSelection().removeAllRanges();
+    } else if (document.selection) {
+        document.selection.empty();
+    }
+}
+
+$(document).keyup(function (e) {
+    if (e.key === "Escape" || e.keyCode == 27) {
+        handleBackButton();
+    }
 });
 
 router.on("routeChange", function (newRoute) {
@@ -67,19 +92,89 @@ router.on("routeChange", function (newRoute) {
 });
 
 // Set alert radius to 100 meters by default
-if (localStorage.getItem("alertradius") == null) {
-    localStorage.setItem("alertradius", 100);
+if (getStorage("alertradius") == null) {
+    setStorage("alertradius", 100);
 }
 
 // Set default alert sound volume
-if (localStorage.getItem("alertvolume") == null) {
-    localStorage.setItem("alertvolume", 100);
+if (getStorage("alertvolume") == null) {
+    setStorage("alertvolume", 100);
 }
 
-if (localStorage.getItem("darktheme") == "true") {
-    $("#app").addClass("theme-dark");
+function setAppTheme(theme) {
+    if (theme == "light") {
+        $("#app").removeClass("theme-dark");
+        if (platform_type == "cordova" && cordova.platformId == 'android' && typeof StatusBar !== 'undefined') {
+            StatusBar.styleDefault();
+            StatusBar.backgroundColorByHexString("#E0E0E0");
+        }
+    } else if (theme == "dark" || theme == "oleddark") {
+        $("#app").addClass("theme-dark");
+        if (platform_type == "cordova" && cordova.platformId == 'android' && typeof StatusBar !== 'undefined') {
+            StatusBar.styleLightContent();
+            StatusBar.backgroundColorByHexString("#000000");
+        }
+    }
+
+    if (theme == "oleddark") {
+        $("#app").addClass("oled-burn-in");
+    } else {
+        $("#app").removeClass("oled-burn-in");
+    }
 }
 
-initPlatform();
+function applyColorTheme() {
+    if (getStorage("apptheme") == "dark") {
+        setAppTheme("dark");
+    } else if (getStorage("apptheme") == "light") {
+        setAppTheme("light");
+    } else if (getStorage("apptheme") == "oleddark") {
+        setAppTheme("oleddark");
+    } else {
+        // automatic theme, default light
+        if (typeof Framework7.device.prefersColorScheme() !== 'undefined' && Framework7.device.prefersColorScheme() == "dark") {
+            setAppTheme("dark");
+        } else {
+            setAppTheme("light");
+        }
+    }
+}
+
+/**
+ * Turn animations on or off.
+ * @param {boolean} on true for on, false for off.
+ * @returns {undefined}
+ */
+function toggleAnimations(on) {
+    if (on) {
+        $("#app").removeClass("no-animation");
+    } else {
+        $("#app").addClass("no-animation");
+    }
+    mainView.params.animate = on;
+}
+
+/**
+ * Turn animations on or off while considering user preferences.
+ * @param boolean enabled true to enable, false to disable, undefined to use animation=on/off setting.
+ * @returns {undefined}
+ */
+function setAnimations(enabled) {
+    if (getStorage("animation") == null) {
+        setStorage("animation", "auto");
+    }
+    if (typeof enabled !== "undefined") {
+        toggleAnimations(enabled == true);
+        return;
+    }
+    if (getStorage("animation") == "off") {
+        toggleAnimations(false);
+    } else if (getStorage("animation") == "on") {
+        toggleAnimations(true);
+    }
+}
+
+applyColorTheme();
+setAnimations();
 
 router.navigate("/home");

www/assets/js/manage.js

@@ -1,87 +0,0 @@
-/*
- * This Source Code Form is subject to the terms of the Mozilla Public
- * License, v. 2.0. If a copy of the MPL was not distributed with this
- * file, You can obtain one at http://mozilla.org/MPL/2.0/.
- */
-
-$("#addpackagebtn").click(function () {
-    if ($("input[name=number]").val().trim() == "") {
-        playSound("error");
-        app.toast.show({
-            text: "Please fill in a street number.",
-            position: "bottom",
-            destroyOnClose: true,
-            closeTimeout: 1000 * 10
-        });
-        return;
-    }
-    if ($("input[name=street]").val().trim() == "") {
-        playSound("error");
-        app.toast.show({
-            text: "Please fill in a street name.",
-            position: "bottom",
-            destroyOnClose: true,
-            closeTimeout: 1000 * 10
-        });
-        return;
-    }
-    if ($("input[name=citystate]").val().trim() == "") {
-        playSound("error");
-        app.toast.show({
-            text: "Please fill in a city and state.",
-            position: "bottom",
-            destroyOnClose: true,
-            closeTimeout: 1000 * 10
-        });
-        return;
-    }
-
-    // Save city/state if changed
-    if (localStorage.getItem("citystate") != $("input[name=citystate]").val().trim()) {
-        localStorage.setItem("citystate", $("input[name=citystate]").val().trim());
-    }
-
-    var address = ($("input[name=number]").val() + " " + $("input[name=street]").val()).toUpperCase();
-    $("#no-history").addClass("display-none");
-    addPackageByAddress(
-            $("input[name=number]").val().toUpperCase(),
-            $("input[name=street]").val().toUpperCase(),
-            $("input[name=citystate]").val().toUpperCase(),
-            $("input[name=itemtype]:checked").val(),
-            function (ids) {
-                var packageObj = getPackage(ids.packageID);
-                // Reset item type to default
-                $("input[name=itemtype][data-default=1]").prop("checked", true);
-                $("#historylist").prepend('<li class="history-list-item item-content" data-package="' + ids.packageID + '">'
-                        + '  <div class="item-media">'
-                        + '    <i class="icon ' + getIconForType(packageObj.type) + '"></i>'
-                        + '  </div>'
-                        + '  <div class="item-inner">'
-                        + '    <div class="item-title">'
-                        + '      ' + packageObj.address
-                        + '    </div>'
-                        + '  </div>'
-                        + '</li>');
-            });
-});
-
-// Remove any pre-existing click handlers from the history list,
-// otherwise the user will see a number of confirm prompts equal to the number
-// of times they've opened the manage page
-$(".view-main").off("click", "#historylist .history-list-item");
-
-$(".view-main").on("click", "#historylist .history-list-item", function () {
-    console.log("Info", "Asking to delete ", $(this).data("package"));
-    confirmDeletePackage(getPackage($(this).data("package")), function (id) {
-        console.log("Info", "Removing history item", id);
-        $('#historylist .history-list-item[data-package="' + id + '"]').remove();
-        if ($('#historylist .history-list-item').length == 0) {
-            $("#no-history").removeClass("display-none");
-        }
-    });
-});
-
-// Restore user's last entered city/state combo
-if (localStorage.getItem("citystate") != null) {
-    $("input[name=citystate]").val(localStorage.getItem("citystate"));
-}

www/assets/js/map.js

@@ -9,10 +9,10 @@ var map = null;
 var maptype = "mapbox";
 
 function createMap() {
-    if (localStorage.getItem("maptype") == null) {
-        localStorage.setItem("maptype", "mapbox");
+    if (getStorage("maptype") == null) {
+        setStorage("maptype", "mapbox");
     }
-    maptype = localStorage.getItem("maptype");
+    maptype = getStorage("maptype");
     if (maptype == "mapbox") {
         if (mapboxgl.supported()) {
             map = mapboxMap();
@@ -70,23 +70,46 @@ function reloadMap() {
     }
 }
 
-$("#app").on("click", "#package-info-sheet #package-info-get-directions", function () {
-    window.open($(this).attr("href"), "_system");
-});
-
 $("#app").on("click", "#package-info-sheet #package-info-sheet-inner .list ul li .item-content", function () {
     markDelivered($(this).data("id"));
     map.updatePackageLayer(packages);
     openPackageInfoSheet($(this).data("coordid"), true);
 });
 
+$("#app").on("sheet:close", "#package-info-sheet", function () {
+    map.openedPanelIconID = null;
+    $(".package-marker").removeClass("selected");
+});
+
+$("#app").on("click", "#package-info-sheet #package-info-deliver-all", function () {
+    var coordid = $(this).data("coordid");
+    for (var i = 0; i < packages.length; i++) {
+        if (packages[i].id == coordid) {
+            package = packages[i];
+            for (var j = 0; j < package.items.length; j++) {
+                if (package.items[j].delivered) {
+                    continue;
+                }
+                markDelivered(package.items[j].id, true);
+            }
+            break;
+        }
+    }
+    map.updatePackageLayer(packages);
+    openPackageInfoSheet(coordid, true);
+});
+
 function openPackageInfoSheet(coordid, refreshOnly) {
+    map.openedPanelIconID = coordid;
     if (typeof refreshOnly == "undefined") {
         refreshOnly = false;
     }
 
     //console.log("Packages array: ", packages);
 
+    $(".package-marker").removeClass("selected"); // prevent multiple highlights when switching icons in tablet mode
+    $(".package-marker#marker-" + coordid).addClass("selected");
+
     for (var i = 0; i < packages.length; i++) {
         if (packages[i].id == coordid) {
             package = packages[i];
@@ -94,6 +117,7 @@ function openPackageInfoSheet(coordid, refreshOnly) {
 
             $("#package-info-get-directions").attr("href", "geo:" + package.coords[0] + "," + package.coords[1]);
             $("#package-info-sheet-inner .list ul").html("");
+            $("#package-info-deliver-all").data("coordid", coordid);
 
             for (var j = 0; j < package.items.length; j++) {
                 var classes = "";
@@ -118,6 +142,7 @@ function openPackageInfoSheet(coordid, refreshOnly) {
             if (!refreshOnly) {
                 app.sheet.create({el: "#package-info-sheet"}).open();
             }
+            break;
         }
     }
 }

www/assets/js/map_leaflet.js

@@ -16,13 +16,13 @@ function leafletMap() {
 
     map.maptype = "leaflet";
 
-    if (localStorage.getItem("mapsource") == null) {
-        localStorage.setItem("mapsource", "liberty");
+    if (getStorage("mapsource") == null) {
+        setStorage("mapsource", "liberty");
     }
 
-    $("#mapbox").css("background-color", SETTINGS.maptileurls[localStorage.getItem("mapsource")].bgcolor);
+    $("#mapbox").css("background-color", SETTINGS.maptileurls[getStorage("mapsource")].bgcolor);
 
-    L.tileLayer(SETTINGS.maptileurls[localStorage.getItem("mapsource")].url, {
+    L.tileLayer(SETTINGS.maptileurls[getStorage("mapsource")].url, {
         minZoom: 1,
         maxZoom: 19
     }).addTo(map);
@@ -32,7 +32,7 @@ function leafletMap() {
         showPopup: false,
         locateOptions: {
             enableHighAccuracy: true,
-            maxZoom: localStorage.getItem("trackzoom") == null ? 16 : localStorage.getItem("trackzoom") * 1
+            maxZoom: getStorage("trackzoom") == null ? 16 : getStorage("trackzoom") * 1
         },
         setView: "untilPanOrZoom",
         icon: "far fa-compass",
@@ -64,6 +64,8 @@ function leafletMap() {
         });
     }
 
+    map.openedPanelIconID = null;
+
     map.updatePackageLayer = function (data) {
         map.packagelayer.clearLayers();
 
@@ -77,10 +79,22 @@ function leafletMap() {
                 var iconName = getMapIconForItems(datai.items);
                 //console.log(iconName);
 
+                var classes = "package-marker package-marker-leaflet";
+
+                // Prevent selection highlight from going away after map refresh
+                if (map.openedPanelIconID != null && map.openedPanelIconID == datai.id) {
+                    classes += " selected";
+                }
+                // Show different color highlight when nearby and undelivered
+                if (packages[i].distance * 1 < getStorage("alertradius") * 1
+                        && getUndeliveredCount(packages[i]) > 0) {
+                    classes += " alerted";
+                }
                 var icon = L.icon({
                     iconUrl: "assets/images/" + iconName + ".png",
                     iconSize: [25, 25],
-                    iconAnchor: [12.5, 12.5]
+                    iconAnchor: [12.5, 12.5],
+                    className: classes
                 });
 
                 var marker = L.marker(
@@ -89,13 +103,16 @@ function leafletMap() {
                             datai.coords[1]
                         ],
                         {
-                            icon: icon
+                            icon: icon,
                         })
                         .on("click", function () {
-                            openPackageInfoSheet(datai.id)
+                            marker._icon.id = "marker-" + datai.id;
+                            openPackageInfoSheet(datai.id);
                         });
 
                 map.packagelayer.addLayer(marker);
+
+                //L.DomUtil.addClass(marker._icon, 'package-marker'); // enable selected CSS to work correctly
             })(data[i]);
         }
     }

www/assets/js/map_mapbox.js

@@ -10,16 +10,16 @@ var firstload = true;
 
 function mapboxMap() {
 
-    if (localStorage.getItem("mapsource") == null) {
-        localStorage.setItem("mapsource", "liberty");
+    if (getStorage("mapsource") == null) {
+        setStorage("mapsource", "liberty");
     }
 
-    $("#mapbox").css("background-color", SETTINGS.maptileurls[localStorage.getItem("mapsource")].bgcolor);
+    $("#mapbox").css("background-color", SETTINGS.maptileurls[getStorage("mapsource")].bgcolor);
 
     mapboxgl.accessToken = '';
     var map = new mapboxgl.Map({
         container: 'mapbox',
-        style: SETTINGS.maptileurls[localStorage.getItem("mapsource")].json,
+        style: SETTINGS.maptileurls[getStorage("mapsource")].json,
         attributionControl: false,
         dragPan: true,
         pitch: 0,
@@ -40,12 +40,20 @@ function mapboxMap() {
                     timeout: 10 * 1000
                 },
                 fitBoundsOptions: {
-                    maxZoom: localStorage.getItem("trackzoom") == null ? 16 : localStorage.getItem("trackzoom") * 1
+                    maxZoom: getStorage("trackzoom") == null ? 16 : getStorage("trackzoom") * 1
                 },
                 trackUserLocation: true
             }), 'top-left'
             );
 
+    if (getStorage("mapscale") !== "false") {
+        map.addControl(
+                new mapboxgl.ScaleControl({
+                    unit: getStorage("units") == "imperial" ? "imperial" : "metric"
+                })
+                );
+    }
+
     map.startLocateControl = function () {
         // stub
     }
@@ -76,6 +84,8 @@ function mapboxMap() {
         });
     }
 
+    map.openedPanelIconID = null;
+
     map.updatePackageLayer = function (data) {
         var oldmarkers = document.getElementsByClassName("package-marker");
         if (oldmarkers.length > 0) {
@@ -94,7 +104,19 @@ function mapboxMap() {
                 //console.log(iconName);
 
                 var el = document.createElement("div");
-                el.className = "package-marker";
+
+                el.className = "package-marker package-marker-mapbox";
+                // Prevent selection highlight from going away after map refresh
+                if (map.openedPanelIconID != null && map.openedPanelIconID == datai.id) {
+                    el.className += " selected";
+                }
+                // Show different color highlight when nearby and undelivered
+                if (packages[i].distance * 1 < getStorage("alertradius") * 1
+                        && getUndeliveredCount(packages[i]) > 0) {
+                    el.className += " alerted";
+                }
+
+                el.id = "marker-" + datai.id;
 
                 el.style = "background-image: url(assets/images/" + iconName + ".png);";
 

www/assets/js/notes.js

@@ -0,0 +1,232 @@
+/*
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+
+if (inStorage("notes")) {
+    var notes = JSON.parse(getStorage("notes"));
+} else {
+    var notes = [];
+    setStorage("notes", "[]");
+}
+
+function findNote(number, street) {
+    for (i in notes) {
+        if (notes[i].number == number && notes[i].street.toUpperCase() == street.toUpperCase()) {
+            return notes[i];
+        }
+    }
+    return null;
+}
+
+function isDeliverable(number, street) {
+    var note = findNote(number, street);
+
+    var ok = true;
+    var reason = "";
+
+    if (note != null) {
+        for (t in note.toggles) {
+            if (!note.toggles.hasOwnProperty(t)) {
+                continue;
+            }
+
+            for (tt in SETTINGS.routenotetoggles) {
+                if (SETTINGS.routenotetoggles[tt].id == t) {
+                    if (SETTINGS.routenotetoggles[tt].preventsDelivery == true && note.toggles[t] == true) {
+                        ok = false;
+                        reason = SETTINGS.routenotetoggles[tt].reason;
+                    }
+                }
+            }
+        }
+    }
+
+    return {
+        ok: ok,
+        reason: reason
+    };
+}
+
+function saveNote(id) {
+    var exists = false;
+    var index = -1;
+    for (var i = 0; i < notes.length; i++) {
+        if (notes[i].id == id) {
+            exists = true;
+            index = i;
+        }
+    }
+
+    var note = {
+        id: id,
+        number: "",
+        street: "",
+        zipcode: "",
+        route: "",
+        notes: "",
+        toggles: {}
+    };
+    if (exists) {
+        note = notes[index];
+    }
+
+    note.number = $("input[name=number]").val().trim();
+    note.street = $("input[name=street]").val().trim();
+    note.zipcode = $("input[name=zipcode]").val().trim();
+    note.route = $("input[name=route]").val().trim().toUpperCase();
+    note.notes = $("textarea#notes").val().trim();
+
+    if (note.number == "") {
+        app.dialog.alert("Fill in an address number.", "Error");
+        return false;
+    }
+    if (note.street == "") {
+        app.dialog.alert("Fill in a street.", "Error");
+        return false;
+    }
+    if (note.zipcode == "") {
+        app.dialog.alert("Fill in a zip code.", "Error");
+        return false;
+    }
+    if (note.route == "" || /^[CRHG][0-9]{3}$/.test(note.route) != true) {
+        app.dialog.alert("Fill in a route (examples: C123, R001, H050).", "Error");
+        return false;
+    }
+
+    setStorage("lastrouteid", note.route);
+    setStorage("zipcode", note.zipcode);
+
+    for (i in SETTINGS.routenotetoggles) {
+        var toggle = SETTINGS.routenotetoggles[i];
+        note.toggles[toggle.id] = $(".note-toggle[data-id=" + toggle.id + "]").is(":checked");
+    }
+    if (exists) {
+        notes[index] = note;
+    } else {
+        notes.push(note);
+    }
+
+
+    setStorage("notes", JSON.stringify(notes));
+
+    if (exists) {
+        appendActivityLog("Edited note", note.number + " " + note.street, "", "fas fa-sticky-note");
+    } else {
+        appendActivityLog("Added note", note.number + " " + note.street, "", "fas fa-sticky-note");
+    }
+
+    app.toast.show({
+        text: "<i class='fas fa-check'></i> Note saved!",
+        position: "bottom",
+        destroyOnClose: true,
+        closeTimeout: 1000 * 3
+    });
+}
+
+function deleteNote(id) {
+    var note = {};
+    for (var i = 0; i < notes.length; i++) {
+        if (notes[i].id == id) {
+            note = notes[i];
+            notes.splice(i, 1);
+        }
+    }
+    setStorage("notes", JSON.stringify(notes));
+    appendActivityLog("Deleted note", note.number + " " + note.street, "", "fas fa-sticky-note");
+}
+
+$(".view-main").on("click", "#savenotebtn", function () {
+    saveNote($(this).data("noteid"));
+});
+
+$(".view-main").on("click", ".editnotebtn", function () {
+    var noteid = $(this).data("noteid");
+
+    var note = {};
+    for (var i = 0; i < notes.length; i++) {
+        if (notes[i].id == noteid) {
+            note = notes[i];
+        }
+    }
+
+    var toggles = [];
+    for (t in SETTINGS.routenotetoggles) {
+        var toggle = SETTINGS.routenotetoggles[t];
+        toggles.push({
+            id: toggle.id,
+            name: toggle.name,
+            checked: note.toggles[toggle.id] == true
+        });
+    }
+
+    router.navigate("/myroute/editnote", {
+        context: {
+            title: "Edit Note",
+            toggles: toggles,
+            noteid: noteid,
+            note: note
+        }
+    });
+});
+
+$(".view-main").on("click", ".deletenotebtn", function () {
+    var noteid = $(this).data("noteid");
+    app.dialog.confirm("Delete note?", "Confirm", function () {
+        deleteNote(noteid);
+        router.navigate("/myroute", {
+            reloadCurrent: true
+        })
+    });
+});
+
+$(".view-main").on("blur", "#notenumberinput,#notestreetinput", function () {
+    if (findNote($("#notenumberinput").val(), $("#notestreetinput").val()) != null) {
+        app.dialog.alert("A note already exists for that address.", "Warning");
+    }
+});
+
+/*
+ * Save note with Ctrl-S
+ */
+$(".view-main").on("keydown", ".page[data-name=editnote]", function (event) {
+        if (event.ctrlKey || event.metaKey) {
+            switch (String.fromCharCode(event.which).toLowerCase()) {
+                case 's':
+                    event.preventDefault();
+                    saveNote($("#savenotebtn").data("noteid"));
+                    break;
+            }
+        }
+    });
+
+function getToggleName(id) {
+    for (i in SETTINGS.routenotetoggles) {
+        if (SETTINGS.routenotetoggles[i].id == id) {
+            return SETTINGS.routenotetoggles[i].name;
+        }
+    }
+    return "";
+}
+
+function getToggleIcon(id) {
+    for (i in SETTINGS.routenotetoggles) {
+        if (SETTINGS.routenotetoggles[i].id == id) {
+            return SETTINGS.routenotetoggles[i].icon;
+        }
+    }
+    return "";
+}
+
+Template7.registerHelper('notetogglename', function (key) {
+    return getToggleName(key);
+});
+
+Template7.registerHelper('notetoggleicon', function (key) {
+    return getToggleIcon(key);
+});
+
+Template7.registerHelper('newlinestobr', function (text) {
+    return text.replace(/(?:\r\n|\r|\n)/g, '<br>');
+});

www/assets/js/packages.js

@@ -6,8 +6,8 @@
 
 var packages = [];
 
-if (localStorage.getItem("packages") != null) {
-    packages = JSON.parse(localStorage.getItem("packages"));
+if (getStorage("packages") != null) {
+    packages = JSON.parse(getStorage("packages"));
 }
 
 /**
@@ -91,6 +91,13 @@ function addPackage(address, latitude, longitude, type, callback, deadline) {
         deadline = false;
     }
 
+    if (typeof address == "object") {
+        var extendedaddress = address;
+        address = extendedaddress.address;
+    } else {
+        var extendedaddress = false;
+    }
+
     // Extra precision makes the map stupider,
     // and doesn't really increase accuracy since four decimal places ~= 11m
     latitude = +(parseFloat("" + latitude).toFixed(4));
@@ -103,6 +110,7 @@ function addPackage(address, latitude, longitude, type, callback, deadline) {
         if (packages[i].coords[0] == latitude && packages[i].coords[1] == longitude) {
             coordsID = packages[i].id;
             packages[i].items.push({
+                extended: extendedaddress,
                 address: address,
                 delivered: false,
                 type: type,
@@ -124,6 +132,7 @@ function addPackage(address, latitude, longitude, type, callback, deadline) {
             address: address,
             items: [
                 {
+                    extended: extendedaddress,
                     address: address,
                     delivered: false,
                     type: type,
@@ -133,7 +142,9 @@ function addPackage(address, latitude, longitude, type, callback, deadline) {
             ]
         });
     }
-    localStorage.setItem("packages", JSON.stringify(packages));
+    setStorage("packages", JSON.stringify(packages));
+
+    appendActivityLog("Added", SETTINGS.itemtypes[type].name, address, "fas fa-truck-loading");
 
     playSound("ok");
 
@@ -165,6 +176,7 @@ function addPackage(address, latitude, longitude, type, callback, deadline) {
  */
 function importPackageList(newlist) {
     skipped = 0;
+    let count = 0;
     for (latlng in newlist) {
         var latitude = newlist[latlng].coords[0];
         var longitude = newlist[latlng].coords[1];
@@ -186,6 +198,7 @@ function importPackageList(newlist) {
                     }
                     if (!added) {
                         packages[i].items.push(package);
+                        count++;
                         added = true;
                     }
                     break;
@@ -196,17 +209,106 @@ function importPackageList(newlist) {
             }
         }
     }
-    localStorage.setItem("packages", JSON.stringify(packages));
+    setStorage("packages", JSON.stringify(packages));
+
+    appendActivityLog("Imported List", count + " items added", "", "fas fa-file-download");
     if (map != null) {
         reloadMap();
     }
     return skipped;
 }
 
+function mapCalibrate(item, packagesentry) {
+    // Determine if the delivery location isn't near the map pin
+    if (userPosition.coords.accuracy < 20 && timeDiff(userPosition.updated) < 10) {
+        // User location is accurate, check distance
+        var distance = getDistance(packagesentry.coords[0], packagesentry.coords[1], userPosition.coords.latitude, userPosition.coords.longitude);
+        var lat = userPosition.coords.latitude;
+        var lon = userPosition.coords.longitude;
+        if (distance > 100) { // Over 100 meters distance
+            if (typeof item.extended == "object") {
+                // we have all the info we need
+                var fixmap = function (item, latitude, longitude, locationtype, pkgsentry) {
+                    $.ajax({
+                        type: "POST",
+                        url: SETTINGS.mapfixapi,
+                        data: {
+                            number: item.extended.number,
+                            unit: item.extended.unit,
+                            street: item.extended.street,
+                            citystate: item.extended.citystate,
+                            zip: item.extended.zip,
+                            latitude: latitude,
+                            longitude: longitude,
+                            locationtype: locationtype
+                        },
+                        success: function () {
+                            appendActivityLog("Map Calibrated",
+                                    item.address,
+                                    "Thanks for improving the map accuracy!<br>"
+                                    + "Old: <a class='geolink' href='geo:" + pkgsentry.coords[0] + "," + pkgsentry.coords[1] + "'>" + pkgsentry.coords[0] + ", " + pkgsentry.coords[1] + "</a><br>"
+                                    + "New: <a class='geolink' href='geo:" + latitude + "," + longitude + "'>" + latitude + ", " + longitude + "</a>",
+                                    "fas fa-map-marked-alt"
+                                    );
+                        },
+                        error: function () {
+                            // try again in five minutes
+                            setTimeout(function () {
+                                fixmap(item, latitude, longitude, locationtype, pkgsentry);
+                            }, 1000 * 60 * 5);
+                        },
+                        dataType: "json"
+                    });
+                };
+
+                app.dialog.create({
+                    title: 'Map Calibration',
+                    text: "Your actual location doesn't match the map location for the " + SETTINGS.itemtypes[item.type].name + " at " + item.address + ". Where are you?",
+                    buttons: [
+                        {
+                            text: 'Address',
+                            close: true
+                        },
+                        {
+                            text: 'Mailbox/CBU',
+                            close: true
+                        },
+                        {
+                            text: 'Parcel Locker',
+                            close: true
+                        },
+                        {
+                            text: "Other/Cancel",
+                            close: true
+                        }
+                    ],
+                    verticalButtons: true,
+                    onClick: function (dialog, index) {
+                        switch (index) {
+                            case 0:
+                                fixmap(item, lat, lon, "address", packagesentry);
+                                break;
+                            case 1:
+                                fixmap(item, lat, lon, "mailbox", packagesentry);
+                                break;
+                            case 2:
+                                fixmap(item, lat, lon, "locker", packagesentry);
+                                break;
+                            default:
+                                return;
+                        }
+                    }
+                }).open();
+            }
+        }
+    }
+}
+
 function markDelivered(id, delivered) {
     for (var i = 0; i < packages.length; i++) {
         for (var j = 0; j < packages[i].items.length; j++) {
             if (packages[i].items[j].id == id) {
+
                 if (typeof delivered == 'undefined') {
                     if (packages[i].items[j].delivered == false) {
                         delivered = true;
@@ -216,14 +318,25 @@ function markDelivered(id, delivered) {
                 }
 
                 packages[i].items[j].delivered = delivered;
-                if (delivered) {
-                    packages[i].items[j].deliverytimestamp = Date.now();
+                let gpslink = "";
+                if (userPosition.coords.accuracy < 40 && timeDiff(userPosition.updated) < 15) {
+                    var lat = parseFloat(userPosition.coords.latitude).toFixed(5);
+                    var lon = parseFloat(userPosition.coords.longitude).toFixed(5);
+                    gpslink = "<br /><a class='geolink' href='geo:" + lat + "," + lon + "'>" + lat + ", " + lon + "</a> (&#177;" + getDisplayDistance(userPosition.coords.accuracy, false) + ")";
                 }
+                if (delivered) {
+                    packages[i].items[j].deliverytimestamp = time();
+                    appendActivityLog("Delivered", SETTINGS.itemtypes[packages[i].items[j].type].name, packages[i].items[j].address + gpslink, "far fa-check-circle");
+                    mapCalibrate(packages[i].items[j], packages[i]);
+                } else {
+                    packages[i].items[j].deliverytimestamp = null;
+                    appendActivityLog("Undelivered", SETTINGS.itemtypes[packages[i].items[j].type].name, packages[i].items[j].address, "fas fa-undo");
+                }
+                setStorage("packages", JSON.stringify(packages));
+                return; // so we don't keep looping over the rest of the packages
             }
         }
     }
-
-    localStorage.setItem("packages", JSON.stringify(packages));
 }
 
 function confirmDeletePackage(package, callback) {
@@ -244,13 +357,16 @@ function deletePackage(id, callback) {
     for (var i = 0; i < packages.length; i++) {
         for (var j = 0; j < packages[i].items.length; j++) {
             if (packages[i].items[j].id == id) {
+
+                appendActivityLog("Deleted", SETTINGS.itemtypes[packages[i].items[j].type].name, packages[i].items[j].address, "fas fa-trash");
+
                 packages[i].items.splice(j, 1);
 
                 if (packages[i].items.length == 0) {
                     packages.splice(i, 1);
                 }
 
-                localStorage.setItem("packages", JSON.stringify(packages));
+                setStorage("packages", JSON.stringify(packages));
                 loadPackageList();
 
                 if (typeof callback == 'function') {
@@ -284,30 +400,40 @@ function countPackages() {
     return count;
 }
 
-function addPackageByAddress(number, street, citystate, type, callback) {
+function addPackageByAddress(number, unit, street, citystate, zip, type, callback) {
     var requestfinished = false;
     var searchingdialogopen = false;
     var deadline = false;
 
     var ajaxlookup = function () {
-        var geocodecache = localStorage.getItem("geocode_cache");
+        var geocodecache = getStorage("geocode_cache");
         if (geocodecache == null) {
             geocodecache = "{}";
-            localStorage.setItem("geocode_cache", "{}");
+            setStorage("geocode_cache", "{}");
         }
 
         geocodecache = JSON.parse(geocodecache);
-        var cachekey = number + " || " + street + " || " + citystate;
+        var cachekey = number + " || " + street + " || " + citystate + " || " + zip + " || " + SETTINGS.itemtypes[type].allowedlocationtypes;
+        if (unit != '') {
+            cachekey = number + " || " + unit + " || " + street + " || " + citystate + " || " + zip + " || " + SETTINGS.itemtypes[type].allowedlocationtypes;
+        }
         var cacheitem = geocodecache[cachekey];
         var timestamp = Math.floor(Date.now() / 1000);
         if (typeof cacheitem != 'undefined') {
             if (cacheitem.added + SETTINGS.geocodecacheexpiry < timestamp) {
                 console.log("Info", "Removing expired geocode cache item " + cachekey);
                 delete geocodecache[cachekey];
-                localStorage.setItem("geocode_cache", JSON.stringify(geocodecache));
+                setStorage("geocode_cache", JSON.stringify(geocodecache));
             } else {
                 console.log("Info", "Using cached geocode result", cacheitem);
-                addPackage(cacheitem.address, cacheitem.latitude, cacheitem.longitude, type, callback, deadline);
+                addPackage({
+                    address: cacheitem.address,
+                    number: number,
+                    unit: unit,
+                    street: street,
+                    citystate: citystate,
+                    zip: zip
+                }, cacheitem.latitude, cacheitem.longitude, type, callback, deadline);
                 return;
             }
         }
@@ -317,8 +443,11 @@ function addPackageByAddress(number, street, citystate, type, callback) {
             dataType: 'json',
             data: {
                 number: number,
+                unit: unit,
                 street: street,
-                citystate: citystate
+                citystate: citystate,
+                zip: zip,
+                type: SETTINGS.itemtypes[type].allowedlocationtypes
             },
             timeout: 15 * 1000,
             success: function (resp) {
@@ -329,14 +458,23 @@ function addPackageByAddress(number, street, citystate, type, callback) {
                 requestfinished = true;
                 if (resp.status == "OK") {
                     if (resp.accuracy.ok) {
-                        addPackage(resp.address.street, resp.coords[0], resp.coords[1], type, callback, deadline);
+                        addPackage({
+                            address: resp.address.street,
+                            number: number,
+                            unit: unit,
+                            street: street,
+                            citystate: citystate,
+                            zip: zip
+                        }, resp.coords[0], resp.coords[1], type, callback, deadline);
                         geocodecache[cachekey] = {
+                            number: resp.address.number,
+                            unit: unit,
                             address: resp.address.street,
                             latitude: resp.coords[0],
                             longitude: resp.coords[1],
                             added: Math.floor(Date.now() / 1000)
                         };
-                        localStorage.setItem("geocode_cache", JSON.stringify(geocodecache));
+                        setStorage("geocode_cache", JSON.stringify(geocodecache));
                     } else {
                         playSound("error");
                         app.dialog.confirm(
@@ -344,9 +482,23 @@ function addPackageByAddress(number, street, citystate, type, callback) {
                                 "Accuracy Warning",
                                 function (ok) {
                                     if (resp.address.street == "") {
-                                        addPackage(address, resp.coords[0], resp.coords[1], type, callback, deadline);
+                                        addPackage({
+                                            address: address,
+                                            number: number,
+                                            unit: unit,
+                                            street: street,
+                                            citystate: citystate,
+                                            zip: zip
+                                        }, resp.coords[0], resp.coords[1], type, callback, deadline);
                                     } else {
-                                        addPackage(resp.address.street, resp.coords[0], resp.coords[1], type, callback, deadline);
+                                        addPackage({
+                                            address: resp.address.street,
+                                            number: number,
+                                            unit: unit,
+                                            street: street,
+                                            citystate: citystate,
+                                            zip: zip
+                                        }, resp.coords[0], resp.coords[1], type, callback, deadline);
                                     }
                                 }
                         );
@@ -376,71 +528,206 @@ function addPackageByAddress(number, street, citystate, type, callback) {
         }, 750);
     }
 
-    if (type == "express") {
-        if (localStorage.getItem("deadlinealarm_minutes") == null) {
-            localStorage.setItem("deadlinealarm_minutes", 20);
-        }
-        var minutes = localStorage.getItem("deadlinealarm_minutes");
-        app.dialog.create({
-            title: 'Express Item',
-            text: 'Set a reminder for ' + minutes + ' minutes before:',
-            buttons: [
-                {
-                    text: '10:30 AM',
-                    close: true
-                },
-                {
-                    text: '12:00 PM',
-                    close: true
-                },
-                {
-                    text: '3:00 PM',
-                    close: true
-                },
-                {
-                    text: "No reminder",
-                    color: "red",
-                    close: true
-                }
-            ],
-            verticalButtons: true,
-            onClick: function (dialog, index) {
-                deadline = new Date();
-                switch (index) {
-                    case 0:
-                        deadline.setMinutes(30);
-                        deadline.setHours(10);
-                        break;
-                    case 1:
-                        deadline.setMinutes(00);
-                        deadline.setHours(12);
-                        break;
-                    case 2:
-                        deadline.setMinutes(00);
-                        deadline.setHours(12 + 3);
-                        break;
-                    case 3:
-                    default:
-                        deadline = false;
-                        break;
-                }
-
-                if (deadline != false) {
-                    deadline = deadline.getTime() / 1000;
-                }
-                ajaxlookup();
+    var prelookup = function () {
+        if (type == "express") {
+            if (getStorage("deadlinealarm_minutes") == null) {
+                setStorage("deadlinealarm_minutes", 20);
             }
-        }).open();
+            var minutes = getStorage("deadlinealarm_minutes");
+            app.dialog.create({
+                title: 'Express Item',
+                text: 'Set a reminder for ' + minutes + ' minutes before:',
+                buttons: [
+                    {
+                        text: '10:30 AM',
+                        close: true
+                    },
+                    {
+                        text: '12:00 PM',
+                        close: true
+                    },
+                    {
+                        text: '3:00 PM',
+                        close: true
+                    },
+                    {
+                        text: "No reminder",
+                        color: "red",
+                        close: true
+                    }
+                ],
+                verticalButtons: true,
+                onClick: function (dialog, index) {
+                    deadline = new Date();
+                    switch (index) {
+                        case 0:
+                            deadline.setMinutes(30);
+                            deadline.setHours(10);
+                            break;
+                        case 1:
+                            deadline.setMinutes(00);
+                            deadline.setHours(12);
+                            break;
+                        case 2:
+                            deadline.setMinutes(00);
+                            deadline.setHours(12 + 3);
+                            break;
+                        case 3:
+                        default:
+                            deadline = false;
+                            break;
+                    }
+
+                    if (deadline != false) {
+                        deadline = deadline.getTime() / 1000;
+                    }
+                    ajaxlookup();
+                }
+            }).open();
+        } else {
+            ajaxlookup();
+        }
+    }
+
+    var deliverable = isDeliverable(number, street);
+
+    if (deliverable.ok) {
+        prelookup();
     } else {
-        ajaxlookup();
+        app.dialog.confirm(
+                "A route note says this address " + deliverable.reason + ". Add item anyways?",
+                "Confirm",
+                function () {
+                    prelookup();
+                },
+                function () {
+                    // cancel
+                }
+        );
     }
 }
 
-function checkDeadlines() {
-    if (localStorage.getItem("deadlinealarm_minutes") == null) {
-        localStorage.setItem("deadlinealarm_minutes", 20);
+function addPackageByBarcode(barcode, type, callback) {
+    var requestfinished = false;
+    var searchingdialogopen = false;
+    var deadline = false;
+
+    var ajaxlookup = function () {
+        $.ajax({
+            url: SETTINGS.geocodebarcodeapi,
+            dataType: 'json',
+            data: {
+                code: barcode,
+                type: SETTINGS.itemtypes[type].allowedlocationtypes
+            },
+            timeout: 15 * 1000,
+            success: function (resp) {
+                if (searchingdialogopen) {
+                    app.dialog.close();
+                    searchingdialogopen = false;
+                }
+                requestfinished = true;
+                if (resp.status == "OK") {
+                    if (resp.accuracy.ok) {
+                        addPackage(resp.address.street, resp.coords[0], resp.coords[1], type, callback, deadline);
+                    } else {
+                        playSound("error");
+                        app.dialog.alert("The scanned address couldn't be reliably located.", "Error");
+                    }
+                } else {
+                    playSound("error");
+                    app.dialog.alert(resp.message, "Error");
+                }
+            },
+            error: function (jqXHR, status, errorThrown) {
+                if (searchingdialogopen) {
+                    app.dialog.close();
+                    searchingdialogopen = false;
+                }
+                requestfinished = true;
+                playSound("error");
+                app.dialog.alert("There was a network issue while looking up the barcode.  Please try again.", "Error");
+            }
+        });
+
+        // Open a loading message if there's a delay finding the address
+        setTimeout(function () {
+            if (!requestfinished) {
+                app.dialog.preloader("Looking up barcode...");
+                searchingdialogopen = true;
+            }
+        }, 750);
     }
-    var minutes = localStorage.getItem("deadlinealarm_minutes");
+
+    var prelookup = function () {
+        if (type == "express") {
+            if (getStorage("deadlinealarm_minutes") == null) {
+                setStorage("deadlinealarm_minutes", 20);
+            }
+            var minutes = getStorage("deadlinealarm_minutes");
+            app.dialog.create({
+                title: 'Express Item',
+                text: 'Set a reminder for ' + minutes + ' minutes before:',
+                buttons: [
+                    {
+                        text: '10:30 AM',
+                        close: true
+                    },
+                    {
+                        text: '12:00 PM',
+                        close: true
+                    },
+                    {
+                        text: '3:00 PM',
+                        close: true
+                    },
+                    {
+                        text: "No reminder",
+                        color: "red",
+                        close: true
+                    }
+                ],
+                verticalButtons: true,
+                onClick: function (dialog, index) {
+                    deadline = new Date();
+                    switch (index) {
+                        case 0:
+                            deadline.setMinutes(30);
+                            deadline.setHours(10);
+                            break;
+                        case 1:
+                            deadline.setMinutes(00);
+                            deadline.setHours(12);
+                            break;
+                        case 2:
+                            deadline.setMinutes(00);
+                            deadline.setHours(12 + 3);
+                            break;
+                        case 3:
+                        default:
+                            deadline = false;
+                            break;
+                    }
+
+                    if (deadline != false) {
+                        deadline = deadline.getTime() / 1000;
+                    }
+                    ajaxlookup();
+                }
+            }).open();
+        } else {
+            ajaxlookup();
+        }
+    }
+
+    prelookup();
+}
+
+function checkDeadlines() {
+    if (getStorage("deadlinealarm_minutes") == null) {
+        setStorage("deadlinealarm_minutes", 20);
+    }
+    var minutes = getStorage("deadlinealarm_minutes");
     var currentTime = new Date().getTime() / 1000;
     var deadlineTime = currentTime + (minutes * 60);
     for (i in packages) {
@@ -457,7 +744,7 @@ function checkDeadlines() {
                             }
                     );
                     packages[i].items[j].deadlinealarmed = true;
-                    localStorage.setItem("packages", JSON.stringify(packages));
+                    setStorage("packages", JSON.stringify(packages));
                 }
             }
         }

www/assets/js/platform.js

@@ -12,6 +12,12 @@ var app_version = "unknown";
 
 var nw_tray = null;
 
+/**
+ * If true and animations are set to "auto", animations should be disabled.
+ * @type Boolean
+ */
+var auto_disable_animations = false;
+
 var openBrowser = function (url) {
     window.open(url);
 }
@@ -24,6 +30,8 @@ var scanBarcode = function (success, error) {
     app.dialog.alert("You can't scan barcodes with this device.", "Sorry!");
 }
 
+var scanningBarcode = false;
+
 var getLocation = function (success, error) {
     if ("geolocation" in navigator) {
         navigator.geolocation.getCurrentPosition(function (position) {
@@ -68,6 +76,7 @@ function setupHTML5BarcodeScanner() {
     $("body").append('<script src="node_modules/@zxing/library/umd/index.min.js"></script>');
 
     scanBarcode = function (success, error) {
+        scanningBarcode = true;
         $("#web-barcode-ui").removeClass("hidden");
         // Stolen from https://zxing-js.github.io/library/examples/multi-camera/
         const codeReader = new ZXing.BrowserMultiFormatReader();
@@ -83,6 +92,7 @@ function setupHTML5BarcodeScanner() {
                     selectedDeviceId = videoInputDevices[0].deviceId;
 
                     codeReader.decodeFromInputVideoDeviceContinuously(selectedDeviceId, 'barcode-viewer', (result, err) => {
+                        scanningBarcode = false;
                         if (result) {
                             codeReader.reset();
                             $("#web-barcode-ui").addClass("hidden");
@@ -99,28 +109,53 @@ function setupHTML5BarcodeScanner() {
                     });
                 })
                 .catch((err) => {
+                    scanningBarcode = false;
                     console.error(err);
                 });
         $("#web-barcode-ui").on("click", function () {
             codeReader.reset();
+            scanningBarcode = false;
             $("#web-barcode-ui").addClass("hidden");
         });
     };
 }
 
+
+function setupCordovaBarcodeScanner() {
+    scanBarcode = function (success, error) {
+        scanningBarcode = true;
+        cordova.plugins.barcodeScanner.scan(
+                function (result) {
+                    scanningBarcode = false;
+                    if (!result.cancelled) {
+                        success(result.text);
+                    }
+                },
+                function (err) {
+                    scanningBarcode = false;
+                    if (typeof error == "function") {
+                        error(err);
+                    }
+                },
+                {
+                    showTorchButton: true,
+                    showFlipCameraButton: true,
+                    prompt: "Scan barcode",
+                    resultDisplayDuration: 0,
+                    disableSuccessBeep: true,
+                    formats: "QR_CODE,DATA_MATRIX,CODE_39,CODE_93,CODE_128,CODABAR,PDF_417"
+                }
+        );
+    };
+}
+
 function initCordova() {
     platform_type = "cordova";
+
     // Handle back button to close things
-    document.addEventListener("backbutton", function (event) {
-        // Close map sheet if it's open
-        if ($(".sheet-modal").hasClass("modal-in")) {
-            app.sheet.close();
-        } else {
-            router.back({force: true, ignoreCache: true});
-        }
-    }, false);
+    document.addEventListener("backbutton", handleBackButton, false);
     document.addEventListener("deviceready", function () {
-        if (localStorage.getItem("wakelock") == "true") {
+        if (getStorage("wakelock") == "true") {
             window.powerManagement.acquire(function () {
                 console.log("Info", 'Wakelock acquired');
             }, function () {
@@ -133,6 +168,9 @@ function initCordova() {
                 console.log("Warn", 'Failed to release wakelock');
             });
         }
+
+        // Make sure the status bar color is set properly
+        applyColorTheme();
     }, false);
     openBrowser = function (url) {
         cordova.InAppBrowser.open(url, '_blank', 'location=yes');
@@ -142,32 +180,37 @@ function initCordova() {
         window.open(url, '_system', '');
     }
 
+    // If initialization fails wait a few seconds and try again
     if (typeof device != "undefined" && device.platform != "browser") {
-        scanBarcode = function (success, error) {
-            cordova.plugins.barcodeScanner.scan(
-                    function (result) {
-                        if (!result.cancelled) {
-                            success(result.text);
-                        }
-                    },
-                    function (err) {
-                        if (typeof error == "function") {
-                            error(err);
-                        }
-                    },
-                    {
-                        showTorchButton: true,
-                        showFlipCameraButton: true,
-                        prompt: "Scan barcode",
-                        resultDisplayDuration: 0,
-                        disableSuccessBeep: true,
-                        formats: "QR_CODE,DATA_MATRIX,CODE_39,CODE_93,CODE_128,CODABAR,PDF_417,AZTEC,MAXICODE"
-                    }
-            );
-        };
+        setupCordovaBarcodeScanner();
     } else {
-        setupHTML5BarcodeScanner();
+        setTimeout(function () {
+            if (typeof device != "undefined" && device.platform != "browser") {
+                setupCordovaBarcodeScanner();
+            } else {
+                setupHTML5BarcodeScanner();
+            }
+        }, 5000);
     }
+
+    // Handle geo: urls
+    $("#app").on("click", "a[href^='geo:']", function (evt) {
+        window.open($(this).attr("href"), "_system");
+        evt.preventDefault();
+    });
+
+    window.addEventListener("batterystatus", function (status) {
+        if (getStorage("animation") == "auto") {
+            if (status.isPlugged || status.level > 20) {
+                // Plugged in or above 20%, enable animations
+                auto_disable_animations = false;
+                toggleAnimations(true);
+            } else {
+                auto_disable_animations = false;
+                toggleAnimations(true);
+            }
+        }
+    }, false);
 }
 
 function initNW() {
@@ -207,6 +250,12 @@ function initNW() {
 
 
     setupHTML5BarcodeScanner();
+
+    // Handle geo: urls
+    $("#app").on("click", ".geolink", function (evt) {
+        require('nw.gui').Shell.openExternal($(this).attr("href"));
+        evt.preventDefault();
+    });
 }
 
 function initBrowser() {
@@ -221,6 +270,11 @@ function initBrowser() {
     }
 
     setupHTML5BarcodeScanner();
+
+    $("#app").on("click", ".geolink", function (evt) {
+        window.open($(this).attr("href"), "_blank");
+        evt.preventDefault();
+    });
 }
 
 function initPlatform() {

www/assets/js/settings.js

@@ -5,48 +5,89 @@
  */
 
 
-$('.item-content[data-setting=darktheme] .toggle input').on("change", function () {
-    var checked = $(this).prop('checked');
-    localStorage.setItem("darktheme", checked);
+function logout() {
+    app.dialog.confirm(
+            "Are you sure you want to log out?",
+            "Log out?",
+            function () {
+                localStorage.removeItem('password');
+                localStorage.removeItem('username');
+                localStorage.removeItem('lastsync');
+                restartApplication();
+            }
+    );
+}
 
-    if (localStorage.getItem("darktheme") == "true") {
-        $("#app").addClass("theme-dark");
-    } else {
-        $("#app").removeClass("theme-dark");
+function resyncAndRestart() {
+    app.toast.show({
+        text: "Syncing settings and restarting...",
+        position: "bottom",
+        destroyOnClose: true,
+        closeTimeout: 1000 * 10
+    });
+    syncNow(function () {
+        restartApplication();
+    });
+}
+
+function clearCaches() {
+    app.toast.show({
+        text: "Clearing caches. You may need to restart the app to see a difference.",
+        position: "bottom",
+        destroyOnClose: true,
+        closeTimeout: 1000 * 10
+    });
+    setStorage("geocode_cache", "{}");
+    if ('caches' in window) {
+        clearAllCaches();
+    }
+}
+
+$('.item-link[data-setting=apptheme] select').on("change", function () {
+    setStorage("apptheme", $('.item-link[data-setting=apptheme] select').val());
+
+    applyColorTheme();
+});
+
+$('.item-link[data-setting=liststyle] select').on("change", function () {
+    setStorage("liststyle", $('.item-link[data-setting=liststyle] select').val());
+});
+
+$('.item-link[data-setting=animation] select').on("change", function () {
+    setStorage("animation", $('.item-link[data-setting=animation] select').val());
+
+    if (getStorage("animation") != "auto") {
+        setAnimations();
+    }
+    if (getStorage("animation") == "auto") {
+        toggleAnimations(auto_disable_animations == false);
     }
 });
 
 $('.item-content[data-setting=showhelp] .toggle input').on("change", function () {
     var checked = $(this).prop('checked');
-    localStorage.setItem("show_help", checked);
+    setStorage("show_help", checked);
+});
+
+$('.item-content[data-setting=oldhomeui] .toggle input').on("change", function () {
+    var checked = $(this).prop('checked');
+    setStorage("oldhomeui", checked);
 });
 
 $('.item-link[data-setting=units] select').on("change", function () {
-    localStorage.setItem("units", $('.item-link[data-setting=units] select').val());
+    setStorage("units", $('.item-link[data-setting=units] select').val());
 });
 
 $('.item-link[data-setting=trackzoom] select').on("change", function () {
-    localStorage.setItem("trackzoom", $('.item-link[data-setting=trackzoom] select').val());
+    setStorage("trackzoom", $('.item-link[data-setting=trackzoom] select').val());
 });
 
 $('.item-content[data-setting=wakelock] .toggle input').on("change", function () {
     var checked = $(this).prop('checked');
-    localStorage.setItem("wakelock", checked);
+    setStorage("wakelock", checked);
 
     if (platform_type == "cordova") {
-        if (localStorage.getItem("wakelock") == "true") {
-            window.powerManagement.acquire(function () {
-                console.log("Info", 'Wakelock acquired');
-            }, function () {
-                console.log("Warn", 'Failed to acquire wakelock');
-            });
-        } else {
-            window.powerManagement.release(function () {
-                console.log("Info", 'Wakelock released');
-            }, function () {
-                console.log("Warn", 'Failed to release wakelock');
-            });
-        }
+        loadSettings();
     } else {
         app.toast.show({
             text: "This setting won't do anything on your device.",
@@ -57,32 +98,45 @@ $('.item-content[data-setting=wakelock] .toggle input').on("change", function ()
     }
 });
 
+$('.item-content[data-setting=hardwarescanner] .toggle input').on("change", function () {
+    var checked = $(this).prop('checked');
+    setStorage("hardwarescanner", checked);
+    setupHardwareScanner();
+});
+
 $('.item-content[data-setting=alertvolume] .range-slider').on('range:changed', function (e, range) {
     var val = app.range.get(".item-content[data-setting=alertvolume] .range-slider").getValue();
-    localStorage.setItem("alertvolume", val);
+    setStorage("alertvolume", val);
     setVolume("alert", val);
     playSound("alert");
 });
 
 $('.item-content[data-setting=alertradius] .range-slider').on('range:changed', function (e, range) {
     var val = app.range.get(".item-content[data-setting=alertradius] .range-slider").getValue();
-    localStorage.setItem("alertradius", val);
+    setStorage("alertradius", val);
 });
 
 $('.item-content[data-setting=alertinterval] .range-slider').on('range:changed', function (e, range) {
     var val = app.range.get(".item-content[data-setting=alertinterval] .range-slider").getValue();
-    localStorage.setItem("alertinterval", val);
+    setStorage("alertinterval", val);
 });
 
 $('.item-link[data-setting=mapsource] select').on("change", function () {
-    localStorage.setItem("mapsource", $('.item-link[data-setting=mapsource] select').val());
+    setStorage("mapsource", $('.item-link[data-setting=mapsource] select').val());
+
+    reloadMap();
+});
+
+$('.item-content[data-setting=mapscale] .toggle input').on("change", function () {
+    var checked = $(this).prop('checked');
+    setStorage("mapscale", checked ? "true" : "false");
 
     reloadMap();
 });
 
 $('.item-content[data-setting=maptype] .toggle input').on("change", function () {
     var checked = $(this).prop('checked');
-    localStorage.setItem("maptype", checked ? "leaflet" : "mapbox");
+    setStorage("maptype", checked ? "leaflet" : "mapbox");
 
     maptype = checked ? "leaflet" : "mapbox";
 
@@ -90,7 +144,7 @@ $('.item-content[data-setting=maptype] .toggle input').on("change", function ()
 });
 
 $('.item-link[data-setting=alertsound] select').on("change", function () {
-    localStorage.setItem("alertsound", $('.item-link[data-setting=alertsound] select').val());
+    setStorage("alertsound", $('.item-link[data-setting=alertsound] select').val());
     // Reload sound effect stuff to apply new sound
     initSFX();
     // Play the selected sound

www/assets/js/storage.js

@@ -0,0 +1,58 @@
+/* 
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+
+
+/**
+ * Save something to persistent storage.
+ * @param {string} key
+ * @param {string} value non-string values are converted to strings.
+ * @param {bool} nochangeupdate If true, the lastchange setting won't be updated.
+ * @returns {undefined}
+ */
+function setStorage(key, value, nochangeupdate) {
+    if (typeof nochangeupdate == 'undefined') {
+        nochangeupdate = false;
+    }
+    localStorage.setItem(key, value);
+    if (!nochangeupdate && !SETTINGS.synckeyblacklist.includes(key)) {
+        localStorage.setItem("lastchange", Date.now() / 1000);
+    }
+}
+
+/**
+ * Get an item from persistent storage.
+ * @param {type} key
+ * @returns {DOMString}
+ */
+function getStorage(key) {
+    return localStorage.getItem(key);
+}
+
+/**
+ * Check if an item is in the persistent storage.
+ * @param {string} key
+ * @returns {Boolean}
+ */
+function inStorage(key) {
+    return localStorage.getItem(key) != null;
+}
+
+/**
+ * Get all item from persistent storage.
+ * @returns {Array} [{key: "", value: ""},...]
+ */
+function getAllStorage() {
+    var all = [];
+    for (var key in localStorage) {
+        if (localStorage.hasOwnProperty(key)) {
+            all.push({
+                key: key,
+                value: getStorage(key)
+            });
+        }
+    }
+    return all;
+}

www/assets/js/sync.js

@@ -0,0 +1,111 @@
+/*
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+
+
+function gatherSyncData() {
+    var data = {
+        localStorage: {},
+        changed: getStorage("lastchange") == null ? 0 : getStorage("lastchange"),
+    };
+    if (!inStorage("lastsync")) {
+        // first time syncing to the server, let's make sure
+        // the server settings take precedence
+        data.changed = 1;
+    }
+    var allitems = getAllStorage();
+    for (var i = 0; i < allitems.length; i++) {
+        var key = allitems[i].key;
+        var value = allitems[i].value;
+        if (SETTINGS.synckeyblacklist.includes(key)) {
+            continue;
+        }
+        data.localStorage[key] = value;
+    }
+    return data;
+}
+
+function syncDataToLocalStorage(data) {
+    for (var key in data.localStorage) {
+        if (data.localStorage.hasOwnProperty(key)) {
+            setStorage(key, data.localStorage[key], true);
+        }
+    }
+}
+
+function resolveSync(remotedata) {
+    var localchangetime = getStorage("lastchange");
+    if (remotedata.changed == null) {
+        // The server has nothing, this is the first sync
+        return true;
+    }
+    if (localchangetime == null) {
+        // No local setting changes but since we've gotten this far,
+        // the server has stuff for us
+        syncDataToLocalStorage(remotedata);
+        return true;
+    }
+    if (localchangetime < remotedata.changed) {
+        // The server has newer stuff for us
+        syncDataToLocalStorage(remotedata);
+        return true;
+    }
+    if (localchangetime >= remotedata.changed) {
+        // Our local data is newer or the same as the server copy
+        return true;
+    }
+    return false;
+}
+
+function syncNow(callback) {
+    var username = getStorage("username");
+    var password = getStorage("password");
+    if (username == null || password == null) {
+        return false;
+    }
+    var data = gatherSyncData();
+
+    $.post(SETTINGS.syncapi, {
+        username: username,
+        password: password,
+        data: JSON.stringify(data)
+    }, function (resp) {
+        if (resp.status == "OK") {
+            resolveSync(resp.data);
+            setStorage("lastsync", Date.now() / 1000);
+            if (typeof callback == "function") {
+                callback();
+            }
+        }
+    }, "json");
+    return true;
+}
+
+function loadSettings() {
+    applyColorTheme();
+
+    if (platform_type == "cordova") {
+        if (getStorage("wakelock") == "true") {
+            window.powerManagement.acquire(function () {
+                console.log("Info", 'Wakelock acquired');
+            }, function () {
+                console.log("Warn", 'Failed to acquire wakelock');
+            });
+        } else {
+            window.powerManagement.release(function () {
+                console.log("Info", 'Wakelock released');
+            }, function () {
+                console.log("Warn", 'Failed to release wakelock');
+            });
+        }
+    }
+}
+
+syncNow(loadSettings);
+
+// Sync every two minutes
+setInterval(function () {
+    syncNow(loadSettings);
+}, 1000 * 60 * 2);

www/assets/js/toolbox_addresslookup.js

@@ -0,0 +1,106 @@
+/*
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+
+// Open geo: url
+$(".view-main").on("click", "a #geocoords", function () {
+    window.open($(this).attr("href"), "_system");
+});
+
+function addressLookup() {
+    if ($("#numberstreetinput").val() == "") {
+        app.dialog.alert("A street address is required.", "Not enough info");
+        return;
+    }
+    if ($("#cityinput").val() == "" || $("#stateinput").val() == "") {
+        var ziprequired = true;
+    }
+    if ($("#zipcodeinput").val() == "" && ziprequired) {
+        app.dialog.alert("A ZIP code or city and state are required.", "Not enough info");
+        return;
+    }
+    app.dialog.preloader("Working...");
+    var addrlookupdialogopen = true;
+    $.ajax({
+        url: SETTINGS.addrlookupapi,
+        dataType: 'json',
+        method: 'post',
+        data: {
+            "street": $("#numberstreetinput").val(),
+            "city": $("#cityinput").val(),
+            "state": $("#stateinput").val(),
+            "zip": $("#zipcodeinput").val()
+        },
+        timeout: 15 * 1000,
+        success: function (resp) {
+            if (addrlookupdialogopen) {
+                app.dialog.close();
+                addrlookupdialogopen = false;
+            }
+            if (resp.status == "OK") {
+                if (resp.address.status == "OK") {
+                    var address = resp.address;
+                    $(".item-text #address").text(address.address);
+                    var zipstr = "";
+                    var postnetstr = "";
+                    var postnetspacedstr = "";
+                    if (address.zip != "") {
+                        zipstr = address.zip;
+                        postnetstr = address.zip;
+                        postnetspacedstr = address.zip;
+                    }
+                    if (address.plus4 != "") {
+                        zipstr += "-" + address.plus4;
+                        postnetstr += "" + address.plus4;
+                        postnetspacedstr += " " + address.plus4;
+                    }
+                    if (address.delivery_point != "") {
+                        postnetstr += "" + address.delivery_point;
+                        postnetspacedstr += " " + address.delivery_point;
+                    }
+                    $(".item-text #citystate").text(address.city + " " + address.state + " " + zipstr);
+
+                    $(".item-text #dp").text(address.delivery_point);
+                    $(".item-text #route").text(address.route);
+                    $(".item-text #county").text(address.county);
+                    $(".item-text #dpvconfirmed").text(address.dpv_confirmed ? "Yes" : "No");
+                    $(".addrresult").removeClass("display-none");
+                    let canvas = document.createElement('canvas');
+                    bwipjs.toCanvas(canvas, {
+                        bcid: 'postnet', // Barcode type
+                        text: postnetstr, // Text to encode
+                        scale: 2,
+                        height: 3, // Bar height, in millimeters
+                        alttext: postnetspacedstr,
+                        includetext: true, // Show human-readable text
+                        textxalign: 'center', // Always good to set this
+                    });
+                    document.getElementById("postnetbarcode").src = canvas.toDataURL('image/png');
+                    $(".barcoderesult").removeClass("display-none");
+                } else {
+                    $(".addrresult").addClass("display-none");
+                    $(".barcoderesult").addClass("display-none");
+                    app.dialog.alert(resp.address.message, "Error");
+                }
+                if (resp.geocode.status == "OK") {
+                    $(".georesult").removeClass("display-none");
+                    $(".item-text #geocoords").text(resp.geocode.latitude.toFixed(4) + ", " + resp.geocode.longitude.toFixed(4));
+                    $(".item-text #geocoords").attr("href", "geo:" + resp.geocode.latitude.toFixed(4) + "," + resp.geocode.longitude.toFixed(4));
+                } else {
+                    $(".georesult").addClass("display-none");
+                }
+            } else {
+                app.dialog.alert(resp.message, "Error");
+            }
+        },
+        error: function (jqXHR, status, errorThrown) {
+            if (addrlookupdialogopen) {
+                app.dialog.close();
+                addrlookupdialogopen = false;
+            }
+            app.dialog.alert("There was a network or server issue.  Please try again.", "Error");
+        }
+    });
+}

www/assets/js/toolbox_log.js

@@ -0,0 +1,21 @@
+/*
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+
+
+function confirmDeleteActivityLog() {
+    app.dialog.confirm(
+            "Really delete all log entries?",
+            "Clear Log",
+            function () {
+                // clear
+                clearActivityLog();
+                router.refreshPage();
+            },
+            function () {
+                // cancel
+            }
+    );
+}

www/assets/js/toolbox_scanner.js

@@ -29,11 +29,7 @@ function brokenScannerEsc() {
 function brokenScannerScan() {
     scanBarcode(function (code) {
         playSound("scan");
-        if (code != "" && code.length > 5 && code.match(/^[0-9A-Z]+$/i)) {
-            addCodeToScannerList(code);
-        } else {
-            app.dialog.alert("That's not a valid tracking code.", "Error");
-        }
+        addCodeToScannerList(code);
     }, function (error) {
         app.dialog.alert(error, "Error");
     });
@@ -52,6 +48,13 @@ function brokenScannerAddTextEntry() {
 function addCodeToScannerList(code) {
     code = code.toUpperCase();
 
+    if (code != "" && code.length > 5 && code.match(/^[0-9A-Z]+$/i)) {
+        // continue
+    } else {
+        app.dialog.alert("That's not a valid tracking code.", "Error");
+        return;
+    }
+
     var signatureregexes = [
         /^E[A-Z][0-9]{9}US$/, // Priority Mail Express
         /^[RV][A-Z][0-9]{9}[A-Z]{2}$/, // Registered mail
@@ -101,7 +104,7 @@ function addCodeToScannerList(code) {
         } else {
             app.dialog.confirm(
                     "It looks like this item might require a signature or other special procedures. Add it anyways?",
-                    "Signature Item",
+                    "Special Item",
                     function () {
                         $("#codelist").append(codeEntryTemplate({
                             code: code
@@ -189,12 +192,14 @@ function openEventTypePopup(eventname) {
 }
 
 function saveScanCode(code) {
-    if (localStorage.getItem("scanevents") == null) {
-        localStorage.setItem("scanevents", "[]");
+    if (getStorage("scanevents") == null) {
+        setStorage("scanevents", "[]");
     }
-    var events = JSON.parse(localStorage.getItem("scanevents"));
+    var events = JSON.parse(getStorage("scanevents"));
     events.push(code);
-    localStorage.setItem("scanevents", JSON.stringify(events));
+    setStorage("scanevents", JSON.stringify(events));
+
+    appendActivityLog("Scanned Item", code.event.join(' <i class="fas fa-chevron-right"></i> '), code.code + (code.form3849 == "" ? "" : "<br>Form 3849: " + code.form3849), "fas fa-barcode");
 }
 
 $(".view-main").off("click", "#codelist li.codelist-entry");

www/assets/js/toolbox_scannerentries.js

@@ -11,7 +11,7 @@ function confirmDeleteScanEntries() {
             "Clear Entries",
             function () {
                 // clear
-                localStorage.setItem("scanevents", "[]");
+                setStorage("scanevents", "[]");
                 router.navigate("/toolbox/scanner/entries", {
                     reloadCurrent: true
                 });

www/assets/js/toolbox_sharelist.js

@@ -33,6 +33,7 @@ function uploadList() {
                     height: 40
                 });
                 $("#listidbarcodeli").css("display", "");
+                appendActivityLog("Shared List", countPackages() + " items sent", "", "fas fa-file-upload");
             } else {
                 app.dialog.alert(resp.message, "Error");
             }

www/assets/js/toolbox_track.js

@@ -88,19 +88,26 @@ function openTrackingHistory(code) {
                 }
 
                 // Keep last five tracking codes in history
-                var history = localStorage.getItem("trackingcodehistory");
+                var history = getStorage("trackingcodehistory");
                 if (history == null) {
                     history = [];
                 } else {
                     history = JSON.parse(history);
                 }
-                if (infocontext.code != "" && !history.includes(infocontext.code)) {
+                if (infocontext.code != "") {
+                    // Search the history list and remove the current code if it's there
+                    for (var i = 0; i < history.length; i++) {
+                        if (history[i] == infocontext.code) {
+                            history.splice(i, 1);
+                        }
+                    }
+                    // Add the code back to the list so it's at the top
                     history.push(infocontext.code);
                 }
                 while (history.length > 5) {
                     history.shift();
                 }
-                localStorage.setItem("trackingcodehistory", JSON.stringify(history));
+                setStorage("trackingcodehistory", JSON.stringify(history));
 
                 if (refresh) {
                     router.navigate("/toolbox/track/info", {

www/assets/js/toolbox_weather.js

@@ -1,4 +1,4 @@
-/* 
+/*
  * This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
@@ -40,23 +40,193 @@ function loadWeather(reload) {
             }
             requestfinished = true;
             if (resp.status == "OK") {
-                var mintemp = (localStorage.getItem("units") == "metric" ? Math.round(ftoc(resp.temp.min)) + " °C" : Math.round(resp.temp.min) + " °F");
-                var maxtemp = (localStorage.getItem("units") == "metric" ? Math.round(ftoc(resp.temp.max)) + " °C" : Math.round(resp.temp.max) + " °F");
-                $("#lowtemp").html(mintemp);
-                $("#hightemp").html(maxtemp);
-                $("#precipchance").text(Math.round(resp.precipitation.chance * 100.0) + "% chance");
-                if (localStorage.getItem("units") == "metric") {
-                    $("#windspeed").text(Math.round(resp.windspeed * 1.609344) + " km/h");
+                //
+                // Summary tab
+                //
+                var mintemp = (getStorage("units") == "metric" ? Math.round(ftoc(resp.summary.temp.min)) + " °C" : Math.round(resp.summary.temp.min) + " °F");
+                var maxtemp = (getStorage("units") == "metric" ? Math.round(ftoc(resp.summary.temp.max)) + " °C" : Math.round(resp.summary.temp.max) + " °F");
+                $("#summarylowtemp").html(mintemp);
+                $("#summaryhightemp").html(maxtemp);
+                $("#summaryprecipchance").text(Math.round(resp.summary.precipitation.chance * 100.0) + "% chance");
+                if (getStorage("units") == "metric") {
+                    $("#summarywindspeed").text(Math.round(resp.summary.windspeed * 1.609344) + " km/h");
                 } else {
-                    $("#windspeed").text(Math.round(resp.windspeed) + " mph");
+                    $("#summarywindspeed").text(Math.round(resp.summary.windspeed) + " mph");
                 }
-                if (SETTINGS.weathericons.includes(resp.icon)) {
-                    $("#weathericon").attr("src", "assets/images/weather-" + resp.icon + ".svg");
+                if (SETTINGS.weathericons.includes(resp.summary.icon)) {
+                    $("#summaryweathericon").attr("src", "assets/images/weather-" + resp.summary.icon + ".svg");
                 } else {
-                    $("#weathericon").attr("src", "assets/images/weather-none.svg");
+                    $("#summaryweathericon").attr("src", "assets/images/weather-none.svg");
                 }
-                $("#forecast-location").text(resp.location_name);
-                $("#forecast-info").text("Forecast covers the next " + resp.forecast_hours + " hours (until " + timestampToTimeString(resp.forecast_until) + ").");
+                $("#summary-forecast-location").text(resp.location_name);
+                $("#summary-forecast-info").text("Forecast covers the next " + resp.summary.forecast_hours + " hours (until " + timestampToTimeString(resp.summary.forecast_until) + ").");
+                $("#summary-forecast-creditlink").text(resp.source.text);
+                $("#summary-forecast-creditlink").attr("onclick", "openExternalBrowser('" + resp.source.url + "')");
+
+
+                //
+                // Now tab
+                //
+                var temp = (getStorage("units") == "metric" ? Math.round(ftoc(resp.now.temp)) + " °C" : Math.round(resp.now.temp) + " °F");
+                var feelslike = (getStorage("units") == "metric" ? Math.round(ftoc(resp.now.feelslike)) + " °C" : Math.round(resp.now.feelslike) + " °F");
+                $("#nowtemp").html(temp);
+                $("#nowfeelslike").html(feelslike);
+                if (SETTINGS.weathericons.includes(resp.now.icon)) {
+                    $("#nowweathericon").attr("src", "assets/images/weather-" + resp.now.icon + ".svg");
+                } else {
+                    $("#nowweathericon").attr("src", "assets/images/weather-none.svg");
+                }
+
+                app.gauge.get('#nowuvindexgauge').update({
+                    value: Math.min(resp.now.uv_index, 10) / 10,
+                    valueText: resp.now.uv_index + "",
+                    borderColor: colorThemeNameToHex(uvIndexToColor(resp.now.uv_index))
+                });
+
+                if (getStorage("units") == "metric") {
+                    $("#nowwindspeed").text(Math.round(resp.now.windspeed * 1.609344) + " km/h");
+                } else {
+                    $("#nowwindspeed").text(Math.round(resp.now.windspeed) + " mph");
+                }
+
+                $("#nowwinddirection").text(degreesToCardinal(resp.now.winddirection));
+
+                var minutelydata = [];
+                var maxprecip = 0;
+                for (var i = 0; i < resp.today.minutely.length; i++) {
+                    precip = resp.today.minutely[i].precip;
+                    if (getStorage("units") == "metric") {
+                        precip = precip * 25.4;
+                    }
+
+                    minutelydata[i] = {
+                        x: new Date(resp.today.minutely[i].time * 1000),
+                        y: precip
+                    };
+                    if (precip > maxprecip) {
+                        maxprecip = precip;
+                    }
+                }
+
+                if (maxprecip > 0) {
+                    // only make rain chart if there's rain
+                    var precipChart = new Chart(document.getElementById('precipchart'), {
+                        type: "line",
+                        data: {
+                            datasets: [
+                                {
+                                    fill: true,
+                                    data: minutelydata,
+                                    borderWidth: 0,
+                                    spanGaps: true,
+                                    backgroundColor: "#03A9F4",
+                                    borderColor: "#03A9F4",
+                                    lineTension: 0.5
+                                }
+                            ]
+                        },
+                        options: {
+                            responsive: true,
+                            elements: {
+                                point: {
+                                    radius: 0
+                                }
+                            },
+                            scales: {
+                                xAxes: [{
+                                        type: 'time',
+                                        display: true,
+                                        scaleLabel: {
+                                            display: false
+                                        },
+                                        gridLines: {
+                                            display: true,
+                                            drawBorder: false
+                                        },
+                                        time: {
+                                            unit: 'minute',
+                                            stepSize: 5,
+                                            displayFormats: {
+                                                minute: 'h:mm',
+                                                hour: 'hA'
+                                            }
+                                        }
+                                    }],
+                                yAxes: [{
+                                        display: true,
+                                        scaleLabel: {
+                                            display: true
+                                        },
+                                        gridLines: {
+                                            display: false,
+                                            drawBorder: false
+                                        },
+                                        ticks: {
+                                            beginAtZero: true,
+                                            min: 0,
+                                            autoSkip: true,
+                                            maxTicksLimit: 3,
+                                            callback: function (value, index, values) {
+                                                if (getStorage("units") == "metric") {
+                                                    return value + ' mm';
+                                                } else {
+                                                    return value + ' in';
+                                                }
+                                            }
+                                        }
+                                    }]
+                            },
+                            legend: {
+                                display: false
+                            },
+                            tooltips: {
+                                enabled: false
+                            }
+                        }
+                    });
+                }
+
+
+
+                //
+                // Forecast tab
+                //
+                forecastItems = [];
+
+                for (var i = 0; i < resp.forecast.length; i++) {
+                    var low = (getStorage("units") == "metric" ? Math.round(ftoc(resp.forecast[i].temp.min)) : Math.round(resp.forecast[i].temp.min));
+                    var high = (getStorage("units") == "metric" ? Math.round(ftoc(resp.forecast[i].temp.max)) + " &deg;C" : Math.round(resp.forecast[i].temp.max) + " &deg;F");
+                    var precipcolor = precipChanceToColor(resp.forecast[i].precipitation.chance);
+                    forecastItems.push({
+                        day: (i == 0 ? "Today" : formatTimestamp('l', resp.forecast[i].date)),
+                        temps: low + " to " + high,
+                        uv_index: resp.forecast[i].uv_index,
+                        uv_color: uvIndexToColor(resp.forecast[i].uv_index),
+                        uv_foreground: uvIndexToColor(resp.forecast[i].uv_index) == "yellow" ? "black" : "white",
+                        precip_chance: Math.round(resp.forecast[i].precipitation.chance * 100),
+                        precip_color: precipcolor,
+                        precip_foreground: precipcolor == "lightblue" ? "black" : "white"
+                    });
+                }
+
+                forecastItemTemplate = '<li>'
+                        + '<div class="item-content">'
+                        + '  <div class="item-inner">'
+                        + '    <div class="item-title">'
+                        + '    <div class="item-header">{{day}}</div>'
+                        + '        {{temps}}'
+                        + '        <br /><span class="padding-half forecast-uv-badge badge color-{{uv_color}} text-color-{{uv_foreground}}"><i class="fas fa-sun fa-fw"></i> {{uv_index}}</span>'
+                        + '        &nbsp; <span class="padding-half forecast-precip-badge badge color-{{precip_color}} text-color-{{precip_foreground}}"><i class="fas fa-tint fa-fw"></i> {{precip_chance}}%</span>'
+                        + '    </div>'
+                        + '  </div>'
+                        + '</div>'
+                        + '</li>';
+
+                forecastVirtualList = app.virtualList.create({
+                    el: "#forecast-list",
+                    items: forecastItems,
+                    itemTemplate: forecastItemTemplate
+                });
             } else {
                 app.dialog.alert(resp.message, "Error");
             }
@@ -83,4 +253,48 @@ function loadWeather(reload) {
             }
         }, 1000);
     }
+}
+
+$("#app").on("click", "#weather-forecast .forecast-uv-badge", function () {
+    app.toast.show({
+        text: "<i class='fas fa-info-circle'></i> UV index",
+        position: "bottom",
+        destroyOnClose: true,
+        closeTimeout: 1000 * 3
+    });
+});
+
+$("#app").on("click", "#weather-forecast .forecast-precip-badge", function () {
+    app.toast.show({
+        text: "<i class='fas fa-info-circle'></i> Chance of precipitation",
+        position: "bottom",
+        destroyOnClose: true,
+        closeTimeout: 1000 * 3
+    });
+});
+
+function uvIndexToColor(index) {
+    var uvcolor = "green";
+    if (index >= 11) {
+        uvcolor = "purple";
+    } else if (index >= 8) {
+        uvcolor = "red";
+    } else if (index >= 6) {
+        uvcolor = "orange";
+    } else if (index >= 3) {
+        uvcolor = "yellow";
+    }
+    return uvcolor;
+}
+
+function precipChanceToColor(chance) {
+    var color = "lightblue";
+    if (chance > 0.8) {
+        color = "gray";
+    } else if (chance > 0.2) {
+        color = "blue";
+    } else {
+        color = "lightblue";
+    }
+    return color;
 }

www/assets/js/util.js

@@ -1,20 +1,248 @@
-/* 
+/*
  * This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
  */
 
+/**
+ * Generate a UUID.
+ * From https://stackoverflow.com/a/2117523
+ * @returns {String}
+ */
+function uuidv4() {
+    return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
+        var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);
+        return v.toString(16);
+    });
+}
 
-function timestampToDateTimeString(timestamp) {
+/**
+ * Take a UNIX timestamp (seconds since Jan 1 1970) and format it.
+ * (Mostly) compatible with PHP's date() function.
+ * @param {String} date format string, see https://www.php.net/manual/en/function.date.php
+ * @param {Integer} timestamp UNIX timestamp
+ * @return {String}
+ */
+function formatTimestamp(format, timestamp) {
+    if (typeof timestamp == "undefined") {
+        timestamp = time();
+    }
     var date = new Date(timestamp * 1000);
 
-    var pm = date.getHours() >= 12;
-    var hours = date.getHours() > 12 ? date.getHours() - 12 : date.getHours();
-    hours = (hours == 0 ? 12 : hours);
-    var minutes = date.getMinutes();
-    var time = hours + ":" + (minutes < 10 ? "0" + minutes : minutes) + " " + (pm ? "PM" : "AM");
+    var out = "";
 
-    return date.toLocaleDateString() + " " + time;
+    var months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
+    var days = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
+    for (var i = 0; i < format.length; i++) {
+        var c = format.charAt(i);
+        // Handle backslash-escaped characters
+        if (c == "\\" && i < format.length - 1) {
+            out += format.charAt(i + 1);
+            i++;
+            continue;
+        }
+        switch (c) {
+            case "d":
+                var d = date.getDate();
+                if (d < 10) {
+                    out += "0";
+                }
+                out += d;
+                break;
+            case "D":
+                out += days[date.getDay()].substring(0, 3);
+                break;
+            case "j":
+                out += date.getDate();
+                break;
+            case "l":
+                out += days[date.getDay()];
+                break;
+            case "N":
+                // TODO
+                break;
+            case "S":
+                // TODO
+                break;
+            case "w":
+                out += date.getDay();
+                break;
+            case "z":
+                // TODO
+                break;
+            case "W":
+                // TODO
+                break;
+            case "F":
+                out += months[date.getMonth()];
+                break;
+            case "m":
+                var m = date.getMonth() + 1;
+                if (m < 10) {
+                    out += "0";
+                }
+                out += m;
+                break;
+            case "M":
+                out += months[date.getMonth()].substring(0, 3);
+                break;
+            case "n":
+                out += date.getMonth() + 1;
+                break;
+            case "t":
+                // TODO
+                break;
+            case "L":
+                // TODO
+                break;
+            case "o":
+                // TODO
+                break;
+            case "Y":
+                out += date.getFullYear();
+                break;
+            case "y":
+                var y = (date.getFullYear() + "");
+                out += y.substring(y.length - 2);
+                break;
+            case "a":
+                if (date.getHours() < 12) {
+                    out += "am";
+                } else {
+                    out += "pm";
+                }
+                break;
+            case "A":
+                if (date.getHours() < 12) {
+                    out += "AM";
+                } else {
+                    out += "PM";
+                }
+                break;
+            case "B":
+                // TODO
+                break;
+            case "g":
+                var h = date.getHours() % 12;
+                if (h == 0) {
+                    h = 12;
+                }
+                out += h;
+                break;
+            case "G":
+                out += date.getHours();
+                break;
+            case "h":
+                var h = date.getHours() % 12;
+                if (h == 0) {
+                    h = 12;
+                }
+                if (h < 10) {
+                    out += "0";
+                }
+                out += h;
+                break;
+            case "H":
+                var h = date.getHours();
+                if (h < 10) {
+                    out += "0";
+                }
+                out += h;
+                break;
+            case "i":
+                var ii = date.getMinutes();
+                if (ii < 10) {
+                    out += "0";
+                }
+                out += ii;
+                break;
+            case "s":
+                var s = date.getSeconds();
+                if (s < 10) {
+                    out += "0";
+                }
+                out += s;
+                break;
+            case "u":
+                out += date.getMilliseconds() * 1000;
+                break;
+            case "v":
+                out += date.getMilliseconds();
+                break;
+            case "e":
+                // TODO
+                break;
+            case "I":
+                // TODO
+                break;
+            case "O":
+                var off = date.getTimezoneOffset();
+                var m = off % 60;
+                var h = (off - m) / 60;
+                if (off >= 0) {
+                    out += "+";
+                } else {
+                    out += "-";
+                }
+                if (h < 10) {
+                    out += "0";
+                }
+                out += h;
+                if (m < 10) {
+                    out += "0";
+                }
+                out += m;
+                break;
+            case "P":
+                var off = date.getTimezoneOffset();
+                var m = off % 60;
+                var h = (off - m) / 60;
+                if (off >= 0) {
+                    out += "+";
+                } else {
+                    out += "-";
+                }
+                if (h < 10) {
+                    out += "0";
+                }
+                out += h;
+                out += ":";
+                if (m < 10) {
+                    out += "0";
+                }
+                out += m;
+                break;
+            case "T":
+                // TODO
+                break;
+            case "Z":
+                out += date.getTimezoneOffset() * 60;
+                break;
+            case "c":
+                out += formatTimestamp(timestamp, "Y-m-d\\TH:i:sP");
+                break;
+            case "r":
+                out += formatTimestamp(timestamp, "D, j M Y G:i:s O");
+                break;
+            case "U":
+                out += Math.round(timestamp);
+                break;
+            default:
+                out += c;
+        }
+    }
+
+    return out;
+}
+
+function timestampToDateTimeString(timestamp) {
+    return timestampToDateString(timestamp) + " " + timestampToTimeString(timestamp);
+}
+
+function timestampToDateString(timestamp) {
+    var date = new Date(timestamp * 1000);
+
+    return date.toLocaleDateString();
 }
 
 function timestampToTimeString(timestamp) {
@@ -27,4 +255,85 @@ function timestampToTimeString(timestamp) {
     var time = hours + ":" + (minutes < 10 ? "0" + minutes : minutes) + " " + (pm ? "PM" : "AM");
 
     return time;
+}
+
+/**
+ * Get the current UNIX timestamp in seconds.
+ * @returns {Number}
+ */
+function time() {
+    return Date.now() / 1000;
+}
+
+/**
+ * Get the number of seconds between now and the given timestamp.
+ * @param {Number} compareto
+ * @returns {Number}
+ */
+function timeDiff(compareto) {
+    return time() - compareto;
+}
+
+/**
+ * Convert decimal degrees to cardinal/compass directions.
+ * https://gist.github.com/felipeskroski/8aec22f01dabdbf8fb6b
+ * @param {type} deg
+ * @returns {String}
+ */
+function degreesToCardinal(deg) {
+    if (deg > 11.25 && deg < 33.75) {
+        return "NNE";
+    } else if (deg > 33.75 && deg < 56.25) {
+        return "ENE";
+    } else if (deg > 56.25 && deg < 78.75) {
+        return "E";
+    } else if (deg > 78.75 && deg < 101.25) {
+        return "ESE";
+    } else if (deg > 101.25 && deg < 123.75) {
+        return "ESE";
+    } else if (deg > 123.75 && deg < 146.25) {
+        return "SE";
+    } else if (deg > 146.25 && deg < 168.75) {
+        return "SSE";
+    } else if (deg > 168.75 && deg < 191.25) {
+        return "S";
+    } else if (deg > 191.25 && deg < 213.75) {
+        return "SSW";
+    } else if (deg > 213.75 && deg < 236.25) {
+        return "SW";
+    } else if (deg > 236.25 && deg < 258.75) {
+        return "WSW";
+    } else if (deg > 258.75 && deg < 281.25) {
+        return "W";
+    } else if (deg > 281.25 && deg < 303.75) {
+        return "WNW";
+    } else if (deg > 303.75 && deg < 326.25) {
+        return "NW";
+    } else if (deg > 326.25 && deg < 348.75) {
+        return "NNW";
+    } else {
+        return "N";
+    }
+}
+
+function colorThemeNameToHex(theme) {
+    var colors = {
+        red: "#ff3b30",
+        green: "#4cd964",
+        blue: "#2196f3",
+        pink: "#ff2d55",
+        yellow: "#ffcc00",
+        orange: "#ff9500",
+        purple: "#9c27b0",
+        deeppurple: "#673ab7",
+        lightblue: "#5ac8fa",
+        teal: "#009688",
+        lime: "#cddc39",
+        deeporange: "#ff6b22",
+        gray: "#8e8e93",
+        white: "#ffffff",
+        black: "#000000"
+    };
+
+    return colors[theme.toLowerCase()];
 }

www/cache.js

@@ -0,0 +1,179 @@
+/*
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+
+
+var cachedurls = [
+    'package.json',
+    'settings.js',
+    'index.html',
+    '.',
+    'routes.js',
+    'cache.js',
+
+    'assets/audio/error.mp3',
+    'assets/audio/ok.mp3',
+    'assets/audio/scan.mp3',
+
+    'assets/images/icons/logo.svg',
+    'assets/images/barcode-dashed.svg',
+    'assets/images/boxes.png',
+    'assets/images/box-open-dashed.svg',
+    'assets/images/box.png',
+    'assets/images/check.png',
+    'assets/images/envelope.png',
+    'assets/images/envelopes.png',
+    'assets/images/express.png',
+    'assets/images/history-dashed.svg',
+    'assets/images/largeboxes.png',
+    'assets/images/largebox.png',
+    'assets/images/multiple-items.png',
+    'assets/images/note-dashed.svg',
+    'assets/images/signature.png',
+    'assets/images/signatures.png',
+    'assets/images/smallpackage.png',
+    'assets/images/smallpackages.png',
+    'assets/images/bgs/add.svg',
+    'assets/images/bgs/list.svg',
+    'assets/images/bgs/map.svg',
+    'assets/images/bgs/notes.svg',
+    'assets/images/bgs/settings.svg',
+    'assets/images/bgs/toolbox.svg',
+    'assets/images/bgs/toolbox_addrlookup.svg',
+    'assets/images/bgs/toolbox_log.svg',
+    'assets/images/bgs/toolbox_scanner.svg',
+    'assets/images/bgs/toolbox_sharelist.svg',
+    'assets/images/bgs/toolbox_track.svg',
+    'assets/images/bgs/toolbox_weather.svg',
+
+    'assets/css/app.css',
+    'assets/css/backdrop.css',
+    'assets/css/oled.css',
+    'assets/css/web-barcode.css',
+
+    'assets/js/audio.js',
+    'assets/js/autofill.js',
+    'assets/js/list.js',
+    'assets/js/location.js',
+    'assets/js/login.js',
+    'assets/js/main.js',
+    'assets/js/manage.js',
+    'assets/js/map.js',
+    'assets/js/map_leaflet.js',
+    'assets/js/map_mapbox.js',
+    'assets/js/notes.js',
+    'assets/js/packages.js',
+    'assets/js/platform.js',
+    'assets/js/settings.js',
+    'assets/js/storage.js',
+    'assets/js/sync.js',
+    'assets/js/toolbox_scannerentries.js',
+    'assets/js/toolbox_scanner.js',
+    'assets/js/toolbox_sharelist.js',
+    'assets/js/toolbox_track.js',
+    'assets/js/toolbox_weather.js',
+    'assets/js/util.js',
+
+    'pages/credits.html',
+    'pages/home.html',
+    'pages/list.html',
+    'pages/login.html',
+    'pages/manage.html',
+    'pages/map.html',
+    'pages/myroute.html',
+    'pages/settings.html',
+    'pages/toolbox.html',
+    'pages/help/list.html',
+    'pages/help/map.html',
+    'pages/myroute/editnote.html',
+    'pages/toolbox/scanner.html',
+    'pages/toolbox/sharelist.html',
+    'pages/toolbox/track.html',
+    'pages/toolbox/trackinginfo.html',
+    'pages/toolbox/weather.html',
+    'pages/toolbox/scanner/entries.html',
+    'pages/toolbox/scanner/scanner.html',
+
+    'node_modules/framework7/css/framework7.bundle.min.css',
+    'node_modules/@fortawesome/fontawesome-free/css/all.min.css',
+    'node_modules/material-design-icons/iconfont/material-icons.css',
+    'node_modules/leaflet/dist/leaflet.css',
+    'node_modules/leaflet.markercluster/dist/MarkerCluster.css',
+    'node_modules/leaflet.markercluster/dist/MarkerCluster.Default.css',
+    'node_modules/leaflet.locatecontrol/dist/L.Control.Locate.min.css',
+    'node_modules/mapbox-gl/dist/mapbox-gl.css',
+    'node_modules/framework7/js/framework7.bundle.min.js',
+    'node_modules/jquery/dist/jquery.min.js',
+    'node_modules/leaflet/dist/leaflet.js',
+    'node_modules/leaflet.markercluster/dist/leaflet.markercluster.js',
+    'node_modules/mapbox-gl/dist/mapbox-gl.js',
+    'node_modules/jsbarcode/dist/JsBarcode.all.min.js',
+    'node_modules/leaflet.locatecontrol/dist/L.Control.Locate.min.js',
+    'node_modules/@zxing/library/umd/index.min.js',
+    'node_modules/@fortawesome/fontawesome-free/webfonts/fa-brands-400.ttf',
+    'node_modules/@fortawesome/fontawesome-free/webfonts/fa-brands-400.woff',
+    'node_modules/@fortawesome/fontawesome-free/webfonts/fa-brands-400.woff2',
+    'node_modules/@fortawesome/fontawesome-free/webfonts/fa-regular-400.ttf',
+    'node_modules/@fortawesome/fontawesome-free/webfonts/fa-regular-400.woff',
+    'node_modules/@fortawesome/fontawesome-free/webfonts/fa-regular-400.woff2',
+    'node_modules/@fortawesome/fontawesome-free/webfonts/fa-solid-900.ttf',
+    'node_modules/@fortawesome/fontawesome-free/webfonts/fa-solid-900.woff',
+    'node_modules/@fortawesome/fontawesome-free/webfonts/fa-solid-900.woff2',
+    'node_modules/material-design-icons/iconfont/MaterialIcons-Regular.ttf',
+    'node_modules/material-design-icons/iconfont/MaterialIcons-Regular.woff',
+    'node_modules/material-design-icons/iconfont/MaterialIcons-Regular.woff2'
+];
+for (i in SETTINGS.maptileurls) {
+    cachedurls.push(SETTINGS.maptileurls[i].json);
+}
+
+for (i in SETTINGS.alertsounds) {
+    cachedurls.push("assets/audio/" + SETTINGS.alertsounds[i].file);
+}
+
+for (i in SETTINGS.weathericons) {
+    cachedurls.push("assets/images/weather-" + SETTINGS.weathericons[i] + ".svg");
+}
+
+var cacheFilled = false;
+
+function fillCache(cachename) {
+    if ('caches' in window) {
+        // delete old caches
+        caches.keys().then(function (cacheNames) {
+            return Promise.all(cacheNames.map(function (oldCacheName) {
+                if (oldCacheName != cachename) {
+                    return caches.delete(oldCacheName);
+                }
+            }));
+        });
+
+        cacheFilled = true; // assume good
+        caches.open(cachename).then(function (cache) {
+            for (i in cachedurls) {
+                try {
+                    cache.add(cachedurls[i]);
+                } catch (ex) {
+                    cacheFilled = false;
+                }
+            }
+        });
+
+        // Do it again in a little while
+        if (!cacheFilled) {
+            setTimeout(function () {
+                fillCache(cachename);
+            }, 1000 * 30);
+        }
+    }
+}
+
+async function clearAllCaches() {
+    const keys = await caches.keys();
+
+    for (const key of keys) {
+        caches.delete(key);
+    }
+}

www/index.html

@@ -5,6 +5,8 @@
 <title>PackageHelper</title>
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
+<link rel="icon" href="assets/images/icons/logo.svg" />
+<link rel="manifest" href="manifest.json">
 <link rel="stylesheet" href="node_modules/framework7/css/framework7.bundle.min.css" />
 <link rel="stylesheet" href="node_modules/@fortawesome/fontawesome-free/css/all.min.css" />
 <link rel="stylesheet" href="node_modules/material-design-icons/iconfont/material-icons.css" />
@@ -13,10 +15,13 @@
 <link rel="stylesheet" href="node_modules/leaflet.markercluster/dist/MarkerCluster.Default.css" />
 <link rel="stylesheet" href="node_modules/leaflet.locatecontrol/dist/L.Control.Locate.min.css" />
 <link rel="stylesheet" href="node_modules/mapbox-gl/dist/mapbox-gl.css">
+<link rel="stylesheet" href="node_modules/chart.js/dist/Chart.min.css">
 <link rel="stylesheet" href="assets/css/app.css" />
 <link rel="stylesheet" href="assets/css/backdrop.css" />
 <link rel="stylesheet" href="assets/css/oled.css" />
 <link rel="stylesheet" href="assets/css/web-barcode.css" />
+<link rel="stylesheet" href="assets/fonts/roboto/Roboto.css" />
+<link rel="stylesheet" href="assets/css/tablet.css" />
 
 <script src="cordova.js"></script>
 
@@ -39,13 +44,19 @@
 <script src="node_modules/leaflet.markercluster/dist/leaflet.markercluster.js"></script>
 <script src="node_modules/mapbox-gl/dist/mapbox-gl.js"></script>
 <script src="node_modules/jsbarcode/dist/JsBarcode.all.min.js"></script>
+<script src="node_modules/bwip-js/dist/bwip-js-min.js"></script>
 <script src="node_modules/leaflet.locatecontrol/dist/L.Control.Locate.min.js"></script>
+<script src="node_modules/onscan.js/onscan.min.js"></script>
+<script src="node_modules/chart.js/dist/Chart.bundle.min.js"></script>
 
 <script src="settings.js"></script>
 
+<script src="assets/js/storage.js"></script>
+
 <script src="assets/js/platform.js"></script>
 
 <script src="assets/js/util.js"></script>
+<script src="assets/js/activitylog.js"></script>
 <script src="assets/js/audio.js"></script>
 <script src="assets/js/autofill.js"></script>
 <script src="assets/js/packages.js"></script>
@@ -54,7 +65,27 @@
 <script src="assets/js/map_leaflet.js"></script>
 <script src="assets/js/map_mapbox.js"></script>
 <script src="assets/js/map.js"></script>
-<script src="assets/js/manage.js"></script>
+<script src="assets/js/sync.js"></script>
+<script src="assets/js/notes.js"></script>
 
 <script src="routes.js"></script>
-<script src="assets/js/main.js"></script>
+<script src="assets/js/main.js"></script>
+
+<script src="assets/js/hardscan.js"></script>
+
+<script src="cache.js"></script>
+
+<script>
+    if (platform_type == "browser") {
+        fillCache(SETTINGS.cacheversion);
+    }
+    if ('serviceWorker' in navigator) {
+        navigator.serviceWorker.register('sw.js').then(function (registration) {
+            console.log('Service worker registration succeeded:', registration);
+        }, /*catch*/ function (error) {
+            console.log('Service worker registration failed:', error);
+        });
+    } else {
+        console.log('Service workers are not supported.');
+    }
+</script>

www/manifest.json

@@ -0,0 +1,57 @@
+{
+    "name": "PackageHelper",
+    "short_name": "PackageHelper",
+    "icons": [
+        {
+            "src": "assets/images/icons/32x32.png",
+            "sizes": "32x32",
+            "type": "image/png"
+        },
+        {
+            "src": "assets/images/icons/128x128.png",
+            "sizes": "128x128",
+            "type": "image/png"
+        },
+        {
+            "src": "assets/images/icons/144x144.png",
+            "sizes": "144x144",
+            "type": "image/png"
+        },
+        {
+            "src": "assets/images/icons/152x152.png",
+            "sizes": "152x152",
+            "type": "image/png"
+        },
+        {
+            "src": "assets/images/icons/192x192.png",
+            "sizes": "192x192",
+            "type": "image/png"
+        },
+        {
+            "src": "assets/images/icons/256x256.png",
+            "sizes": "256x256",
+            "type": "image/png"
+        },
+        {
+            "src": "assets/images/icons/512x512.png",
+            "sizes": "512x512",
+            "type": "image/png"
+        }
+    ],
+    "scope": "/",
+    "lang": "en-US",
+    "categories": ["navigation", "productivity", "utilities", "weather"],
+    "prefer_related_applications": true,
+    "related_applications": [
+        {
+            "platform": "play",
+            "url": "https://play.google.com/store/apps/details?id=com.netsyms.PackageHelper",
+            "id": "com.netsyms.PackageHelper"
+        }
+    ],
+    "start_url": "index.html",
+    "display": "standalone",
+    "background_color": "#ffffff",
+    "theme_color": "#2196f3",
+    "iarc_rating_id": "0e146f9e-8f83-4981-8d7d-30b857ac8db6"
+}

www/package-lock.json

@@ -0,0 +1,407 @@
+{
+  "name": "PackageHelper",
+  "version": "1.6.0",
+  "lockfileVersion": 1,
+  "requires": true,
+  "dependencies": {
+    "@fortawesome/fontawesome-free": {
+      "version": "5.12.1",
+      "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-free/-/fontawesome-free-5.12.1.tgz",
+      "integrity": "sha512-ZtjIIFplxncqxvogq148C3hBLQE+W3iJ8E4UvJ09zIJUgzwLcROsWwFDErVSXY2Plzao5J9KUYNHKHMEUYDMKw=="
+    },
+    "@mapbox/geojson-rewind": {
+      "version": "0.5.0",
+      "resolved": "https://registry.npmjs.org/@mapbox/geojson-rewind/-/geojson-rewind-0.5.0.tgz",
+      "integrity": "sha512-73l/qJQgj/T/zO1JXVfuVvvKDgikD/7D/rHAD28S9BG1OTstgmftrmqfCx4U+zQAmtsB6HcDA3a7ymdnJZAQgg==",
+      "requires": {
+        "concat-stream": "~2.0.0",
+        "minimist": "^1.2.5"
+      }
+    },
+    "@mapbox/geojson-types": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/@mapbox/geojson-types/-/geojson-types-1.0.2.tgz",
+      "integrity": "sha512-e9EBqHHv3EORHrSfbR9DqecPNn+AmuAoQxV6aL8Xu30bJMJR1o8PZLZzpk1Wq7/NfCbuhmakHTPYRhoqLsXRnw=="
+    },
+    "@mapbox/jsonlint-lines-primitives": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/@mapbox/jsonlint-lines-primitives/-/jsonlint-lines-primitives-2.0.2.tgz",
+      "integrity": "sha1-zlblOfg1UrWNENZy6k1vya3HsjQ="
+    },
+    "@mapbox/mapbox-gl-supported": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/@mapbox/mapbox-gl-supported/-/mapbox-gl-supported-1.5.0.tgz",
+      "integrity": "sha512-/PT1P6DNf7vjEEiPkVIRJkvibbqWtqnyGaBz3nfRdcxclNSnSdaLU5tfAgcD7I8Yt5i+L19s406YLl1koLnLbg=="
+    },
+    "@mapbox/point-geometry": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/@mapbox/point-geometry/-/point-geometry-0.1.0.tgz",
+      "integrity": "sha1-ioP5M1x4YO/6Lu7KJUMyqgru2PI="
+    },
+    "@mapbox/tiny-sdf": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@mapbox/tiny-sdf/-/tiny-sdf-1.1.1.tgz",
+      "integrity": "sha512-Ihn1nZcGIswJ5XGbgFAvVumOgWpvIjBX9jiRlIl46uQG9vJOF51ViBYHF95rEZupuyQbEmhLaDPLQlU7fUTsBg=="
+    },
+    "@mapbox/unitbezier": {
+      "version": "0.0.0",
+      "resolved": "https://registry.npmjs.org/@mapbox/unitbezier/-/unitbezier-0.0.0.tgz",
+      "integrity": "sha1-FWUb1VOme4WB+zmIEMmK2Go0Uk4="
+    },
+    "@mapbox/vector-tile": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/@mapbox/vector-tile/-/vector-tile-1.3.1.tgz",
+      "integrity": "sha512-MCEddb8u44/xfQ3oD+Srl/tNcQoqTw3goGk2oLsrFxOTc3dUp+kAnby3PvAeeBYSMSjSPD1nd1AJA6W49WnoUw==",
+      "requires": {
+        "@mapbox/point-geometry": "~0.1.0"
+      }
+    },
+    "@mapbox/whoots-js": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/@mapbox/whoots-js/-/whoots-js-3.1.0.tgz",
+      "integrity": "sha512-Es6WcD0nO5l+2BOQS4uLfNPYQaNDfbot3X1XUoloz+x0mPDS3eeORZJl06HXjwBG1fOGwCRnzK88LMdxKRrd6Q=="
+    },
+    "@zxing/library": {
+      "version": "0.15.2",
+      "resolved": "https://registry.npmjs.org/@zxing/library/-/library-0.15.2.tgz",
+      "integrity": "sha1-MCYHGsqAqErwlwbf+h04YFPhHvw=",
+      "requires": {
+        "text-encoding": "^0.7.0",
+        "ts-custom-error": "^3.0.0"
+      }
+    },
+    "buffer-from": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.1.tgz",
+      "integrity": "sha512-MQcXEUbCKtEo7bhqEs6560Hyd4XaovZlO/k9V3hjVUF/zwW7KBVdSK4gIt/bzwS9MbR5qob+F5jusZsb0YQK2A=="
+    },
+    "bwip-js": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/bwip-js/-/bwip-js-2.0.6.tgz",
+      "integrity": "sha512-25zupM+tgx6NGmrg0kFhdkddeQ5+QnUMvHbb7cPNVbBdFDd0SOG3xRZ1ocGDEamhmM+fStglCLEkH21OpD4Y/w=="
+    },
+    "chart.js": {
+      "version": "2.9.3",
+      "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-2.9.3.tgz",
+      "integrity": "sha512-+2jlOobSk52c1VU6fzkh3UwqHMdSlgH1xFv9FKMqHiNCpXsGPQa/+81AFa+i3jZ253Mq9aAycPwDjnn1XbRNNw==",
+      "requires": {
+        "chartjs-color": "^2.1.0",
+        "moment": "^2.10.2"
+      }
+    },
+    "chartjs-color": {
+      "version": "2.4.1",
+      "resolved": "https://registry.npmjs.org/chartjs-color/-/chartjs-color-2.4.1.tgz",
+      "integrity": "sha512-haqOg1+Yebys/Ts/9bLo/BqUcONQOdr/hoEr2LLTRl6C5LXctUdHxsCYfvQVg5JIxITrfCNUDr4ntqmQk9+/0w==",
+      "requires": {
+        "chartjs-color-string": "^0.6.0",
+        "color-convert": "^1.9.3"
+      }
+    },
+    "chartjs-color-string": {
+      "version": "0.6.0",
+      "resolved": "https://registry.npmjs.org/chartjs-color-string/-/chartjs-color-string-0.6.0.tgz",
+      "integrity": "sha512-TIB5OKn1hPJvO7JcteW4WY/63v6KwEdt6udfnDE9iCAZgy+V4SrbSxoIbTw/xkUIapjEI4ExGtD0+6D3KyFd7A==",
+      "requires": {
+        "color-name": "^1.0.0"
+      }
+    },
+    "color-convert": {
+      "version": "1.9.3",
+      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
+      "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
+      "requires": {
+        "color-name": "1.1.3"
+      },
+      "dependencies": {
+        "color-name": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
+          "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU="
+        }
+      }
+    },
+    "color-name": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
+    },
+    "concat-stream": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-2.0.0.tgz",
+      "integrity": "sha512-MWufYdFw53ccGjCA+Ol7XJYpAlW6/prSMzuPOTRnJGcGzuhLn4Scrz7qf6o8bROZ514ltazcIFJZevcfbo0x7A==",
+      "requires": {
+        "buffer-from": "^1.0.0",
+        "inherits": "^2.0.3",
+        "readable-stream": "^3.0.2",
+        "typedarray": "^0.0.6"
+      }
+    },
+    "csscolorparser": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/csscolorparser/-/csscolorparser-1.0.3.tgz",
+      "integrity": "sha1-s085HupNqPPpgjHizNjfnAQfFxs="
+    },
+    "dom7": {
+      "version": "2.1.3",
+      "resolved": "https://registry.npmjs.org/dom7/-/dom7-2.1.3.tgz",
+      "integrity": "sha512-QTxHHDox+M6ZFz1zHPAHZKI3JOHY5iY4i9BK2uctlggxKQwRhO3q3HHFq1BKsT25Bm/ySSj70K6Wk/G4bs9rMQ==",
+      "requires": {
+        "ssr-window": "^1.0.1"
+      }
+    },
+    "earcut": {
+      "version": "2.2.2",
+      "resolved": "https://registry.npmjs.org/earcut/-/earcut-2.2.2.tgz",
+      "integrity": "sha512-eZoZPPJcUHnfRZ0PjLvx2qBordSiO8ofC3vt+qACLM95u+4DovnbYNpQtJh0DNsWj8RnxrQytD4WA8gj5cRIaQ=="
+    },
+    "framework7": {
+      "version": "5.5.1",
+      "resolved": "https://registry.npmjs.org/framework7/-/framework7-5.5.1.tgz",
+      "integrity": "sha512-Ei+LYZtBf+6kmz9u5YcgXKEFQAK4CRm4lQiUO2zh2HNsxXBJFh3nJ+usybbDmxDL4FZO6/8xF9tO7c77n2X4/A==",
+      "requires": {
+        "dom7": "^2.1.3",
+        "path-to-regexp": "^6.1.0",
+        "ssr-window": "^1.0.1",
+        "template7": "^1.4.2"
+      }
+    },
+    "geojson-vt": {
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/geojson-vt/-/geojson-vt-3.2.1.tgz",
+      "integrity": "sha512-EvGQQi/zPrDA6zr6BnJD/YhwAkBP8nnJ9emh3EnHQKVMfg/MRVtPbMYdgVy/IaEmn4UfagD2a6fafPDL5hbtwg=="
+    },
+    "gl-matrix": {
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/gl-matrix/-/gl-matrix-3.3.0.tgz",
+      "integrity": "sha512-COb7LDz+SXaHtl/h4LeaFcNdJdAQSDeVqjiIihSXNrkWObZLhDI4hIkZC11Aeqp7bcE72clzB0BnDXr2SmslRA=="
+    },
+    "grid-index": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/grid-index/-/grid-index-1.1.0.tgz",
+      "integrity": "sha512-HZRwumpOGUrHyxO5bqKZL0B0GlUpwtCAzZ42sgxUPniu33R1LSFH5yrIcBCHjkctCAh3mtWKcKd9J4vDDdeVHA=="
+    },
+    "ieee754": {
+      "version": "1.1.13",
+      "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.1.13.tgz",
+      "integrity": "sha512-4vf7I2LYV/HaWerSo3XmlMkp5eZ83i+/CDluXi/IGTs/O1sejBNhTtnxzmRZfvOUqj7lZjqHkeTvpgSFDlWZTg=="
+    },
+    "inherits": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
+      "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ=="
+    },
+    "jquery": {
+      "version": "3.5.1",
+      "resolved": "https://registry.npmjs.org/jquery/-/jquery-3.5.1.tgz",
+      "integrity": "sha512-XwIBPqcMn57FxfT+Go5pzySnm4KWkT1Tv7gjrpT1srtf8Weynl6R273VJ5GjkRb51IzMp5nbaPjJXMWeju2MKg=="
+    },
+    "jsbarcode": {
+      "version": "3.11.0",
+      "resolved": "https://registry.npmjs.org/jsbarcode/-/jsbarcode-3.11.0.tgz",
+      "integrity": "sha1-IGI+AIsQHvRdDM6cgCLN9JvihUc="
+    },
+    "kdbush": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/kdbush/-/kdbush-3.0.0.tgz",
+      "integrity": "sha512-hRkd6/XW4HTsA9vjVpY9tuXJYLSlelnkTmVFu4M9/7MIYQtFcHpbugAU7UbOfjOiVSVYl2fqgBuJ32JUmRo5Ew=="
+    },
+    "leaflet": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/leaflet/-/leaflet-1.6.0.tgz",
+      "integrity": "sha1-rsuwRLlJ7ClGnusxx3qI4vRI8wg="
+    },
+    "leaflet-geometryutil": {
+      "version": "0.9.3",
+      "resolved": "https://registry.npmjs.org/leaflet-geometryutil/-/leaflet-geometryutil-0.9.3.tgz",
+      "integrity": "sha512-Wi6YvfNx/Xu9q35AEfXpsUXmIFLen/MO+C2qimxHRnjyeyOxBhdcZa6kSiReaOX0cGK7yQInqrzz0dkIqZ8Dpg==",
+      "requires": {
+        "leaflet": ">=0.7.0"
+      }
+    },
+    "leaflet.locatecontrol": {
+      "version": "0.67.0",
+      "resolved": "https://registry.npmjs.org/leaflet.locatecontrol/-/leaflet.locatecontrol-0.67.0.tgz",
+      "integrity": "sha1-rf7r/WYvYdY5paX7o2I2hXn4rFU="
+    },
+    "leaflet.markercluster": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/leaflet.markercluster/-/leaflet.markercluster-1.4.1.tgz",
+      "integrity": "sha1-tT8sTyynMG3asdu28YYdXoqmxeU="
+    },
+    "mapbox-gl": {
+      "version": "1.12.0",
+      "resolved": "https://registry.npmjs.org/mapbox-gl/-/mapbox-gl-1.12.0.tgz",
+      "integrity": "sha512-B3URR4qY9R/Bx+DKqP8qmGCai8IOZYMSZF7ZSvcCZaYTaOYhQQi8ErTEDZtFMOR0ZPj7HFWOkkhl5SqvDfpJpA==",
+      "requires": {
+        "@mapbox/geojson-rewind": "^0.5.0",
+        "@mapbox/geojson-types": "^1.0.2",
+        "@mapbox/jsonlint-lines-primitives": "^2.0.2",
+        "@mapbox/mapbox-gl-supported": "^1.5.0",
+        "@mapbox/point-geometry": "^0.1.0",
+        "@mapbox/tiny-sdf": "^1.1.1",
+        "@mapbox/unitbezier": "^0.0.0",
+        "@mapbox/vector-tile": "^1.3.1",
+        "@mapbox/whoots-js": "^3.1.0",
+        "csscolorparser": "~1.0.3",
+        "earcut": "^2.2.2",
+        "geojson-vt": "^3.2.1",
+        "gl-matrix": "^3.2.1",
+        "grid-index": "^1.1.0",
+        "minimist": "^1.2.5",
+        "murmurhash-js": "^1.0.0",
+        "pbf": "^3.2.1",
+        "potpack": "^1.0.1",
+        "quickselect": "^2.0.0",
+        "rw": "^1.3.3",
+        "supercluster": "^7.1.0",
+        "tinyqueue": "^2.0.3",
+        "vt-pbf": "^3.1.1"
+      }
+    },
+    "material-design-icons": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/material-design-icons/-/material-design-icons-3.0.1.tgz",
+      "integrity": "sha1-mnHEh0chjrylHlGmbaaCA4zct78="
+    },
+    "minimist": {
+      "version": "1.2.5",
+      "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.5.tgz",
+      "integrity": "sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw=="
+    },
+    "moment": {
+      "version": "2.27.0",
+      "resolved": "https://registry.npmjs.org/moment/-/moment-2.27.0.tgz",
+      "integrity": "sha512-al0MUK7cpIcglMv3YF13qSgdAIqxHTO7brRtaz3DlSULbqfazqkc5kEjNrLDOM7fsjshoFIihnU8snrP7zUvhQ=="
+    },
+    "murmurhash-js": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/murmurhash-js/-/murmurhash-js-1.0.0.tgz",
+      "integrity": "sha1-sGJ44h/Gw3+lMTcysEEry2rhX1E="
+    },
+    "onscan.js": {
+      "version": "1.5.2",
+      "resolved": "https://registry.npmjs.org/onscan.js/-/onscan.js-1.5.2.tgz",
+      "integrity": "sha512-9oGYy2gXYRjvXO9GYqqVca0VuCTAmWhbmX3egBSBP13rXiMNb+dKPJzKFEeECGqPBpf0m40Zoo+GUQ7eCackdw=="
+    },
+    "path-to-regexp": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-6.1.0.tgz",
+      "integrity": "sha1-Cxj4i3oM4L+uaiWZDJCauG9RJCc="
+    },
+    "pbf": {
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/pbf/-/pbf-3.2.1.tgz",
+      "integrity": "sha512-ClrV7pNOn7rtmoQVF4TS1vyU0WhYRnP92fzbfF75jAIwpnzdJXf8iTd4CMEqO4yUenH6NDqLiwjqlh6QgZzgLQ==",
+      "requires": {
+        "ieee754": "^1.1.12",
+        "resolve-protobuf-schema": "^2.1.0"
+      }
+    },
+    "potpack": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/potpack/-/potpack-1.0.1.tgz",
+      "integrity": "sha512-15vItUAbViaYrmaB/Pbw7z6qX2xENbFSTA7Ii4tgbPtasxm5v6ryKhKtL91tpWovDJzTiZqdwzhcFBCwiMVdVw=="
+    },
+    "protocol-buffers-schema": {
+      "version": "3.4.0",
+      "resolved": "https://registry.npmjs.org/protocol-buffers-schema/-/protocol-buffers-schema-3.4.0.tgz",
+      "integrity": "sha512-G/2kcamPF2S49W5yaMGdIpkG6+5wZF0fzBteLKgEHjbNzqjZQ85aAs1iJGto31EJaSTkNvHs5IXuHSaTLWBAiA=="
+    },
+    "quickselect": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/quickselect/-/quickselect-2.0.0.tgz",
+      "integrity": "sha512-RKJ22hX8mHe3Y6wH/N3wCM6BWtjaxIyyUIkpHOvfFnxdI4yD4tBXEBKSbriGujF6jnSVkJrffuo6vxACiSSxIw=="
+    },
+    "readable-stream": {
+      "version": "3.6.0",
+      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.0.tgz",
+      "integrity": "sha512-BViHy7LKeTz4oNnkcLJ+lVSL6vpiFeX6/d3oSH8zCW7UxP2onchk+vTGB143xuFjHS3deTgkKoXXymXqymiIdA==",
+      "requires": {
+        "inherits": "^2.0.3",
+        "string_decoder": "^1.1.1",
+        "util-deprecate": "^1.0.1"
+      }
+    },
+    "resolve-protobuf-schema": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/resolve-protobuf-schema/-/resolve-protobuf-schema-2.1.0.tgz",
+      "integrity": "sha512-kI5ffTiZWmJaS/huM8wZfEMer1eRd7oJQhDuxeCLe3t7N7mX3z94CN0xPxBQxFYQTSNz9T0i+v6inKqSdK8xrQ==",
+      "requires": {
+        "protocol-buffers-schema": "^3.3.1"
+      }
+    },
+    "rw": {
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/rw/-/rw-1.3.3.tgz",
+      "integrity": "sha1-P4Yt+pGrdmsUiF700BEkv9oHT7Q="
+    },
+    "safe-buffer": {
+      "version": "5.2.1",
+      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
+      "integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ=="
+    },
+    "ssr-window": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/ssr-window/-/ssr-window-1.0.1.tgz",
+      "integrity": "sha1-MHUqakZm53Z/C35qpvwv29DZs2k="
+    },
+    "string_decoder": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.3.0.tgz",
+      "integrity": "sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA==",
+      "requires": {
+        "safe-buffer": "~5.2.0"
+      }
+    },
+    "supercluster": {
+      "version": "7.1.0",
+      "resolved": "https://registry.npmjs.org/supercluster/-/supercluster-7.1.0.tgz",
+      "integrity": "sha512-LDasImUAFMhTqhK+cUXfy9C2KTUqJ3gucLjmNLNFmKWOnDUBxLFLH9oKuXOTCLveecmxh8fbk8kgh6Q0gsfe2w==",
+      "requires": {
+        "kdbush": "^3.0.0"
+      }
+    },
+    "template7": {
+      "version": "1.4.2",
+      "resolved": "https://registry.npmjs.org/template7/-/template7-1.4.2.tgz",
+      "integrity": "sha1-YvMpWTYeRV7Bce+e8z0pynEw4Ak="
+    },
+    "text-encoding": {
+      "version": "0.7.0",
+      "resolved": "https://registry.npmjs.org/text-encoding/-/text-encoding-0.7.0.tgz",
+      "integrity": "sha1-+JXoNuRZkGJAhmAXmOqY6PNu5kM=",
+      "optional": true
+    },
+    "tinyqueue": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/tinyqueue/-/tinyqueue-2.0.3.tgz",
+      "integrity": "sha512-ppJZNDuKGgxzkHihX8v9v9G5f+18gzaTfrukGrq6ueg0lmH4nqVnA2IPG0AEH3jKEk2GRJCUhDoqpoiw3PHLBA=="
+    },
+    "ts-custom-error": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/ts-custom-error/-/ts-custom-error-3.1.1.tgz",
+      "integrity": "sha1-0wx0FUYdrJPcLMnp6y2ukuZCOQE="
+    },
+    "typedarray": {
+      "version": "0.0.6",
+      "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
+      "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c="
+    },
+    "util-deprecate": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
+      "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8="
+    },
+    "vt-pbf": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/vt-pbf/-/vt-pbf-3.1.1.tgz",
+      "integrity": "sha512-pHjWdrIoxurpmTcbfBWXaPwSmtPAHS105253P1qyEfSTV2HJddqjM+kIHquaT/L6lVJIk9ltTGc0IxR/G47hYA==",
+      "requires": {
+        "@mapbox/point-geometry": "0.1.0",
+        "@mapbox/vector-tile": "^1.3.1",
+        "pbf": "^3.0.5"
+      }
+    }
+  }
+}

www/package.json

@@ -1,20 +1,23 @@
 {
   "name": "PackageHelper",
-  "version": "1.3.0",
+  "version": "1.6.1",
   "main": "index.html",
   "license": "MPL-2.0",
   "dependencies": {
-    "@fortawesome/fontawesome-free": "^5.10.2",
+    "@fortawesome/fontawesome-free": "^5.12.1",
     "@zxing/library": "^0.15.2",
-    "framework7": "^5.1.3",
-    "jquery": "^3.4.1",
+    "bwip-js": "^2.0.6",
+    "chart.js": "^2.9.3",
+    "framework7": "^5.5.1",
+    "jquery": "^3.5.1",
     "jsbarcode": "^3.11.0",
     "leaflet": "^1.5.1",
     "leaflet-geometryutil": "^0.9.1",
     "leaflet.locatecontrol": "^0.67.0",
     "leaflet.markercluster": "^1.4.1",
-    "mapbox-gl": "^1.6.1",
-    "material-design-icons": "^3.0.1"
+    "mapbox-gl": "^1.12.0",
+    "material-design-icons": "^3.0.1",
+    "onscan.js": "^1.5.2"
   },
   "devDependencies": {}
 }

www/pages/add.html

@@ -0,0 +1,177 @@
+<!-- This Source Code Form is subject to the terms of the Mozilla Public
+   - License, v. 2.0. If a copy of the MPL was not distributed with this
+   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
+
+<div class="page" data-name="add">
+
+    <div class="navbar no-tablet">
+        <div class="navbar-bg"></div>
+        <div class="navbar-inner">
+            <div class="left">
+                <a class="link" onclick="router.back({force: true, ignoreCache: true})">
+                    <i class="icon icon-back"></i>
+                    <span class="if-not-md">Back</span>
+                </a>
+            </div>
+            <div class="title">Add Items</div>
+            <div class="right">
+                <a class="link scanbarcodebtn">
+                    <i class="icon material-icons">center_focus_strong</i>
+                </a>
+                <a class="link popover-open" data-popover="#popover-add-options">
+                    <i class="icon material-icons">more_vert</i>
+                </a>
+            </div>
+        </div>
+    </div>
+
+    <div class="popover" id="popover-add-options">
+        <div class="popover-inner">
+            <div class="list">
+                <ul>
+                    <li><a class="list-button item-link popover-close" href="" onclick="toggleLettersInAddressNumber()"><label class="checkbox"><input type="checkbox" id="address-has-letters-checkbox"><i class="icon-checkbox"></i></label> Address contains letters</a></li>
+                </ul>
+            </div>
+        </div>
+    </div>
+
+    <div class="toolbar tabbar toolbar-bottom">
+        <div class="toolbar-inner">
+            <a href="#add-tab" class="tab-link tab-link-active">Add</a>
+            <a href="#history-tab" class="tab-link">Recent</a>
+        </div>
+    </div>
+
+    {{#if nottablet}}
+    <div class="tabs-swipeable-wrap">
+        {{/if}}
+        <div class="tabs">
+            <div id="add-tab" class="tab tab-active">
+                <div class="navbar only-tablet">
+                    <div class="navbar-bg"></div>
+                    <div class="navbar-inner">
+                        <div class="left">
+                            <a class="link" onclick="router.back({force: true, ignoreCache: true})">
+                                <i class="icon icon-back"></i>
+                                <span class="if-not-md">Back</span>
+                            </a>
+                        </div>
+                        <div class="title">Add Items</div>
+                        <div class="right">
+                            <a class="link scanbarcodebtn">
+                                <i class="icon material-icons">center_focus_strong</i>
+                            </a>
+                            <a class="link popover-open" data-popover="#popover-add-options">
+                                <i class="icon material-icons">more_vert</i>
+                            </a>
+                        </div>
+                    </div>
+                </div>
+                <div class="page-content row justify-content-center margin-top-tablet padding-bottom-tablet">
+                    <div class="list no-margin-top col-100 medium-80 large-50 elevation-tablet">
+                        <ul>
+                            <li class="item-divider">Address</li>
+                            <li>
+                                <div class="row justify-content-stretch">
+                                    <div class="col-70 item-content item-input">
+                                        <div class="item-inner">
+                                            <div class="item-title item-label">Number</div>
+                                            <div class="item-input-wrap">
+                                                <input type="number" name="number" id="housenumberinput" placeholder="1234" value="" autocomplete="off" autocorrect="off">
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div class="col-30 item-content item-input no-padding-left">
+                                        <div class="item-inner no-padding-right">
+                                            <div class="item-title item-label">Unit</div>
+                                            <div class="item-input-wrap">
+                                                <input type="text" name="unit" id="unitinput" placeholder="" value="" autocomplete="off" autocorrect="off">
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </li>
+                            <li class="item-content item-input">
+                                <div class="item-inner">
+                                    <div class="item-title item-label">Street</div>
+                                    <div class="item-input-wrap">
+                                        <input type="text" name="street" id="streetInput" placeholder="Road Dr" autocomplete="off" autocorrect="off">
+                                        <span class="input-clear-button"></span>
+                                    </div>
+                                </div>
+                            </li>
+                            <li>
+                                <div class="row justify-content-stretch">
+                                    <div class="col-70 item-content item-input">
+                                        <div class="item-inner">
+                                            <div class="item-title item-label">City, State</div>
+                                            <div class="item-input-wrap">
+                                                <input type="text" name="citystate" placeholder="City, ST" value="" autocomplete="off" autocorrect="off">
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div class="col-30 item-content item-input no-padding-left">
+                                        <div class="item-inner no-padding-right">
+                                            <div class="item-title item-label">ZIP</div>
+                                            <div class="item-input-wrap">
+                                                <input type="text" name="zipcode" placeholder="12345" value="" autocomplete="off" autocorrect="off">
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </li>
+                            <li class="item-divider">Item Type</li>
+                            {{#each itemtypes}}
+                            <li>
+                                <label class="item-radio item-content">
+                                    <input type="radio" name="itemtype" value="{{id}}" {{#if selected}}data-default="1" checked{{/if}} />
+                                    <i class="icon icon-radio"></i>
+                                    <div class="item-inner">
+                                        <div class="item-title"><i class="{{icon}}"></i> {{name}}</div>
+                                    </div>
+                                </label>
+                            </li>
+                            {{/each}}
+                        </ul>
+                    </div>
+                </div>
+
+                <div class="fab fab-right-bottom no-tablet">
+                    <a class="addpackagebtn">
+                        <i class="icon material-icons">add</i>
+                    </a>
+                </div>
+                <div class="fab fab-extended fab-right-bottom only-tablet">
+                    <a class="addpackagebtn">
+                        <i class="icon material-icons">add</i>
+                        <div class="fab-text">Add Item</div>
+                    </a>
+                </div>
+            </div>
+
+            <div id="history-tab" class="page-content tab">
+                <div class="navbar only-tablet">
+                    <div class="navbar-bg"></div>
+                    <div class="navbar-inner">
+                        <div class="title">Recent Items</div>
+                    </div>
+                </div>
+                <div class="block text-align-center noselect" id="no-history">
+                    <img style="width: 60%; max-width: 300px; max-height: 40vh;" src="assets/images/history-dashed.svg" class="margin-vertical" />
+                    <div class="margin-top">No recently added items!  <span id="history-empty-swipe-prompt">Swipe <i class="fas fa-arrow-left"></i> to add some.</span></div>
+                </div>
+                <ul class="list no-hairlines tablet-inset no-margin-top" id="historylist">
+                    <!-- Packages go here -->
+                </ul>
+                <div class="block text-align-center display-none noselect" id="tap-to-remove-history-prompt">
+                    <span class="block-header"><span class="taptext">Tap</span><span class="clicktext">Click</span> a recently added item to delete it.</span>
+                </div>
+            </div>
+        </div>
+        {{#if nottablet}}
+    </div>
+    {{/if}}
+
+    <script src="assets/js/add.js"></script>
+
+</div>

www/pages/help/list.html

@@ -20,19 +20,16 @@
             <div class="page-content">
                 <div class="block-title">Manage Items</div>
                 <div class="block">
-                    Swipe <i class="fas fa-arrow-right"></i> left-to-right on a list entry
+                    <span class="taptext">Tap</span><span class="clicktext">Click</span> on a list entry
                     to show the actions you can take.
-                    These actions are marking the item as delivered/undelivered, or
-                    navigating to its location with your device's default maps app.
-                    <br />
-                    Swipe <i class="fas fa-arrow-left"></i> right-to-left on a list entry
-                    and tap
-                    <span class="button button-small display-inline button-fill color-red text-color-white"><i class="material-icons">delete</i> Delete</span> to remove it.
+                    These actions are marking the item as delivered/undelivered,
+                    navigating to its location with your device's default maps app,
+                    and deleting the item.
                 </div>
 
                 <div class="block-title">Clear the List</div>
                 <div class="block">
-                    Tap the <span class="color-red text-color-primary"><i class="material-icons">delete</i></span>
+                    <span class="taptext">Tap</span><span class="clicktext">Click</span> the <span class="color-red text-color-primary"><i class="material-icons">delete</i></span>
                     button to remove all items from the list. This cannot be undone, so it's
                     a good idea to do it at the end of the day or in the morning before you start.
                     Note that clearing the list does not affect the address autofill.
@@ -40,14 +37,14 @@
 
                 <div class="block-title">Search</div>
                 <div class="block">
-                    Tap the <i class="material-icons text-color-primary">search</i> button to open a search
+                    <span class="taptext">Tap</span><span class="clicktext">Click</span> the <i class="material-icons text-color-primary">search</i> button to open a search
                     box.  Type in this box to hide any list entries that don't contain your
                     search query.
                 </div>
 
                 <div class="block-title">Sort Items</div>
                 <div class="block">
-                    Tap the <i class="material-icons text-color-primary">sort</i> button to sort
+                    <span class="taptext">Tap</span><span class="clicktext">Click</span> the <i class="material-icons text-color-primary">sort</i> button to sort
                     the list. You can sort by distance from your current
                     location, alphabetically by street name, and numerically by
                     address number.

www/pages/help/map.html

@@ -20,21 +20,22 @@
             <div class="page-content">
                 <div class="block-title">Manage Items</div>
                 <div class="block">
-                    Tap on an icon to see the item(s) at that location.
-                    Tap on an item to toggle it between delivered and
+                    <span class="taptext">Tap</span><span class="clicktext">Click</span> on an icon to see the item(s) at that location.
+                    <span class="taptext">Tap</span><span class="clicktext">Click</span> on an item to toggle it between delivered and
                     undelivered. If two or more addresses are very close
                     together, their items will be grouped under one icon.
                 </div>
 
                 <div class="block-title">Move the Map</div>
                 <div class="block">
-                    Pinch with two fingers or scroll with a mouse to zoom
-                    in and out. You can also double-tap to zoom in.
-                    Drag with one finger or a mouse to move (pan) the map.
+                    <span class="taptext">Pinch with two fingers</span><span class="clicktext">Scroll with a mouse</span>
+                     to zoom
+                    in and out. You can also double-<span class="taptext">tap</span><span class="clicktext">click</span> to zoom in.
+                    Drag with <span class="taptext">one finger</span><span class="clicktext">the mouse</span> to move (pan) the map.
 
                     <br />
 
-                    If you prefer, tap or click
+                    If you prefer, <span class="taptext">tap</span><span class="clicktext">click</span>
                     <span class="button button-small display-inline button-fill color-white text-color-black"><i class="fas fa-plus"></i></span>
                     and
                     <span class="button button-small display-inline button-fill color-white text-color-black"><i class="fas fa-minus"></i></span>
@@ -45,13 +46,13 @@
                     Drag on
                     <span class="button button-small display-inline button-fill color-white text-color-black"><i class="fas fa-sort"></i></span>
                     to rotate and tilt the map.  Dragging left and right rotates, up and down tilts.
-                    You can also rotate with two fingers by twisting them around each other,
-                    or with a keyboard by holding Ctrl and dragging the mouse.
+                    You can also rotate with <span class="taptext">two fingers by twisting them around each other,
+                    or with</span> a keyboard by holding Ctrl and dragging <span class="taptext">your finger</span><span class="clicktext">the mouse</span>.
                 </div>
 
                 <div class="block-title">Follow Location</div>
                 <div class="block">
-                    Tap
+                    <span class="taptext">Tap</span><span class="clicktext">Click</span>
                     <span class="button button-small display-inline button-fill color-white text-color-black"><i class='material-icons'>my_location</i></span>
                     or
                     <span class="button button-small display-inline button-fill color-white text-color-black"><i class='far fa-compass'></i></span>

www/pages/home.html

@@ -11,8 +11,8 @@
         </div>
     </div>
 
-    <div class="page-content">
-        <div class="row margin-top">
+    <div class="page-content noselect">
+        <div class="row margin-top noselect">
             <div class="col text-align-center">
                 <div
                     id="delivery-progress-gauge"
@@ -27,49 +27,43 @@
                     ></div>
             </div>
         </div>
-        <div class="list no-hairlines tablet-inset no-margin-top">
-            <ul>
-                <li>
-                    <a href="/manage" class="item-link item-content">
-                        <div class="item-media"><i class="icon fas fa-truck-loading"></i></div>
-                        <div class="item-inner">
-                            <div class="item-title">Add Items</div>
-                        </div>
-                    </a>
-                </li>
-                <li>
-                    <a href="/list" class="item-link item-content">
-                        <div class="item-media"><i class="icon fas fa-list"></i></div>
-                        <div class="item-inner">
-                            <div class="item-title">Item List</div>
-                        </div>
-                    </a>
-                </li>
-                <li>
-                    <a href="/map" class="item-link item-content">
-                        <div class="item-media"><i class="icon fas fa-map"></i></div>
-                        <div class="item-inner">
-                            <div class="item-title">Delivery Map</div>
-                        </div>
-                    </a>
-                </li>
-                <li>
-                    <a href="/toolbox" class="item-link item-content">
-                        <div class="item-media"><i class="icon fas fa-tools"></i></div>
-                        <div class="item-inner">
-                            <div class="item-title">Toolbox</div>
-                        </div>
-                    </a>
-                </li>
-                <li>
-                    <a href="/settings" class="item-link item-content">
-                        <div class="item-media"><i class="icon fas fa-cog"></i></div>
-                        <div class="item-inner">
-                            <div class="item-title">Settings</div>
-                        </div>
-                    </a>
-                </li>
-            </ul>
+        {{#if oldui}}
+        <div class="row justify-content-center">
+            <div class="col-100 small-80 medium-60 large-50 xlarge-40">
+                <div class="list no-hairlines tablet-inset no-margin-top">
+                    <ul>
+                        {{#each pages}}
+                        <li>
+                            <a href="{{href}}" class="item-link item-content">
+                                <div class="item-media"><i class="icon {{icon}}"></i></div>
+                                <div class="item-inner">
+                                    <div class="item-title">{{title}}</div>
+                                </div>
+                            </a>
+                        </li>
+                        {{/each}}
+                    </ul>
+                </div>
+            </div>
         </div>
+        {{else}}
+        <div class="row justify-content-center margin-top">
+            <div class="col-100 medium-90 xlarge-75 margin-horizontal">
+                <div class="row">
+                    {{#each pages}}
+                    <div class="col-50 small-33 large-15">
+                        <div class="card" onclick="router.navigate('{{href}}');" style="cursor: pointer; background-image: url(assets/images/bgs/{{bg}}); background-repeat: no-repeat; background-position: center; background-size: cover;">
+                            <div class="card-content text-align-center padding-vertical">
+                                <h1 class="no-margin"><i class="{{icon}}"></i></h1>
+                                <br />
+                                <span style="font-weight: 700;">{{title}}</span>
+                            </div>
+                        </div>
+                    </div>
+                    {{/each}}
+                </div>
+            </div>
+        </div>
+        {{/if}}
     </div>
 </div>