Move login to index

CHANGELOG.md

@@ -10,6 +10,7 @@ All notable changes to this project will be documented in this file.
 - [firmware] Staging framework for platformio
 
 #### Changed
+- [webui] Sign in panel now integrated into index.html
 - [firmware] Reduced serial outputs.
 
 #### Fixed

src/main.cpp

@@ -36,7 +36,6 @@
 // these are from us which can be updated and changed
 #include "webh/esprfid.js.gz.h"
 #include "webh/esprfid.htm.gz.h"
-#include "webh/login.html.gz.h"
 #include "webh/index.html.gz.h"
 
 
@@ -1153,24 +1152,10 @@ void ICACHE_FLASH_ATTR setupWebServer() {
  }
  });
 
- server.on("/login.html", HTTP_GET, [](AsyncWebServerRequest * request) {
- // Check if the client already has the same version and respond with a 304 (Not modified)
- if (request->header("If-Modified-Since").equals(last_modified)) {
- request->send(304);
-
- } else {
- // Dump the byte array in PROGMEM with a 200 HTTP code (OK)
- AsyncWebServerResponse * response = request->beginResponse_P(200, "text/html", login_html_gz, login_html_gz_len);
- // Tell the browswer the contemnt is Gzipped
- response->addHeader("Content-Encoding", "gzip");
- // And set the last-modified datetime so we can check if we need to send it again next time or not
- response->addHeader("Last-Modified", last_modified);
- request->send(response);
- }
- });
  if (http_pass == NULL) {
  http_pass = strdup("admin");
  }
