From b5eb0be5b38bfdad6cdfdb30b6d22ddc9d85770c Mon Sep 17 00:00:00 2001 From: Dan Gowans Date: Tue, 27 Sep 2022 16:05:40 -0400 Subject: [PATCH] keyboard shortcuts --- docs/README.md | 3 ++ docs/shortcuts.md | 47 ++++++++++++++++++ views/_header.ejs | 28 ++++++----- views/admin-fees.ejs | 2 +- views/admin-occupancyTypes.ejs | 2 +- views/dashboard.ejs | 68 +++++++++++++-------------- views/login.ejs | 2 +- views/lot-edit.ejs | 6 ++- views/lot-search.ejs | 7 ++- views/lot-view.ejs | 9 ++-- views/lotOccupancy-edit.ejs | 6 ++- views/lotOccupancy-search.ejs | 17 ++++--- views/lotOccupancy-view.ejs | 3 +- views/map-edit.ejs | 11 ++++- views/map-search.ejs | 6 ++- views/map-view.ejs | 5 +- views/workOrder-edit.ejs | 6 +-- views/workOrder-milestoneCalendar.ejs | 2 +- views/workOrder-search.ejs | 5 +- views/workOrder-view.ejs | 5 +- 20 files changed, 161 insertions(+), 79 deletions(-) create mode 100644 docs/shortcuts.md diff --git a/docs/README.md b/docs/README.md index 8b8106e8..a7404cb9 100644 --- a/docs/README.md +++ b/docs/README.md @@ -10,4 +10,7 @@ Understanding the key terms used in the Lot Occupancy System. [**Map Images**](mapImages.md)
+How to create images compatible with the Lot Occupancy System. + +[**Keyboard Shortcuts**](shortcuts.md)
How to create images compatible with the Lot Occupancy System. \ No newline at end of file diff --git a/docs/shortcuts.md b/docs/shortcuts.md new file mode 100644 index 00000000..d2bc3400 --- /dev/null +++ b/docs/shortcuts.md @@ -0,0 +1,47 @@ +[Home](https://cityssm.github.io/lot-occupancy-system/) +• +[Help](https://cityssm.github.io/lot-occupancy-system/docs/) + +# Keyboard Shortcuts + +Note that the keys needed to access the keyboard shortcuts +vary by browser and operating system. + +For example, the Mozilla Firefox web browser running on Windows uses Shift + Alt, +while most web browsers running on Mac machines use Control + Option. + +See [MDN's documentation on the accesskeys](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/accesskey) +for assistance identifying the combination for your web browser - operating system combination. + +## All Pages + +| Shortcut Key | Description | +| ------------ | ------------------------------------ | +| 1 | Go to Work Order search. | +| 2 | Go to Occupancy search. | +| 3 | Go to Lot search. | +| 4 | Go to Map search. | +| h | Open the Help website. | +| x | Log out of the Lot Occupancy System. | + +## Search Pages + +| Shortcut Key | Description | +| ------------ | --------------------------------- | +| n | Create a new record. | +| f | Focus on the first search filter. | + +## View Pages + +| Shortcut Key | Description | +| ------------------------------ | ----------------------------------------- | +| e | Switch to edit mode. | +| , (or <) | Move to previous record (when available). | +| . (or >) | Move to next record (when available). | + +## Edit Pages + +| Shortcut Key | Description | +| ------------ | ---------------------------------- | +| f | Focus on the first editable field. | +| v | Switch to view mode. | diff --git a/views/_header.ejs b/views/_header.ejs index 9941163a..0a354553 100644 --- a/views/_header.ejs +++ b/views/_header.ejs @@ -36,8 +36,14 @@
+ + + + + Work Orders + - + - - - - - Work Orders - -
@@ -63,12 +62,13 @@
- + <%= configFunctions.getProperty("aliases.lots") %> - + + @@ -82,8 +82,10 @@ Reports
- + @@ -94,7 +96,7 @@
- + diff --git a/views/admin-fees.ejs b/views/admin-fees.ejs index 4ad13a25..0a893d1c 100644 --- a/views/admin-fees.ejs +++ b/views/admin-fees.ejs @@ -33,7 +33,7 @@
- diff --git a/views/admin-occupancyTypes.ejs b/views/admin-occupancyTypes.ejs index c0d10e60..81b246d2 100644 --- a/views/admin-occupancyTypes.ejs +++ b/views/admin-occupancyTypes.ejs @@ -33,7 +33,7 @@
- diff --git a/views/dashboard.ejs b/views/dashboard.ejs index df122146..c31e10f3 100644 --- a/views/dashboard.ejs +++ b/views/dashboard.ejs @@ -59,39 +59,6 @@ <% } %>
-
-
-
-
-
- -
-
-

