Procházet zdrojové kódy

Login screen on dashboard

kanadeko před 7 roky
rodič
revize
0da43c4520
3 změnil soubory, kde provedl 74 přidání a 8 odebrání
  1. 36 6
      pages/panel.html
  2. 15 1
      public/css/style.css
  3. 23 1
      public/js/panel.js

+ 36 - 6
pages/panel.html

@@ -7,8 +7,39 @@
         <script type="text/javascript" src="/js/panel.js"></script>
     </head>
     <body>
-        <section class="section">
-            <div class="container">
+
+        <section id='auth' class="hero is-light is-fullheight">
+            <div class="hero-body">
+                <div class="container">
+                    <h1 class="title">
+                        Admin dashboard
+                    </h1>
+                    <h2 class="subtitle">
+                        <p class="control has-addons">
+                            <input id='token' class="input is-danger" type="text" placeholder="Your admin token">
+                            <a id='tokenSubmit' class="button is-danger is-outlined">Check</a>
+                        </p>
+                    </h2>
+                </div>
+            </div>
+        </section>
+
+        <section id='dashboard' class="section">
+
+            <!--<div id="auth" class="container">
+                <div class="columns">
+                    <div class="column"></div>
+                    <div class="column">
+                        <p class="control has-addons has-addons-centered">
+                            <input id='token' class="input is-danger" type="text" placeholder="Your admin token">
+                            <a id='tokenSubmit' class="button is-danger">Check</a>
+                        </p>
+                    </div>
+                    <div class="column"></div>
+                </div>
+            </div>-->
+
+            <div id="panel" class="container">
                 <h1 class="title">Dashboard</h1>
                 <h2 class="subtitle">A simple <strong>dashboard</strong>, to sort your uploaded stuff</h2>
                 <hr>
@@ -31,11 +62,10 @@
                                     </ul>
                                 </li>
                             </ul>
-                            <!--<p class="menu-label">Administration</p>
+                            <p class="menu-label">Administration</p>
                             <ul class="menu-list">
-                                <li><a>Change your token</a></li>
-                                <li><a>Some other fancy stuff</a></li>
-                            </ul>-->
+                                <li><a>Change your tokens</a></li>
+                            </ul>
                         </aside>
                     </div>
                     <div class="column has-text-centered" id='page'>

+ 15 - 1
public/css/style.css

@@ -75,4 +75,18 @@ img.logo { height: 200px; margin-top: 20px; }
 		-webkit-transform: scale(1);
 		transform: scale(1);
 	}
-}
+}
+
+/* ------------------
+		PANEL
+------------------ */
+
+section#dashboard { display: none }
+section#auth input, section#auth a {
+	border-left: 0px;
+    border-top: 0px;
+    border-right: 0px;
+    border-radius: 0px;
+    background: rgba(0, 0, 0, 0);
+    box-shadow: 0 0 0;
+}

+ 23 - 1
public/js/panel.js

@@ -1,12 +1,34 @@
 window.onload = function () {
 
-	if(!localStorage.token) 
+	if(!localStorage.admintoken){
+		askForToken();
 		return;
+	}
 
+	var dashboard = document.getElementById('dashboard');
 	var page = document.getElementById('page');
 
+	dashboard.style.display = 'block';
 	prepareMenu();
 
+	function askForToken(){
+		document.getElementById('tokenSubmit').addEventListener('click', function(){
+			checkToken();
+		});
+
+		function checkToken(){
+			var xhr = new XMLHttpRequest();
+
+			xhr.onreadystatechange = function() {
+				if (xhr.readyState == XMLHttpRequest.DONE) {
+					// xhr.responseText
+				}
+			}
+			xhr.open('POST', '/api/info', true);
+			xhr.send(null);
+		}
+	}
+
 	function prepareMenu(){
 		document.getElementById('itemUploads').addEventListener('click', function(){
 			getUploads();