From e32766bd1196fa6f49fd76c7d26024a48e44b41a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Daniel=20Calvi=C3=B1o=20S=C3=A1nchez?= <danxuliu@gmail.com>
Date: Thu, 7 Nov 2019 12:28:43 +0100
Subject: [PATCH 1/3] Change menu toggle element from span to button
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

This makes possible to navigate to the menu toggle using the keyboard,
as well as being semantically more correct.

Signed-off-by: Daniel Calviño Sánchez <danxuliu@gmail.com>
---
 core/css/public.scss             | 10 ++++++++++
 core/templates/layout.public.php |  2 +-
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/core/css/public.scss b/core/css/public.scss
index 1b55d9d12d..6ec22cbc6d 100644
--- a/core/css/public.scss
+++ b/core/css/public.scss
@@ -11,6 +11,16 @@ $footer-height: 65px;
 			ul li {
 				min-width: 270px;
 			}
+			#header-actions-toggle {
+				background-color: transparent;
+				border-color: transparent;
+
+				&:hover,
+				&:focus,
+				&:active {
+					opacity: 1;
+				}
+			}
 			#save-external-share {
 				form {
 					display: flex;
diff --git a/core/templates/layout.public.php b/core/templates/layout.public.php
index bbfa264d17..996b78a922 100644
--- a/core/templates/layout.public.php
+++ b/core/templates/layout.public.php
@@ -61,7 +61,7 @@
 			</span>
 			<?php if($template->getActionCount() > 1) { ?>
 			<div id="header-secondary-action">
-				<span id="header-actions-toggle" class="menutoggle icon-more-white"></span>
+				<button id="header-actions-toggle" class="menutoggle icon-more-white"></button>
 				<div id="header-actions-menu" class="popovermenu menu">
 					<ul>
 						<?php

From 33b2f4e29589e6a415612f7d15525659847f3a8a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Daniel=20Calvi=C3=B1o=20S=C3=A1nchez?= <danxuliu@gmail.com>
Date: Thu, 7 Nov 2019 14:19:04 +0100
Subject: [PATCH 2/3] Format HTML elements
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Daniel Calviño Sánchez <danxuliu@gmail.com>
---
 .../Http/Template/ExternalShareMenuAction.php    | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/lib/public/AppFramework/Http/Template/ExternalShareMenuAction.php b/lib/public/AppFramework/Http/Template/ExternalShareMenuAction.php
index 5e1387ac85..47f62d9f8f 100644
--- a/lib/public/AppFramework/Http/Template/ExternalShareMenuAction.php
+++ b/lib/public/AppFramework/Http/Template/ExternalShareMenuAction.php
@@ -67,14 +67,14 @@ class ExternalShareMenuAction extends SimpleMenuAction {
 	 */
 	public function render(): string {
 		return '<li>' .
-			'<a id="save-external-share" data-protected="false" data-owner-display-name="' . Util::sanitizeHTML($this->displayname) . '" data-owner="' . Util::sanitizeHTML($this->owner) . '" data-name="' . Util::sanitizeHTML($this->shareName) . '">' .
-			'<span class="icon ' . Util::sanitizeHTML($this->getIcon()) . '"></span>' .
-			'<label for="remote_address">' . Util::sanitizeHTML($this->getLabel()) . '</label>' .
-			'<form class="save-form hidden" action="#">' .
-			'<input type="text" id="remote_address" placeholder="user@yourNextcloud.org">' .
-			'<input type="submit" value=" " id="save-button-confirm" class="icon-confirm" disabled="disabled"></button>' .
-			'</form>' .
-			'</a>' .
+			'    <a id="save-external-share" data-protected="false" data-owner-display-name="' . Util::sanitizeHTML($this->displayname) . '" data-owner="' . Util::sanitizeHTML($this->owner) . '" data-name="' . Util::sanitizeHTML($this->shareName) . '">' .
+			'        <span class="icon ' . Util::sanitizeHTML($this->getIcon()) . '"></span>' .
+			'        <label for="remote_address">' . Util::sanitizeHTML($this->getLabel()) . '</label>' .
+			'        <form class="save-form hidden" action="#">' .
+			'            <input type="text" id="remote_address" placeholder="user@yourNextcloud.org">' .
+			'            <input type="submit" value=" " id="save-button-confirm" class="icon-confirm" disabled="disabled"></button>' .
+			'        </form>' .
+			'    </a>' .
 			'</li>';
 	}
 }

From 883a71ce8e00d317e1827deacf46ee0c37934485 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Daniel=20Calvi=C3=B1o=20S=C3=A1nchez?= <danxuliu@gmail.com>
Date: Thu, 7 Nov 2019 21:30:56 +0100
Subject: [PATCH 3/3] Split the menu entry for external shares in two
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The external shares entry showed a "button" that, when pressed, replaced
the button with the input to set the remote share address. The "button"
was actually a label for the input, so when the label was focused it
transferred the focus to the input and thus pressing enter or space did
not show the input. Moreover, inputs inside links are not valid HTML,
and once shown there was no way to hide the input again.

Due to all this, and for consistency with the direct link input, the
external share input was moved to a different menu item that is shown
and hidden when the button, which nows is also a real button, is
clicked.

Signed-off-by: Daniel Calviño Sánchez <danxuliu@gmail.com>
---
 core/css/public.scss                                  |  3 +--
 core/js/public/publicpage.js                          |  5 ++---
 .../Http/Template/ExternalShareMenuAction.php         | 11 ++++++-----
 3 files changed, 9 insertions(+), 10 deletions(-)

diff --git a/core/css/public.scss b/core/css/public.scss
index 6ec22cbc6d..b171dd4970 100644
--- a/core/css/public.scss
+++ b/core/css/public.scss
@@ -21,10 +21,9 @@ $footer-height: 65px;
 					opacity: 1;
 				}
 			}