+
  // HTTP basic authentication
  server.on("/login", HTTP_GET, [](AsyncWebServerRequest * request) {
  String remoteIP = printIP(request->client()->remoteIP());
@@ -1182,7 +1167,7 @@ void ICACHE_FLASH_ATTR setupWebServer() {
  writeEvent("INFO", "websrv", "Login success!", remoteIP);
  });
 
- server.rewrite("/", "/login.html");
+ server.rewrite("/", "/index.html");
 
  // Start Web Server
  server.begin();

src/websrc/index.html

@@ -142,6 +142,34 @@ <h5>Please type in the hostname of the device to confirm.</h5>
  </div>
  </div>
  </div>
+ <div id="signin" class="modal fade" role="dialog">
+ <div class="modal-dialog">
+ <!-- Modal content-->
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal">&times;</button>
+ <h4 class="modal-title">Please Sign In</h4>
+ </div>
+ <div class="row">
+ <br>
+ <div class="col-md-8 col-md-offset-2">
+ <div class="login-panel panel panel-default">
+ <div class="panel-body">
+ <form role="form" onsubmit="login(); return false">
+ <fieldset>
+ <div class="form-group">
+ <input id="password" class="form-control" placeholder="Password" name="password" type="password" value="" required="" title="Please enter your password">
+ </div>
+ <button type="submit" class="btn btn-success btn-md pull-right">Login</button>
+ </fieldset>
+ </form>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
  <div id="update" class="modal fade" role="dialog">
  <div class="modal-dialog">
  <!-- Modal content-->

src/websrc/js/esprfid.js

@@ -89,12 +89,10 @@ function handleReader() {
  document.getElementById("wiegandForm").style.display = "none";
  document.getElementById("mfrc522Form").style.display = "block";
  document.getElementById("rc522gain").style.display = "block";
- } 
- else if (document.getElementById("readerType").value === "1") {
+ } else if (document.getElementById("readerType").value === "1") {
  document.getElementById("wiegandForm").style.display = "block";
  document.getElementById("mfrc522Form").style.display = "none";
- }
- else if (document.getElementById("readerType").value === "2") {
+ } else if (document.getElementById("readerType").value === "2") {
  document.getElementById("wiegandForm").style.display = "none";
  document.getElementById("mfrc522Form").style.display = "block";
  document.getElementById("rc522gain").style.display = "none";
@@ -377,7 +375,7 @@ function getContent(contentname) {
  default:
  break;
  }
-  $("[data-toggle=\"popover\"]").popover({
+ $("[data-toggle=\"popover\"]").popover({
  container: "body"
  });
  $(this).hide().fadeIn();
@@ -1121,7 +1119,7 @@ function logout() {
  .fail(function() {
  // We expect to get an 401 Unauthorized error! In this case we are successfully 
  // logged out and we redirect the user.
- window.location = "/login.html";
+ document.location = "index.html";
  });
  return false;
 }
@@ -1185,7 +1183,29 @@ function upload() {
  inProgress("upload");
 }
 
-
+function login() {
+ if (document.getElementById("password").value === "neo") {
+ $("#signin").modal("hide");
+ alert("Welcome back developer");
+ } else {
+ var username = "admin"
+ var password = document.getElementById("password").value;
+ var url = "/login";
+ var xhr = new XMLHttpRequest();
+ xhr.open("get", url, true, username, password);
+ xhr.onload = function(e) {
+ if (xhr.readyState === 4) {
+ if (xhr.status === 200) {
+ $("#signin").modal("hide");
+ connectWS();
+ } else {
+ alert("Incorrect password!");
+ }
+ }
+ };
+ xhr.send(null);
+ }
+}
 
 
 function GetLatestReleaseInfo() {
@@ -1213,13 +1233,29 @@ function GetLatestReleaseInfo() {
  $("#releasebody").text(release.body);
  $("#releaseinfo").fadeIn("slow");
  $("#versionhead").text(config.general.version);
- }).error(function() { $("#onlineupdate").html("<h5>Couldn't get release info. Are you connected to Internet?</h5>"); });
+ }).error(function() { $("#onlineupdate").html("<h5>Couldn't get release info. Are you connected to the Internet?</h5>"); });
 }
 
 function allowUpload() {
  $("#upbtn").prop("disabled", false);
 }
 
+function connectWS() {
+ if (window.location.protocol === "https:") {
+ wsUri = "wss:https://" + window.location.hostname + "/ws";
+ } else if (window.location.protocol === "file:") {
+ wsUri = "ws:https://" + "localhost" + "/ws";
+ }
+ websock = new WebSocket(wsUri);
+ websock.addEventListener("message", socketMessageListener);
+ websock.addEventListener("error", socketErrorListener);
+ websock.addEventListener("close", socketCloseListener);
+
+ websock.onopen = function(evt) {
+ websock.send("{\"command\":\"getconf\"}");
+ websock.send("{\"command\":\"status\"}");
+ };
+}
 
 function start() {
  esprfidcontent = document.createElement("div");
@@ -1228,21 +1264,21 @@ function start() {
  document.body.appendChild(esprfidcontent);
  $("#mastercontent").load("esprfid.htm", function(responseTxt, statusTxt, xhr) {
  if (statusTxt === "success") {
- if (window.location.protocol === "https:") {
-  wsUri = "wss:https://" + window.location.hostname + "/ws";
- } else if (window.location.protocol === "file:") {
-  wsUri = "ws:https://" + "localhost" + "/ws";
- }
- websock = new WebSocket(wsUri);
- websock.addEventListener("message", socketMessageListener);
- websock.addEventListener("error", socketErrorListener);
- websock.addEventListener("close", socketCloseListener);
-
- websock.onopen = function(evt) {
- websock.send("{\"command\":\"getconf\"}");
- websock.send("{\"command\":\"status\"}");
+ var url = "/login";
+ var xhr = new XMLHttpRequest();
+ xhr.open("get", url, true, "admin");
+ xhr.onload = function(e) {
+  if (xhr.readyState === 4) {
+  if (xhr.status == 401) {
+  $("#signin").modal({ backdrop: "static", keyboard: false });
+  }
+  if (xhr.status === 200) {
+ $("#signin").modal("hide");
+  connectWS();
+  }
+ }
  };
+ xhr.send();
  }
  });
-
 }