Redesign admin navbar

signed as alignment

More autofocus and correct redirections

Hack for modal autofocus

Capitalize Logout

css/index.css

@@ -13,3 +13,7 @@ body {
 .btn .glyphicon {
   top: 2px;
 }
+
+.signed {
+  margin-top: 20px;
+}

include/html/grids.php

@@ -15,7 +15,7 @@
         <div class="modal-body">
           <div class="form-group">
             <label for="modal-user-add-username">Username</label>
-            <input type="text" name="username" id="modal-user-add-username" class="form-control" />
+            <input type="text" name="username" id="modal-user-add-username" class="form-control" autofocus/>
           </div>
           <div class="form-group">
             <label for="modal-user-add-password">Password</label>
@@ -56,7 +56,7 @@
         <div class="modal-body">
           <div class="form-group">
             <label for="modal-admin-add-username">Username</label>
-            <input type="text" name="username" id="modal-admin-add-username" class="form-control" />
+            <input type="text" name="username" id="modal-admin-add-username" class="form-control" autofocus/>
           </div>
           <div class="form-group">
             <label for="modal-admin-add-password">Password</label>

index.php

@@ -108,7 +108,7 @@
     if(isset($_GET['installation'])) {
       if(isInstalled($bdd) == true) {
         printError('OpenVPN-admin is already installed. Redirection.');
-        header( "refresh:3;url=index.php?admin.php" );
+        header( "refresh:3;url=index.php?admin" );
         exit -1;
       }
 
@@ -119,7 +119,8 @@
         $admin_repeat_pass = $_POST['repeat_admin_pass'];
 
         if($admin_pass != $admin_repeat_pass) {
-          printError('The passwords do not correspond.');
+          printError('The passwords do not correspond. Redirection.');
+          header( "refresh:3;url=index.php?installation" );
           exit -1;
         }
 
@@ -144,7 +145,7 @@
         unlink($sql_file);
         rmdir(dirname(__FILE__) . '/sql');
         printSuccess('Well done, OpenVPN-Admin is installed. Redirection.');
-        header( "refresh:3;url=index.php?admin.php" );
+        header( "refresh:3;url=index.php?admin" );
       }
       // Print the installation form
       else {
@@ -178,9 +179,16 @@
     else{
   ?>
       <nav class="navbar navbar-default">
-        <p class="navbar-text">Signed as <?php echo $_SESSION['admin_id']; ?> /
+        <div class="row col-md-12">
-          <a class="navbar-link" href="index.php?logout" title="Logout ?">logout ?</a>
+          <div class="col-md-6">
-        </p>
+            <p class="navbar-text signed">Signed as <?php echo $_SESSION['admin_id']; ?>
+            </div>
+            <div class="col-md-6">
+              <a class="navbar-text navbar-right" href="index.php?logout" title="Logout"><button class="btn btn-danger">Logout</button></a>
+              <a class="navbar-text navbar-right" href="index.php" title="Configuration"><button class="btn btn-default">Configuration</button></a>
+            </p>
+          </div>
+        </div>
       </nav>
 
   <?php

js/grids.js

@@ -234,3 +234,12 @@ $(function () {
     ]
   });
 });
+
+// -------------------- HACKS --------------------
+
+// Autofocus for bootstrap modals
+// Thx http://stackoverflow.com/questions/14940423/autofocus-input-in-twitter-bootstrap-modal/33323836#33323836
+
+$(document).on('shown.bs.modal', '.modal', function() {
+  $(this).find('[autofocus]').focus();
+});