-			#save-external-share {
+			#external-share-menu-item {
 				form {
 					display: flex;
-					margin: 0;
 				}
 				.hidden {
 					display: none;
diff --git a/core/js/public/publicpage.js b/core/js/public/publicpage.js
index e71bdff12a..4fb9c67bfe 100644
--- a/core/js/public/publicpage.js
+++ b/core/js/public/publicpage.js
@@ -26,9 +26,8 @@ $(document).ready(function () {
 		$(this).next('.popovermenu').toggleClass('open');
 	});
 
-	$('#save-external-share').find('label').click(function () {
-		$(this).toggleClass('hidden');
-		$('.save-form').toggleClass('hidden')
+	$('#save-external-share').click(function () {
+		$('#external-share-menu-item').toggleClass('hidden')
 		$('#remote_address').focus();
 	});
 
diff --git a/lib/public/AppFramework/Http/Template/ExternalShareMenuAction.php b/lib/public/AppFramework/Http/Template/ExternalShareMenuAction.php
index 47f62d9f8f..33ca3be94a 100644
--- a/lib/public/AppFramework/Http/Template/ExternalShareMenuAction.php
+++ b/lib/public/AppFramework/Http/Template/ExternalShareMenuAction.php
@@ -67,14 +67,15 @@ class ExternalShareMenuAction extends SimpleMenuAction {
 	 */
 	public function render(): string {
 		return '<li>' .
-			'    <a id="save-external-share" data-protected="false" data-owner-display-name="' . Util::sanitizeHTML($this->displayname) . '" data-owner="' . Util::sanitizeHTML($this->owner) . '" data-name="' . Util::sanitizeHTML($this->shareName) . '">' .
-			'        <span class="icon ' . Util::sanitizeHTML($this->getIcon()) . '"></span>' .
-			'        <label for="remote_address">' . Util::sanitizeHTML($this->getLabel()) . '</label>' .
-			'        <form class="save-form hidden" action="#">' .
+			'    <button id="save-external-share" class="icon ' . Util::sanitizeHTML($this->getIcon()) . '" data-protected="false" data-owner-display-name="' . Util::sanitizeHTML($this->displayname) . '" data-owner="' . Util::sanitizeHTML($this->owner) . '" data-name="' . Util::sanitizeHTML($this->shareName) . '">' . Util::sanitizeHTML($this->getLabel()) . '</button>' .
+			'</li>' .
+			'<li id="external-share-menu-item" class="hidden">' .
+			'    <span class="menuitem">' .
+			'        <form class="save-form" action="#">' .
 			'            <input type="text" id="remote_address" placeholder="user@yourNextcloud.org">' .
 			'            <input type="submit" value=" " id="save-button-confirm" class="icon-confirm" disabled="disabled"></button>' .
 			'        </form>' .
-			'    </a>' .
+			'    </span>' .
 			'</li>';
 	}
 }