From 8514582bcbc521ed46b083e93a63d476d7a968ac Mon Sep 17 00:00:00 2001
From: Skylar Ittner <skylar@netsyms.com>
Date: Fri, 20 Dec 2019 00:50:08 -0700
Subject: [PATCH] Add help panel to list page

---
 www/pages/help/list.html | 52 ++++++++++++++++++++++++++++++++++++++++
 www/pages/list.html      |  4 ++++
 www/routes.js            | 11 +++++++++
 3 files changed, 67 insertions(+)
 create mode 100644 www/pages/help/list.html

diff --git a/www/pages/help/list.html b/www/pages/help/list.html
new file mode 100644
index 0000000..0d94a6e
--- /dev/null
+++ b/www/pages/help/list.html
@@ -0,0 +1,52 @@
+<!-- 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="panel panel-right panel-cover">
+    <div class="view">
+        <div class="page">
+
+            <div class="navbar">
+                <div class="navbar-bg"></div>
+                <div class="navbar-inner">
+                    <div class="title">Help</div>
+                    <div class="right">
+                        <a class="link panel-close">
+                            <span>Close</span>
+                        </a>
+                    </div>
+                </div>
+            </div>
+
+            <div class="page-content">
+                <div class="block">
+                    <p>
+                        Swipe <i class="fas fa-arrow-right"></i> left-to-right 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.
+                    </p>
+
+                    <p>
+                        Swipe <i class="fas fa-arrow-left"></i> right-to-left on a list entry
+                        and tap <i class="material-icons">delete</i> Delete to remove it.
+                    </p>
+
+                    <p>
+                        Tap the <i class="material-icons">search</i> button to open a search
+                        box.  Type in this box to hide any list entries that don't contain your
+                        input.
+                    </p>
+
+                    <p>
+                        Tap the <i class="material-icons">sort</i> button to sort the list.
+                    </p>
+
+                    <p>
+                        Tap the <span class="color-red"><i class="material-icons">delete</i></span> button to remove all
+                        items from the list.
+                    </p>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/www/pages/list.html b/www/pages/list.html
index 83b010a..312b291 100644
--- a/www/pages/list.html
+++ b/www/pages/list.html
@@ -24,6 +24,10 @@
                 <a class="link text-color-red" onclick="confirmDeleteAllPackages()">
                     <i class="icon material-icons">delete</i>
                 </a>
+                
+                <a class="link" href="/help/list">
+                    <i class="icon material-icons">help</i>
+                </a>
             </div>
             <form class="searchbar searchbar-expandable package-list-searchbar">
                 <div class="searchbar-inner">
diff --git a/www/routes.js b/www/routes.js
index cc419b4..4c3c12f 100644
--- a/www/routes.js
+++ b/www/routes.js
@@ -183,6 +183,17 @@ var routes = [
             }
         ]
     },
+    {
+        path: '/help',
+        routes: [
+            {
+                path: '/list',
+                panel: {
+                    url: './pages/help/list.html'
+                }
+            }
+        ]
+    },
     {
         path: '/credits',
         url: './pages/credits.html',