fix duplicate ids in login form and move login/register buttons into the hamburger menu on small screens

6 files changed, 57 insertions, 47 deletions

diff --git a/boot.php b/boot.php
index 6b6a56b6d..5fa314eee 100644
--- a/boot.php
+++ b/boot.php
@@ -1687,7 +1687,7 @@ function fix_system_urls($oldurl, $newurl) {
  * @param boolean $login_page (optional) default true
  * @return string Parsed HTML code.
  */
-function login($register = false, $form_id = 'main-login', $hiddens = false, $login_page = true) {
+function login($register = false, $form_id = 'main_login', $hiddens = false, $login_page = true) {
 
 	$o   = '';
 	$reg = null;
@@ -1747,9 +1747,9 @@ function login($register = false, $form_id = 'main-login', $hiddens = false, $lo
 		'$login'        => t('Login'),
 		'$remote_login' => t('Remote Authentication'),
 		'$form_id'      => $form_id,
-		'$lname'        => ['username', $lname_label],
-		'$lpassword'    => ['password', t('Password')],
-		'$remember_me'  => [(($login_page) ? 'remember' : 'remember_me'), t('Remember me'), '', '', [t('No'), t('Yes')]],
+		'$lname'        => [$form_id . '_username', $lname_label],
+		'$lpassword'    => [$form_id . '_password', t('Password')],
+		'$remember_me'  => [$form_id . '_remember', t('Remember me'), '', '', [t('No'), t('Yes')]],
 		'$hiddens'      => $hiddens,
 		'$register'     => $reg,
 		'$lostpass'     => t('Forgot your password?'),
diff --git a/include/auth.php b/include/auth.php
index 8eeb077b5..07b8e2971 100644
--- a/include/auth.php
+++ b/include/auth.php
@@ -30,9 +30,9 @@ require_once('include/security.php');
  *  The return array is dependent on the login mechanism.
  *    $ret['account'] will be set if either an email or channel address validation was successful (local login).
  *    $ret['channel'] will be set if a channel address validation was successful.
- *    $ret['xchan'] will be set if a guest access token validation was successful. 
- *   Keys will exist for invalid return arrays but will be set to null. 
- *   This function does not perform a login. It merely validates systems passwords and tokens.  
+ *    $ret['xchan'] will be set if a guest access token validation was successful.
+ *   Keys will exist for invalid return arrays but will be set to null.
+ *   This function does not perform a login. It merely validates systems passwords and tokens.
  *
  */
 
@@ -44,7 +44,7 @@ function account_verify_password($login, $pass) {
 	$email_verify = get_config('system', 'verify_email');
 	$register_policy = get_config('system', 'register_policy');
 
-	if(! $login)
+	if(!$login || !$pass)
 		return null;
 
 	$account = null;
@@ -72,7 +72,7 @@ function account_verify_password($login, $pass) {
 		$ret['account'] = $addon_auth['user_record'];
 		return $ret;
 	}
-	else {	
+	else {
 		if(! strpos($login,'@')) {
 			$channel = channelx_by_nick($login);
 			if(! $channel) {
@@ -102,7 +102,7 @@ function account_verify_password($login, $pass) {
 		$account = $a[0];
 
 		// Currently we only verify email address if there is an open registration policy.
-		// This isn't because of any policy - it's because the workflow gets too complicated if 
+		// This isn't because of any policy - it's because the workflow gets too complicated if
 		// you have to verify the email and then go through the account approval workflow before
 		// letting them login.
 
@@ -112,7 +112,7 @@ function account_verify_password($login, $pass) {
 		}
 
 		if($channel) {
-			// Try the authentication plugin again since weve determined we are using the channel login instead of account login 
+			// Try the authentication plugin again since weve determined we are using the channel login instead of account login
 			$addon_auth = [
 				'username'      => $account['account_email'],
 				'password'      => trim($pass),
@@ -128,7 +128,7 @@ function account_verify_password($login, $pass) {
 			}
 		}
 
-		if(($account['account_flags'] == ACCOUNT_OK) 
+		if(($account['account_flags'] == ACCOUNT_OK)
 			&& (hash('whirlpool',$account['account_salt'] . $pass) === $account['account_password'])) {
 			logger('password verified for ' . $login);
 			$ret['account'] = $account;
@@ -193,7 +193,7 @@ if((isset($_SESSION)) && (x($_SESSION, 'authenticated')) &&
 			$_SESSION = $_SESSION['delegate_push'];
 			info( t('Delegation session ended.') . EOL);
 		}
-		else {	
+		else {
 			App::$session->nuke();
 			info( t('Logged out.') . EOL);
 		}
@@ -280,8 +280,11 @@ else {
 
 	// handle a fresh login request
 
-	if((x($_POST, 'password')) && strlen($_POST['password']))
-		$encrypted = hash('whirlpool', trim($_POST['password']));
+	$password = $_POST['main_login_password'] ?? $_POST['modal_login_password'];
+	$username = $_POST['main_login_username'] ?? $_POST['modal_login_username'];
+
+	if($password)
+		$encrypted = hash('whirlpool', trim($password));
 
 	if((x($_POST, 'auth-params')) && $_POST['auth-params'] === 'login') {
 
@@ -289,10 +292,10 @@ else {
 		$account = null;
 		$channel = null;
 
-		$verify = account_verify_password($_POST['username'], $_POST['password']);
+		$verify = account_verify_password($username, $password);
 		if($verify && array_key_exists('reason',$verify) && $verify['reason'] === 'unvalidated') {
 			notice( t('Email validation is incomplete. Please check your email.'));
-			goaway(z_root() . '/email_validation/' . bin2hex(punify(trim(escape_tags($_POST['username'])))));
+			goaway(z_root() . '/email_validation/' . bin2hex(punify(trim(escape_tags($username)))));
 		}
 		elseif($verify) {
 			$atoken  = $verify['xchan'];
@@ -311,8 +314,8 @@ else {
 		}
 
 		if(! ($account || $atoken)) {
-			$error = 'authenticate: failed login attempt: ' . notags(trim($_POST['username'])) . ' from IP ' . $_SERVER['REMOTE_ADDR'];
-			logger($error); 
+			$error = 'authenticate: failed login attempt: ' . notags(trim($username)) . ' from IP ' . $_SERVER['REMOTE_ADDR'];
+			logger($error);
 			// Also log failed logins to a separate auth log to reduce overhead for server side intrusion prevention
 			$authlog = get_config('system', 'authlog');
 			if ($authlog)
@@ -334,7 +337,9 @@ else {
 		// (i.e. expire when the browser is closed), even when there's a time expiration
 		// on the cookie
 
-		if(($_POST['remember_me']) || ($_POST['remember'])) {
+		$remember = $_POST['main_login_remember'] ?? $_POST['modal_login_remember'];
+
+		if($remember) {
 			$_SESSION['remember_me'] = 1;
 			App::$session->new_cookie(31449600); // one year
 		}
@@ -360,7 +365,7 @@ else {
  * and returns the corresponding channel_id.
  *
  * @fixme How do we prevent that an OpenID identity is used more than once?
- * 
+ *
  * @param string $authid
  *  The given openid_identity
  * @return int|bool
diff --git a/include/nav.php b/include/nav.php
index 9278c1587..b9b24e34c 100644
--- a/include/nav.php
+++ b/include/nav.php
@@ -118,11 +118,11 @@ function nav($template = 'default') {
 	else {
 		if (!get_account_id()) {
 			if (App::$module === 'channel') {
-				$nav['login']       = login(true, 'main-login', false, false);
+				$nav['login']       = login(true, 'modal_login', false, false);
 				$nav['loginmenu'][] = ['login', t('Login'), '', t('Sign in'), ''];
 			}
 			else {
-				$nav['login']         = login(true, 'main-login', false, false);
+				$nav['login']         = login(true, 'modal_login', false, false);
 				$nav['loginmenu'][]   = ['login', t('Login'), '', t('Sign in'), 'login_nav_btn'];
 
 				App::$page['content'] .= replace_macros(get_markup_template('nav_login.tpl'),
diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css
index cea9b8ae5..ebbc1aaa3 100644
--- a/view/theme/redbasic/css/style.css
+++ b/view/theme/redbasic/css/style.css
@@ -1728,7 +1728,7 @@ dl.bb-dl > dd > li {
 	text-align: center;
 }
 
-#login-main, .rmagic-button {
+.login-wrapper {
 	max-width: 400px;
 	margin-top: 20px;
 	margin-left: auto;
diff --git a/view/tpl/login.tpl b/view/tpl/login.tpl
index cc4616b16..ead524193 100644
--- a/view/tpl/login.tpl
+++ b/view/tpl/login.tpl
@@ -1,13 +1,13 @@
 <form action="{{$dest_url}}" id="{{$form_id}}" method="post" >
 	<input type="hidden" name="auth-params" value="login" />
-	<div id="login-main" class="d-grid gap-2">
+	<div class="login-wrapper d-grid gap-2">
 		{{include file="field_input.tpl" field=$lname}}
 		{{include file="field_password.tpl" field=$lpassword}}
 		{{include file="field_checkbox.tpl" field=$remember_me}}
 		<button type="submit" name="submit" class="btn btn-primary">{{$login}}</button>
-		{{if $register}}<a href="{{$register.link}}" title="{{$register.title}}" id="register-link" class="float-end">{{$register.desc}}</a>{{/if}}
-		{{if $lostlink}}<a href="lostpass" title="{{$lostpass}}" id="lost-password-link" >{{$lostlink}}</a>{{/if}}
-<hr>
+		{{if $register}}<a href="{{$register.link}}" title="{{$register.title}}" class="register-link float-end">{{$register.desc}}</a>{{/if}}
+		{{if $lostlink}}<a href="lostpass" title="{{$lostpass}}" class="lost-pass-link">{{$lostlink}}</a>{{/if}}
+		<hr>
 		<a href="rmagic" class="btn btn-outline-success">{{$remote_login}}</a>
 	</div>
 	{{foreach $hiddens as $k=>$v}}
diff --git a/view/tpl/navbar_default.tpl b/view/tpl/navbar_default.tpl
index 8d6d5dfd7..0dccd4404 100644
--- a/view/tpl/navbar_default.tpl
+++ b/view/tpl/navbar_default.tpl
@@ -1,23 +1,5 @@
 <nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark">
 	<div class="container-fluid flex-nowrap">
-		{{if $nav.login && !$userinfo}}
-		<div class="d-lg-none pt-1 pb-1">
-			{{if $nav.loginmenu.1.4}}
-			<a class="btn btn-primary btn-sm text-white" href="#" title="{{$nav.loginmenu.1.3}}" id="{{$nav.loginmenu.1.4}}_collapse" data-bs-toggle="modal" data-bs-target="#nav-login">
-				{{$nav.loginmenu.1.1}}
-			</a>
-			{{else}}
-			<a class="btn btn-primary btn-sm text-white" href="login" title="{{$nav.loginmenu.1.3}}">
-				{{$nav.loginmenu.1.1}}
-			</a>
-			{{/if}}
-			{{if $nav.register}}
-			<a class="btn btn-warning btn-sm text-dark" href="{{$nav.register.0}}" title="{{$nav.register.3}}" id="{{$nav.register.4}}" >
-				{{$nav.register.1}}
-			</a>
-			{{/if}}
-		</div>
-		{{/if}}
 		{{if $userinfo}}
 		<div class="d-flex" style="max-width: 50%">
 			<div class="dropdown">
@@ -83,8 +65,9 @@
 			{{/if}}
 			{{/if}}
 		</div>
+		{{else}}
+		<div id="banner" class="navbar-text d-lg-none">{{$banner}}</div>
 		{{/if}}
-
 		<div class="navbar-toggler-right">
 			{{if $nav.help.6}}
 			<button id="context-help-btn" class="navbar-toggler border-0" type="button" onclick="contextualHelp(); return false;">
@@ -179,6 +162,25 @@
 </nav>
 <div class="offcanvas offcanvas-end" tabindex="-1" id="app-bin" aria-labelledby="app-bin-label">
 	<div class="offcanvas-header">
+		{{if $nav.login && !$userinfo}}
+		<div class="d-lg-none pt-1 pb-1">
+			{{if $nav.loginmenu.1.4}}
+			<a class="btn btn-primary btn-sm text-white" href="#" title="{{$nav.loginmenu.1.3}}" id="{{$nav.loginmenu.1.4}}_collapse" data-bs-toggle="modal" data-bs-target="#nav-login">
+				{{$nav.loginmenu.1.1}}
+			</a>
+			{{else}}
+			<a class="btn btn-primary btn-sm text-white" href="login" title="{{$nav.loginmenu.1.3}}">
+				{{$nav.loginmenu.1.1}}
+			</a>
+			{{/if}}
+			{{if $nav.register}}
+			<a class="btn btn-warning btn-sm text-dark" href="{{$nav.register.0}}" title="{{$nav.register.3}}" id="{{$nav.register.4}}" >
+				{{$nav.register.1}}
+			</a>
+			{{/if}}
+		</div>
+		<div class="d-lg-flex"></div>
+		{{else}}
 		<div class="lh-1" id="app-bin-label">
 			{{if $name}}
 			<img src="{{$thumb}}" class="menu-img-2">
@@ -189,7 +191,10 @@
 			{{/if}}
 		</div>
 		<i id="app-bin-trash" class="fa fa-2x fa-fw fa-trash-o d-none"></i>
+		{{/if}}
+
 		<button type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas" aria-label="Close"></button>
+
 	</div>
 	<div class="offcanvas-body pt-0">
 		{{if $channel_apps.0}}