steve
/
sunrise-cms
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

keyboard shortcuts

deepsource-autofix-76c6eb20
Dan Gowans 2022-09-27 16:05:40 -04:00
parent d9666c3e2a
commit b5eb0be5b3
20 changed files with 161 additions and 79 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
docs/README.md
View File

@ -10,4 +10,7 @@
Understanding the key terms used in the Lot Occupancy System.
[**Map Images**](mapImages.md)<br />
How to create images compatible with the Lot Occupancy System.
[**Keyboard Shortcuts**](shortcuts.md)<br />
How to create images compatible with the Lot Occupancy System.

47
docs/shortcuts.md 100644
View File

@ -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 <kbd>Shift</kbd> + <kbd>Alt</kbd>,
while most web browsers running on Mac machines use <kbd>Control</kbd> + <kbd>Option</kbd>.
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 |
| ------------ | ------------------------------------ |
| <kbd>1</kbd> | Go to Work Order search. |
| <kbd>2</kbd> | Go to Occupancy search. |
| <kbd>3</kbd> | Go to Lot search. |
| <kbd>4</kbd> | Go to Map search. |
| <kbd>h</kbd> | Open the Help website. |
| <kbd>x</kbd> | Log out of the Lot Occupancy System. |
## Search Pages
| Shortcut Key | Description |
| ------------ | --------------------------------- |
| <kbd>n</kbd> | Create a new record. |
| <kbd>f</kbd> | Focus on the first search filter. |
## View Pages
| Shortcut Key | Description |
| ------------------------------ | ----------------------------------------- |
| <kbd>e</kbd> | Switch to edit mode. |
| <kbd>,</kbd> (or <kbd><</kbd>) | Move to previous record (when available). |
| <kbd>.</kbd> (or <kbd>></kbd>) | Move to next record (when available). |
## Edit Pages
| Shortcut Key | Description |
| ------------ | ---------------------------------- |
| <kbd>f</kbd> | Focus on the first editable field. |
| <kbd>v</kbd> | Switch to view mode. |

28
views/_header.ejs
View File

@ -36,8 +36,14 @@
<div class="navbar-menu">
<div class="navbar-start">
<a class="navbar-item" href="<%= urlPrefix %>/workOrders" accesskey="1">
<span class="icon mr-1">
<i class="fas fa-hard-hat" aria-hidden="true"></i>
</span>
<span>Work Orders</span>
</a>
<a class="navbar-item" href="<%= urlPrefix %>/lotOccupancies">
<a class="navbar-item" href="<%= urlPrefix %>/lotOccupancies" accesskey="2">
<span class="icon mr-1">
<span class="fa-layers fa-fw" aria-hidden="true">
<i class="fas fa-vector-square"></i>
@ -47,13 +53,6 @@
<span><%= configFunctions.getProperty("aliases.occupancies") %></span>
</a>
<a class="navbar-item" href="<%= urlPrefix %>/workOrders">
<span class="icon mr-1">
<i class="fas fa-hard-hat" aria-hidden="true"></i>
</span>
<span>Work Orders</span>
</a>
<div class="navbar-item has-dropdown">
<a class="navbar-link is-arrowless" href="#">
@ -63,12 +62,13 @@
</span>
</a>
<div class="navbar-dropdown">
<a class="navbar-item" href="<%= urlPrefix %>/lots">
<a class="navbar-item" href="<%= urlPrefix %>/lots" accesskey="3">
<span class="icon mr-1">
<i class="fas fa-fw fa-vector-square" aria-hidden="true"></i>
</span>
<span><%= configFunctions.getProperty("aliases.lots") %></span>
</a><a class="navbar-item" href="<%= urlPrefix %>/maps">
</a>
<a class="navbar-item" href="<%= urlPrefix %>/maps" accesskey="4">
<span class="icon mr-1">
<i class="far fa-fw fa-map" aria-hidden="true"></i>
</span>
@ -82,8 +82,10 @@
<span>Reports</span>
</a>
<hr class="navbar-divider" />
<a class="navbar-item" href="https://cityssm.github.io/lot-occupancy-system/"
target="_blank" rel="noopener noreferrer">
<a class="navbar-item" href="https://cityssm.github.io/lot-occupancy-system/docs"
target="_blank"
accesskey="h"
rel="noopener noreferrer">
<span class="icon mr-1">
<i class="fas fa-fw fa-question-circle" aria-hidden="true"></i>
</span>
@ -94,7 +96,7 @@
</div>
<div class="navbar-end">
<a class="navbar-item" id="cityssm-theme--logout-button" role="button" href="#">
<a class="navbar-item" id="cityssm-theme--logout-button" role="button" href="#" accesskey="x">
<span class="icon mr-1">
<i class="fas fa-fw fa-sign-out-alt" aria-hidden="true"></i>
</span>

