From 0daa2f2228afdb8506fff569834c2c39247d98a9 Mon Sep 17 00:00:00 2001
From: Hypolite Petovan <hypolite@mrpetovan.com>
Date: Sun, 14 Nov 2021 20:28:39 -0500
Subject: [PATCH] [frio] Check for role="presentation" uses throughout the
 templates

- Upgrade a tags to buttons in file browser
- Fix formatting in nav.tpl
- Remove unwarranted instance for character counter in jot form
---
 view/theme/frio/js/filebrowser.js         |  2 +-
 view/theme/frio/templates/filebrowser.tpl |  8 +-
 view/theme/frio/templates/jot.tpl         |  2 +-
 view/theme/frio/templates/nav.tpl         | 95 ++++++++++++++++-------
 4 files changed, 74 insertions(+), 33 deletions(-)

diff --git a/view/theme/frio/js/filebrowser.js b/view/theme/frio/js/filebrowser.js
index a9ee6ea086..bebb279078 100644
--- a/view/theme/frio/js/filebrowser.js
+++ b/view/theme/frio/js/filebrowser.js
@@ -96,7 +96,7 @@ var FileBrowser = {
 		});
 
 		// Click on album link
-		$(".fbrowser").on("click", ".folders a, .path a", function (e) {
+		$(".fbrowser").on("click", ".folders button, .path button", function (e) {
 			e.preventDefault();
 			var url =
 				baseurl +
diff --git a/view/theme/frio/templates/filebrowser.tpl b/view/theme/frio/templates/filebrowser.tpl
index 1f849555c1..e8c03cf386 100644
--- a/view/theme/frio/templates/filebrowser.tpl
+++ b/view/theme/frio/templates/filebrowser.tpl
@@ -8,9 +8,11 @@
 		</div>
 
 		{{* The breadcrumb navigation *}}
-		<ol class="path breadcrumb" aria-label="Breadcrumb" role="navigation">
+		<ol class="path breadcrumb" aria-label="Breadcrumb" role="menu">
 		{{foreach $path as $folder => $name}}
-			<li role="presentation"><a href="#" data-folder="{{$folder}}">{{$name}}</a></li>
+			<li role="presentation">
+				<button type="button" class="btn btn-link" data-folder="{{$folder}}" role="menuitem">{{$name}}</button>
+			</li>
 		{{/foreach}}
 
 			{{* Switch between image and file mode *}}
@@ -28,7 +30,7 @@
 				<ul role="menu">
 					{{foreach $folders as $folder}}
 					<li role="presentation">
-						<a href="#" data-folder="{{$folder}}" role="menuitem">{{$folder}}</a>
+						<button type="button" data-folder="{{$folder}}" role="menuitem">{{$folder}}</button>
 					</li>
 					{{/foreach}}
 				</ul>
diff --git a/view/theme/frio/templates/jot.tpl b/view/theme/frio/templates/jot.tpl
index d8372f3aed..5ef8a7b6e4 100644
--- a/view/theme/frio/templates/jot.tpl
+++ b/view/theme/frio/templates/jot.tpl
@@ -120,7 +120,7 @@
 								<i class="fa fa-paper-plane fa-fw" aria-hidden="true"></i> {{$share}}
 							</button>
 						</li>
-						<li role="presentation" id="character-counter" class="grey jothidden text-info pull-right"></li>
+						<li id="character-counter" class="grey jothidden text-info pull-right"></li>
 						<li role="presentation" id="profile-rotator-wrapper" class="pull-right" style="display: {{$visitor}};">
 							<img role="presentation" id="profile-rotator" src="images/rotator.gif" alt="{{$wait}}" title="{{$wait}}" style="display: none;" />
 						</li>
diff --git a/view/theme/frio/templates/nav.tpl b/view/theme/frio/templates/nav.tpl
index 915e5e9fc7..53176fe92c 100644
--- a/view/theme/frio/templates/nav.tpl
+++ b/view/theme/frio/templates/nav.tpl
@@ -110,7 +110,7 @@
 								{{* The notifications dropdown menu. There are two parts of menu. The second is at the bottom of this file. It is loaded via js. Look at nav-notifications-template *}}
 								<ul id="nav-notifications-menu" class="dropdown-menu menu-popup" role="menu"
 									aria-labelledby="nav-notifications-menu-btn">
-									{{* the following list entry must have the id "nav-notificaionts-mark-all". Without it this isn't visable. ....strange behavior :-/ *}}
+									{{* the following list entry must have the id "nav-notifications-mark-all". Without it this isn't visible. ....strange behavior :-/ *}}
 									<li role="presentation" id="nav-notifications-mark-all" class="dropdown-header">
 										<div class="arrow"></div>
 										{{$nav.notifications.1}}
@@ -194,7 +194,8 @@
 										</li>
 									{{/if}}
 									{{if $nav.messages}}
-										<li role="presentation"><a role="menuitem"
+										<li role="presentation">
+											<a role="menuitem"
 												class="nav-commlink {{$nav.messages.2}} {{$sel.messages}}"
 												href="{{$nav.messages.0}}" title="{{$nav.messages.3}}">
 												<i class="fa fa-envelope fa-fw" aria-hidden="true"></i>
@@ -205,7 +206,8 @@
 									{{/if}}
 									<li role="presentation" class="divider"></li>
 									{{if $nav.contacts}}
-										<li role="presentation"><a role="menuitem" id="nav-menu-contacts-link"
+										<li role="presentation">
+											<a role="menuitem" id="nav-menu-contacts-link"
 												class="nav-link {{$nav.contacts.2}}" href="{{$nav.contacts.0}}"
 												title="{{$nav.contacts.3}}">
 												<i class="fa fa-users fa-fw" aria-hidden="true"></i>
@@ -235,6 +237,7 @@
 												href="{{$nav.apps.0}}" title="{{$nav.apps.3}}">
 												<i class="fa fa-puzzle-piece fa-fw" aria-hidden="true"></i> {{$nav.apps.1}}
 											</a>
+										</li>
 										<li role="presentation" class="divider"></li>
 									{{/if}}
 									{{if $nav.help}}
@@ -254,28 +257,40 @@
 										</li>
 									{{/if}}
 									{{if $nav.admin}}
-										<li role="presentation"><a accesskey="a" role="menuitem" id="nav-admin-link"
+										<li role="presentation">
+											<a accesskey="a" role="menuitem" id="nav-admin-link"
 												class="nav-link {{$nav.admin.2}}" href="{{$nav.admin.0}}"
 												title="{{$nav.admin.3}}"><i class="fa fa-user-secret fa-fw" aria-hidden="true"></i>
-												{{$nav.admin.1}}</a></li>
+												{{$nav.admin.1}}
+											</a>
+										</li>
 									{{/if}}
 									{{if $nav.tos}}
 										<li role="presentation" class="divider"></li>
-										<li role="presentation"><a role="menuitem" id="nav-tos-link" class="nav-link {{$nav.tos.2}}"
+										<li role="presentation">
+											<a role="menuitem" id="nav-tos-link" class="nav-link {{$nav.tos.2}}"
 												href="{{$nav.tos.0}}" title="{{$nav.tos.3}}"><i class="fa fa-file-text"
-													aria-hidden="true"></i> {{$nav.tos.1}}</a></li>
+													aria-hidden="true"></i> {{$nav.tos.1}}
+											</a>
+										</li>
 									{{/if}}
 									<li role="presentation" class="divider"></li>
 									{{if $nav.logout}}
-										<li role="presentation"><a role="menuitem" id="nav-logout-link"
+										<li role="presentation">
+											<a role="menuitem" id="nav-logout-link"
 												class="nav-link {{$nav.logout.2}}" href="{{$nav.logout.0}}"
 												title="{{$nav.logout.3}}"><i class="fa fa fa-sign-out fa-fw" aria-hidden="true"></i>
-												{{$nav.logout.1}}</a></li>
+												{{$nav.logout.1}}
+											</a>
+										</li>
 									{{else}}
-										<li role="presentation"><a role="menuitem" id="nav-login-link"
+										<li role="presentation">
+											<a role="menuitem" id="nav-login-link"
 												class="nav-login-link {{$nav.login.2}}" href="{{$nav.login.0}}"
 												title="{{$nav.login.3}}"><i class="fa fa-power-off fa-fw" aria-hidden="true"></i>
-												{{$nav.login.1}}</a></li>
+												{{$nav.login.1}}
+											</a>
+										</li>
 									{{/if}}
 								</ul>
 							</li>{{* End of userinfo dropdown menu *}}
@@ -304,35 +319,49 @@
 								{{$userinfo.name}}{{if $nav.remote}} ({{$nav.remote}}){{/if}}
 							</li>
 							{{foreach $nav.usermenu as $usermenu}}
-								<li role="menuitem" class="list-group-item"><a role="menuitem" class="{{$usermenu.2}}"
-										href="{{$usermenu.0}}" title="{{$usermenu.3}}">{{$usermenu.1}}</a></li>
+								<li role="presentation" class="list-group-item">
+									<a role="menuitem" class="{{$usermenu.2}}"
+										href="{{$usermenu.0}}" title="{{$usermenu.3}}">{{$usermenu.1}}
+									</a>
+								</li>
 							{{/foreach}}
 							{{if $nav.notifications || $nav.contacts || $nav.messages || $nav.delegation}}
 								<li role="presentation" class="divider"></li>
 							{{/if}}
 							{{if $nav.notifications}}
-								<li role="presentation" class="list-group-item"><a role="menuitem"
+								<li role="presentation" class="list-group-item">
+									<a role="menuitem"
 										href="{{$nav.notifications.all.0}}" title="{{$nav.notifications.1}}"><i
-											class="fa fa-bell fa-fw" aria-hidden="true"></i> {{$nav.notifications.1}}</a>
+											class="fa fa-bell fa-fw" aria-hidden="true"></i> {{$nav.notifications.1}}
+									</a>
 								</li>
 							{{/if}}
 							{{if $nav.contacts}}
-								<li role="presentation" class="list-group-item"><a role="menuitem"
+								<li role="presentation" class="list-group-item">
+									<a role="menuitem"
 										class="nav-link {{$nav.contacts.2}}" href="{{$nav.contacts.0}}"
 										title="{{$nav.contacts.3}}"><i class="fa fa-users fa-fw" aria-hidden="true"></i>
-										{{$nav.contacts.1}}</a></li>
+										{{$nav.contacts.1}}
+									</a>
+								</li>
 							{{/if}}
 							{{if $nav.messages}}
-								<li role="presentation" class="list-group-item"><a role="menuitem"
+								<li role="presentation" class="list-group-item">
+									<a role="menuitem"
 										class="nav-link {{$nav.messages.2}} {{$sel.messages}}" href="{{$nav.messages.0}}"
 										title="{{$nav.messages.3}}"><i class="fa fa-envelope fa-fw" aria-hidden="true"></i>
-										{{$nav.messages.1}}</a></li>
+										{{$nav.messages.1}}
+									</a>
+								</li>
 							{{/if}}
 							{{if $nav.delegation}}
-								<li role="presentation" class="list-group-item"><a role="menuitem"
+								<li role="presentation" class="list-group-item">
+									<a role="menuitem"
 										class="nav-commlink {{$nav.delegation.2}} {{$sel.delegation}}"
 										href="{{$nav.delegation.0}}" title="{{$nav.delegation.3}}"><i class="fa fa-flag fa-fw"
-											aria-hidden="true"></i> {{$nav.delegation.1}}</a></li>
+											aria-hidden="true"></i> {{$nav.delegation.1}}
+									</a>
+								</li>
 							{{/if}}
 							{{if $nav.settings || $nav.admin || $nav.logout}}
 								<li role="presentation" class="divider"></li>
@@ -341,25 +370,35 @@
 								<li role="presentation" class="list-group-item">
 									<a role="menuitem" class="nav-link {{$nav.settings.2}}" href="{{$nav.settings.0}}"
 										title="{{$nav.settings.3}}"><i class="fa fa-cog fa-fw" aria-hidden="true"></i>
-										{{$nav.settings.1}}</a>
+										{{$nav.settings.1}}
+									</a>
 								</li>
 							{{/if}}
 							{{if $nav.admin}}
-								<li role="presentation" class="list-group-item"><a role="menuitem"
+								<li role="presentation" class="list-group-item">
+									<a role="menuitem"
 										class="nav-link {{$nav.admin.2}}" href="{{$nav.admin.0}}" title="{{$nav.admin.3}}"><i
 											class="fa fa-user-secret fa-fw" aria-hidden="true"></i>
-										{{$nav.admin.1}}</a></li>
+										{{$nav.admin.1}}
+									</a>
+								</li>
 							{{/if}}
 							{{if $nav.logout}}
-								<li role="presentation" class="list-group-item"><a role="menuitem"
+								<li role="presentation" class="list-group-item">
+									<a role="menuitem"
 										class="nav-link {{$nav.logout.2}}" href="{{$nav.logout.0}}" title="{{$nav.logout.3}}"><i
 											class="fa fa fa-sign-out fa-fw" aria-hidden="true"></i>
-										{{$nav.logout.1}}</a></li>
+										{{$nav.logout.1}}
+									</a>
+								</li>
 							{{else}}
-								<li role="presentation" class="list-group-item"><a role="menuitem"
+								<li role="presentation" class="list-group-item">
+									<a role="menuitem"
 										class="nav-login-link {{$nav.login.2}}" href="{{$nav.login.0}}"
 										title="{{$nav.login.3}}"><i class="fa fa-power-off fa-fw" aria-hidden="true"></i>
-										{{$nav.login.1}}</a></li>
+										{{$nav.login.1}}
+									</a>
+								</li>
 							{{/if}}
 						</ul>
 					</div>