Browse Source

Change Login screen to reflect plex login clearer

causefx 7 years ago
parent
commit
287955894f
2 changed files with 64 additions and 35 deletions
  1. 16 4
      api/functions/organizr-functions.php
  2. 48 31
      api/pages/login.php

+ 16 - 4
api/functions/organizr-functions.php

@@ -1372,16 +1372,28 @@ function showLogin()
 	}
 }
 
+function checkoAuth()
+{
+	return ($GLOBALS['plexoAuth']) ? true : false;
+}
+
 function showoAuth()
 {
 	$buttons = '';
 	if ($GLOBALS['plexoAuth']) {
-		$buttons .= '<a href="javascript:void(0)" onclick="oAuthStart(\'plex\')" class="btn btn-lg btn-block text-uppercase waves-effect waves-light bg-plex text-muted" data-toggle="tooltip" title="" data-original-title="Login with Plex"> <span>Login with Plex Account</span><i aria-hidden="true" class="mdi mdi-plex m-l-5"></i> </a>';
+		$buttons .= '<a href="javascript:void(0)" onclick="oAuthStart(\'plex\')" class="btn btn-lg btn-block text-uppercase waves-effect waves-light bg-plex text-muted" data-toggle="tooltip" title="" data-original-title="Login with Plex"> <span>Login</span><i aria-hidden="true" class="mdi mdi-plex m-l-5"></i> </a>';
 	}
 	return ($buttons) ? '
-		<div class="row">
-            <div class="col-xs-12 col-sm-12 col-md-12 m-t-10 text-center">
-                <div class="social">' . $buttons . '</div>
+		<div class="panel">
+            <div class="panel-heading bg-org" id="plex-login-heading" role="tab"> <a class="panel-title" data-toggle="collapse" href="#plex-login-collapse" data-parent="#login-panels" aria-expanded="false" aria-controls="organizr-login-collapse"> Login With Plex </a> </div>
+            <div class="panel-collapse collapse in" id="plex-login-collapse" aria-labelledby="plex-login-heading" role="tabpanel">
+                <div class="panel-body">
+               		<div class="row">
+			            <div class="col-xs-12 col-sm-12 col-md-12 text-center">
+			                <div class="social m-b-0">' . $buttons . '</div>
+			            </div>
+			        </div>
+               </div>
             </div>
         </div>
 	' : '';

+ 48 - 31
api/pages/login.php

@@ -1,5 +1,7 @@
 <?php
-$pageLogin = '
+if (file_exists('config' . DIRECTORY_SEPARATOR . 'config.php')) {
+	$hideOrganizrLogin = (checkoAuth()) ? 'collapse' : 'collapse in';
+	$pageLogin = '
 <script>
 if(activeInfo.settings.login.rememberMe){
 	$(\'#checkbox-login\').prop(\'checked\',true);
@@ -34,36 +36,50 @@ if(activeInfo.settings.login.rememberMe){
             </div>
           </div>
         </div>
-        <div class="form-group m-t-40">
-          <div class="col-xs-12">
-            <input id="login-username-Input" class="form-control" name="username" type="text" required="" placeholder="Username" lang="en" autofocus>
-          </div>
-        </div>
-        <div class="form-group">
-          <div class="col-xs-12">
-            <input id="login-password-Input" class="form-control" name="password" type="password" required="" placeholder="Password" lang="en">
-          </div>
-        </div>
-        <div class="form-group">
-          <div class="col-md-12">
-            <div class="checkbox checkbox-primary pull-left p-t-0 remember-me">
-              <input id="checkbox-login" name="remember" type="checkbox">
-              <label for="checkbox-login" lang="en">Remember Me</label>
-            </div>
-        	</div>
-        </div>
-        <div class="form-group text-center m-t-20 m-b-0">
-          <div class="col-xs-12">
-            <button class="btn btn-info btn-lg btn-block text-uppercase waves-effect waves-light login-button" type="submit" lang="en">Login</button>
-          </div>
-        </div>
-		' . showoAuth() . '
-        <div class="form-group m-b-0">
-          <div class="col-sm-12 text-center">
-          	<input id="oAuth-Input" class="form-control" name="oAuth" type="hidden">
-            <input id="oAuthType-Input" class="form-control" name="oAuthType" type="hidden">
-            ' . showLogin() . '
-          </div>
+        <div class="panel-group" id="login-panels" data-type="accordion" aria-multiselectable="true" role="tablist">
+	        <!-- ORGANIZR LOGIN -->
+	        <div class="panel">
+	            <div class="panel-heading bg-org" id="organizr-login-heading" role="tab"> <a class="panel-title collapsed" data-toggle="collapse" href="#organizr-login-collapse" data-parent="#login-panels" aria-expanded="false" aria-controls="organizr-login-collapse"> Login With Organizr </a> </div>
+	            <div class="panel-collapse ' . $hideOrganizrLogin . '" id="organizr-login-collapse" aria-labelledby="organizr-login-heading" role="tabpanel">
+	                <div class="panel-body">
+	                
+	                	<div class="form-group">
+				          <div class="col-xs-12">
+				            <input id="login-username-Input" class="form-control" name="username" type="text" required="" placeholder="Username" lang="en" autofocus>
+				          </div>
+				        </div>
+				        <div class="form-group">
+				          <div class="col-xs-12">
+				            <input id="login-password-Input" class="form-control" name="password" type="password" required="" placeholder="Password" lang="en">
+				          </div>
+				        </div>
+				        <div class="form-group">
+				          <div class="col-md-12">
+				            <div class="checkbox checkbox-primary pull-left p-t-0 remember-me">
+				              <input id="checkbox-login" name="remember" type="checkbox">
+				              <label for="checkbox-login" lang="en">Remember Me</label>
+				            </div>
+				            </div>
+				        </div>
+				        <div class="form-group text-center m-t-20 m-b-0">
+				          <div class="col-xs-12">
+				            <button class="btn btn-info btn-lg btn-block text-uppercase waves-effect waves-light login-button" type="submit" lang="en">Login</button>
+				          </div>
+				        </div>
+				        <div class="form-group m-b-0">
+				          <div class="col-sm-12 text-center">
+				            <input id="oAuth-Input" class="form-control" name="oAuth" type="hidden">
+				            <input id="oAuthType-Input" class="form-control" name="oAuthType" type="hidden">
+				            ' . showLogin() . '
+				          </div>
+				        </div>
+	                </div>
+	            </div>
+	        </div>
+	        <!-- END ORGANIZR LOGIN -->
+        	<!-- PLEX OAUTH LOGIN -->
+	        ' . showoAuth() . '
+	        <!-- END PLEX OAUTH LOGIN -->
         </div>
       </form>
       <form class="form-horizontal form-material hidden" id="registerForm" onsubmit="return false;">
@@ -125,3 +141,4 @@ if(activeInfo.settings.login.rememberMe){
   </div>
 </section>
 ';
+}