2
views/admin-fees.ejs
View File

@ -33,7 +33,7 @@
</div>
<div class="level-right">
<div class="level-item">
<button class="button is-success" id="button--addFeeCategory" type="button">
<button class="button is-success" id="button--addFeeCategory" type="button" accesskey="n">
<span class="icon is-small"><i class="fas fa-plus" aria-hidden="true"></i></span>
<span>Add Fee Category</span>
</button>

2
views/admin-occupancyTypes.ejs
View File

@ -33,7 +33,7 @@
</div>
<div class="level-right">
<div class="level-item">
<button class="button is-success" id="button--addOccupancyType" type="button">
<button class="button is-success" id="button--addOccupancyType" type="button" accesskey="n">
<span class="icon is-small"><i class="fas fa-plus" aria-hidden="true"></i></span>
<span>Add <%= configFunctions.getProperty("aliases.occupancy") %> Type</span>
</button>

68
views/dashboard.ejs
View File

@ -59,39 +59,6 @@
<% } %>
<div class="column">
<div class="columns is-desktop">
<div class="column">
<div class="card">
<div class="card-content">
<div class="media">
<div class="media-left">
<span class="fa-layers fa-3x fa-fw" aria-hidden="true">
<i class="fas fa-vector-square"></i>
<i class="fas fa-user" data-fa-transform="shrink-10"></i>
</span>
</div>
<div class="media-content has-text-black">
<h2 class="title is-4 is-marginless">
<a href="<%= urlPrefix %>/lotOccupancies"><%= configFunctions.getProperty("aliases.lot") %>
<%= configFunctions.getProperty("aliases.occupancies") %></a>
</h2>
<p>View and maintain current and past
<%= configFunctions.getProperty("aliases.lot").toLowerCase() %>
<%= configFunctions.getProperty("aliases.occupancies").toLowerCase() %>.</p>
</div>
</div>
</div>
<% if (user.userProperties.canUpdate) { %>
<div class="card-footer">
<a class="card-footer-item" href="<%= urlPrefix %>/lotOccupancies/new">
<span class="icon">
<i class="fas fa-plus" aria-hidden="true"></i>
</span>
<span>New <%= configFunctions.getProperty("aliases.occupancy") %></span>
</a>
</div>
<% } %>
</div>
</div>
<div class="column">
<div class="card">
<div class="card-content">
@ -138,6 +105,39 @@
</div>
</div>
</div>
<div class="column">
<div class="card">
<div class="card-content">
<div class="media">
<div class="media-left">
<span class="fa-layers fa-3x fa-fw" aria-hidden="true">
<i class="fas fa-vector-square"></i>
<i class="fas fa-user" data-fa-transform="shrink-10"></i>
</span>
</div>
<div class="media-content has-text-black">
<h2 class="title is-4 is-marginless">
<a href="<%= urlPrefix %>/lotOccupancies"><%= configFunctions.getProperty("aliases.lot") %>
<%= configFunctions.getProperty("aliases.occupancies") %></a>
</h2>
<p>View and maintain current and past
<%= configFunctions.getProperty("aliases.lot").toLowerCase() %>
<%= configFunctions.getProperty("aliases.occupancies").toLowerCase() %>.</p>
</div>
</div>
</div>
<% if (user.userProperties.canUpdate) { %>
<div class="card-footer">
<a class="card-footer-item" href="<%= urlPrefix %>/lotOccupancies/new">
<span class="icon">
<i class="fas fa-plus" aria-hidden="true"></i>
</span>
<span>New <%= configFunctions.getProperty("aliases.occupancy") %></span>
</a>
</div>
<% } %>
</div>
</div>
</div>
<div class="columns">
<div class="column">
@ -223,7 +223,7 @@
</div>
<div class="media-content has-text-black">
<h2 class="title is-4 is-marginless">
<a href="https://cityssm.github.io/lot-occupancy-system/" target="_blank"
<a href="https://cityssm.github.io/lot-occupancy-system/docs" target="_blank"
rel="noopener noreferrer">Help Documentation</a>
</h2>
<p>Instructions on how to use this application.</p>