- <%= configFunctions.getProperty("aliases.lot") %> - <%= configFunctions.getProperty("aliases.occupancies") %> -

-

View and maintain current and past - <%= configFunctions.getProperty("aliases.lot").toLowerCase() %> - <%= configFunctions.getProperty("aliases.occupancies").toLowerCase() %>.

-
-
-
- <% if (user.userProperties.canUpdate) { %> -
- - - - - New <%= configFunctions.getProperty("aliases.occupancy") %> - -
- <% } %> -
-
@@ -138,6 +105,39 @@
+
+
+
+
+
+ +
+
+

+ <%= configFunctions.getProperty("aliases.lot") %> + <%= configFunctions.getProperty("aliases.occupancies") %> +

+

View and maintain current and past + <%= configFunctions.getProperty("aliases.lot").toLowerCase() %> + <%= configFunctions.getProperty("aliases.occupancies").toLowerCase() %>.

+
+
+
+ <% if (user.userProperties.canUpdate) { %> +
+ + + + + New <%= configFunctions.getProperty("aliases.occupancy") %> + +
+ <% } %> +
+
@@ -223,7 +223,7 @@

- Help Documentation

Instructions on how to use this application.

diff --git a/views/login.ejs b/views/login.ejs index d7457c11..e90a49a6 100644 --- a/views/login.ejs +++ b/views/login.ejs @@ -76,7 +76,7 @@
Build <%= buildNumber %>
- Help + Help GitHub
diff --git a/views/lot-edit.ejs b/views/lot-edit.ejs index f59be842..7f704943 100644 --- a/views/lot-edit.ejs +++ b/views/lot-edit.ejs @@ -11,7 +11,7 @@ <% if (!isCreate) { %>
  • - + <%= lot.lotName %>
    • @@ -53,7 +53,9 @@ pattern="<%= configFunctions.getProperty("settings.lot.lotNamePattern").source %>" <% } %> maxlength="100" - required /> + required + accesskey="f" + <%= (isCreate ? " autofocus" : "") %> />
    diff --git a/views/lot-search.ejs b/views/lot-search.ejs index 5c752bed..38fc731f 100644 --- a/views/lot-search.ejs +++ b/views/lot-search.ejs @@ -18,7 +18,10 @@ <% if (user.userProperties.canUpdate) { %>
    - " href="<%= urlPrefix %>/lots/new"> + " + href="<%= urlPrefix %>/lots/new" + accesskey="n"> Create a New <%= configFunctions.getProperty("aliases.lot") %> @@ -34,7 +37,7 @@
    - + diff --git a/views/lot-view.ejs b/views/lot-view.ejs index 5577ce0e..6153a3a9 100644 --- a/views/lot-view.ejs +++ b/views/lot-view.ejs @@ -23,20 +23,23 @@ " - href="<%= urlPrefix %>/lots/<%= lot.lotId %>/previous"> + href="<%= urlPrefix %>/lots/<%= lot.lotId %>/previous" + accesskey=","> Previous <%= configFunctions.getProperty("aliases.lot") %> " - href="<%= urlPrefix %>/lots/<%= lot.lotId %>/next"> + href="<%= urlPrefix %>/lots/<%= lot.lotId %>/next" + accesskey="."> Next <%= configFunctions.getProperty("aliases.lot") %> <% if (user.userProperties.canUpdate) { %> " - href="<%= urlPrefix %>/lots/<%= lot.lotId %>/edit"> + href="<%= urlPrefix %>/lots/<%= lot.lotId %>/edit" + accesskey="e"> Update <%= configFunctions.getProperty("aliases.lot") %> diff --git a/views/lotOccupancy-edit.ejs b/views/lotOccupancy-edit.ejs index 6ab62446..6f3caaf9 100644 --- a/views/lotOccupancy-edit.ejs +++ b/views/lotOccupancy-edit.ejs @@ -16,7 +16,7 @@ <% if (!isCreate) { %>
  • - + <%= configFunctions.getProperty("aliases.occupancy") %>: <%= lotOccupancy.lotName || ("(No " + configFunctions.getProperty("aliases.lot") + ")") %>
    • @@ -100,7 +100,9 @@ <% if (!isCreate) { %> class="is-readonly" <% } %> - id="lotOccupancy--occupancyTypeId" name="occupancyTypeId" required> + id="lotOccupancy--occupancyTypeId" name="occupancyTypeId" + required accesskey="f" + <%= (isCreate ? " autofocus" : "") %>> <% if (isCreate) { %> <% } %> diff --git a/views/lotOccupancy-search.ejs b/views/lotOccupancy-search.ejs index 2d87f44d..493fe257 100644 --- a/views/lotOccupancy-search.ejs +++ b/views/lotOccupancy-search.ejs @@ -22,12 +22,15 @@ <% if (user.userProperties.canUpdate) { %> -
    - " href="<%= urlPrefix %>/lotOccupancies/new"> - - Create a New <%= configFunctions.getProperty("aliases.occupancy") %> - -
    +
    + " + href="<%= urlPrefix %>/lotOccupancies/new" + accesskey="n"> + + Create a New <%= configFunctions.getProperty("aliases.occupancy") %> + +
    <% } %>
    @@ -39,7 +42,7 @@
    - + diff --git a/views/lotOccupancy-view.ejs b/views/lotOccupancy-view.ejs index bce99ff6..1bca1d86 100644 --- a/views/lotOccupancy-view.ejs +++ b/views/lotOccupancy-view.ejs @@ -70,7 +70,8 @@
    " - href="<%= urlPrefix %>/lotOccupancies/<%= lotOccupancy.lotOccupancyId %>/edit"> + href="<%= urlPrefix %>/lotOccupancies/<%= lotOccupancy.lotOccupancyId %>/edit" + accesskey="e"> Update <%= configFunctions.getProperty("aliases.occupancy") %> diff --git a/views/map-edit.ejs b/views/map-edit.ejs index cd701f9f..75096644 100644 --- a/views/map-edit.ejs +++ b/views/map-edit.ejs @@ -10,7 +10,11 @@ <% if (!isCreate) { %> -
  • <%= map.mapName || "(No Name)" %>
    • +
  • + + <%= map.mapName || "(No Name)" %> + +
    • <% } %>
  • @@ -42,7 +46,10 @@
    - + />
    diff --git a/views/map-search.ejs b/views/map-search.ejs index dfd7f26e..2f88441f 100644 --- a/views/map-search.ejs +++ b/views/map-search.ejs @@ -18,7 +18,8 @@
    " - href="<%= urlPrefix %>/maps/new"> + href="<%= urlPrefix %>/maps/new" + accesskey="n"> Create a New <%= configFunctions.getProperty("aliases.map") %> @@ -30,7 +31,8 @@
    name, description, and address" /> + placeholder="Search <%= configFunctions.getProperty("aliases.map").toLowerCase() %> name, description, and address" + accesskey="f" /> diff --git a/views/map-view.ejs b/views/map-view.ejs index a285a22f..09837039 100644 --- a/views/map-view.ejs +++ b/views/map-view.ejs @@ -23,7 +23,10 @@ <% if (user.userProperties.canUpdate) { %>
    - " href="<%= urlPrefix %>/maps/<%= map.mapId %>/edit"> + " + href="<%= urlPrefix %>/maps/<%= map.mapId %>/edit" + accesskey="e"> Update <%= configFunctions.getProperty("aliases.map") %> diff --git a/views/workOrder-edit.ejs b/views/workOrder-edit.ejs index 12ef6e98..e100ede0 100644 --- a/views/workOrder-edit.ejs +++ b/views/workOrder-edit.ejs @@ -17,7 +17,7 @@
    • <% } else { %>
  • - + Work Order #<%= workOrder.workOrderNumber || "(No Number)" %>
    • @@ -49,7 +49,7 @@
    - " id="workOrderEdit--workOrderNumber" name="workOrderNumber" type="text" value="<%= workOrder.workOrderNumber %>" maxlength="50" readonly <%= (isCreate ? "" : " required") %> /> + " id="workOrderEdit--workOrderNumber" name="workOrderNumber" type="text" value="<%= workOrder.workOrderNumber %>" maxlength="50" readonly accesskey="f" <%= (isCreate ? "" : " required") %> />