autoexec config settings working (#10)

* autoexec config settings working

* small fixes

* working autoexec* saving

components/wifi-manager/code.js

@@ -15,7 +15,6 @@ var apList = null;
 var selectedSSID = "";
 var refreshAPInterval = null; 
 var checkStatusInterval = null;
-var checkConfigInterval = null;
 
 var StatusIntervalActive = false;
 var ConfigIntervalActive = false;
@@ -29,13 +28,6 @@ function stopCheckStatusInterval(){
 	}
 	StatusIntervalActive = false;
 }
-function stopCheckConfigInterval(){
-	if(checkConfigInterval != null){
-		clearTimeout(checkConfigInterval);
-		checkConfigInterval = null;
-	}
-	ConfigIntervalActive=false;
-}
 
 function stopRefreshAPInterval(){
 	
@@ -51,10 +43,6 @@ function startCheckStatusInterval(){
 	StatusIntervalActive = true;
 	checkStatusInterval = setTimeout(checkStatus, 950);
 }
-function startCheckConfigInterval(){
-	ConfigIntervalActive = true;
-	checkConfigInterval = setTimeout(checkConfig, 950);
-}
 
 function startRefreshAPInterval(){
 	RefreshAPIIntervalActive = true;
@@ -78,8 +66,6 @@ function RepeatRefreshAPInterval(){
 }
 
 $(document).ready(function(){
-	
-	
 	$("#wifi-status").on("click", ".ape", function() {
 		$( "#wifi" ).slideUp( "fast", function() {});
 		$( "#connect-details" ).slideDown( "fast", function() {});
@@ -138,19 +124,10 @@ $(document).ready(function(){
 		$( "#wifi" ).slideDown( "fast", function() {});
 		
 	});
-	$("#update").on("click", function() {
-		
-		performUpdate();
-	});	
-		$("#factory").on("click", function() {
-		
-		performFactory();
-	});	
 	
 	$("#ok-credits").on("click", function() {
 		$( "#credits" ).slideUp( "fast", function() {});
 		$( "#app" ).slideDown( "fast", function() {});
-		
 	});
 	
 	$("#acredits").on("click", function(event) {
@@ -196,48 +173,18 @@ $(document).ready(function(){
 		$( "#wifi" ).slideDown( "fast", function() {})
 	});
 	
-	
-	
-	
-	
-	
-	
-	
+	$("#update-command").on("click", function() {
+		updateAutoexec();
+	});	
+
 	//first time the page loads: attempt get the connection status and start the wifi scan
 	refreshAP();
 	startCheckStatusInterval();
 	startRefreshAPInterval();
-	startCheckConfigInterval();
-
-
-	
-	
+    getConfig();
 });
 
 
-function performUpdate(){
-	autoexec1 = $("#autoexec1").val();
-	//reset connection 
-// 		
-// 	$( "#ok-connect" ).prop("disabled",true);
-// 	$( "#ssid-wait" ).text(selectedSSID);
-// 	$( "#connect" ).slideUp( "fast", function() {});
-// 	$( "#connect_manual" ).slideUp( "fast", function() {});
-// 	$( "#connect-wait" ).slideDown( "fast", function() {});
-// 	// todo: should we update the UI here? 
-	
-	$.ajax({
-		url: '/config.json',
-		dataType: 'json',
-		method: 'POST',
-		cache: false,
-		headers: { 'X-Custom-autoexec1': autoexec1 },
-		data: { 'timestamp': Date.now()}
-	});
-
-
-}
-
 function performFactory(){
 		
 // 	$( "#ok-connect" ).prop("disabled",true);
@@ -258,7 +205,6 @@ function performFactory(){
 
 }
 
-
 function performConnect(conntype){
 	
 	//stop the status refresh. This prevents a race condition where a status 
@@ -302,7 +248,6 @@ function performConnect(conntype){
 	//now we can re-set the intervals regardless of result
 	startCheckStatusInterval();
 	startRefreshAPInterval();
-	
 }
 
 
@@ -322,7 +267,6 @@ function rssiToIcon(rssi){
 	}
 }
 
-
 function refreshAP(){
 	$.getJSON( "/ap.json", function( data ) {
 		if(data.length > 0){
@@ -337,7 +281,6 @@ function refreshAP(){
 		}
 	});
 	RepeatRefreshAPInterval();
-
 }
 
 function refreshAPHTML(data){
@@ -350,9 +293,6 @@ function refreshAPHTML(data){
 	$( "#wifi-list" ).html(h)
 }
 
-
-
-
 function checkStatus(){
 	$.getJSON( "/status.json", function( data ) {
 		if(data.hasOwnProperty('autoexec1') && data['autoexec1'] != ""){
@@ -424,31 +364,46 @@ function checkStatus(){
 	RepeatCheckStatusInterval();
 }
 
-
-function checkConfig(){
-	var h = "";
-	//{ "autoexec" : 0, "list" : [{ 'autoexec1' : 'squeezelite -o "I2S" -b 500:2000 -d all=info -M esp32' }]}
-	$.getJSON( "/config.json", function( data ) {
-		if(data.hasOwnProperty('autoexec')) {
-			h+= '<div id="autoexec">Autoexec: {0}</div>'.format(data["autoexec"]===1?"Active":"Inactive");
-		}
-		if(data.hasOwnProperty('list')) {
-			data["list"].forEach(function(e, idx, array) {
-		    	for (const [key, value] of Object.entries(e)) {
-  			 		h+= '<input id="{0}" type="text" maxlength="201" value="{1}"><br>'.format(key,value); 
-					}
-				}
-			
-			);
-		h += "\n";
-		$( "#command-list" ).html(h);
-		}
-		
+function getConfig() {
+	$.getJSON("/config.json", function(data) {
+		if (data.hasOwnProperty('autoexec')) {
+            if (data["autoexec"] === 1) {
+                console.log('turn on autoexec');
+                $("#autoexec-cb")[0].checked=true;
+            } else {
+                console.log('turn off autoexec');
+                $("#autoexec-cb")[0].checked=false;
+                $("#autoexec-command").hide(200);
+            }
+        }
+		if (data.hasOwnProperty('list')) {
+            data.list.forEach(function(line) {
+                let key = Object.keys(line)[0];
+                let val = Object.values(line)[0];
+                console.log(key, val);
+                if (key == 'autoexec1') {
+                    $("#autoexec1").val(val);
+                }
+            });
+        }
 	})
 	.fail(function() {
-		//don't do anything, the server might be down while esp32 recalibrates radio
+		console.log("failed to fetch config!");
 	});
+}
 
-	RepeatCheckConfigInterval();
-
+function updateAutoexec(){
+	autoexec = ($("#autoexec-cb")[0].checked)?1:0;
+	autoexec1 = $("#autoexec1").val();
+	
+	$.ajax({
+		url: '/config.json',
+		dataType: 'json',
+		method: 'POST',
+		cache: false,
+		headers: { "X-Custom-autoexec": autoexec, "X-Custom-autoexec1": autoexec1 },
+		data: { 'timestamp': Date.now() }
+	});
+    console.log('sent config JSON with headers:', autoexec, autoexec1);
 }
+

components/wifi-manager/http_server.c

@@ -38,9 +38,9 @@ function to process requests, decode URLs, serve files, etc. etc.
 
 /* @brief tag used for ESP serial console messages */
 static const char TAG[] = "http_server";
-static const char json_start[] = "{ \"autoexec\" : %u, \"list\" : [";
+static const char json_start[] = "{ \"autoexec\": %u, \"list\": [";
 static const char json_end[] = "]}";
-static const char template[] = "{ '%s' : '%s' }";
+static const char template[] = "{ \"%s\": \"%s\" }";
 static const char array_separator[]=",";
 
 /* @brief task handle for the http server */
@@ -222,7 +222,6 @@ void http_server_netconn_serve(struct netconn *conn) {
 					ESP_LOGI(TAG,"Serving config.json");
 					char autoexec_name[21]={0};
 					char * autoexec_value=NULL;
-					char * autoexec_flag_s=NULL;
 					uint8_t autoexec_flag=0;
 					int buflen=MAX_COMMAND_LINE_SIZE+strlen(template)+1;
 					char * buff = malloc(buflen);
@@ -251,7 +250,7 @@ void http_server_netconn_serve(struct netconn *conn) {
 									ESP_LOGD(TAG,"%s", array_separator);
 								}
 								ESP_LOGI(TAG,"found command %s = %s", autoexec_name, autoexec_value);
-								snprintf(buff,buflen-1,template, autoexec_name,autoexec_value);
+								snprintf(buff, buflen-1, template, autoexec_name, autoexec_value);
 								netconn_write(conn, buff, strlen(buff), NETCONN_NOCOPY);
 								ESP_LOGD(TAG,"%s", buff);
 								ESP_LOGD(TAG,"Freeing memory for command %s name", autoexec_name);
@@ -277,7 +276,8 @@ void http_server_netconn_serve(struct netconn *conn) {
 					if(wifi_manager_lock_json_buffer(( TickType_t ) 10)){
 						int i=1;
 						int lenS = 0, lenA=0;
-						char autoexec_name[21]={0};
+						char autoexec_name[22]={0};
+						char autoexec_key[12]={0};
 						char * autoexec_value=NULL;
 						char * autoexec_flag_s=NULL;
 						uint8_t autoexec_flag=0;
@@ -289,14 +289,16 @@ void http_server_netconn_serve(struct netconn *conn) {
 						}
 
 						do {
-							snprintf(autoexec_name,sizeof(autoexec_name)-1,"X-Custom-autoexec%u:",i++);
-							ESP_LOGD(TAG,"Looking for command name %s", autoexec_name);
+							snprintf(autoexec_name,sizeof(autoexec_name)-1,"X-Custom-autoexec%u: ",i);
+							snprintf(autoexec_key,sizeof(autoexec_key)-1,"autoexec%u",i++);
+							ESP_LOGD(TAG,"Looking for command name %s.", autoexec_name);
 							autoexec_value = http_server_get_header(save_ptr, autoexec_name, &lenS);
+							snprintf(autoexec_value, lenS+1, autoexec_value);
 
 							if(autoexec_value ){
 								if(lenS < MAX_COMMAND_LINE_SIZE ){
-									ESP_LOGD(TAG, "http_server_netconn_serve: config.json/ call, with %s: %s", autoexec_name, autoexec_value);
-									wifi_manager_save_autoexec_config(autoexec_value,autoexec_name,lenS);
+									ESP_LOGD(TAG, "http_server_netconn_serve: config.json/ call, with %s: %s, length %i", autoexec_key, autoexec_value, lenS);
+									wifi_manager_save_autoexec_config(autoexec_value,autoexec_key,lenS);
 								}
 								else
 								{

components/wifi-manager/index.html

@@ -9,6 +9,7 @@
 		<script src="/code.js"></script>
 		<title>esp32-wifi-manager</title>
 	</head>
+
 	<script>
 var ws, sel, host, old, once = 0, jso, m;
 var to = 0, set_int = 0;
@@ -156,10 +157,52 @@ function heartbeat()
 		
 }
 
+function handleClick(cb) {
+    if (cb.checked) {
+        $("#autoexec-command").show(200);
+    } else {
+        $("#autoexec-command").hide(200);
+    }
+}
 </script>
+
 	<body>
 		<div id="app">
 			<div id="app-wrap">
+                <div id="command_line">
+                    <header>
+                        <h1>Startup command</h1>
+                    </header>
+                    <h2>
+                        <div id="autoexec" class="toggle">
+                            <label>Run automatically at boot
+                                <input id="autoexec-cb" type="checkbox" checked="checked" onclick='handleClick(this);'/><span class="slider"></span>
+                            </label>
+                        </div>
+                    </h2>
+
+                    <div id="autoexec-command">
+                        <h2>Command to run</h2>
+                        <section id="command-list">
+                            <input id="autoexec1" type="text" size="50" maxlength="201" value="squeezelite -o I2S -b 500:2000 -d all=info" />
+                        </section>
+                    </div>
+
+                    <div class="buttons">
+                        <input id="update-command" type="button" value="Update" />
+                    </div>
+                </div>
+                <div id="otadiv">
+                    <header><h1>Firmware upgrade</h1></header>
+                    <form name="multipart" action="otaform" method="post" enctype="multipart/form-data" onsubmit="do_upload(this); return false;">
+                        <progress id="progr" value="0" max="100" >Upload Progress</progress>
+                        <input type="file" name="ota" id="ota" size="20" accept=".bin" onchange="file_change();" style="font-size: 12pt">
+                        <span id="file_info" style="font-size:12pt;"></span>
+                        <input type="submit" id="update" disabled="" value="upload">
+                        <input type="submit" id="factory"  disabled="" value="factory">
+                    </form>
+                </div>
+
 				<div id="wifi">
 					<header>
 						<h1>Wi-Fi</h1>
@@ -179,36 +222,11 @@ function heartbeat()
 					</section>
 					<div id="pwrdby"><em>Powered by </em><a id="acredits" href="#"><strong>esp32-wifi-manager</strong></a>.</div>
 				</div>
-				<div id="command_line">
-				<header>
-						<h1>Startup command</h1>
-					</header>
-					<h2>Squeezelite</span></h2>
-					
-					<div id="autoexec1_current" ></div>
-					<section id="command-list">
-					<input id="autoexec1" type="text" maxlength="201" placeholder="squeezelite -o I2S -b 500:2000 -d all=info" value="">
-					</section>
-					
-					<div class="buttons">
-					<input id="update_command" type="button" value="Update"  />
-					</div>
-				</div>
-			<div id="ota">
-				<header><h1>Application</h1></header>
-				<form name="multipart" action="otaform" method="post" enctype="multipart/form-data" onsubmit="do_upload(this); return false;">
-	          	<progress id="progr" value="0" max="100" >Upload Progress</progress>
-	            <input type="file" name="ota" id="ota" size="20" accept=".bin" onchange="file_change();" style="font-size: 12pt">
-	            <span id="file_info" style="font-size:12pt;"></span>
-	            <input type="submit" id="update" disabled="" value="upload">
-	            <input type="submit" id="factory"  disabled="" value="factory">
-	        </form>
-				</div>
 				<div id="connect_manual">
 					<header>
 						<h1>Enter Details</h1>
 					</header>
-					<h2>Manual Connection</span></h2>
+					<h2>Manual Connection</h2>
 					<section>
 						<input id="manual_ssid" type="text" placeholder="SSID" value="">
 						<input id="manual_pwd" type="password" placeholder="Password" value="">
@@ -307,4 +325,4 @@ function heartbeat()
 			</div>
 		</div>
 	</body>
-<html>
+<html>

components/wifi-manager/style.css

@@ -13,7 +13,6 @@ a:hover {
     color: red;
 }
 input {
-    display: none;
     font: 1.1em tahoma, arial, sans-serif;
 }
 input:focus,
@@ -77,6 +76,7 @@ p {
 header {
     background-color: #fff;
     border-bottom: 1px solid #888;
+    border-top: 1px solid #888;
 }
 section {
     background-color: #fff;
@@ -247,4 +247,99 @@ h3 {
         -webkit-transform: scale(1.0);
     }
 }
-/* end of SpinKit */
+/* end of SpinKit */
+
+.toggle label {
+	position: relative;
+	display: inline-block;
+	height: 3.5em;
+}
+
+.toggle input {
+	display: none;
+}
+
+.toggle .slider {
+	/* Grundfläche */
+	
+	position: absolute;
+	cursor: pointer;
+	top: 1.5em;
+	width: 4em;
+	height: 2em;
+	background-color: #c32e04;
+	/* red */
+	
+	transition: all .3s ease-in-out;
+	border-radius: 1em;
+}
+
+.toggle .slider:before {
+	/* verschiebbarer Button */
+	
+	position: absolute;
+	content: "";
+	height: 1.6em;
+	width: 1.6em;
+	left: 0.2em;
+	bottom: 0.2em;
+	background-color: white;
+	border-radius: 50%;
+	transition: all .3s ease-in-out;
+}
+
+.toggle input:checked + .slider {
+	background-color: #5a9900;
+	/* green */
+}
+
+.toggle input:focus + .slider {
+	background-color: pink;
+	box-shadow: 0 0 1px #5a9900;
+}
+
+.toggle input:checked + .slider:before {
+	-webkit-transform: translateX(1.9em);
+	/* Android 4 */
+	
+	-ms-transform: translateX(1.9em);
+	/* IE9 */
+	
+	transform: translateX(1.9em);
+}
+
+.text .slider:after {
+	/* Text vor dem FlipFlop-Schalter */
+	
+	position: absolute;
+	content: "AUS";
+	color: #c32e04;
+	font-weight: bold;
+	height: 1.6em;
+	left: -2.5em;
+	bottom: 0.2em;
+}
+
+.text input:checked + .slider:after {
+	/* Text hinter dem FlipFlop-Schalter */
+	
+	position: absolute;
+	content: "AN";
+	color: #5a9900;
+	left: 4.5em;
+}
+
+input#autoexec1 {
+    border: none;
+    margin-left: 35px;
+    padding: 10px 0px 10px 10px;
+}
+
+input#ota {
+    margin-top: 5px;
+    margin-bottom: 5px;
+}
+
+#otadiv {
+    margin-bottom: 15px;
+}

components/wifi-manager/wifi_manager.c

@@ -250,7 +250,7 @@ esp_err_t wifi_manager_save_autoexec_config(char * value, char * name, int len){
 		return esp_err;
 	}
 
-	esp_err = nvs_set_str(handle, name, value);
+    esp_err = nvs_set_str(handle, name, value);
 	if (esp_err != ESP_OK){
 		ESP_LOGE(TAG,"Unable to save value %s=%s",name,value);
 		nvs_close(handle);
@@ -265,7 +265,7 @@ esp_err_t wifi_manager_save_autoexec_config(char * value, char * name, int len){
 
 	nvs_close(handle);
 
-	ESP_LOGD(TAG, "wifi_manager_wrote %s config %s",name,value);
+	ESP_LOGD(TAG, "wifi_manager_wrote %s=%s with length %i", name, value, len);
 
 	return ESP_OK;
 

main/console.c

@@ -145,7 +145,7 @@ void process_autoexec(){
 	{
 		ESP_LOGD(TAG,"No matching command found for name autoexec. Adding default entries");
 		uint8_t autoexec_dft=0;
-		char autoexec1_dft[256]="squeezelite -o \"I2S\" -b 500:2000 -d all=info -M esp32";
+		char autoexec1_dft[256]="squeezelite -o I2S -b 500:2000 -d all=info -M esp32";
 		store_nvs_value(NVS_TYPE_U8,"autoexec",&autoexec_dft);
 		store_nvs_value(NVS_TYPE_STR,"autoexec1",autoexec1_dft);
 	}