2
views/login.ejs
View File

@ -76,7 +76,7 @@
<hr />
<div class="has-text-right has-text-grey-dark is-size-7">
Build <%= buildNumber %><br />
<a class="has-text-grey-dark" href="https://cityssm.github.io/lot-occupancy-system/" target="_blank" rel="nofollow noreferrer">Help</a>
<a class="has-text-grey-dark" href="https://cityssm.github.io/lot-occupancy-system/docs" target="_blank" rel="nofollow noreferrer" accesskey="h">Help</a>
<a class="has-text-grey-dark ml-4" href="https://github.com/cityssm/lot-occupancy-system" target="_blank" rel="noreferrer">GitHub</a>
</div>
</div>

6
views/lot-edit.ejs
View File

@ -11,7 +11,7 @@
</li>
<% if (!isCreate) { %>
<li>
<a href="<%= urlPrefix %>/lots/<%= lot.lotId %>">
<a href="<%= urlPrefix %>/lots/<%= lot.lotId %>" accesskey="v">
<%= lot.lotName %>
</a>
</li>
@ -53,7 +53,9 @@
pattern="<%= configFunctions.getProperty("settings.lot.lotNamePattern").source %>"
<% } %>
maxlength="100"
required />
required
accesskey="f"
<%= (isCreate ? " autofocus" : "") %> />
</div>
</div>
</div>

7
views/lot-search.ejs
View File

@ -18,7 +18,10 @@
<% if (user.userProperties.canUpdate) { %>
<div class="fixed-container is-fixed-bottom-right mx-4 my-4 has-text-right is-hidden-print">
<a class="button is-circle is-primary has-tooltip-left" data-tooltip="Create a New <%= configFunctions.getProperty("aliases.lot") %>" href="<%= urlPrefix %>/lots/new">
<a class="button is-circle is-primary has-tooltip-left"
data-tooltip="Create a New <%= configFunctions.getProperty("aliases.lot") %>"
href="<%= urlPrefix %>/lots/new"
accesskey="n">
<i class="fas fa-plus" aria-hidden="true"></i>
<span class="sr-only">Create a New <%= configFunctions.getProperty("aliases.lot") %></span>
</a>
@ -34,7 +37,7 @@
<div class="field">
<label class="label" for="searchFilter--lotName"><%= configFunctions.getProperty("aliases.lot") %></label>
<div class="control has-icons-left">
<input class="input" id="searchFilter--lotName" name="lotName" />
<input class="input" id="searchFilter--lotName" name="lotName" accesskey="f" />
<span class="icon is-small is-left">
<i class="fas fa-search" aria-hidden="true"></i>
</span>

9
views/lot-view.ejs
View File

@ -23,20 +23,23 @@
<a class="button is-circle is-link has-tooltip-left"
data-tooltip="Previous <%= configFunctions.getProperty("aliases.lot") %>"
href="<%= urlPrefix %>/lots/<%= lot.lotId %>/previous">
href="<%= urlPrefix %>/lots/<%= lot.lotId %>/previous"
accesskey=",">
<i class="fas fa-arrow-left" aria-hidden="true"></i>
<span class="sr-only">Previous <%= configFunctions.getProperty("aliases.lot") %></span>
</a>
<a class="button is-circle is-link has-tooltip-left"
data-tooltip="Next <%= configFunctions.getProperty("aliases.lot") %>"
href="<%= urlPrefix %>/lots/<%= lot.lotId %>/next">
href="<%= urlPrefix %>/lots/<%= lot.lotId %>/next"
accesskey=".">
<i class="fas fa-arrow-right" aria-hidden="true"></i>
<span class="sr-only">Next <%= configFunctions.getProperty("aliases.lot") %></span>
</a>
<% if (user.userProperties.canUpdate) { %>
<a class="button is-circle is-primary has-tooltip-left"
data-tooltip="Update <%= configFunctions.getProperty("aliases.lot") %>"
href="<%= urlPrefix %>/lots/<%= lot.lotId %>/edit">
href="<%= urlPrefix %>/lots/<%= lot.lotId %>/edit"
accesskey="e">
<i class="fas fa-pencil-alt" aria-hidden="true"></i>
<span class="sr-only">Update <%= configFunctions.getProperty("aliases.lot") %></span>
</a>

6
views/lotOccupancy-edit.ejs
View File

@ -16,7 +16,7 @@
</li>
<% if (!isCreate) { %>
<li>
<a href="<%= urlPrefix %>/lotOccupancies/<%= lotOccupancy.lotOccupancyId %>">
<a href="<%= urlPrefix %>/lotOccupancies/<%= lotOccupancy.lotOccupancyId %>" accesskey="v">
<%= configFunctions.getProperty("aliases.occupancy") %>: <%= lotOccupancy.lotName || ("(No " + configFunctions.getProperty("aliases.lot") + ")") %>
</a>
</li>
@ -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) { %>
<option value="">(No Type)</option>
<% } %>

17
views/lotOccupancy-search.ejs
View File

@ -22,12 +22,15 @@
</h1>
<% if (user.userProperties.canUpdate) { %>
<div class="fixed-container is-fixed-bottom-right mx-4 my-4 has-text-right is-hidden-print">
<a class="button is-circle is-primary has-tooltip-left" data-tooltip="Create a New <%= configFunctions.getProperty("aliases.occupancy") %>" href="<%= urlPrefix %>/lotOccupancies/new">
<i class="fas fa-plus" aria-hidden="true"></i>
<span class="sr-only">Create a New <%= configFunctions.getProperty("aliases.occupancy") %></span>
</a>
</div>
<div class="fixed-container is-fixed-bottom-right mx-4 my-4 has-text-right is-hidden-print">
<a class="button is-circle is-primary has-tooltip-left"
data-tooltip="Create a New <%= configFunctions.getProperty("aliases.occupancy") %>"
href="<%= urlPrefix %>/lotOccupancies/new"
accesskey="n">
<i class="fas fa-plus" aria-hidden="true"></i>
<span class="sr-only">Create a New <%= configFunctions.getProperty("aliases.occupancy") %></span>
</a>
</div>
<% } %>
<div class="box">
@ -39,7 +42,7 @@
<div class="field">
<label class="label" for="searchFilter--occupantName"><%= configFunctions.getProperty("aliases.occupant") %> Name</label>
<div class="control has-icons-left">
<input class="input" id="searchFilter--occupantName" name="occupantName" />
<input class="input" id="searchFilter--occupantName" name="occupantName" accesskey="f" />
<span class="icon is-small is-left">
<i class="fas fa-search" aria-hidden="true"></i>
</span>

3
views/lotOccupancy-view.ejs
View File

@ -70,7 +70,8 @@
<div class="fixed-container is-fixed-bottom-right mx-4 my-4 has-text-right is-hidden-print">
<a class="button is-circle is-primary has-tooltip-left"
data-tooltip="Update <%= configFunctions.getProperty("aliases.occupancy") %>"
href="<%= urlPrefix %>/lotOccupancies/<%= lotOccupancy.lotOccupancyId %>/edit">
href="<%= urlPrefix %>/lotOccupancies/<%= lotOccupancy.lotOccupancyId %>/edit"
accesskey="e">
<i class="fas fa-pencil-alt" aria-hidden="true"></i>
<span class="sr-only">Update <%= configFunctions.getProperty("aliases.occupancy") %></span>
</a>

11
views/map-edit.ejs
View File

@ -10,7 +10,11 @@
</a>
</li>
<% if (!isCreate) { %>
<li><a href="<%= urlPrefix %>/maps/<%= map.mapId %>"><%= map.mapName || "(No Name)" %></a></li>
<li>
<a href="<%= urlPrefix %>/maps/<%= map.mapId %>" accesskey="v">
<%= map.mapName || "(No Name)" %>
</a>
</li>
<% } %>
<li class="is-active">
<a href="#" aria-current="page">
@ -42,7 +46,10 @@
<div class="field">
<label class="label" for="map--mapName"><%= configFunctions.getProperty("aliases.map") %> Name</label>
<div class="control">
<input class="input" id="map--mapName" name="mapName" type="text" value="<%= map.mapName %>" maxlength="200" required />
<input class="input" id="map--mapName" name="mapName" type="text"
value="<%= map.mapName %>" maxlength="200" required
accesskey="f"
<%= (isCreate ? " autofocus" : "") %> />
</div>
</div>
<div class="field">

6
views/map-search.ejs
View File

@ -18,7 +18,8 @@
<div class="fixed-container is-fixed-bottom-right mx-4 my-4 has-text-right is-hidden-print">
<a class="button is-circle is-primary has-tooltip-left"
data-tooltip="Create a New <%= configFunctions.getProperty("aliases.map") %>"
href="<%= urlPrefix %>/maps/new">
href="<%= urlPrefix %>/maps/new"
accesskey="n">
<i class="fas fa-plus" aria-hidden="true"></i>
<span class="sr-only">Create a New <%= configFunctions.getProperty("aliases.map") %></span>
</a>
@ -30,7 +31,8 @@
<div class="field">
<div class="control has-icons-left">
<input class="input" id="searchFilter--map" type="text"
placeholder="Search <%= configFunctions.getProperty("aliases.map").toLowerCase() %> name, description, and address" />
placeholder="Search <%= configFunctions.getProperty("aliases.map").toLowerCase() %> name, description, and address"
accesskey="f" />
<span class="icon is-small is-left">
<i class="fas fa-search" aria-hidden="true"></i>
</span>

5
views/map-view.ejs
View File

@ -23,7 +23,10 @@
<% if (user.userProperties.canUpdate) { %>
<div class="fixed-container is-fixed-bottom-right mx-4 my-4 has-text-right is-hidden-print">
<a class="button is-circle is-primary has-tooltip-left" data-tooltip="Update <%= configFunctions.getProperty("aliases.map") %>" href="<%= urlPrefix %>/maps/<%= map.mapId %>/edit">
<a class="button is-circle is-primary has-tooltip-left"
data-tooltip="Update <%= configFunctions.getProperty("aliases.map") %>"
href="<%= urlPrefix %>/maps/<%= map.mapId %>/edit"
accesskey="e">
<i class="fas fa-pencil-alt" aria-hidden="true"></i>
<span class="sr-only">Update <%= configFunctions.getProperty("aliases.map") %></span>
</a>

6
views/workOrder-edit.ejs
View File

@ -17,7 +17,7 @@
</li>
<% } else { %>
<li>
<a href="<%= urlPrefix %>/workOrders/<%= workOrder.workOrderId %>">
<a href="<%= urlPrefix %>/workOrders/<%= workOrder.workOrderId %>" accesskey="v">
Work Order #<%= workOrder.workOrderNumber || "(No Number)" %>
</a>
</li>
@ -49,7 +49,7 @@
<label class="label" for="workOrderEdit--workOrderNumber">Work Order Number</label>
<div class="field has-addons">
<div class="control is-expanded">
<input class="input <%= (isCreate ? "" : " is-readonly") %>" id="workOrderEdit--workOrderNumber" name="workOrderNumber" type="text" value="<%= workOrder.workOrderNumber %>" maxlength="50" readonly <%= (isCreate ? "" : " required") %> />
<input class="input <%= (isCreate ? "" : " is-readonly") %>" id="workOrderEdit--workOrderNumber" name="workOrderNumber" type="text" value="<%= workOrder.workOrderNumber %>" maxlength="50" readonly accesskey="f" <%= (isCreate ? "" : " required") %> />
</div>
<div class="control">
<button class="button is-unlock-field-button" data-tooltip="Unlock Field" type="button" aria-label="Unlock Field">
@ -66,7 +66,7 @@
<label class="label" for="workOrderEdit--workOrderTypeId">Work Order Type</label>
<div class="control">
<div class="select is-fullwidth">
<select id="workOrderEdit--workOrderTypeId" name="workOrderTypeId" required>
<select id="workOrderEdit--workOrderTypeId" name="workOrderTypeId" required <%= (isCreate ? " autofocus" : "") %>>
<% if (isCreate) { %>
<option value="">(Select Type)</option>
<% } %>

2
views/workOrder-milestoneCalendar.ejs
View File

@ -34,7 +34,7 @@
<label class="label" for="searchFilter--workOrderMilestoneDateFilter">Miestone Date Filter Type</label>
<div class="control">
<div class="select is-fullwidth">
<select id="searchFilter--workOrderMilestoneDateFilter" name="workOrderMilestoneDateFilter">
<select id="searchFilter--workOrderMilestoneDateFilter" name="workOrderMilestoneDateFilter" accesskey="f">
<option value="upcomingMissed" selected>Upcoming and Missed</option>
<option value="recent">Recent</option>
<option value="date">Specific Date</option>

5
views/workOrder-search.ejs
View File

@ -25,7 +25,8 @@
<div class="fixed-container is-fixed-bottom-right mx-4 my-4 has-text-right is-hidden-print">
<a class="button is-circle is-primary has-tooltip-left"
data-tooltip="Create a New Work Order"
href="<%= urlPrefix %>/workOrders/new">
href="<%= urlPrefix %>/workOrders/new"
accesskey="n">
<i class="fas fa-plus" aria-hidden="true"></i>
<span class="is-sr-only">Create a New Work Order</span>
</a>
@ -43,7 +44,7 @@
<label class="label" for="searchFilter--workOrderTypeId">Work Order Type</label>
<div class="control has-icons-left">
<div class="select is-fullwidth">
<select id="searchFilter--workOrderTypeId" name="workOrderTypeId">
<select id="searchFilter--workOrderTypeId" name="workOrderTypeId" accesskey="f">
<option value="">(All Work Order Types)</option>
<% for (const workOrderType of workOrderTypes) { %>
<option value="<%= workOrderType.workOrderTypeId %>"><%= workOrderType.workOrderType || "(No Name)" %></option>

5
views/workOrder-view.ejs
View File

@ -23,7 +23,10 @@
<% if (user.userProperties.canUpdate && !workOrder.workOrderCloseDate) { %>
<div class="fixed-container is-fixed-bottom-right mx-4 my-4 has-text-right is-hidden-print">
<a class="button is-circle is-primary has-tooltip-left" data-tooltip="Update Work Order" href="<%= urlPrefix %>/workOrders/<%= workOrder.workOrderId %>/edit">
<a class="button is-circle is-primary has-tooltip-left"
data-tooltip="Update Work Order"
href="<%= urlPrefix %>/workOrders/<%= workOrder.workOrderId %>/edit"
accesskey="e">
<i class="fas fa-pencil-alt" aria-hidden="true"></i>
<span class="sr-only">Update Work Order</span>
</a>