preset fix - release

credits Mumpf and Harry1999

.github/workflows/CrossBuild.yml

@@ -80,7 +80,7 @@ jobs:
       run: |
         env | grep "artifact\|tag\|GITHUB\|version\|NUMBER\|TARGET" >${TARGET_BUILD_NAME}-env.txt
         echo "${tag}" >version.txt
-        docker run --env-file=${TARGET_BUILD_NAME}-env.txt --rm -v $PWD:/project -w /project sle118/squeezelite-esp32:release-v4.0 /bin/bash -c "cp build-scripts/${TARGET_BUILD_NAME}-sdkconfig.defaults sdkconfig && idf.py build && zip build/${artifact_file_name} partitions*.csv build/*.bin build/bootloader/bootloader.bin build/partition_table/partition-table.bin build/flash_project_args build/size_*.txt"
+        docker run --env-file=${TARGET_BUILD_NAME}-env.txt --rm -v $PWD:/project -w /project sle118/idf:release-v4.0 /bin/bash -c "cp build-scripts/${TARGET_BUILD_NAME}-sdkconfig.defaults sdkconfig && idf.py build && zip -r build_output.zip build && zip build/${artifact_file_name} partitions*.csv build/*.bin build/bootloader/bootloader.bin build/partition_table/partition-table.bin build/flash_project_args build/size_*.txt"
     # - name: Build Mock firmware
     #   run: |
     #     mkdir -p build
@@ -106,6 +106,7 @@ jobs:
           build/size_comp1.txt
           build/size_comp2.txt
           partitions.csv
+          build_output.zip
     - uses: actions/upload-artifact@v2
       with:
         name: ${{ env.artifact_bin_file_name }}

README.md

@@ -24,7 +24,7 @@ Other features include
  - Firmware over-the-air update 
 
 ## Supported Hardware
-Any esp32-based hardware with at least 4MB of flash and 4MB of PSRAM will be capable of running squeezelite-esp32 and there are various boards that include such chip. A few are mentionned below, but any should work.
+Any esp32-based hardware with at least 4MB of flash and 4MB of PSRAM will be capable of running squeezelite-esp32 and there are various boards that include such chip. A few are mentionned below, but any should work. You can find various help & instructions [here](https://forums.slimdevices.com/showthread.php?112697-ANNOUNCE-Squeezelite-ESP32-(dedicated-thread))
 ### Raw WROVER module
 Per above description, a [WROVER module](https://www.espressif.com/en/products/modules/esp32) is enough to run Squeezelite-esp32, but that requires a bit of tinkering to extend it to have analogue audio or hardware buttons (e.g.) 
 
@@ -45,13 +45,18 @@ NB: You can use the pre-build binaries SqueezeAMP4MBFlash which has all the hard
 ### ESP32-A1S
 Works with [ESP32-A1S](https://docs.ai-thinker.com/esp32-a1s) module that includes audio codec and headset output. You still need to use a demo board like [this](https://www.aliexpress.com/item/4000765857347.html?spm=2114.12010615.8148356.11.5d963cd0j669ns) or an external amplifier if you want direct speaker connection. 
 
-The board showed above has the following IO set
+The board shown above has the following IO set
 - amplifier: GPIO21
 - key2: GPIO13, key3: GPIO19, key4: GPIO23, key5: GPIO18, key6: GPIO5 (to be confirmed with dip switches)
-- key1: not sure, something with GPIO36
+- key1: not sure, using GPIO36 in a matrix
 - jack insertion: GPIO39 (inserted low)
-- LED: GPIO22 (active low)
-(note that GPIO need pullups)
+- D4 -> GPIO22 used for green LED (active low)
+- D5 -> GPIO19 (muxed with key3)
+- The IO connector also brings GPIO5, GPIO18, GPIO19, GPIO21, GPIO22 and GPIO23 (don't forget it's muxed with keys!)
+- The JTAG connector uses GPIO 12, 13, 14 and 15 (see dip switch) but these are also used for SD-card (and GPIO13 is key2 as well)
+- It's always possible to re-use GPIOO (download at boot) and GPIO1/GPIO3 which are RX/TX of UART0 but you'll lose trace
+
+(note that some GPIO need pullups)
 
 So a possible config would be
 - set_GPIO: 21=amp,22=green:0,39=jack:0
@@ -207,16 +212,18 @@ There is also the possibility to use 'knobonly' option (exclusive with 'volume'
 - double press is 'Back' (Left in LMS's terminology). 
 - a quick left-right movement on the encoder is 'Pause' 
 
-The speed of double click (or left-right) can be set using the optional parameter of 'knobonly'. This is not a perfect solution, and other ideas are welcome. Be aware that the longer you set double click speed, the less responsive the interface will be. The reason is that I need to wait for that delay before deciding if it's a single or double click. It can also make menu navigation "hesitations" being easoly interpreted as 'Pause'
+The speed of double click (or left-right) can be set using the optional parameter of 'knobonly'. This is not a perfect solution, and other ideas are welcome. Be aware that the longer you set double click speed, the less responsive the interface will be. The reason is that I need to wait for that delay before deciding if it's a single or double click. It can also make menu navigation "hesitations" being easily interpreted as 'Pause'
 
 Use parameter rotary_config with the following syntax:
 
 ```
-A=<gpio>,B=<gpio>[,SW=gpio>[[,knobonly[=<ms>]|[,volume][,longpress]]
+A=<gpio>,B=<gpio>[,SW=gpio>[[,knobonly[=<ms>]]|[[,volume][,longpress]]]]
 ```
 
 HW note: all gpio used for rotary have internal pull-up so normally there is no need to provide Vcc to the encoder. Nevertheless if the encoder board you're using also has its own pull-up that are stronger than ESP32's ones (which is likely the case), then there will be crosstalk between gpio, so you must bring Vcc. Look at your board schematic and you'll understand that these board pull-up create a "winning" pull-down when any other pin is grounded. 
 
+The SW gpio is optional, you can re-affect it to a pure button if you prefer but the volume, longpress and knobonly options make little sense as the missing switch plays an important role in these modes. You could still have the "volume" mode, but you won't be able to use it for *anything* expect volume up and down. So be aware that the use of syntax [] is a bit misleading hereabove.
+
 See also the "IMPORTANT NOTE" on the "Buttons" section and remember that when 'lms_ctrls_raw' (see below) is activated, none of these knobonly,volume,longpress options apply, raw button codes (not actions) are simply sent to LMS
 
 ### Buttons

build-scripts/ESP32-A1S-sdkconfig.defaults

@@ -626,6 +626,8 @@ CONFIG_LWIP_MAX_SOCKETS=16
 CONFIG_LWIP_SO_REUSE=y
 CONFIG_LWIP_SO_REUSE_RXTOALL=y
 #CONFIG_LWIP_IP_REASSEMBLY is not set
+CONFIG_LWIP_IP6_REASSEMBLY=Y
+CONFIG_LWIP_IP4_REASSEMBLY=Y
 CONFIG_LWIP_ESP_GRATUITOUS_ARP=y
 CONFIG_LWIP_GARP_TMR_INTERVAL=60
 CONFIG_LWIP_TCPIP_RECVMBOX_SIZE=32

build-scripts/I2S-4MFlash-sdkconfig.defaults

@@ -459,7 +459,9 @@ CONFIG_LWIP_SO_REUSE_RXTOALL=y
 # CONFIG_LWIP_IP_FRAG is not set
 # CONFIG_LWIP_STATS is not set
 # CONFIG_LWIP_ETHARP_TRUST_IP_MAC is not set
-CONFIG_LWIP_IP_REASSEMBLY=y
+#CONFIG_LWIP_IP_REASSEMBLY is not set
+CONFIG_LWIP_IP6_REASSEMBLY=Y
+CONFIG_LWIP_IP4_REASSEMBLY=Y
 CONFIG_LWIP_ESP_GRATUITOUS_ARP=y
 CONFIG_LWIP_GARP_TMR_INTERVAL=60
 CONFIG_LWIP_TCPIP_RECVMBOX_SIZE=32

build-scripts/SqueezeAmp-sdkconfig.defaults

@@ -182,8 +182,6 @@ CONFIG_BT_A2DP_ENABLE=y
 CONFIG_BT_SSP_ENABLED=y
 # CONFIG_BT_BLE_ENABLED is not set
 CONFIG_BT_STACK_NO_LOG=n
-CONFIG_BT_BLE_ENABLED=n
-CONFIG_BT_BLE_SMP_ENABLE=y
 CONFIG_BT_ACL_CONNECTIONS=4
 CONFIG_BT_ALLOCATION_FROM_SPIRAM_FIRST=y
 CONFIG_BT_BLE_DYNAMIC_ENV_MEMORY=y
@@ -457,7 +455,9 @@ CONFIG_LWIP_MAX_SOCKETS=16
 # CONFIG_LWIP_USE_ONLY_LWIP_SELECT is not set
 CONFIG_LWIP_SO_REUSE=y
 CONFIG_LWIP_SO_REUSE_RXTOALL=y
-CONFIG_LWIP_IP_REASSEMBLY=y
+#CONFIG_LWIP_IP_REASSEMBLY is not set
+CONFIG_LWIP_IP6_REASSEMBLY=Y
+CONFIG_LWIP_IP4_REASSEMBLY=Y
 CONFIG_LWIP_ESP_GRATUITOUS_ARP=y
 CONFIG_LWIP_GARP_TMR_INTERVAL=60
 CONFIG_LWIP_TCPIP_RECVMBOX_SIZE=32

components/codecs/inc/alac/alac_wrapper.h

@@ -19,7 +19,7 @@ extern "C" {
 
 struct alac_codec_s *alac_create_decoder(int magic_cookie_size, unsigned char *magic_cookie,
 								unsigned char *sample_size, unsigned *sample_rate,
-								unsigned char *channels);
+								unsigned char *channels, unsigned int *block_size);
 void alac_delete_decoder(struct alac_codec_s *codec);
 bool alac_to_pcm(struct alac_codec_s *codec, unsigned char* input,
 				 unsigned char *output, char channels, unsigned *out_frames);

components/display/ILI9341.c

@@ -1,6 +1,7 @@
 /**
  * Copyright (c) 2017-2018 Tara Keeling
  *				 2020 Philippe G.
+ *				 2021 Mumpf and Harry1999
  * 
  * This software is released under the MIT License.
  * https://opensource.org/licenses/MIT
@@ -10,356 +11,331 @@
 #include <string.h>
 #include <stdint.h>
 #include <stdbool.h>
-#include "freertos/FreeRTOS.h"
-#include "freertos/task.h"
-#include "driver/gpio.h"
-
 #include <esp_heap_caps.h>
 #include <esp_log.h>
 
 #include "gds.h"
 #include "gds_private.h"
 
-//#define SHADOW_BUFFER
-#define PAGE_BLOCK	1024
+#define SHADOW_BUFFER
+#define USE_IRAM
+#define PAGE_BLOCK		2048
+#define ENABLE_WRITE	0x2c
+#define MADCTL_MX  0x40
+#define TFT_RGB_BGR  0x08
 
 #define min(a,b) (((a) < (b)) ? (a) : (b))
 
 static char TAG[] = "ILI9341";
 
-
-#define L1_CMD_NOP 0X00
-#define L1_CMD_SOFTWARE_RESET 0X01
-#define L1_CMD_READ_DISPLAY_IDENTIFICATION_INFORMATION 0X04
-#define L1_CMD_READ_DISPLAY_STATUS 0X09
-#define L1_CMD_READ_DISPLAY_POWER_MODE 0X0A
-#define L1_CMD_READ_DISPLAY_MADCTL 0X0B
-#define L1_CMD_READ_DISPLAY_PIXEL_FORMAT 0X0C
-#define L1_CMD_READ_DISPLAY_IMAGE_FORMAT 0X0D
-#define L1_CMD_READ_DISPLAY_SIGNAL_MODE 0X0E
-#define L1_CMD_READ_DISPLAY_SELF_DIAGNOSTIC_RESULT 0X0F
-#define L1_CMD_ENTER_SLEEP_MODE 0X10
-#define L1_CMD_SLEEP_OUT 0X11
-#define L1_CMD_PARTIAL_MODE_ON 0X12
-#define L1_CMD_NORMAL_DISPLAY_MODE_ON 0X13
-#define L1_CMD_DISPLAY_INVERSION_OFF 0X20
-#define L1_CMD_DISPLAY_INVERSION_ON 0X21
-#define L1_CMD_GAMMA_SET 0X26
-#define L1_CMD_DISPLAY_OFF 0X28
-#define L1_CMD_DISPLAY_ON 0X29
-#define L1_CMD_COLUMN_ADDRESS_SET 0X2A
-#define L1_CMD_PAGE_ADDRESS_SET 0X2B
-#define L1_CMD_MEMORY_WRITE 0X2C
-#define L1_CMD_COLOR_SET 0X2D
-#define L1_CMD_MEMORY_READ 0X2E
-#define L1_CMD_PARTIAL_AREA 0X30
-#define L1_CMD_VERTICAL_SCROLLING_DEFINITION 0X33
-#define L1_CMD_TEARING_EFFECT_LINE_OFF 0X34
-#define L1_CMD_TEARING_EFFECT_LINE_ON 0X35
-#define L1_CMD_MEMORY_ACCESS_CONTROL 0X36
-#define L1_CMD_VERTICAL_SCROLLING_START_ADDRESS 0X37
-#define L1_CMD_IDLE_MODE_OFF 0X38
-#define L1_CMD_IDLE_MODE_ON 0X39
-#define L1_CMD_COLMOD_PIXEL_FORMAT_SET 0X3A
-#define L1_CMD_WRITE_MEMORY_CONTINUE 0X3C
-#define L1_CMD_READ_MEMORY_CONTINUE 0X3E
-#define L1_CMD_SET_TEAR_SCANLINE 0X44
-#define L1_CMD_GET_SCANLINE 0X45
-#define L1_CMD_WRITE_DISPLAY_BRIGHTNESS 0X51
-#define L1_CMD_READ_DISPLAY_BRIGHTNESS 0X52
-#define L1_CMD_WRITE_CTRL_DISPLAY 0X53
-#define L1_CMD_READ_CTRL_DISPLAY 0X54
-#define L1_CMD_WRITE_CONTENT_ADAPTIVE_BRIGHTNESS_CONTROL 0X55
-#define L1_CMD_READ_CONTENT_ADAPTIVE_BRIGHTNESS_CONTROL 0X56
-#define L1_CMD_WRITE_CABC_MINIMUM_BRIGHTNESS 0X5E
-#define L1_CMD_READ_CABC_MINIMUM_BRIGHTNESS 0X5F
-#define L1_CMD_READ_ID1 0XDA
-#define L1_CMD_READ_ID2 0XDB
-#define L1_CMD_READ_ID3 0XDC
-
-#define L2_CMD_RGB_INTERFACE_SIGNAL_CONTROL 0XB0
-#define L2_CMD_FRAME_RATE_CONTROL_IN_NORMAL_MODE_FULL_COLORS 0XB1
-#define L2_CMD_FRAME_RATE_CONTROL_IN_IDLE_MODE_8_COLORS 0XB2
-#define L2_CMD_FRAME_RATE_CONTROL_IN_PARTIAL_MODE_FULL_COLORS 0XB3
-#define L2_CMD_DISPLAY_INVERSION_CONTROL 0XB4
-#define L2_CMD_BLANKING_PORCH_CONTROL 0XB5
-#define L2_CMD_DISPLAY_FUNCTION_CONTROL 0XB6
-#define L2_CMD_ENTRY_MODE_SET 0XB7
-#define L2_CMD_BACKLIGHT_CONTROL_1 0XB8
-#define L2_CMD_BACKLIGHT_CONTROL_2 0XB9
-#define L2_CMD_BACKLIGHT_CONTROL_3 0XBA
-#define L2_CMD_BACKLIGHT_CONTROL_4 0XBB
-#define L2_CMD_BACKLIGHT_CONTROL_5 0XBC
-#define L2_CMD_BACKLIGHT_CONTROL_7 0XBE
-#define L2_CMD_BACKLIGHT_CONTROL_8 0XBF
-#define L2_CMD_POWER_CONTROL_1 0XC0
-#define L2_CMD_POWER_CONTROL_2 0XC1
-#define L2_CMD_VCOM_CONTROL_1 0XC5
-#define L2_CMD_VCOM_CONTROL_2 0XC7
-#define L2_CMD_NV_MEMORY_WRITE 0XD0
-#define L2_CMD_NV_MEMORY_PROTECTION_KEY 0XD1
-#define L2_CMD_NV_MEMORY_STATUS_READ 0XD2
-#define L2_CMD_READ_ID4 0XD3
-#define L2_CMD_POSITIVE_GAMMA_CORRECTION 0XE0
-#define L2_CMD_NEGATIVE_GAMMA_CORRECTION 0XE1
-#define L2_CMD_DIGITAL_GAMMA_CONTROL_1 0XE2
-#define L2_CMD_DIGITAL_GAMMA_CONTROL_2 0XE3
-#define L2_CMD_INTERFACE_CONTROL 0XF6
-
-
-
-/*
- The LCD needs a bunch of command/argument values to be initialized. They are stored in this struct.
-*/
-typedef struct {
-    uint8_t cmd;
-    uint8_t data[16];
-    uint8_t databytes; //No of data in data; bit 7 = delay after set; 0xFF = end of cmds.
-} lcd_init_cmd_t;
-
-
-
-static const lcd_init_cmd_t ili_init_cmds[]={
-    /* Power contorl B, power control = 0, DC_ENA = 1 */
-    {0xCF, {0x00, 0x83, 0X30}, 3},
-    /* Power on sequence control,
-     * cp1 keeps 1 frame, 1st frame enable
-     * vcl = 0, ddvdh=3, vgh=1, vgl=2
-     * DDVDH_ENH=1
-     */
-    {0xED, {0x64, 0x03, 0X12, 0X81}, 4},
-    /* Driver timing control A,
-     * non-overlap=default +1
-     * EQ=default - 1, CR=default
-     * pre-charge=default - 1
-     */
-    {0xE8, {0x85, 0x01, 0x79}, 3},
-    /* Power control A, Vcore=1.6V, DDVDH=5.6V */
-    {0xCB, {0x39, 0x2C, 0x00, 0x34, 0x02}, 5},
-    /* Pump ratio control, DDVDH=2xVCl */
-    {0xF7, {0x20}, 1},
-    /* Driver timing control, all=0 unit */
-    {0xEA, {0x00, 0x00}, 2},
-    /* Power control 1, GVDD=4.75V */
-    {0xC0, {0x26}, 1},
-    /* Power control 2, DDVDH=VCl*2, VGH=VCl*7, VGL=-VCl*3 */
-    {0xC1, {0x11}, 1},
-    /* VCOM control 1, VCOMH=4.025V, VCOML=-0.950V */
-    {0xC5, {0x35, 0x3E}, 2},
-    /* VCOM control 2, VCOMH=VMH-2, VCOML=VML-2 */
-    {0xC7, {0xBE}, 1},
-    /* Memory access contorl, MX=MY=0, MV=1, ML=0, BGR=1, MH=0 */
-    {0x36, {0x28}, 1},
-    /* Pixel format, 16bits/pixel for RGB/MCU interface */
-    {0x3A, {0x55}, 1},
-    /* Frame rate control, f=fosc, 70Hz fps */
-    {0xB1, {0x00, 0x1B}, 2},
-    /* Enable 3G, disabled */
-    {0xF2, {0x08}, 1},
-    /* Gamma set, curve 1 */
-    {0x26, {0x01}, 1},
-    /* Positive gamma correction */
-    {0xE0, {0x1F, 0x1A, 0x18, 0x0A, 0x0F, 0x06, 0x45, 0X87, 0x32, 0x0A, 0x07, 0x02, 0x07, 0x05, 0x00}, 15},
-    /* Negative gamma correction */
-    {0XE1, {0x00, 0x25, 0x27, 0x05, 0x10, 0x09, 0x3A, 0x78, 0x4D, 0x05, 0x18, 0x0D, 0x38, 0x3A, 0x1F}, 15},
-    /* Column address set, SC=0, EC=0xEF */
-    {0x2A, {0x00, 0x00, 0x00, 0xEF}, 4},
-    /* Page address set, SP=0, EP=0x013F */
-    {0x2B, {0x00, 0x00, 0x01, 0x3f}, 4},
-    /* Memory write */
-    {0x2C, {0}, 0},
-    /* Entry mode set, Low vol detect disabled, normal display */
-    {0xB7, {0x07}, 1},
-    /* Display function control */
-    {0xB6, {0x0A, 0x82, 0x27, 0x00}, 4},
-    /* Sleep out */
-    {0x11, {0}, 0x80},
-    /* Display on */
-    {0x29, {0}, 0x80},
-    {0, {0}, 0xff},
-};
-
-//To speed up transfers, every SPI transfer sends a bunch of lines. This define specifies how many. More means more memory use,
-//but less overhead for setting up / finishing transfers. Make sure 240 is dividable by this.
-#define PARALLEL_LINES 16
+enum { ILI9341, ILI9341_24 };	//ILI9341_24 for future use...
 
 struct PrivateSpace {
 	uint8_t *iRAM, *Shadowbuffer;
-	uint8_t ReMap, PageSize;
-	uint8_t Offset;
+	struct {
+		uint16_t Height, Width;
+	} Offset;
+	uint8_t MADCtl, PageSize;
+	uint8_t Model;
 };
 
 // Functions are not declared to minimize # of lines
 
-static void WriteDataByte( struct GDS_Device* Device, uint8_t Data ) {
-	Device->WriteData( Device, &Data, 1);
+static void WriteByte( struct GDS_Device* Device, uint8_t Data ) {
+	Device->WriteData( Device, &Data, 1 );
 }
 
-static void SetColumnAddress( struct GDS_Device* Device, uint8_t Start, uint8_t End ) {
-	Device->WriteCommand( Device, L1_CMD_COLUMN_ADDRESS_SET );
-	Device->WriteData( Device, &Start, 1 );
-	Device->WriteData( Device, &End, 1 );
-}
-static void SetRowAddress( struct GDS_Device* Device, uint8_t Start, uint8_t End ) {
-	Device->WriteCommand( Device, L1_CMD_PAGE_ADDRESS_SET );
-	Device->WriteData( Device, &Start, 1 );
-	Device->WriteData( Device, &End, 1 );
+static void SetColumnAddress( struct GDS_Device* Device, uint16_t Start, uint16_t End ) {
+	uint32_t Addr = __builtin_bswap16(Start) | (__builtin_bswap16(End) << 16);
+	Device->WriteCommand( Device, 0x2A );
+	Device->WriteData( Device, (uint8_t*) &Addr, 4 );
 }
 
+static void SetRowAddress( struct GDS_Device* Device, uint16_t Start, uint16_t End ) {
+	uint32_t Addr = __builtin_bswap16(Start) | (__builtin_bswap16(End) << 16);
+	Device->WriteCommand( Device, 0x2B );
+	Device->WriteData( Device, (uint8_t*) &Addr, 4 );
+}
 
-
-static void Update( struct GDS_Device* Device ) {
+static void Update16( struct GDS_Device* Device ) {
 	struct PrivateSpace *Private = (struct PrivateSpace*) Device->Private;
 		
-	//SetColumnAddress( Device, Private->Offset, Private->Offset + Device->Width / 4 - 1);
-	SetColumnAddress( Device, Private->Offset, Private->Offset + Device->Width - 1);
-	
 #ifdef SHADOW_BUFFER
-	uint16_t *optr = (uint16_t*) Private->Shadowbuffer, *iptr = (uint16_t*) Device->Framebuffer;
-	bool dirty = false;
+	uint32_t *optr = (uint32_t*) Private->Shadowbuffer, *iptr = (uint32_t*) Device->Framebuffer;
+	int FirstCol = Device->Width / 2, LastCol = 0, FirstRow = -1, LastRow = 0;  
 	
-	for (int r = 0, page = 0; r < Device->Height; r++) {
-		// look for change and update shadow (cheap optimization = width always / by 2)
-		for (int c = Device->Width / 2 / 2; --c >= 0;) {
+	for (int r = 0; r < Device->Height; r++) {
+		// look for change and update shadow (cheap optimization = width is always a multiple of 2)
+		for (int c = 0; c < Device->Width / 2; c++, iptr++, optr++) {
 			if (*optr != *iptr) {
-				dirty = true;
 				*optr = *iptr;
+				if (c < FirstCol) FirstCol = c;	
+				if (c > LastCol) LastCol = c;
+				if (FirstRow < 0) FirstRow = r;
+				LastRow = r;
 			}
-			iptr++; optr++;
 		}
+
+		// wait for a large enough window - careful that window size might increase by more than a line at once !
+		if (FirstRow < 0 || ((LastCol - FirstCol + 1) * (r - FirstRow + 1) * 4 < PAGE_BLOCK && r != Device->Height - 1)) continue;
 		
-		// one line done, check for page boundary
-		if (++page == Private->PageSize) {
-			if (dirty) {
-				uint16_t *optr = (uint16_t*) Private->iRAM, *iptr = (uint16_t*) (Private->Shadowbuffer + (r - page + 1) * Device->Width / 2);
-				SetRowAddress( Device, r - page + 1, r );
-				for (int i = page * Device->Width / 2 / 2; --i >= 0; iptr++) *optr++ = (*iptr >> 8) | (*iptr << 8);
-				//memcpy(Private->iRAM, Private->Shadowbuffer + (r - page + 1) * Device->Width / 2, page * Device->Width / 2 );
-				Device->WriteCommand( Device, 0x5c );
-				Device->WriteData( Device, Private->iRAM, Device->Width * page / 2 );
-				dirty = false;
-			}	
-			page = 0;
+		FirstCol *= 2;
+		LastCol = LastCol * 2 + 1;
+		SetRowAddress( Device, FirstRow + Private->Offset.Height, LastRow + Private->Offset.Height);
+		SetColumnAddress( Device, FirstCol + Private->Offset.Width, LastCol + Private->Offset.Width );
+		Device->WriteCommand( Device, ENABLE_WRITE );
+			
+		int ChunkSize = (LastCol - FirstCol + 1) * 2;
+			
+		// own use of IRAM has not proven to be much better than letting SPI do its copy
+		if (Private->iRAM) {
+			uint8_t *optr = Private->iRAM;
+			for (int i = FirstRow; i <= LastRow; i++) {
+				memcpy(optr, Private->Shadowbuffer + (i * Device->Width + FirstCol) * 2, ChunkSize);
+				optr += ChunkSize;
+				if (optr - Private->iRAM <= (PAGE_BLOCK - ChunkSize) && i < LastRow) continue;
+				Device->WriteData(Device, Private->iRAM, optr - Private->iRAM);
+				optr = Private->iRAM;
+			}
+		} else for (int i = FirstRow; i <= LastRow; i++) {
+			Device->WriteData( Device, Private->Shadowbuffer + (i * Device->Width + FirstCol) * 2, ChunkSize );
 		}	
+
+		FirstCol = Device->Width / 2; LastCol = 0;
+		FirstRow = -1;
 	}	
 #else
-	for (int r = 0; r < Device->Height; r += Private->PageSize) {
-		SetRowAddress( Device, r, r + Private->PageSize - 1 );
-		Device->WriteCommand( Device, L1_CMD_MEMORY_WRITE );
+	// always update by full lines
+	SetColumnAddress( Device, Private->Offset.Width, Device->Width - 1);
+	
+	for (int r = 0; r < Device->Height; r += min(Private->PageSize, Device->Height - r)) {
+		int Height = min(Private->PageSize, Device->Height - r);
+		
+		SetRowAddress( Device, Private->Offset.Height + r, Private->Offset.Height + r + Height - 1 );
+		Device->WriteCommand(Device, ENABLE_WRITE);
+		
 		if (Private->iRAM) {
-			uint16_t *optr = (uint16_t*) Private->iRAM, *iptr = (uint16_t*) (Device->Framebuffer + r * Device->Width / 2);
-			for (int i = Private->PageSize * Device->Width / 2 / 2; --i >= 0; iptr++) *optr++ = (*iptr >> 8) | (*iptr << 8);
-			//memcpy(Private->iRAM, Device->Framebuffer + r * Device->Width / 2, Private->PageSize * Device->Width / 2 );
-			Device->WriteData( Device, Private->iRAM, Private->PageSize * Device->Width / 2 );
+			memcpy(Private->iRAM, Device->Framebuffer + r * Device->Width * 2, Height * Device->Width * 2 );
+			Device->WriteData( Device, Private->iRAM, Height * Device->Width * 2 );
 		} else	{
-			Device->WriteData( Device, Device->Framebuffer + r * Device->Width / 2, Private->PageSize * Device->Width / 2 );
+			Device->WriteData( Device, Device->Framebuffer + r * Device->Width * 2, Height * Device->Width * 2 );
 		}	
 	}	
 #endif	
 }
 
-//Bit 	Name 						Description
-//---	---------------------------	------------------------------------------------------
-//MY  	Row Address Order 	 		MCU to memory write/read direction.
-//MX 	Column Address Order 		MCU to memory write/read direction.
-//MV 	Row / Column Exchange 		MCU to memory write/read direction.
-//ML 	Vertical Refresh Order 		LCD vertical refresh direction control.
-//BGR 	RGB-BGR Order 				Color selector switch control
-//									(0=RGB color filter panel, 1=BGR color filter panel)
-//MH 	Horizontal Refresh ORDER 	LCD horizontal refreshing direction control.
-// Bits 17-0
-//		XX XX XX XX XX XX XX XX XX XX MY MX MV ML BGR MH 0 0
-typedef enum  {
-	MAC_BIT_MH=2,
-	MAC_BIT_BGR,
-	MAC_BIT_ML,
-	MAC_BIT_MV,
-	MAC_BIT_MX,
-	MAC_BIT_MY,
-} mac_bits;
+static void Update24( struct GDS_Device* Device ) {
+	struct PrivateSpace *Private = (struct PrivateSpace*) Device->Private;
+		
+#ifdef SHADOW_BUFFER
+	uint16_t *optr = (uint16_t*) Private->Shadowbuffer, *iptr = (uint16_t*) Device->Framebuffer;
+	int FirstCol = (Device->Width * 3) / 2, LastCol = 0, FirstRow = -1, LastRow = 0;  
 
-uint16_t set_mac_bit(mac_bits bit, uint16_t val){
-	return (1 << bit) | val;
-}
-uint16_t unset_mac_bit(mac_bits bit, uint16_t val){
-	return ~(1 << bit) & val;
+	for (int r = 0; r < Device->Height; r++) {
+		// look for change and update shadow (cheap optimization = width always / by 2)
+		for (int c = 0; c < (Device->Width * 3) / 2; c++, optr++, iptr++) {
+			if (*optr != *iptr) {
+				*optr = *iptr;
+				if (c < FirstCol) FirstCol = c;	
+				if (c > LastCol) LastCol = c;
+				if (FirstRow < 0) FirstRow = r;
+				LastRow = r;
+			}
+		}
+
+		// do we have enough to send (cols are divided by 3/2)
+		if (FirstRow < 0 || ((((LastCol - FirstCol + 1) * 2 ) / 3) * (r - FirstRow + 1) * 4 < PAGE_BLOCK && r != Device->Height - 1)) continue;
+		
+		FirstCol = (FirstCol * 2) / 3;
+		LastCol = (LastCol * 2 + 1 ) / 3; 
+		SetRowAddress( Device, FirstRow + Private->Offset.Height, LastRow + Private->Offset.Height);
+		SetColumnAddress( Device, FirstCol + Private->Offset.Width, LastCol + Private->Offset.Width );
+		Device->WriteCommand( Device, ENABLE_WRITE );
+			
+		int ChunkSize = (LastCol - FirstCol + 1) * 3;
+					
+		// own use of IRAM has not proven to be much better than letting SPI do its copy
+		if (Private->iRAM) {
+			uint8_t *optr = Private->iRAM;
+			for (int i = FirstRow; i <= LastRow; i++) {
+				memcpy(optr, Private->Shadowbuffer + (i * Device->Width + FirstCol) * 3, ChunkSize);
+				optr += ChunkSize;
+				if (optr - Private->iRAM <= (PAGE_BLOCK - ChunkSize) && i < LastRow) continue;
+				Device->WriteData(Device, Private->iRAM, optr - Private->iRAM);
+				optr = Private->iRAM;
+			}	
+		} else for (int i = FirstRow; i <= LastRow; i++) {
+			Device->WriteData( Device, Private->Shadowbuffer + (i * Device->Width + FirstCol) * 3, ChunkSize );
+		}	
+
+		FirstCol = (Device->Width * 3) / 2; LastCol = 0;
+		FirstRow = -1;
+	}	
+#else
+	// always update by full lines
+	SetColumnAddress( Device, Private->Offset.Width, Device->Width - 1);
+	
+	for (int r = 0; r < Device->Height; r += min(Private->PageSize, Device->Height - r)) {
+		int Height = min(Private->PageSize, Device->Height - r);
+		
+		SetRowAddress( Device, Private->Offset.Height + r, Private->Offset.Height + r + Height - 1 );
+		Device->WriteCommand(Device, ENABLE_WRITE);
+		
+		if (Private->iRAM) {
+			memcpy(Private->iRAM, Device->Framebuffer + r * Device->Width * 3, Height * Device->Width * 3 );
+			Device->WriteData( Device, Private->iRAM, Height * Device->Width * 3 );
+		} else	{
+			Device->WriteData( Device, Device->Framebuffer + r * Device->Width * 3, Height * Device->Width * 3 );
+		}	
+	}	
+#endif	
 }
 
 static void SetLayout( struct GDS_Device* Device, bool HFlip, bool VFlip, bool Rotate ) { 
 	struct PrivateSpace *Private = (struct PrivateSpace*) Device->Private;
-	Private->ReMap = HFlip ? (Private->ReMap & ~(1 << MAC_BIT_MX)) : (Private->ReMap | (1 << MAC_BIT_MX));
-	Private->ReMap = VFlip ? (Private->ReMap | (1 << MAC_BIT_MY)) : (Private->ReMap & ~(1 << MAC_BIT_MY));
-	Device->WriteCommand( Device, L1_CMD_MEMORY_ACCESS_CONTROL );
-	Device->WriteData( Device, &Private->ReMap, 1 );
-	WriteDataByte(Device,0x00);
+	ESP_LOGI(TAG, "SetLayout 197 HFlip=%d VFlip=%d Rotate=%d (1=true)", HFlip, VFlip, Rotate);
+	//        D/CX RDX WRX D17-8 D7 D6 D5 D4 D3  D2 D1 D0 HEX
+	//Command   0   1   ↑    XX  0  0  1  1  0   1  1  0  36h
+	//Parameter 1   1   ↑    XX  MY MX MV ML BGR MH 0  0  00
+	//Orientation 0: MADCtl = 0x80  =   1000 0000 (MY=1)
+	if ((Device->Height)>(Device->Width)){		//Resolution = 320x240
+		Private->MADCtl = (1 << 7);				// 0x80 = default (no Rotation an no Flip)
+		if (HFlip) {							//Flip Horizontal
+			int a = Private->MADCtl;
+			Private->MADCtl = (a ^ (1 << 7));
+		}
+		if (Rotate) {							//Rotate 180 degr.
+			int a = Private->MADCtl;
+			a = (a ^ (1 << 7));
+			Private->MADCtl = (a ^ (1 << 6));
+		}
+		if (VFlip) {							//Flip Vertical
+			int a = Private->MADCtl;
+			Private->MADCtl = (a ^ (1 << 6));
+		}
+	} else {									//Resolution = 240x320
+		Private->MADCtl = (1 << 5);				// 0x20 = default (no Rotation an no Flip)
+		if (HFlip) {							//Flip Horizontal
+			int a = Private->MADCtl;
+			Private->MADCtl = (a ^ (1 << 6));
+		}
+		if (Rotate) {							//Rotate 180 degr.
+			int a = Private->MADCtl;
+			a = (a ^ (1 << 7));
+			Private->MADCtl = (a ^ (1 << 6));
+		}
+		if (VFlip) {							//Flip Vertical
+			int a = Private->MADCtl;
+			Private->MADCtl = (a ^ (1 << 7));
+		}
+	}
+
+	ESP_LOGI(TAG, "SetLayout 255 Private->MADCtl=%hhu", Private->MADCtl);
+
+	Device->WriteCommand( Device, 0x36 );
+	WriteByte( Device, Private->MADCtl );
+
+#ifdef SHADOW_BUFFER
+	// force a full refresh (almost ...)
+	memset(Private->Shadowbuffer, 0xAA, Device->FramebufferSize);
+#endif	
 }	
 
-static void DisplayOn( struct GDS_Device* Device ) { Device->WriteCommand( Device, L1_CMD_DISPLAY_ON ); }
-static void DisplayOff( struct GDS_Device* Device ) { Device->WriteCommand( Device, L1_CMD_DISPLAY_OFF ); }
+static void DisplayOn( struct GDS_Device* Device ) { Device->WriteCommand( Device, 0x29 ); }	//DISPON =0x29
+static void DisplayOff( struct GDS_Device* Device ) { Device->WriteCommand( Device, 0x28 ); }	//DISPOFF=0x28
 
 static void SetContrast( struct GDS_Device* Device, uint8_t Contrast ) {
-    Device->WriteCommand( Device, L1_CMD_WRITE_DISPLAY_BRIGHTNESS );
-    uint8_t loc_contrast =  (uint8_t)((float)Contrast/5.0f*  255.0f);
-    Device->WriteData( Device, &loc_contrast , 1 );
-    WriteDataByte(Device,0x00);
+	Device->WriteCommand( Device, 0x51 );
+	WriteByte( Device, Contrast );
+	
+	Device->SetContrast = NULL;
+	GDS_SetContrast( Device, Contrast );
+	Device->SetContrast = SetContrast;	// 0x00 value means the lowest brightness and 0xFF value means the highest brightness.
 }
 
 static bool Init( struct GDS_Device* Device ) {
 	struct PrivateSpace *Private = (struct PrivateSpace*) Device->Private;
+	int Depth = (Device->Depth + 8 - 1) / 8;
 	
+	Private->PageSize = min(8, PAGE_BLOCK / (Device->Width * Depth));
 
-//	Private->Offset = (480 - Device->Width) / 4 / 2;
-	
-	// find a page size that is not too small is an integer of height
-	Private->PageSize = min(8, PAGE_BLOCK / (Device->Width / 2));
-	Private->PageSize = Device->Height / (Device->Height / Private->PageSize) ;
-	
 #ifdef SHADOW_BUFFER	
-//	Private->Shadowbuffer = malloc( Device->FramebufferSize );
-//	memset(Private->Shadowbuffer, 0xFF, Device->FramebufferSize);
+	Private->Shadowbuffer = malloc( Device->FramebufferSize );	
+	memset(Private->Shadowbuffer, 0xFF, Device->FramebufferSize);
+#endif
+#ifdef USE_IRAM
+	Private->iRAM = heap_caps_malloc( (Private->PageSize + 1) * Device->Width * Depth, MALLOC_CAP_INTERNAL | MALLOC_CAP_DMA );
 #endif
-	Private->iRAM =NULL;
-	//Private->iRAM =heap_caps_malloc(320*PARALLEL_LINES*sizeof(uint16_t), MALLOC_CAP_DMA);
 
-
-	//ESP_LOGI(TAG, "ILI9341 with offset %u, page %u, iRAM %p", Private->Offset, Private->PageSize, Private->iRAM);
-	ESP_LOGI(TAG, "ILI9341 ");
-
-	// need to be off and disable display RAM
-	Device->DisplayOff( Device );
-	int cmd=0;
-	//Send all the commands
-	while (ili_init_cmds[cmd].databytes!=0xff) {
-		Device->WriteCommand( Device, ili_init_cmds[cmd].cmd );
-		Device->WriteData(Device,ili_init_cmds[cmd].data,ili_init_cmds[cmd].databytes&0x1F);
-		if (ili_init_cmds[cmd].databytes&0x80) {
-			vTaskDelay(100 / portTICK_RATE_MS);
-		}
-		cmd++;
-	}
+	ESP_LOGI(TAG, "ILI9341 with bit default-depth %u, page %u, iRAM %p", Device->Depth, Private->PageSize, Private->iRAM);
 	
+	// Sleepout + Booster
+	Device->WriteCommand( Device, 0x11 );
+			
+	// set flip modes & contrast
+	GDS_SetContrast( Device, 0x7f );
+	Device->SetLayout( Device, false, false, false );
+	
+	// set screen depth (16/18) *** INTERFACE PIXEL FORMAT: 0x66=18 bit; 0x55=16 bit
+	Device->WriteCommand( Device, 0x3A );
+	if (Private->Model == ILI9341_24) WriteByte( Device, Device->Depth == 24 ? 0x66 : 0x55 );
+	else WriteByte( Device, Device->Depth == 24 ? 0x66 : 0x55 );
+
+	ESP_LOGI(TAG, "ILI9341_Init 312 device-depth %u, 0x66/0x55=0x%X", Device->Depth, Device->Depth == 24 ? 0x66 : 0x55);
+
+	// no Display Inversion (INVOFF=0x20 INVON=0x21)
+	Device->WriteCommand( Device, 0x20 );
+
+	//Gamma Correction: Enable next two line and enabel one of the Test0x Section... or build you own 15 Parameter...
+	Device->WriteCommand( Device, 0xF2 ); WriteByte( Device, 0x03 );	// 3Gamma Function: Disable = default (0x02), Enable (0x03)
+	Device->WriteCommand( Device, 0x26 ); WriteByte( Device, 0x01 );	// Gamma curve selected (0x01, 0x02, 0x04, 0x08) - A maximum of 4 fixed gamma curves can be selected
+	//Gamma Correction Test01
+	Device->WriteCommand( Device, 0xE0 );								// Positive Gamma Correction (15 Parameter)
+	WriteByte( Device, 0x0F ); WriteByte( Device, 0x31 ); WriteByte( Device, 0x2B ); WriteByte( Device, 0x0C ); WriteByte( Device, 0x0E );
+	WriteByte( Device, 0x08 ); WriteByte( Device, 0x4E ); WriteByte( Device, 0xF1 ); WriteByte( Device, 0x37 ); WriteByte( Device, 0x07 );
+	WriteByte( Device, 0x10 ); WriteByte( Device, 0x03 ); WriteByte( Device, 0x0E ); WriteByte( Device, 0x09 ); WriteByte( Device, 0x00 );
+	Device->WriteCommand( Device, 0xE1 ); 								// Negative Gamma Correction (15 Parameter)
+	WriteByte( Device, 0x00 ); WriteByte( Device, 0x0E ); WriteByte( Device, 0x14 ); WriteByte( Device, 0x03 ); WriteByte( Device, 0x11 );
+	WriteByte( Device, 0x07 ); WriteByte( Device, 0x31 ); WriteByte( Device, 0xC1 ); WriteByte( Device, 0x48 ); WriteByte( Device, 0x08 );
+	WriteByte( Device, 0x0F ); WriteByte( Device, 0x0C ); WriteByte( Device, 0x31 ); WriteByte( Device, 0x36 ); WriteByte( Device, 0x0F );
+	 
 	// gone with the wind
 	Device->DisplayOn( Device );
 	Device->Update( Device );
-	
+
 	return true;
 }	
 
-static const struct GDS_Device ILI9341 = {
-	.DisplayOn = DisplayOn, .DisplayOff = DisplayOff, .SetContrast = SetContrast,
+static const struct GDS_Device ILI9341_X = {
+	.DisplayOn = DisplayOn, .DisplayOff = DisplayOff,
 	.SetLayout = SetLayout,
-	.Update = Update, .Init = Init,
-};	
+	.Update = Update16, .Init = Init,
+	.Mode = GDS_RGB565, .Depth = 16,
+};		
 
 struct GDS_Device* ILI9341_Detect(char *Driver, struct GDS_Device* Device) {
-	if (!strcasestr(Driver, "ILI9341")) return NULL;
+	uint8_t Model;
+	int Depth=16;		// 16bit colordepth
+	
+	if (strcasestr(Driver, "ILI9341")) Model = ILI9341;
+	else if (strcasestr(Driver, "ILI9341_24")) Model = ILI9341_24;	//for future use...
+	else return NULL;
 		
 	if (!Device) Device = calloc(1, sizeof(struct GDS_Device));
-	
-	*Device = ILI9341;
-	Device->Depth = 4;
 		
+	*Device = ILI9341_X;	
+	sscanf(Driver, "%*[^:]:%u", &Depth);		// NVS-Parameter driver=ILI9341[:16|18]
+	struct PrivateSpace* Private = (struct PrivateSpace*) Device->Private;
+	Private->Model = Model;
+		ESP_LOGI(TAG, "ILI9341_Detect 391 Driver= %s   Depth=%d", Driver, Depth);
+
+	if (Depth == 18) {
+		Device->Mode = GDS_RGB888;
+		Device->Depth = 24;
+		Device->Update = Update24;
+	} 	
+	
+	if (Model == ILI9341_24) Device->SetContrast = SetContrast;
+
 	return Device;
-}
-
-
+}

components/display/SSD1322.c

@@ -147,23 +147,28 @@ static bool Init( struct GDS_Device* Device ) {
 	Private->ReMap = 0;
 	Device->SetLayout( Device, false, false, false);
 	
+	// set Display Enhancement
+    Device->WriteCommand( Device, 0xB4 );
+	WriteDataByte( Device, 0xA0 );
+	WriteDataByte( Device, 0xB5 );
+	
 	// set Clocks
     Device->WriteCommand( Device, 0xB3 );
-	WriteDataByte( Device, 0x91 );
+	WriteDataByte( Device, 0xB2 ); // 0x91 seems to be common but is too slow for 5.5'
 	
 	// set MUX
 	Device->WriteCommand( Device, 0xCA );
 	WriteDataByte( Device, Device->Height - 1 );
 	
-	// phase 1 & 2 period (needed?)	
+	// phase 1 & 2 period
 	Device->WriteCommand( Device, 0xB1 );
-	WriteDataByte( Device, 0xE2 );
+	WriteDataByte( Device, 0xE3 );	// 0xE2 was recommended
 	
-	// set pre-charge V (needed?°)
+	// set pre-charge V 
 	Device->WriteCommand( Device, 0xBB );
-	WriteDataByte( Device, 0x1F );
+	WriteDataByte( Device, 0x0F); // 0x1F causes column interferences 
 	
-	// set COM deselect voltage (needed?)
+	// set COM deselect voltage
 	Device->WriteCommand( Device, 0xBE );
 	WriteDataByte( Device, 0x07 );
 	

components/display/display.c

@@ -60,8 +60,8 @@ static const char *known_drivers[] = {"SH1106",
 static void displayer_task(void *args);
 
 struct GDS_Device *display;   
-extern GDS_DetectFunc SSD1306_Detect, SSD132x_Detect, SH1106_Detect, SSD1675_Detect, SSD1322_Detect, SSD1351_Detect, ST77xx_Detect;
-GDS_DetectFunc *drivers[] = { SH1106_Detect, SSD1306_Detect, SSD132x_Detect, SSD1675_Detect, SSD1322_Detect, SSD1351_Detect, ST77xx_Detect, NULL };
+extern GDS_DetectFunc SSD1306_Detect, SSD132x_Detect, SH1106_Detect, SSD1675_Detect, SSD1322_Detect, SSD1351_Detect, ST77xx_Detect, ILI9341_Detect;
+GDS_DetectFunc *drivers[] = { SH1106_Detect, SSD1306_Detect, SSD132x_Detect, SSD1675_Detect, SSD1322_Detect, SSD1351_Detect, ST77xx_Detect, ILI9341_Detect, NULL };
 
 /****************************************************************************************
  * 
@@ -84,8 +84,8 @@ void display_init(char *welcome) {
 		display = GDS_AutoDetect(drivername, drivers, &PWMConfig);
 	} else {
 		display = GDS_AutoDetect(drivername, drivers, NULL);
-	}	
-		
+	}
+
 	// so far so good
 	if (display && width > 0 && height > 0) {
 		int RST_pin = -1;

components/driver_bt/bt_app_sink.c

@@ -558,7 +558,7 @@ void bt_sink_init(bt_cmd_vcb_t cmd_cb, bt_data_cb_t data_cb)
 	cmd_handler_chain = cmd_cb;
   	bt_app_a2d_data_cb = data_cb;
 	
-    ESP_ERROR_CHECK(esp_bt_controller_mem_release(ESP_BT_MODE_BLE));
+    esp_bt_controller_mem_release(ESP_BT_MODE_BLE);
 
     esp_bt_controller_config_t bt_cfg = BT_CONTROLLER_INIT_CONFIG_DEFAULT();
     if ((err = esp_bt_controller_init(&bt_cfg)) != ESP_OK) {

components/driver_bt/bt_app_source.c

@@ -189,13 +189,13 @@ static void peers_list_maintain(const char * s_peer_bdname, int32_t rssi){
         free(list_json);
     }    
 }
-        
+
 int bt_app_source_get_a2d_state(){
-    ESP_LOGW(TAG,"a2dp status: %u = %s", bt_app_source_a2d_state, APP_AV_STATE_DESC[bt_app_source_a2d_state]);
+    ESP_LOGD(TAG,"a2dp status: %u = %s", bt_app_source_a2d_state, APP_AV_STATE_DESC[bt_app_source_a2d_state]);
     return bt_app_source_a2d_state;
 }
 int bt_app_source_get_media_state(){
-    ESP_LOGW(TAG,"media state : %u ", bt_app_source_media_state);
+    ESP_LOGD(TAG,"media state : %u ", bt_app_source_media_state);
     return bt_app_source_media_state;
 }
 void set_app_source_state(int new_state){

components/platform_console/cmd_config.c

@@ -139,7 +139,6 @@ static struct {
 	//			   "   \t\t\t b = basic linear interpolation, l = 13 taps, m = 21 taps, i = interpolate filter coefficients\n"
 	#endif
 	struct arg_int * rate;//			   "  -Z <rate>\t\tReport rate to server in helo as the maximum sample rate we can support\n"
-
     struct arg_end *end;
 } squeezelite_args;
 
@@ -266,7 +265,6 @@ char * strip_bt_name(char * opt_str)
             pch = strtok(NULL, " ");
             ESP_LOGV(TAG,"\n");
         }
-      
     }
     else
     {

components/raop/rtp.c

@@ -168,7 +168,7 @@ static void 	rtp_thread_func(void *arg);
 #endif	
 
 /*---------------------------------------------------------------------------*/
-static struct alac_codec_s* alac_init(int fmtp[32]) {
+static struct alac_codec_s* alac_init(int fmtp[32]) {
 	struct alac_codec_s *alac;
 	unsigned sample_rate, block_size;
 	unsigned char sample_size, channels;
@@ -196,7 +196,7 @@ static struct alac_codec_s* alac_init(int fmtp[32]) {
 	config.maxRun = htons(fmtp[8]);
 	config.maxFrameBytes = htonl(fmtp[9]);
 	config.avgBitRate = htonl(fmtp[10]);
-	config.sampleRate = htonl(fmtp[11]);
+	config.sampleRate = htonl(fmtp[11]);
 
 	alac = alac_create_decoder(sizeof(config), (unsigned char*) &config, &sample_size, &sample_rate, &channels, &block_size);
 	if (!alac) {

components/services/audio_controls.c

@@ -56,9 +56,10 @@ static const actrls_config_map_t actrls_config_map[] =
 
 // BEWARE: the actions below need to stay aligned with the corresponding enum to properly support json parsing
 #define EP(x) [x] = #x  /* ENUM PRINT */
-static const char * actrls_action_s[ ] = { EP(ACTRLS_VOLUP),EP(ACTRLS_VOLDOWN),EP(ACTRLS_TOGGLE),EP(ACTRLS_PLAY),
+static const char * actrls_action_s[ ] = { EP(ACTRLS_POWER),EP(ACTRLS_VOLUP),EP(ACTRLS_VOLDOWN),EP(ACTRLS_TOGGLE),EP(ACTRLS_PLAY),
 									EP(ACTRLS_PAUSE),EP(ACTRLS_STOP),EP(ACTRLS_REW),EP(ACTRLS_FWD),EP(ACTRLS_PREV),EP(ACTRLS_NEXT),
 									EP(BCTRLS_UP),EP(BCTRLS_DOWN),EP(BCTRLS_LEFT),EP(BCTRLS_RIGHT), 
+									EP(BCTRLS_PS1),EP(BCTRLS_PS2),EP(BCTRLS_PS3),EP(BCTRLS_PS4),EP(BCTRLS_PS5),EP(BCTRLS_PS6),
 									EP(KNOB_LEFT),EP(KNOB_RIGHT),EP(KNOB_PUSH),
 									""} ;
 									

components/services/audio_controls.h

@@ -11,9 +11,10 @@
 #include "buttons.h"
 
 // BEWARE: this is the index of the array of action below (change actrls_action_s as well!)
-typedef enum { 	ACTRLS_NONE = -1, ACTRLS_VOLUP, ACTRLS_VOLDOWN, ACTRLS_TOGGLE, ACTRLS_PLAY, 
+typedef enum { 	ACTRLS_NONE = -1, ACTRLS_POWER,ACTRLS_VOLUP, ACTRLS_VOLDOWN, ACTRLS_TOGGLE, ACTRLS_PLAY, 
 				ACTRLS_PAUSE, ACTRLS_STOP, ACTRLS_REW, ACTRLS_FWD, ACTRLS_PREV, ACTRLS_NEXT, 
 				BCTRLS_UP, BCTRLS_DOWN, BCTRLS_LEFT, BCTRLS_RIGHT, 
+				BCTRLS_PS1,BCTRLS_PS2,BCTRLS_PS3,BCTRLS_PS4,BCTRLS_PS5,BCTRLS_PS6,
 				KNOB_LEFT, KNOB_RIGHT, KNOB_PUSH,
 				ACTRLS_REMAP, ACTRLS_MAX 
 		} actrls_action_e;

components/services/messaging.c

@@ -120,6 +120,7 @@ const char * messaging_get_class_desc(messaging_classes msg_class){
 	CASE_TO_STR(MESSAGING_CLASS_SYSTEM);
 	CASE_TO_STR(MESSAGING_CLASS_STATS);
 	CASE_TO_STR(MESSAGING_CLASS_CFGCMD);
+	CASE_TO_STR(MESSAGING_CLASS_BT);
 		default:
 			return "Unknown";
 			break;

components/squeezelite/alac.c

@@ -21,7 +21,7 @@
 
 #include "squeezelite.h"
 
-#include <alac_wrapper.h>
+#include "alac_wrapper.h"
 
 #if BYTES_PER_FRAME == 4		
 #define ALIGN8(n) 	(n << 8)		
@@ -119,8 +119,15 @@ static int read_mp4_header(void) {
 		// extract audio config from within alac
 		if (!strcmp(type, "alac") && bytes > len) {
 			u8_t *ptr = streambuf->readp + 36;
-			l->decoder = alac_create_decoder(len - 36, ptr, &l->sample_size, &l->sample_rate, &l->channels);
-			l->play = l->trak;
+			unsigned int block_size;
+			l->play = l->trak;						
+			l->decoder = alac_create_decoder(len - 36, ptr, &l->sample_size, &l->sample_rate, &l->channels, &block_size);
+			l->writebuf = malloc(block_size + 256);
+			LOG_INFO("allocated write buffer of %u bytes", block_size);
+			if (!l->writebuf) {
+				LOG_ERROR("allocation failed");
+				return -1;
+			}
 		}
 
 		// extract the total number of samples from stts
@@ -374,10 +381,9 @@ static decode_state alac_decode(void) {
 
 	// need to create a buffer with contiguous data
 	if (bytes < block_size) {
-		u8_t *buffer = malloc(block_size);
-		memcpy(buffer, streambuf->readp, bytes);
-		memcpy(buffer + bytes, streambuf->buf, block_size - bytes);
-		iptr = buffer;
+		iptr = malloc(block_size);
+		memcpy(iptr, streambuf->readp, bytes);
+		memcpy(iptr + bytes, streambuf->buf, block_size - bytes);
 	} else iptr = streambuf->readp;
 
 	if (!alac_to_pcm(l->decoder, iptr, l->writebuf, 2, &frames)) {
@@ -472,6 +478,7 @@ static decode_state alac_decode(void) {
 			}
 		} else if (l->sample_size == 16) {
 			u16_t *_iptr = (u16_t*) iptr;
+			iptr += count * 4;
 			while (count--) {
 				*optr++ = ALIGN16(*_iptr++);
 				*optr++ = ALIGN16(*_iptr++);
@@ -484,6 +491,7 @@ static decode_state alac_decode(void) {
 			}
 		} else if (l->sample_size == 32) {
 			u32_t *_iptr = (u32_t*) iptr;
+			iptr += count * 8;
 			while (count--) {
 				*optr++ = ALIGN32(*_iptr++);
 				*optr++ = ALIGN32(*_iptr++);
@@ -509,27 +517,17 @@ static decode_state alac_decode(void) {
 	return DECODE_RUNNING;
 }
 
-static void alac_open(u8_t size, u8_t rate, u8_t chan, u8_t endianness) {
-	if (l->decoder)	alac_delete_decoder(l->decoder);
-	else l->writebuf = malloc(BLOCK_SIZE * 2);
-	
-	if (l->chunkinfo) free(l->chunkinfo);
-	if (l->block_size) free(l->block_size);
-	if (l->stsc) free(l->stsc);
-	l->decoder = l->chunkinfo = l->stsc = l->block_size = NULL;
-	l->skip = 0;
-	l->samples = l->sttssamples = 0;
-	l->empty = false;
-	l->pos = l->consume = l->sample = l->nextchunk = 0;
-}
-
 static void alac_close(void) {
 	if (l->decoder) alac_delete_decoder(l->decoder);
+	if (l->writebuf) free(l->writebuf);	
 	if (l->chunkinfo) free(l->chunkinfo);
 	if (l->block_size) free(l->block_size);
 	if (l->stsc) free(l->stsc);
-	l->decoder = l->chunkinfo = l->stsc = l->block_size = NULL;
-	free(l->writebuf);
+	memset(l, 0, sizeof(struct alac));	
+}
+
+static void alac_open(u8_t size, u8_t rate, u8_t chan, u8_t endianness) {
+	alac_close();
 }
 
 struct codec *register_alac(void) {
@@ -543,13 +541,9 @@ struct codec *register_alac(void) {
 		alac_decode,    // decode
 	};
 	
-	l =  malloc(sizeof(struct alac));
-	if (!l) {
-		return NULL;
-	}	
-	
-	l->decoder = l->chunkinfo = l->stsc = l->block_size = NULL;
-	
+	l =  calloc(1, sizeof(struct alac));
+	if (!l) return NULL;
+		
 	LOG_INFO("using alac to decode alc");
 	return &ret;
 }

components/squeezelite/controls.c

@@ -97,22 +97,6 @@ static void sendIR(u16_t addr, u16_t cmd) {
 	UNLOCK_P;
 }
 
-static void lms_volume_up(bool pressed) {
-	if (raw_mode) {
-		sendBUTN(BUTN_VOLUP_FRONT, pressed);
-	} else {
-		cli_send_cmd("button volup");
-	}	
-}
-
-static void lms_volume_down(bool pressed) {
-	if (raw_mode) {
-		sendBUTN(BUTN_VOLDOWN_FRONT, pressed);
-	} else {
-		cli_send_cmd("button voldown");
-	}	
-}
-
 static void lms_toggle(bool pressed) {
 	if (raw_mode) {
 		sendBUTN(BUTN_PAUSE, pressed);
@@ -129,114 +113,56 @@ static void lms_pause(bool pressed) {
 	}	
 }
 
-static void lms_play(bool pressed) {
-	if (raw_mode) {
-		sendBUTN(BUTN_PLAY, pressed);
-	} else {
-		cli_send_cmd("button play.single");
-	}	
-}
-
 static void lms_stop(bool pressed) {
 	cli_send_cmd("button stop");
 }
 
-static void lms_rew(bool pressed) {
-	if (raw_mode) {
-		sendBUTN(BUTN_REW, pressed);
-	} else {
-		cli_send_cmd("button rew.repeat");
-	}	
+#define LMS_CALLBACK(N,B,E)					\
+static void lms_##N (bool pressed) {    	\
+	if (raw_mode) {							\
+		sendBUTN( BUTN_##B , pressed );		\
+	} else {								\
+		cli_send_cmd("button" " " #E); 		\
+	}                                       \
 }
 
-static void lms_fwd(bool pressed) {
-	if (raw_mode) {
-		sendBUTN(BUTN_FWD, pressed);
-	} else {
-		cli_send_cmd("button fwd.repeat");
-	}	
-}
+LMS_CALLBACK(power, POWER_FRONT, power)
+LMS_CALLBACK(play, PLAY, play.single)
 
-static void lms_prev(bool pressed) {
-	if (raw_mode) {
-		sendBUTN(BUTN_REW, pressed);
-	} else {
-		cli_send_cmd("button rew");
-	}	
-}
+LMS_CALLBACK(volup, VOLUP_FRONT, volup)
+LMS_CALLBACK(voldown, VOLDOWN_FRONT, voldown)
 
-static void lms_next(bool pressed) {
-	if (raw_mode) {
-		sendBUTN(BUTN_FWD, pressed);
-	} else {
-		cli_send_cmd("button fwd");
-	}
-}
+LMS_CALLBACK(rew, REW, rew.repeat)
+LMS_CALLBACK(fwd, FWD, fwd.repeat)
+LMS_CALLBACK(prev, REW, rew)
+LMS_CALLBACK(next, FWD, fwd)
 
-static void lms_up(bool pressed) {
-	if (raw_mode) {
-		sendBUTN(BUTN_ARROW_UP, pressed);
-	} else {
-		cli_send_cmd("button arrow_up");
-	}	
-}
+LMS_CALLBACK(up, ARROW_UP, arrow_up)
+LMS_CALLBACK(down, ARROW_DOWN, arrow_down)
+LMS_CALLBACK(left, ARROW_LEFT, arrow_left)
+LMS_CALLBACK(right, ARROW_RIGHT, arrow_right)
 
-static void lms_down(bool pressed) {
-	if (raw_mode) {
-		sendBUTN(BUTN_ARROW_DOWN, pressed);
-	} else {
-		cli_send_cmd("button arrow_down");
-	}	
-}
+LMS_CALLBACK(pre1, PRESET_1, preset_1.single)
+LMS_CALLBACK(pre2, PRESET_2, preset_2.single)
+LMS_CALLBACK(pre3, PRESET_3, preset_3.single)
+LMS_CALLBACK(pre4, PRESET_4, preset_4.single)
+LMS_CALLBACK(pre5, PRESET_5, preset_5.single)
+LMS_CALLBACK(pre6, PRESET_6, preset_6.single)
 
-static void lms_left(bool pressed) {
-	if (raw_mode) {
-		sendBUTN(BUTN_ARROW_LEFT, pressed);
-	} else {
-		cli_send_cmd("button arrow_left");
-	}	
-}
-
-static void lms_right(bool pressed) {
-	if (raw_mode) {
-		sendBUTN(BUTN_ARROW_RIGHT, pressed);
-	} else {
-		cli_send_cmd("button arrow_right");
-	}	
-}
-
-static void lms_knob_left(bool pressed) {
-	if (raw_mode) {
-		sendBUTN(BUTN_KNOB_LEFT, pressed);
-	} else {
-		cli_send_cmd("button knob_left");
-	}	
-}
-
-static void lms_knob_right(bool pressed) {
-	if (raw_mode) {
-		sendBUTN(BUTN_KNOB_RIGHT, pressed);
-	} else {
-		cli_send_cmd("button knob_right");
-	}	
-}
-
-static void lms_knob_push(bool pressed) {
-	if (raw_mode) {
-		sendBUTN(BUTN_KNOB_PUSH, pressed);
-	} else {
-		cli_send_cmd("button knob_push");
-	}	
-}
+LMS_CALLBACK(knob_left, KNOB_LEFT, knob_left)
+LMS_CALLBACK(knob_right, KNOB_RIGHT, knob_right)
+LMS_CALLBACK(knob_push, KNOB_PUSH, knob_push)
 
 const actrls_t LMS_controls = {
-	lms_volume_up, lms_volume_down,	// volume up, volume down
+	lms_power,
+	lms_volup, lms_voldown,	// volume up, volume down
 	lms_toggle, lms_play,	// toggle, play
 	lms_pause, lms_stop,	// pause, stop
 	lms_rew, lms_fwd,		// rew, fwd
 	lms_prev, lms_next,		// prev, next
 	lms_up, lms_down,
 	lms_left, lms_right, 
+	lms_pre1, lms_pre2, lms_pre3, lms_pre4, lms_pre5, lms_pre6,
 	lms_knob_left, lms_knob_right, lms_knob_push,
 };
 

components/squeezelite/display.c

@@ -972,7 +972,7 @@ static void visu_update(void) {
 				}
 			}
 		}
-	} else if (displayer.width / 2 >  3 * VU_WIDTH / 4) {
+	} else if (displayer.width / 2 >=  3 * VU_WIDTH / 4) {
 		if (visu.rotate) {
 			draw_VU(display, vu_bitmap, visu.bars[0].current, 0, visu.row, visu.height / 2, visu.rotate);
 			draw_VU(display, vu_bitmap, visu.bars[1].current, 0, visu.row + visu.height / 2, visu.height / 2, visu.rotate);

components/squeezelite/helix-aac.c

@@ -430,12 +430,11 @@ static decode_state helixaac_decode(void) {
 		}
 	}
 
-	// we always have at least WRAPBUF_LEN unless it's the end of a stream
-	if (bytes_wrap < WRAPBUF_LEN) {
+	// we always have at least WRAPBUF_LEN unless it's the end of a stream	
+	if (bytes_wrap < WRAPBUF_LEN && bytes_wrap != bytes_total) {		
 		// build a linear buffer if we are crossing the end of streambuf
 		memcpy(a->wrap_buf, streambuf->readp, bytes_wrap);
-		memcpy(a->wrap_buf + bytes_wrap, streambuf->buf, min(WRAPBUF_LEN, bytes_total) - bytes_wrap);
-		
+		memcpy(a->wrap_buf + bytes_wrap, streambuf->buf, min(WRAPBUF_LEN, bytes_total) - bytes_wrap);		
 		sptr = a->wrap_buf;
 		bytes = bytes_wrap = min(WRAPBUF_LEN, bytes_total);
 	} else {

components/squeezelite/output.c

@@ -253,6 +253,9 @@ frames_t _output_frames(frames_t avail) {
 		}
 		
 		out_frames = !silence ? min(size, cont_frames) : size;
+		
+		if (output.channels & 0x01) gainR = COPY_MONO;
+		else if (output.channels & 0x02) gainL = COPY_MONO;
 
 		wrote = output.write_cb(out_frames, silence, gainL, gainR, cross_gain_in, cross_gain_out, &cross_ptr);
 

components/squeezelite/output_bt.c

@@ -90,9 +90,7 @@ static int _write_frames(frames_t out_frames, bool silence, s32_t gainL, s32_t g
 			_apply_cross(outputbuf, out_frames, cross_gain_in, cross_gain_out, cross_ptr);
 		}
 
-		if (gainL != FIXED_ONE || gainR!= FIXED_ONE) {
-			_apply_gain(outputbuf, out_frames, gainL, gainR);
-		}
+		_apply_gain(outputbuf, out_frames, gainL, gainR);
 
 #if BYTES_PER_FRAME == 4
 		memcpy(btout + oframes * BYTES_PER_FRAME, outputbuf->readp, out_frames * BYTES_PER_FRAME);

components/squeezelite/output_i2s.c

@@ -410,10 +410,7 @@ static int _i2s_write_frames(frames_t out_frames, bool silence, s32_t gainL, s32
 		}
 		
 #if BYTES_PER_FRAME == 4
-		if (gainL != FIXED_ONE || gainR!= FIXED_ONE) {
-			_apply_gain(outputbuf, out_frames, gainL, gainR);
-		}
-			
+		_apply_gain(outputbuf, out_frames, gainL, gainR);
 		memcpy(obuf + oframes * BYTES_PER_FRAME, outputbuf->readp, out_frames * BYTES_PER_FRAME);
 #else
 		optr = (s32_t*) outputbuf->readp;	

components/squeezelite/output_pack.c

@@ -356,17 +356,34 @@ void _apply_cross(struct buffer *outputbuf, frames_t out_frames, s32_t cross_gai
 	}
 }
 
+
+
 #if !WIN
 inline 
 #endif
 void _apply_gain(struct buffer *outputbuf, frames_t count, s32_t gainL, s32_t gainR) {
-	ISAMPLE_T *ptrL = (ISAMPLE_T *)(void *)outputbuf->readp;
-	ISAMPLE_T *ptrR = (ISAMPLE_T *)(void *)outputbuf->readp + 1;
-	while (count--) {
-		*ptrL = gain(gainL, *ptrL);
-		*ptrR = gain(gainR, *ptrR);
-		ptrL += 2;
-		ptrR += 2;
-	}
+	if (gainL == FIXED_ONE && gainR == FIXED_ONE) {
+		return;
+	} else if (gainL == COPY_MONO) {
+		ISAMPLE_T *ptr = (ISAMPLE_T *)(void *)outputbuf->readp + 1;
+		while (count--) {
+			*(ptr - 1) = *ptr = gain(gainR, *ptr);
+			ptr += 2;
+		}
+	} else if (gainR == COPY_MONO) {
+		ISAMPLE_T *ptr = (ISAMPLE_T *)(void *)outputbuf->readp;
+		while (count--) {
+			*(ptr + 1) = *ptr = gain(gainL, *ptr);
+			ptr += 2;
+		}
+   } else {
+   		ISAMPLE_T *ptrL = (ISAMPLE_T *)(void *)outputbuf->readp;
+		ISAMPLE_T *ptrR = (ISAMPLE_T *)(void *)outputbuf->readp + 1;
+		while (count--) {
+			*ptrL = gain(gainL, *ptrL);
+			*ptrR = gain(gainR, *ptrR);
+			ptrL += 2; ptrR += 2;
+		}
+   }	
 }
 

components/squeezelite/pcm.c

@@ -204,7 +204,7 @@ static decode_state pcm_decode(void) {
 		out = process.max_in_frames;
 	);
 
-	if ((stream.state <= DISCONNECT && bytes == 0) || (limit && audio_left == 0)) {
+	if ((stream.state <= DISCONNECT && bytes < bytes_per_frame) || (limit && audio_left == 0)) {
 		UNLOCK_O_direct;
 		UNLOCK_S;
 		return DECODE_COMPLETE;

components/squeezelite/slimproto.c

@@ -397,8 +397,9 @@ static void process_strm(u8_t *pkt, int len) {
 			output.next_replay_gain = unpackN(&strm->replay_gain);
 			output.fade_mode = strm->transition_type - '0';
 			output.fade_secs = strm->transition_period;
-			output.invert    = (strm->flags & 0x03) == 0x03;
-			LOG_DEBUG("set fade mode: %u", output.fade_mode);
+			output.invert = (strm->flags & 0x03) == 0x03;
+			output.channels = (strm->flags & 0x0c) >> 2;
+			LOG_DEBUG("set fade: %u, channels: %u, invert: %u", output.fade_mode, output.channels, output.invert);
 			UNLOCK_O;
 		}
 		break;

components/squeezelite/squeezelite.h

@@ -471,7 +471,8 @@ void _wake_create(event_event*);
 
 #define MAX_SILENCE_FRAMES 2048
 
-#define FIXED_ONE 0x10000
+#define FIXED_ONE 	0x10000
+#define COPY_MONO	(FIXED_ONE + 1)
 
 #ifndef BYTES_PER_FRAME
 #define BYTES_PER_FRAME 8
@@ -660,6 +661,7 @@ typedef enum { FADE_NONE = 0, FADE_CROSSFADE, FADE_IN, FADE_OUT, FADE_INOUT } fa
 struct outputstate {
 	output_state state;
 	output_format format;
+	u8_t  channels;            
 	const char *device;
 	int external;
 	u32_t init_size;

components/squeezelite/stream.c

@@ -334,7 +334,7 @@ static void *stream_thread() {
 					
 					n = _recv(ssl, fd, streambuf->writep, space, 0);
 					if (n == 0) {
-						LOG_INFO("end of stream");
+						LOG_INFO("end of stream (%u bytes)", stream.bytes);
 						_disconnect(DISCONNECT, DISCONNECT_OK);
 					}
 					if (n < 0 && _last_error() != ERROR_WOULDBLOCK) {
@@ -521,19 +521,16 @@ void stream_sock(u32_t ip, u16_t port, const char *header, size_t header_len, un
 	
 #if USE_SSL
 	if (ntohs(port) == 443) {
-		char *server = strcasestr(header, "Host:");
+		char server[256], *p;
 
 		ssl = SSL_new(SSLctx);
 		SSL_set_fd(ssl, sock);
 
 		// add SNI
+		sscanf(header, "Host:%255s", server);
 		if (server) {
-			char *p, *servername = malloc(1024);
-
-			sscanf(server, "Host:%255[^:]s", servername);
-			for (p = servername; *p == ' '; p++);
-			SSL_set_tlsext_host_name(ssl, p);
-			free(servername);
+			if ((p = strchr(server, ':')) != NULL) *p = '\0';
+			SSL_set_tlsext_host_name(ssl, server);
 		}
 		
 		while (1) {

components/wifi-manager/.gitignore

@@ -1 +0,0 @@
-/.code.js.swp

components/wifi-manager/CMakeLists.txt

@@ -1,8 +1,10 @@
-idf_component_register( SRC_DIRS .
-						INCLUDE_DIRS . ${IDF_PATH}/components/esp_http_server/src ${IDF_PATH}/components/esp_http_server/src/port/esp32  ${IDF_PATH}/components/esp_http_server/src/util ${IDF_PATH}/components/esp_http_server/src/
+
+set( WEBPACK_DIR webapp/webpack/dist )
+idf_component_register( SRC_DIRS . webapp
+						INCLUDE_DIRS . webapp ${IDF_PATH}/components/esp_http_server/src ${IDF_PATH}/components/esp_http_server/src/port/esp32  ${IDF_PATH}/components/esp_http_server/src/util ${IDF_PATH}/components/esp_http_server/src/
 						REQUIRES squeezelite-ota json mdns 
 						PRIV_REQUIRES tools services platform_config esp_common json newlib freertos  spi_flash nvs_flash mdns pthread wpa_supplicant platform_console esp_http_server console driver_bt
-						EMBED_FILES res/style.css.gz res/code.js.gz index.html res/bootstrap.css.gz res/yeti/bootstrap.css.gz res/jquery.js.gz res/bootstrap.js.gz res/favicon.ico
-						
 )
+
  
+include(webapp/webapp.cmake)

components/wifi-manager/compress.bat

@@ -1,2 +0,0 @@
-gzip index.html style.css jquery.js --best --keep --force
-pause

components/wifi-manager/connect

@@ -1,2 +0,0 @@
-<html>
-</html>

components/wifi-manager/http_server_handlers.c

@@ -54,6 +54,7 @@ function to process requests, decode URLs, serve files, etc. etc.
 #include "argtable3/argtable3.h"
 #include "platform_console.h"
 #include "accessors.h"
+#include "webapp/webpack.h"
  
 #define HTTP_STACK_SIZE	(5*1024)
 const char str_na[]="N/A";
@@ -89,22 +90,7 @@ static const char redirect_payload3[]="'>here</a> to login.</p></body></html>";
  * @see file "component.mk"
  * @see https://docs.espressif.com/projects/esp-idf/en/latest/api-guides/build-system.html#embedding-binary-data
  */
-extern const uint8_t style_css_start[] asm("_binary_style_css_gz_start");
-extern const uint8_t style_css_end[]   asm("_binary_style_css_gz_end");
-extern const uint8_t jquery_gz_start[] asm("_binary_jquery_js_gz_start");
-extern const uint8_t jquery_gz_end[] asm("_binary_jquery_js_gz_end");
-// extern const uint8_t popper_gz_start[] asm("_binary_popper_min_js_gz_start");
-// extern const uint8_t popper_gz_end[] asm("_binary_popper_min_js_gz_end");
-extern const uint8_t bootstrap_js_gz_start[] asm("_binary_bootstrap_js_gz_start");
-extern const uint8_t bootstrap_js_gz_end[] asm("_binary_bootstrap_js_gz_end");
-extern const uint8_t bootstrap_css_gz_start[] asm("_binary_bootstrap_css_gz_start");
-extern const uint8_t bootstrap_css_gz_end[] asm("_binary_bootstrap_css_gz_end");
-extern const uint8_t code_js_start[] asm("_binary_code_js_gz_start");
-extern const uint8_t code_js_end[] asm("_binary_code_js_gz_end");
-extern const uint8_t index_html_start[] asm("_binary_index_html_start");
-extern const uint8_t index_html_end[] asm("_binary_index_html_end");
-extern const uint8_t favicon_ico_start[] asm("_binary_favicon_ico_start");
-extern const uint8_t favicon_ico_end[] asm("_binary_favicon_ico_end");
+
 esp_err_t redirect_processor(httpd_req_t *req, httpd_err_code_t error);
 
 
@@ -334,8 +320,8 @@ static esp_err_t set_content_type_from_file(httpd_req_t *req, const char *filena
         return httpd_resp_set_type(req, HTTPD_TYPE_TEXT);
     } else if (IS_FILE_EXT(filename, ".jpeg")) {
         return httpd_resp_set_type(req, "image/jpeg");
-    } else if (IS_FILE_EXT(filename, ".ico")) {
-        return httpd_resp_set_type(req, "image/x-icon");
+    } else if (IS_FILE_EXT(filename, ".png")) {
+        return httpd_resp_set_type(req, "image/png");
     } else if (IS_FILE_EXT(filename, ".ico")) {
         return httpd_resp_set_type(req, "image/x-icon");
     } else if (IS_FILE_EXT(filename, ".css")) {
@@ -370,8 +356,16 @@ static esp_err_t set_content_type_from_req(httpd_req_t *req)
    return ESP_OK;
 }
 
-
+int resource_get_index(const char * fileName){
+	for(int i=0;resource_lookups[i][0]!='\0';i++){
+		if(strstr(resource_lookups[i], fileName)){
+			return i;
+		}
+	}
+	return -1;
+}
 esp_err_t root_get_handler(httpd_req_t *req){
+	esp_err_t err = ESP_OK;
     ESP_LOGD_LOC(TAG, "serving [%s]", req->uri);
     httpd_resp_set_hdr(req, "Access-Control-Allow-Origin", "*");
     httpd_resp_set_hdr(req, "Accept-Encoding", "identity");
@@ -379,15 +373,24 @@ esp_err_t root_get_handler(httpd_req_t *req){
     if(!is_user_authenticated(req)){
     	// todo:  send password entry page and return
     }
-    const size_t file_size = (index_html_end - index_html_start);
-	esp_err_t err = set_content_type_from_req(req);
-	if(err == ESP_OK){
-		httpd_resp_send(req, (const char *)index_html_start, file_size);
+	int idx=-1;
+	if((idx=resource_get_index("index.html"))>=0){
+		const size_t file_size = (resource_map_end[idx] - resource_map_start[idx]);
+		httpd_resp_set_hdr(req, "Content-Encoding", "gzip");
+		err = set_content_type_from_req(req);
+		if(err == ESP_OK){
+			httpd_resp_send(req, (const char *)resource_map_start[idx], file_size);
+		} 
+	}
+    else{
+		httpd_resp_send_err(req, HTTPD_500_INTERNAL_SERVER_ERROR, "index.html not found");
+	   return ESP_FAIL;
 	}
 	ESP_LOGD_LOC(TAG, "done serving [%s]", req->uri);
     return err;
 }
 
+
 esp_err_t resource_filehandler(httpd_req_t *req){
     char filepath[FILE_PATH_MAX];
    ESP_LOGD_LOC(TAG, "serving [%s]", req->uri);
@@ -407,41 +410,17 @@ esp_err_t resource_filehandler(httpd_req_t *req){
 	   return ESP_FAIL;
    }
 
-   if(strstr(filename, "code.js")) {
+
+	int idx=-1;
+	if((idx=resource_get_index(filename))>=0){
 	    set_content_type_from_file(req, filename);
-		httpd_resp_set_hdr(req, "Content-Encoding", "gzip");
-	    const size_t file_size = (code_js_end - code_js_start);
-	    httpd_resp_send(req, (const char *)code_js_start, file_size);
-	} else if(strstr(filename, "style.css")) {
-		set_content_type_from_file(req, filename);
-		httpd_resp_set_hdr(req, "Content-Encoding", "gzip");
-	    const size_t file_size = (style_css_end - style_css_start);
-	    httpd_resp_send(req, (const char *)style_css_start, file_size);
-    } else if(strstr(filename, "favicon.ico")) {
-		set_content_type_from_file(req, filename);
-	    const size_t file_size = (favicon_ico_end - favicon_ico_start);
-	    httpd_resp_send(req, (const char *)favicon_ico_start, file_size);
-	} else if(strstr(filename, "jquery.js")) {
-		set_content_type_from_file(req, filename);
-		httpd_resp_set_hdr(req, "Content-Encoding", "gzip");
-	    const size_t file_size = (jquery_gz_end - jquery_gz_start);
-	    httpd_resp_send(req, (const char *)jquery_gz_start, file_size);
-	// } else if(strstr(filename, "popper.js")) {
-	// 	set_content_type_from_file(req, filename);
-	// 	httpd_resp_set_hdr(req, "Content-Encoding", "gzip");
-	//     const size_t file_size = (popper_gz_end - popper_gz_start);
-	//     httpd_resp_send(req, (const char *)popper_gz_start, file_size);
-	} else if(strstr(filename, "bootstrap.js")) {
-			set_content_type_from_file(req, filename);
+		if(strstr(resource_lookups[idx], ".gz")) {
 			httpd_resp_set_hdr(req, "Content-Encoding", "gzip");
-		    const size_t file_size = (bootstrap_js_gz_end - bootstrap_js_gz_start);
-		    httpd_resp_send(req, (const char *)bootstrap_js_gz_start, file_size);
-	} else if(strstr(filename, "bootstrap.css")) {
-			set_content_type_from_file(req, filename);
-			httpd_resp_set_hdr(req, "Content-Encoding", "gzip");
-		    const size_t file_size = (bootstrap_css_gz_end - bootstrap_css_gz_start);
-		    httpd_resp_send(req, (const char *)bootstrap_css_gz_start, file_size);
-    } else {
+		}
+	    const size_t file_size = (resource_map_end[idx] - resource_map_start[idx]);
+	    httpd_resp_send(req, (const char *)resource_map_start[idx], file_size);
+	}
+	else {
 	   ESP_LOGE_LOC(TAG, "Unknown resource [%s] from path [%s] ", filename,filepath);
 	   /* Respond with 404 Not Found */
 	   httpd_resp_send_err(req, HTTPD_404_NOT_FOUND, "File does not exist");

components/wifi-manager/index.development.html

@@ -1,410 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-	<head>
-		<meta charset="utf-8"/>
-		<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
-		<meta name="apple-mobile-web-app-capable" content="yes" />
-		<link rel="stylesheet" href="/res/bootstrap.css">
-		<script src="/res/jquery.js"></script>
-		<link rel="shortcut icon" type="image/x-icon" href="/res/favicon.ico">
-		<link rel="stylesheet" href="/res/style.css">
-		<!-- <script src="/res/popper.js"></script> -->
-		<script src="/res/bootstrap.js"></script>
-		<script src="/res/code.js"></script>
-		<title>esp32-wifi-manager</title>
-	</head>
-	<body>
-		<div id="info">
-			<svg xmlns="http://www.w3.org/2000/svg" id="jack" width="24" height="24" viewBox="0 0 24 24">
-				<g id="o_jack" display="none">
-					<path d="m 16.074253,15.636738 v -1.05413 h 5.893274 c 1.16249,0 2.108261,-0.855111 2.108261,-1.906183 0,-1.051073 -0.945771,-1.906236 -2.108261,-1.906236 H 16.074253 V 9.7160604 c 0,-0.5812492 -0.472879,-1.0541321 -1.054131,-1.0541321 H 6.7847349 c -1.256731,0 -2.301908,0.9212057 -2.496867,2.1237027 h -0.451896 c -0.540407,0 -1.001317,0.349129 -1.173459,0.835611 H 0.47312787 c -0.23285,0 -0.42164599,0.188794 -0.42164599,0.421651 v 1.251779 c 0,0.232857 0.18879599,0.421652 0.42164599,0.421652 H 2.6550809 c 0.165919,0.497866 0.632365,0.857588 1.180831,0.857588 h 0.45312 c 0.19781,1.199177 1.241345,2.116956 2.495659,2.116956 h 8.2353861 c 0.581297,0 1.054176,-0.472883 1.054176,-1.05413 z m 5.060935,-4.023245 v 2.125811 h -0.844935 v -2.125811 z m 2.097293,1.062932 c 0,0.582933 -0.561524,1.057661 -1.253986,1.062668 v -2.125337 c 0.692462,0.0049 1.253986,0.47963 1.253986,1.062669 z m -3.785535,-1.062932 v 2.125811 h -3.372693 v -2.125811 z m -18.55215712,0.851 H 2.5901939 v 0.408475 H 0.89478888 Z m 2.94118302,1.266114 c -0.221897,0 -0.40247,-0.185737 -0.40247,-0.414062 v -1.273547 c 0,-0.228271 0.180573,-0.41401 0.40247,-0.41401 h 0.418855 v 2.101671 h -0.418855 z m 2.948763,2.116956 c -0.929997,0 -1.6866,-0.756601 -1.6866,-1.686608 v -0.0087 -2.944976 -0.01545 c 0,-0.930006 0.756603,-1.6866072 1.6866,-1.6866072 h 8.2353871 c 0.114313,0 0.210838,0.096554 0.210838,0.2108266 v 5.9206786 c 0,0.114268 -0.09656,0.210824 -0.210838,0.210824 z" />
-				</g>
-			</svg>
-			<span data-toggle="tooltip" id="o_type" data-placement="top" title=""><svg xmlns="http://www.w3.org/2000/svg" id="output" width="24" height="24" viewBox="0 0 24 24">
-				<g id="o_i2s" display="none">
-					<path d="M2 7L2 8L2 9L2 10L2 11L2 12L2 13L2 14L2 15L2 16L2 17L3 17L3 16L3 15L3 14L3 13L3 12L3 11L3 10L3 9L3 8L2 7M6 7L6 8L6 9L7 9L7 8L8 8L9 8L10 8L10 9L11 9L11 10L11 11L10 11L10 12L9 12L9 13L8 13L8 14L7 14L7 15L6 15L6 16L6 17L7 17L8 17L9 17L10 17L11 17L12 17L12 16L11 16L10 16L9 16L8 16L8 15L9 15L9 14L10 14L10 13L11 13L11 12L12 12L12 11L12 10L12 9L12 8L11 8L11 7L10 7L9 7L8 7L6 7M16 7L16 8L15 8L15 9L15 10L15 11L16 11L16 12L17 12L18 12L18 13L19 13L20 13L21 13L21 14L21 15L20 15L20 16L19 16L18 16L17 16L16 16L16 15L15 15L15 16L15 17L16 17L17 17L18 17L19 17L20 17L21 17L21 16L22 16L22 15L22 14L22 13L21 13L21 12L20 12L20 11L19 11L18 11L17 11L16 11L16 10L16 9L17 9L17 8L18 8L19 8L20 8L21 8L21 9L22 9L22 8L22 7L21 7L20 7L19 7L18 7L16 7z"/>
-				</g>
-				<g id="o_bt" stroke="currentColor" stroke-width="1" fill="none" fill-rule="evenodd" display="none"></g>
-				<g id="o_spdif" display="none">
-					<path d="M3 1L3 2L2 2L2 3L2 4L2 5L3 5L3 6L4 6L5 6L5 7L6 7L7 7L8 7L8 8L8 9L7 9L7 10L6 10L5 10L4 10L3 10L3 9L2 9L2 10L2 11L3 11L4 11L5 11L6 11L7 11L8 11L8 10L9 10L9 9L9 8L9 7L8 7L8 6L7 6L7 5L6 5L5 5L4 5L3 5L3 4L3 3L4 3L4 2L5 2L6 2L7 2L8 2L8 3L9 3L9 2L9 1L8 1L7 1L6 1L5 1L3 1M13 1L13 2L13 3L13 4L12 4L12 5L12 6L12 7L12 8L11 8L11 9L11 10L11 11L10 11L10 12L10 13L11 13L11 12L11 11L12 11L12 10L12 9L12 8L13 8L13 7L13 6L13 5L14 5L14 4L14 3L14 2L15 2L15 1L13 1M16 1L16 2L16 3L16 4L16 5L16 6L16 7L16 8L16 9L16 10L16 11L17 11L17 10L17 9L17 8L17 7L18 7L19 7L20 7L21 7L21 6L22 6L22 5L22 4L22 3L22 2L21 2L21 1L20 1L19 1L18 1L16 1z"/>
-					<path style="fill:#272B30;" d="M17 2L17 3L17 4L17 5L17 6L18 6L19 6L20 6L20 5L21 5L21 4L21 3L20 3L20 2L19 2L17 2z"/>
-					<path d="M2 13L2 14L2 15L2 16L2 17L2 18L2 19L2 20L2 21L2 22L2 23L3 23L4 23L5 23L6 23L7 23L8 23L8 22L9 22L9 21L10 21L10 20L10 19L10 18L10 17L10 16L10 15L9 15L9 14L8 14L7 14L7 13L6 13L5 13L4 13L2 13M13 13L13 14L13 15L13 16L13 17L13 18L13 19L13 20L13 21L13 22L13 23L14 23L14 22L14 21L14 20L14 19L14 18L14 17L14 16L14 15L14 14L13 13M17 13L17 14L17 15L17 16L17 17L17 18L17 19L17 20L17 21L17 22L17 23L18 23L18 22L18 21L18 20L18 19L18 18L19 18L20 18L21 18L22 18L22 17L21 17L20 17L19 17L18 17L18 16L18 15L18 14L19 14L20 14L21 14L22 14L22 13L21 13L20 13L19 13L17 13z"/>
-					<path style="fill:#272B30;" d="M3 14L3 15L3 16L3 17L3 18L3 19L3 20L3 21L3 22L4 22L5 22L6 22L7 22L7 21L8 21L8 20L9 20L9 19L9 18L9 17L9 16L8 16L8 15L7 15L7 14L6 14L5 14L3 14z"/>
-				</g>
-			</svg></span>
-			<svg xmlns="http://www.w3.org/2000/svg" id="battery" width="24" height="24" viewBox="0 0 24 24">
-				<g id="bat0" display="none">
-					<path d="M19 8v8h-17v-8h17zm2-2h-21v12h21v-12zm1 9h.75c.69 0 1.25-.56 1.25-1.25v-3.5c0-.69-.56-1.25-1.25-1.25h-.75v6z"/>
-				</g>
-				<g id="bat1" display="none">
-					<path d="M19 8v8h-17v-8h17zm2-2h-21v12h21v-12zm1 9h.75c.69 0 1.25-.56 1.25-1.25v-3.5c0-.69-.56-1.25-1.25-1.25h-.75v6zm-16-6h-3v6h3v-6z"/>
-				</g>
-				<g id="bat2" display="none">
-					<path d="M19 8v8h-17v-8h17zm2-2h-21v12h21v-12zm1 9h.75c.69 0 1.25-.56 1.25-1.25v-3.5c0-.69-.56-1.25-1.25-1.25h-.75v6zm-16-6h-3v6h3v-6zm4 0h-3v6h3v-6z"/>
-				</g>
-				<g id="bat3" display="none">
-					<path d="M19 8v8h-17v-8h17zm2-2h-21v12h21v-12zm1 9h.75c.69 0 1.25-.56 1.25-1.25v-3.5c0-.69-.56-1.25-1.25-1.25h-.75v6zm-16-6h-3v6h3v-6zm4 0h-3v6h3v-6zm4 0h-3v6h3v-6z"/>
-				</g>
-				<g id="bat4" display="none">
-					<path d="M19 8v8h-17v-8h17zm2-2h-21v12h21v-12zm1 9h.75c.69 0 1.25-.56 1.25-1.25v-3.5c0-.69-.56-1.25-1.25-1.25h-.75v6zm-16-6h-3v6h3v-6zm4 0h-3v6h3v-6zm4 0h-3v6h3v-6zm4 0h-3v6h3v-6z"/>
-				</g>
-			</svg>
-					
-		</div>
-		<ul class="nav nav-tabs bg-primary" id="mainnav">
-			<li class="nav-item">
-				<a class="nav-link active" data-toggle="tab" href="#tab-wifi">WiFi</a>
-			</li>
-			<li class="nav-item">
-				<a class="nav-link" data-toggle="tab" href="#tab-configuration">Configuration</a>
-			</li>  
-			<li class="nav-item">
-				<a class="nav-link" data-toggle="tab" href="#tab-syslog">Status<span class="badge badge-success badge-pill" id="msgcnt"></span></a>
-			</li>
-			<li class="nav-item">
-				<a class="nav-link" data-toggle="tab" href="#tab-commands">Advanced</a>
-			</li>
-			<li class="nav-item">
-				<a class="nav-link" data-toggle="tab" href="#tab-credits">Credits</a>
-			</li>
-		</ul>
-		<div id="message"></div>
-		<div id="content" >
-			<div id="myTabContent" class="tab-content mt-3">
-				<div class="tab-pane fade active show" id="tab-wifi">
-					<div id="wifi">
-						<div id="wifi-status">
-							<h2>Connected to:</h2>
-							<section id="connected-to">
-								<div class="ape">
-									<div class="w0">
-										<div class="pw"><span></span></div>
-									</div>
-								</div>
-							</section>
-						</div>
-						<h2>Manual connect</h2>
-						<section id="manual_add">
-							<div class="ape">ADD (HIDDEN) SSID</div>
-						</section>
-						<h2>or choose a network...
-							<button type="button" id="updateAP" class="btn btn-info btn-sm">Update</button>
-						</h2>
-						<section id="wifi-list">
-						</section>
-					</div>
-					<div id="connect_manual">
-						<header>
-							<h1>Enter Details</h1>
-						</header>
-						<h2>DHCP host name</h2>
-						<section id="wifi-list">
-							<input id="dhcp-name2" type="text" placeholder="" value="squeezeamp">
-						</section>
-						<h2>Manual Connection</h2>
-						<section>
-							<input id="manual_ssid" type="text" placeholder="SSID" value="">
-							<input id="manual_pwd" type="password" placeholder="Password" value="">
-						</section>
-						<div class="buttons">
-							<input id="manual_join" type="button" class="btn btn-success" value="Join" data-connect="manual" />
-							<input id="manual_cancel" type="button" class="btn btn-danger" value="Cancel"/>
-						</div>
-					</div>
-					<div id="connect">
-						<header>
-							<h1>Connect to network</h1>
-						</header>
-						<h2>DHCP host name</h2>
-						<section id="wifi-list">
-							<input id="dhcp-name1" type="text" placeholder="" value="squeezeamp">
-						</section>
-						<h2>Password for <span id="ssid-pwd"></span></h2>
-						<section>
-							<input id="pwd" type="password" placeholder="Password" value="">
-						</section>
-						<div class="buttons">
-							<input id="join" type="button" class="btn btn-success" value="Join" />
-							<input id="cancel" type="button" class="btn btn-danger" value="Cancel"/>
-						</div>
-					</div>
-					<div id="connect-wait">
-						<header>
-							<h1>Please wait...</h1>
-						</header>
-						<h2>Connecting to <span id="ssid-wait"></span></h2>
-						<section>
-							<div id="loading">
-								<div class="spinner">
-									<div class="double-bounce1"></div>
-									<div class="double-bounce2"></div>
-								</div>
-								<p class="tctr">You may lose wifi access while the esp32 recalibrates its radio. Please wait until your device automatically reconnects. This can take up to 30s.</p>
-							</div>
-							<div id="connect-success">
-								<h3 class="gr">Success!</h3>
-							</div>
-							<div id="connect-fail">
-								<h3 class="rd">Connection failed</h3>
-								<p class="tctr">Please double-check wifi password if any and make sure the access point has good signal.</p>
-							</div>
-						</section>
-						<div class="buttons">
-							<input id="ok-connect" type="button" value="OK" class="btn btn-success" />
-						</div>
-					</div>
-					<div id="connect-details">
-						<div id="connect-details-wrap">
-							<header>
-								<h1></h1>
-							</header>
-							<h2></h2>
-							<section>
-								<div class="buttons">
-									<input id="disconnect" type="button" value="Disconnect" class="btn btn-danger"/>
-								</div>
-							</section>
-							<h2>IP Address</h2>
-							<section>
-								<div class="ape brdb">
-									IP Address:
-									<div id="ip" class="fr"></div>
-								</div>
-								<div class="ape brdb">
-									Subnet Mask:
-									<div id="netmask" class="fr"></div>
-								</div>
-								<div class="ape">
-									Default Gateway:
-									<div id="gw" class="fr"></div>
-								</div>
-							</section>
-							<div class="buttons">
-								<input id="ok-details" type="button" value="Back" class="btn btn-success" />
-							</div>
-						</div>
-						<div id="diag-disconnect" class="diag-box">
-							<div class="diag-box-win">
-								<p>Are you sure you would like to disconnect from this wifi?</p>
-								<div class="buttons">
-									<input id="no-disconnect" type="button" value="No" class="btn btn-success" />
-									<input id="yes-disconnect" type="button" value="Yes" class="btn btn-danger" />
-								</div>
-							</div>
-						</div>
-					</div>
-				</div>
-                <!-- Config -->
-                <div class="tab-pane fade mt-2" id="tab-configuration">
-                    <ul class="nav nav-tabs bg-info" name="secnav">
-                        <li class="nav-link" style="padding: inherit; border: none;">
-                            <a class="nav-link active" data-toggle="tab" href="#tab-cfg-audio">Audio</a>
-                        </li>
-                        <li class="nav-item">
-                            <a class="nav-link" data-toggle="tab" href="#tab-cfg-syst">System</a>
-                        </li>  
-                        <li class="nav-item">
-                            <a class="nav-link" data-toggle="tab" href="#tab-cfg-hw"  >Hardware</a>
-                        </li>  
-                        <li class="nav-item">
-                            <a class="nav-link" data-toggle="tab" href="#tab-cfg-fw"  >Updates</a> 
-                        </li>  
-                        <li class="nav-item">
-                            <a class="nav-link" data-toggle="tab" href="#tab-nvs">NVS editor</a>
-                        </li>
-                    </ul>
-
-                    <div id="myTabContent2" class="tab-content mt-3">
-                        <div class="tab-pane fade" id="tab-cfg-hw"></div>
-                        <div class="tab-pane fade" id="tab-cfg-syst"></div>
-                        <div class="tab-pane fade" id="tab-cfg-gen"></div>
-                        <div class="tab-pane fade" id="tab-cfg-fw">
-                            <div id="boot-div">
-                                <form id="boot-form" action="/recovery.json" method="post" target="dummyframe">
-                                    <button id="boot-button" type="submit" class="btn btn-primary">Recovery</button>
-                                </form>
-                            </div>
-                            <h1>Check for firmware upgrade</h1>
-                            <div class="buttons">
-                                <input type="button" id="fwcheck" class="btn btn-info" value="Check for updates" />
-                            </div>
-                            <div id="searchfw" class="form-group">
-                                <select class="custom-select" id="fwbranch">
-                                    <option selected="">Choose FW branch</option>
-                                </select>
-                                <input class="form-control form-control-sm" id="searchinput" type="text" placeholder="search releases" id="inputSmall">
-                            </div>
-                            <table class="table table-hover">
-                                <thead>
-                                    <tr>
-                                        <th scope="col">Firmware version</th>
-                                        <th scope="col">Release date</th>
-                                        <th scope="col">HW platform</th>
-                                        <th scope="col">IDF version</th>
-                                        <th scope="col">Branch</th>
-                                        <th scope="col">Flash this FW</th>
-                                    </tr>
-                                </thead>
-                                <tbody id="releaseTable">
-                                </tbody>
-                            </table>
-                            <h2>Firmware URL:</h2>
-                            <textarea id="fwurl" maxlength="1000"></textarea>
-                            <div class="buttons">
-                                <input type="button" id="flash" class="btn btn-danger" value="Flash!" /><span id="flash-status"></span>
-                            </div>
-                            <p>OR</p>
-                            <div class="form-group">
-                                <input type="file" class="form-control-file" id="flashfilename" aria-describedby="fileHelp">
-                                <div class="buttons">
-                                    <button type="button" class="btn btn-danger" id="fwUpload">Upload!</button>
-                                </div>
-                            </div>
-                            <div id="otadiv">
-                                <div class="progress" id="progress">
-                                    <div class="progress-bar" role="progressbar" aria-valuemin="0" aria-valuemax="100" style="width:0%">
-                                        0%
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                        <div class="tab-pane fade" id="tab-nvs">
-                            <table class="table table-hover">
-                                <thead>
-                                    <tr>
-                                        <th scope="col">Key</th>
-                                        <th scope="col">Value</th>
-                                    </tr>
-                                </thead>
-                                <tbody id="nvsTable">
-                                </tbody>
-                            </table>
-                            <div class="buttons">
-                                <div id="boot-div">
-                                    <form id="reboot-form" action="/reboot.json" method="post" target="dummyframe">
-                                        <button id="reboot-button" type="submit" class="btn btn-primary">Reboot</button>
-                                    </form>
-                                </div>
-                                <input id="save-nvs" type="button" class="btn btn-success" value="Commit">
-                                <input id="save-as-nvs" type="button" class="btn btn-success" value="Download config">
-                                <input id="load-nvs" type="button" class="btn btn-success" value="Load File">
-                                <input aria-describedby="fileHelp" onchange="onChooseFile(event, onFileLoad.bind(this))" id="nvsfilename" type="file" style="display:none">
-                            </div>
-						</div>
-						
-						<div class="tab-pane fade active show" id="tab-cfg-audio">
-							<div class="card text-white bg-primary mb-3">
-								<div class="card-header">Usage Templates</div>
-								<div class="card-body">
-									<fieldset >
-										<fieldset class="form-group" id="output-tmpl">
-											<legend>Output</legend>
-											<div class="form-check">
-												<label class="form-check-label">
-												  <input type="radio" class="form-check-input" name="output-tmpl" id="i2s" >
-												  I2S Dac
-												</label>
-											</div>
-											<div class="form-check">
-												<label class="form-check-label">
-													<input type="radio" class="form-check-input" name="output-tmpl" id="spdif" >
-													SPDIF
-												</label>
-											</div>
-											<div class="form-check">
-												<label class="form-check-label">
-													<input type="radio" class="form-check-input" name="output-tmpl" id="bt" >
-													Bluetooth
-												</label>
-											</div>
-										</fieldset>
-										<div class="form-group"><label for="player">Player Name</label><input type="text" class="form-control " placeholder="Squeezelite" id="player" ></div>
-										<div class="form-group"><label for="optional">Optional setting (e.g. for LMS IP address)</label><input type="text" class="form-control"  id="optional" ></div>
-										<div class="form-group"><div class="form-check">
-											<label class="form-check-label">
-											  <input class="form-check-input" type="checkbox" id="disable-squeezelite" value="" checked="" >
-											  Disable Squeezelite
-											</label>
-										  </div></div>
-										<div class="toast show" role="alert" aria-live="assertive" aria-atomic="true" style="display: none;" id="toast_cfg-audio-tmpl"><div class="toast-header"><strong class="mr-auto">Result</strong><button type="button" class="ml-2 mb-1 close" data-dismiss="toast" aria-label="Close" onclick="$(this).parent().parent().hide()"><span aria-hidden="true">×</span></button></div><div class="toast-body" id="msg_cfg-audio-tmpl"></div></div>
-										<button id="save-autoexec1" type="submit"  class="btn btn-info" cmdname="cfg-audio-tmpl" onclick="save_autoexec1(false)">Save</button>	  
-										<button id="commit-autoexec1" type="submit"  class="btn btn-warning" cmdname="cfg-audio-tmpl" onclick="save_autoexec1(true)">Apply</button>
-								   </fieldset>
-								</div>
-							</div>
-						</div>                    
-					</div>
-                </div>
-				<div class="tab-pane fade " id="tab-commands">
-						<fieldset id="commands-list"></fieldset>
-				</div>
-				<!-- Status -->
-				<div class="tab-pane fade " id="tab-syslog">
-				<div class="card border-primary mb-3" >
-  				<div class="card-header">Logs</div>
-  				<div class="card-body">
-    			<table class="table table-hover">
-						<thead>
-							<tr>
-								<th scope="col">Timestamp</th>
-								<th scope="col">Message</th>
-							</tr>
-						</thead>
-						<tbody id="syslogTable">
-						</tbody>
-					</table>
-					<div class="buttons">
-						<input id="clear-syslog" type="button" class="btn btn-danger btn-sm" value="Clear" />
-					</div></div></div>
-				<div class="card border-primary mb-3">
-  				<div class="card-header">Pin Assignments</div>
-  				<div class="card-body">
-					<table class="table table-hover">
-						<thead><tr><th scope="col">Device</th><th scope="col">Pin Name</th><th scope="col">GPIO Number</th><th scope="col">Type</th></tr></thead>
-						<tbody id="gpiotable"></tbody></table></div></div>
-				<div class="card border-primary mb-3" style="visibility: collapse;" id="tasks_sect">
-					<div class="card-header">Tasks</div>
-					<div class="card-body">
-						<table class="table table-hover">
-							<!-- console.log(msg_time.toLocaleString() + '\tname' + '\tcpu' + '\tstate' + '\tminstk' + '\tbprio' + '\tcprio' + '\tnum'); -->
-							<thead><tr><th scope="col">#</th><th scope="col">Task Name</th><th scope="col">CPU</th><th scope="col">State</th><th scope="col">Min Stack</th><th scope="col">Base Priority</th><th scope="col">Cur Priority</th></tr></thead>
-							<tbody id="tasks"></tbody></table></div></div>					
-					</div>
-				<!-- syslog -->
-				<div class="tab-pane fade " id="tab-credits">
-					<div class="jumbotron">
-						<p><strong><a href="https://github.com/sle118/squeezelite-esp32">squeezelite-esp32</a></strong>, &copy; 2020, philippe44, sle118, daduke<br /><a href="https://opensource.org/licenses/MIT">This software is released under the MIT License.</a></p>
-						<p>
-							This app would not be possible without the following libraries:
-						</p>
-						<ul>
-							<li>squeezelite, &copy;  2012-2019, Adrian Smith and Ralph Irving. Licensed under the GPL License.</li>
-							<li>esp32-wifi-manager, &copy;  2017-2019, Tony Pottier. Licensed under the MIT License.</li>
-							<li>SpinKit, &copy;  2015, Tobias Ahlin. Licensed under the MIT License.</li>
-							<li>jQuery, The jQuery Foundation. Licensed under the MIT License.</li>
-							<li>cJSON, &copy; 2009-2017, Dave Gamble and cJSON contributors. Licensed under the MIT License.</li>
-							<li>esp32-rotary-encoder, &copy; 2011-2019, David Antliff and Ben Buxton. Licensed under the GPL License.</li>
-							<li>tarablessd1306, &copy; 2017-2018, Tara Keeling. Licensed under the MIT license.</li>
-						</ul>
-					</div>
-					<h2>Show NVS Editor</h2>
-					<div class="custom-control custom-switch">
-						<input type="checkbox" class="custom-control-input" id="show-nvs" checked="checked">
-						<label class="custom-control-label" for="show-nvs"></label>
-					</div>
-					<h2>Show Advanced Commands</h2>
-					<div class="custom-control custom-switch">
-						<input type="checkbox" class="custom-control-input" id="show-commands" checked="checked">
-						<label class="custom-control-label" for="show-commands"></label>
-					</div>
-				</div>
-				<!-- credits -->
-			</div>
-			<footer class="footer">
-				<button class="btn-warning" id="reboot_nav" type="submit" onclick="$('#reboot_nav').removeClass('active'); delay_reboot(500,'', false);" style="display: none;">Reboot</button>
-				<button class="btn-danger" id="reboot_ota_nav" type="submit" onclick="$('#reboot_ota_nav').removeClass('active'); delay_reboot(500,'', true);" style="display: none;">Exit Recovery</button><br>
-				<span id="foot-fw"></span><span id="foot-wifi"></span></footer>
-			<iframe width="0" height="0" border="0" name="dummyframe" id="dummyframe"></iframe>
-		</div>
-	</body>
-</html>

components/wifi-manager/webapp/.babelrc

@@ -0,0 +1,19 @@
+{
+  "presets": [
+    "@babel/preset-env",
+    "@babel/typescript"
+  ],
+  "env": {
+    "production": {
+      "presets": [
+        "minify"
+      ]
+    }
+  },
+  "plugins": [
+    "@babel/plugin-proposal-nullish-coalescing-operator",
+    "@babel/plugin-proposal-optional-chaining",
+    "@babel/plugin-transform-runtime",
+
+  ],
+}

components/wifi-manager/webapp/.eslintcache

@@ -0,0 +1 @@
+[{"C:\\Users\\sle11\\Documents\\VSCode\\squeezelite-esp32\\components\\wifi-manager\\webapp\\src\\js\\test.js":"1","C:\\Users\\sle11\\Documents\\VSCode\\squeezelite-esp32\\components\\wifi-manager\\webapp\\src\\js\\custom.js":"2"},{"size":4775,"mtime":1608244817341,"results":"3","hashOfConfig":"4"},{"size":52524,"mtime":1608525668984,"results":"5","hashOfConfig":"4"},{"filePath":"6","messages":"7","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"8"},"1lj4yrw",{"filePath":"9","messages":"10","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"C:\\Users\\sle11\\Documents\\VSCode\\squeezelite-esp32\\components\\wifi-manager\\webapp\\src\\js\\test.js",[],[],"C:\\Users\\sle11\\Documents\\VSCode\\squeezelite-esp32\\components\\wifi-manager\\webapp\\src\\js\\custom.js",[]]

components/wifi-manager/webapp/.eslintrc

@@ -0,0 +1,27 @@
+{
+  "parser": "babel-eslint",
+  "extends": "eslint:recommended",
+  "parserOptions": {
+    "ecmaVersion": 2020,
+    "ecmaFeatures": {
+      "modules": true
+    }
+  },
+  "env": {
+    "browser": true,
+    "es6": true,
+    "jquery": true
+  }  ,
+  "rules": {
+    "no-tabs": "off",
+    "semi": 0,
+    "comma-dangle": 0,
+    "require-jsdoc": ["off", {
+      "require": {
+        "FunctionDeclaration": true,
+        "MethodDefinition": false,
+        "ClassDeclaration": false
+      }
+    }]
+  }
+}

components/wifi-manager/webapp/.eslintrc.json.back

@@ -0,0 +1,18 @@
+{
+    "env": {
+        "browser": true,
+        "es6": true,
+        "jquery": true
+    },
+    "extends": "eslint:recommended",
+    "globals": {
+        "Atomics": "readonly",
+        "SharedArrayBuffer": "readonly"
+    },
+    "parserOptions": {
+        "ecmaVersion": 2018,
+        "sourceType": "module"
+    },
+    "rules": {
+    }
+}

components/wifi-manager/webapp/.gitignore

@@ -0,0 +1,4 @@
+node_modules
+.DS_Store
+.idea
+package-lock.json

components/wifi-manager/webapp/.vscode/launch.json

@@ -0,0 +1,12 @@
+{
+    "configurations": [
+        {
+            "type": "chrome",
+            "request": "launch",
+            "name": "Debug",
+            "preLaunchTask": "webpack: dev server",
+            "sourceMaps": true,
+            "trace": true
+          }
+    ]
+}

components/wifi-manager/webapp/.vscode/tasks.json

@@ -0,0 +1,42 @@
+{
+    "version": "2.0.0",
+    "tasks": [
+        // {
+        //     "label": "build",
+        //     "command": "webpack --config webpack/webpack.prod.js",
+        //     "type": "shell",
+        //     "group": { "kind": "build", "isDefault": true },
+        //     "isBackground": true
+        // },
+          
+        {
+            "type": "npm",
+            "label": "webpack: dev server",
+            "script": "dev",
+            "promptOnClose": true,
+            "isBackground": true,
+            "problemMatcher": {
+              "owner": "webpack",
+              "severity": "error",
+              "fileLocation": "absolute",
+              "pattern": [
+                {
+                  "regexp": "ERROR in (.*)",
+                  "file": 1
+                },
+                {
+                  "regexp": "\\((\\d+),(\\d+)\\):(.*)",
+                  "line": 1,
+                  "column": 2,
+                  "message": 3
+                }
+              ],
+              "background": {
+                "activeOnStart": true,
+                "beginsPattern": "Compiling\\.\\.\\.",
+                "endsPattern": "Compiled successfully\\."
+              }
+            }
+          }        
+    ]
+}

components/wifi-manager/webapp/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2019 AndyKorek
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

components/wifi-manager/webapp/README.md

@@ -0,0 +1,204 @@
+<h2 align="center">Boilerplate - Bootstrap v4 - SASS - JQuery - WebPack</h2>
+
+<p align="center">    
+            <a href="https://webpack.js.org/"><img alt="Webpack" src="https://img.shields.io/badge/Webpack-4.41.6-%238DD6F9.svg"></a>
+                <a href="https://babeljs.io/"><img alt="Webpack" src="https://img.shields.io/badge/Babel%2FCore-7.8.4-%23f5da55.svg"></a>
+                <a href="https://www.npmjs.com/package/gulp-sass"><img alt="node-sass" src="https://img.shields.io/badge/node--sass-v4.13.1-ff69b4.svg"></a>
+                <a href="https://jquery.com/"><img src="https://img.shields.io/badge/jQuery-3.3.1-blue.svg" alt="jquery"></a>
+                <a href="https://lodash.com/"><img src="https://img.shields.io/badge/lodash-4.17.15-blue.svg" alt="jquery"></a>
+                <a href="https://popper.js.org/"><img src="https://img.shields.io/badge/popper.js-2.0.6-blue.svg" alt="popper.js"></a>
+                <a href="https://eslint.org/"><img src="https://img.shields.io/badge/es--lint-5.15.1-%23463fd4.svg" alt="eslint"></a>
+                <a href="https://fontawesome.com/"><img alt="Font Awesome" src="https://img.shields.io/badge/Font--Awesome-5.12.1-blue.svg"></a>
+                <a href="https://icons8.com/line-awesome"><img alt="Line Awesome" src="https://img.shields.io/badge/Line%20Awesome-1.3.0-green"></a>
+</p>
+
+![webpack logo](https://abload.de/img/webpack1tkeb.png)
+![bootstrap logo](https://abload.de/img/bootstrap-logo-vector78khf.png)
+![babel logo](https://abload.de/img/2000px-babel_logo.svgrzkxw.png)
+![sass logo](https://abload.de/img/1280px-sass_logo_colo0bjb4.png)
+
+
+<p align="center">
+  <em>
+  SASS
+  · Babel
+  · Bootstrap
+  · JQuery
+  · PopperJS
+  · Font Awesome
+  </em>
+</p>
+
+This Webpack4-Sass Boilerplate contains the following features:
+
+- Webpack4 & Dev-Server
+- TypeScript 3.7.5
+- Babel ES6 Compiler
+- Bootstrap v4 - with Theme Support
+- Font Awesome v5.7
+- Animate.css Library v3.7.2
+- JQuery v3.3.1
+- PopperJS v2
+- _lodash
+- concentrate and minify JavaScript.
+- Compile, minify, Autoprefix SASS.
+- Optimize and Cache Images
+- Preconfigured BootsWatch Template (YETI & Slate)
+- Linting for your TS, JS and SASS
+
+## Features
+
+### Webpack Loaders & Plugins
+
+This project contains the following loaders & plugins:
+
+- `node-sass` for compiling sass (SCSS)
+- `babel-loader` for compiling ES6 code
+- `babel-eslint && eslint-loader` for Linting your .js
+- `tslint` for Linting your .ts 
+- `lodash-webpack-plugin` create smaller Lodash builds by replacing feature sets of modules with noop, identity, or simpler alternatives.
+- `webpack-dev-server` for serving & Hot-Reloading
+- `css-loader` for compressing css
+- `sass-loader` for compressing and loading scss & sass
+- `url- & file-loader` for loading and optimizing images
+- `xml and csv loader` for loading data files
+- `html-loader` for loading & optimizing html files
+- `clean-webpack-plugin` for keeping your dist folder clean
+- `favicons-webpack-plugin` generate favicons form your "logo.png"
+
+
+## Getting Started
+
+### Dependencies
+
+Make sure these are installed first.
+
+- [Node.js](http://nodejs.org)
+- [Webpack](https://webpack.js.org/guides/installation/)
+
+     `npm install --g webpack`
+
+<hr/>
+
+### Quick Start
+
+1. Clone the repo :
+      `git clone https://github.com/AndyKorek/webpack-boilerplate-sass-ts-bootstrap4-fontawesome.git`
+2. In bash/terminal/command line, `cd ` into project directory.
+3. Run `npm i` to install required dependencies.
+
+4. Run the Dev Server with (with Hot Reloading) `npm run dev`
+
+<hr/>
+
+### Build the Production Folder
+`npm run build`
+
+This will:
+
+- Bundle and Minify SASS(scss) to css & Hash and Cash it
+- generate GZip and Brodli Compressed Assets
+- Bundle and Minify JS
+- Optimize Images
+- Optimize HTML
+- generate Favicons
+
+<hr/>
+
+## Documentation
+
+### Workflow structure
+
+`src` - > source directory
+
+`dist` -> build directory
+
+
+```
+
+├── src
+│   ├── assets
+│   │   └── images
+│   ├── fonts
+│   ├── sass
+│   │   ├── layout
+|   |   |     └── _features.scss
+│   │   ├── setup
+|   |   |     └── _normalize.scss
+│   │   ├── themes
+|   |   |     ├── _slate.scss
+|   |   |     └── _yeti.scss
+│   │   ├── utils
+|   |   |     ├── _mixins.scss
+|   |   |     └── _variables.scss
+│   │   ├── _globals.scss
+│   │   ├── _headings.scss
+│   │   ├── _typography.scss
+│   │   ├── _vendor.scss
+│   │   └── main.scss
+│   ├── ts
+│   │   ├── custom.ts
+│   │   ├── line-awesome.ts
+│   │   ├── vendor.ts
+│   |── .htaccess
+│   |── 404.html
+│   |── index.html
+│   └── index.ts
+
+
+
+├── dist
+│   ├── assets
+│   │   ├── images
+│   │   └── 
+│   ├── css
+│   │   ├── vendors.[contenthash].css
+│   │   └── main.contenthash].css
+│   ├── js
+│   │   ├── main.[contenthash].js
+│   │   ├── runtime.[contenthash].js
+│   │   └── vendors.[contenthash].js
+│   │   
+│   └── index.html
+
+```
+### Loading the Features you need
+
+in  `src/js/vendor/_boostrap.js` uncomment all Features you need
+
+put your custom js to `src/js/_custom.js`
+
+
+<hr/>
+
+### Instructions
+
+- Add `sass`(.scss) files to `src/_scss` folder.
+
+    - Make sure you import the scss file in `main.scss`
+      ```
+      @import "filename";
+      ```
+- Add your assets to `src/assets/`
+
+- Add `images` to `src/assets/images`
+
+## TODO list
+
+- [x] Bootstrap 4
+- [x] Webpack 4
+- [x] Jquery
+- [x] PopperJS v2
+- [x] Include ES-Lint
+- [x] Font-Awesome
+- [x] Assets Loader
+- [x] Separated location for Bundled Files
+- [x] Adding EsLint
+- [ ] Code Optimising
+- [x] Uglify and Minify JS with Terser
+
+## Licence
+
+Code released under the [MIT License](https://github.com/AndyKorek/webpack4_boilerplate/blob/master/LICENSE).
+
+*</> with* :heart: *from Germany*

components/wifi-manager/webapp/config/.stylelintrc

@@ -0,0 +1,24 @@
+{
+  "extends": "stylelint-config-standard",
+  "rules": {
+    "no-duplicate-selectors": true,
+    "indentation": null,
+    "color-hex-case": "lower",
+    "color-hex-length": "long",
+    "selector-combinator-space-after": "never",
+    "declaration-block-trailing-semicolon": "always",
+    "declaration-colon-space-before": "never",
+    "declaration-colon-newline-after": null,
+    "comment-whitespace-inside": "always",
+    "comment-empty-line-before": null,
+    "selector-pseudo-class-parentheses-space-inside": "always",
+    "selector-list-comma-newline-after": null,
+    "media-feature-range-operator-space-before": "always",
+    "media-feature-range-operator-space-after": "always",
+    "media-feature-parentheses-space-inside": "always",
+    "media-feature-colon-space-before": "always",
+    "media-feature-colon-space-after": "always",
+    "no-eol-whitespace": null,
+    "no-missing-end-of-source-newline": null,
+    "number-leading-zero": "never"  }
+}

components/wifi-manager/webapp/debug.log

@@ -0,0 +1,3 @@
+[1211/165128.604:ERROR:directory_reader_win.cc(43)] FindFirstFile: Le chemin d<>acc<63>s sp<73>cifi<66> est introuvable. (0x3)
+[1212/063417.746:ERROR:directory_reader_win.cc(43)] FindFirstFile: Le chemin d<>acc<63>s sp<73>cifi<66> est introuvable. (0x3)
+[1213/063413.475:ERROR:directory_reader_win.cc(43)] FindFirstFile: Le chemin d<>acc<63>s sp<73>cifi<66> est introuvable. (0x3)

components/wifi-manager/webapp/mock/ap.json

@@ -8,5 +8,6 @@
 {"ssid":"The Shah 5GHz-2","chan":1,"rssi":-90,"auth":3},
 {"ssid":"SINGTEL-1D28 (2G)","chan":11,"rssi":-91,"auth":3},
 {"ssid":"dlink-F864","chan":1,"rssi":-92,"auth":4},
-{"ssid":"dlink-74F0","chan":1,"rssi":-93,"auth":4}
+{"ssid":"dlink-74F0","chan":1,"rssi":-93,"auth":4},
+{"ssid":"MyTestSSID","chan":2,"rssi":-53,"auth":4}
 ]

components/wifi-manager/webapp/mock/commands.json

@@ -1,117 +1,125 @@
 {
 	"commands":	[{
-			"help":	"Squeezelite Options",
+			"help":	"WiFi",
 			"hascb":	true,
 			"argtable":	[{
-					"datatype":	"<server>[:<port>]",
-					"glossary":	"Connect to specified server, otherwise uses autodiscovery to find server",
-					"longopts":	"server",
-					"shortopts":	"s",
+					"datatype":	"Fast|Comprehensive",
+					"glossary":	"Sets the WiFi Scan Mode. Use Comprehensive where more than one AP has the same name on different channels. This will ensure that the AP with the strongest signal is chosen.",
+					"longopts":	"scanmode",
 					"checkbox":	false,
 					"hasvalue":	true,
 					"mincount":	0,
 					"maxcount":	1
+				}],
+			"hint":	" [--scanmode=Fast|Comprehensive]",
+			"name":	"cfg-syst-wifi"
+		}, {
+			"help":	"Get the current size of free heap memory",
+			"hascb":	false,
+			"name":	"free"
+		}, {
+			"help":	"Services",
+			"hascb":	true,
+			"argtable":	[{
+					"glossary":	"Bluetooth Speaker",
+					"longopts":	"BT_Speaker",
+					"checkbox":	true,
+					"hasvalue":	false,
+					"mincount":	0,
+					"maxcount":	1
 				}, {
-					"datatype":	"<stream>:<output>",
-					"glossary":	"Internal Stream and Output buffer sizes in Kbytes",
-					"longopts":	"buffers",
-					"shortopts":	"b",
+					"glossary":	"AirPlay",
+					"longopts":	"AirPlay",
+					"checkbox":	true,
+					"hasvalue":	false,
+					"mincount":	0,
+					"maxcount":	1
+				}, {
+					"datatype":	"Disabled|Telnet Only|Telnet and Serial",
+					"glossary":	"Telnet server. Use only for troubleshooting",
+					"longopts":	"telnet",
+					"shortopts":	"t",
 					"checkbox":	false,
 					"hasvalue":	true,
 					"mincount":	0,
 					"maxcount":	1
-				}, {
-					"datatype":	"<codec1>,<codec2>",
-					"glossary":	"Restrict codecs to those specified, otherwise load all available codecs; known codecs",
-					"longopts":	"codecs",
-					"shortopts":	"c",
-					"checkbox":	false,
-					"hasvalue":	true,
-					"mincount":	0,
-					"maxcount":	20
-				}, {
-					"datatype":	"<n>",
-					"glossary":	"Close output device when idle after timeout seconds, default is to keep it open while player is 'on",
-					"longopts":	"timeout",
-					"shortopts":	"C",
-					"checkbox":	false,
-					"hasvalue":	true,
-					"mincount":	0,
-					"maxcount":	1
-				}, {
-					"datatype":	"log=level",
-					"glossary":	"Set logging level, logs: all|slimproto|stream|decode|output|ir, level: info|debug|sdebug",
-					"longopts":	"loglevel",
-					"shortopts":	"d",
-					"checkbox":	false,
-					"hasvalue":	true,
-					"mincount":	0,
-					"maxcount":	1
-				}, {
-					"datatype":	"<string>",
-					"glossary":	"Output device",
-					"longopts":	"output_device",
-					"shortopts":	"o",
-					"checkbox":	false,
-					"hasvalue":	true,
-					"mincount":	0,
-					"maxcount":	1
-				}, {
-					"datatype":	"<string>",
-					"glossary":	"Mac address, format: ab:cd:ef:12:34:56",
-					"longopts":	"mac_addr",
-					"shortopts":	"m",
-					"checkbox":	false,
-					"hasvalue":	true,
-					"mincount":	0,
-					"maxcount":	1
-				}, {
-					"datatype":	"<string>",
-					"glossary":	"Squeezelite player model name sent to the server",
-					"longopts":	"modelname",
-					"shortopts":	"M",
-					"checkbox":	false,
-					"hasvalue":	true,
-					"mincount":	0,
-					"maxcount":	1
-				}, {
-					"datatype":	"<string>",
-					"glossary":	"Player name",
+				}],
+			"hint":	" [--BT_Speaker] [--AirPlay] [-t Disabled|Telnet Only|Telnet and Serial]",
+			"name":	"cfg-syst-services"
+		}, {
+			"help":	"Get minimum size of free heap memory found during execution",
+			"hascb":	false,
+			"name":	"heap"
+		}, {
+			"help":	"Device Name",
+			"hascb":	true,
+			"argtable":	[{
+					"datatype":	"Bureau-OLED",
+					"glossary":	"New Name",
 					"longopts":	"name",
 					"shortopts":	"n",
 					"checkbox":	false,
 					"hasvalue":	true,
 					"mincount":	0,
 					"maxcount":	1
-				}, {
-					"glossary":	"Read wave and aiff format from header, ignore server parameters",
-					"longopts":	"header_format",
-					"shortopts":	"W",
-					"checkbox":	true,
-					"hasvalue":	false,
-					"mincount":	0,
-					"maxcount":	1
-				}, {
-					"datatype":	"<rates>[:<delay>]",
-					"glossary":	"Sample rates supported, allows output to be off when squeezelite is started; rates = <maxrate>|<minrate>-<maxrate>|<rate1>,<rate2>,<rate3>; delay = optional delay switching rates in ms\n",
-					"longopts":	"rates",
-					"shortopts":	"r",
-					"checkbox":	false,
-					"hasvalue":	true,
-					"mincount":	0,
-					"maxcount":	1
-				}, {
-					"datatype":	"<n>",
-					"glossary":	"Report rate to server in helo as the maximum sample rate we can support",
-					"longopts":	"max_rate",
-					"shortopts":	"Z",
+				}],
+			"hint":	" [-n Bureau-OLED]",
+			"name":	"cfg-syst-name"
+		}, {
+			"help":	"Get version of chip and SDK",
+			"hascb":	false,
+			"name":	"version"
+		}, {
+			"help":	"Reboot system",
+			"hascb":	false,
+			"name":	"restart"
+		}, {
+			"help":	"Reboot system to Recovery",
+			"hascb":	false,
+			"name":	"recovery"
+		}, {
+			"help":	"Reboot system to Squeezelite",
+			"hascb":	false,
+			"name":	"restart_ota"
+		}, {
+			"help":	"General Audio Options",
+			"hascb":	true,
+			"argtable":	[{
+					"datatype":	"Headphones|Subwoofer",
+					"glossary":	"On supported DAC, determines the audio jack behavior. Selecting headphones will cause the external amp to be muted on insert, while selecting Subwoofer will keep the amp active all the time.",
+					"longopts":	"jack_behavior",
+					"shortopts":	"j",
 					"checkbox":	false,
 					"hasvalue":	true,
 					"mincount":	0,
 					"maxcount":	1
 				}],
-			"hint":	" [-W] [-s <server>[:<port>]] [-b <stream>:<output>] [-c <codec1>,<codec2>]... [-C <n>] [-d log=level] [-o <string>] [-m <string>] [-M <string>] [-n <string>] [-r <rates>[:<delay>]] [-Z <n>]",
-			"name":	"cfg-syst-squeezelite"
+			"hint":	" [-j Headphones|Subwoofer]",
+			"name":	"cfg-audio-general"
+		}, {
+			"help":	"Bluetooth Audio Output Options",
+			"hascb":	true,
+			"argtable":	[{
+					"datatype":	"name",
+					"glossary":	"Bluetooth audio device name. This applies when output mode is Bluetooth",
+					"longopts":	"sink_name",
+					"shortopts":	"n",
+					"checkbox":	false,
+					"hasvalue":	true,
+					"mincount":	1,
+					"maxcount":	1
+				}, {
+					"datatype":	"pin",
+					"glossary":	"Bluetooth security/pin code. Usually 0000. This applies when output mode is Bluetooth",
+					"longopts":	"pin_code",
+					"shortopts":	"p",
+					"checkbox":	false,
+					"hasvalue":	true,
+					"mincount":	1,
+					"maxcount":	1
+				}],
+			"hint":	" -n name -p pin",
+			"name":	"cfg-audio-bt_source"
 		}, {
 			"help":	"DAC Options",
 			"hascb":	true,
@@ -156,7 +164,7 @@
 					"mincount":	0,
 					"maxcount":	1
 				}, {
-					"glossary":	"Mute active GPIO level",
+					"glossary":	"Mute GPIO level. Checked=HIGH, Unchecked=LOW",
 					"longopts":	"mute_level",
 					"checkbox":	true,
 					"hasvalue":	false,
@@ -197,80 +205,42 @@
 			"hint":	" --model_name=TAS57xx|TAS5713|AC101|I2S --clock=<n> --wordselect=<n> --data=<n> [--mute_gpio=<n>] [--mute_level] [--dac_sda=<n>] [--dac_scl=<n>] [--dac_i2c=<n>] [--clear]",
 			"name":	"cfg-hw-dac"
 		}, {
-			"help":	"Get the current size of free heap memory",
-			"hascb":	false,
-			"name":	"free"
-		}, {
-			"help":	"Services",
+			"help":	"SPDIF Options",
 			"hascb":	true,
 			"argtable":	[{
-					"glossary":	"Bluetooth Speaker",
-					"longopts":	"BT_Speaker",
-					"checkbox":	true,
-					"hasvalue":	false,
-					"mincount":	0,
-					"maxcount":	1
-				}, {
-					"glossary":	"AirPlay",
-					"longopts":	"AirPlay",
-					"checkbox":	true,
-					"hasvalue":	false,
-					"mincount":	0,
-					"maxcount":	1
-				}, {
-					"datatype":	"Disabled|Telnet Only|Telnet and Serial",
-					"glossary":	"Telnet server. Use only for troubleshooting",
-					"longopts":	"telnet",
-					"shortopts":	"t",
+					"datatype":	"<n>",
+					"glossary":	"Clock GPIO. e.g. 33",
+					"longopts":	"clock",
 					"checkbox":	false,
 					"hasvalue":	true,
-					"mincount":	0,
+					"mincount":	1,
 					"maxcount":	1
 				}, {
-					"glossary":	"System Statistics. Use only for troubleshooting",
-					"longopts":	"stats",
+					"datatype":	"<n>",
+					"glossary":	"Word Select GPIO. e.g. 25",
+					"longopts":	"wordselect",
+					"checkbox":	false,
+					"hasvalue":	true,
+					"mincount":	1,
+					"maxcount":	1
+				}, {
+					"datatype":	"<n>",
+					"glossary":	"Data GPIO. e.g. 32",
+					"longopts":	"data",
+					"checkbox":	false,
+					"hasvalue":	true,
+					"mincount":	1,
+					"maxcount":	1
+				}, {
+					"glossary":	"Clear configuration",
+					"longopts":	"clear",
 					"checkbox":	true,
 					"hasvalue":	false,
 					"mincount":	0,
 					"maxcount":	1
 				}],
-			"hint":	" [--BT_Speaker] [--AirPlay] [-t Disabled|Telnet Only|Telnet and Serial] [--stats]",
-			"name":	"cfg-syst-services"
-		}, {
-			"help":	"Get minimum size of free heap memory found during execution",
-			"hascb":	false,
-			"name":	"heap"
-		}, {
-			"help":	"Device Name",
-			"hascb":	true,
-			"argtable":	[{
-					"datatype":	"\"squeezelite-test3\"",
-					"glossary":	"New Name",
-					"longopts":	"name",
-					"shortopts":	"n",
-					"checkbox":	false,
-					"hasvalue":	true,
-					"mincount":	0,
-					"maxcount":	1
-				}],
-			"hint":	" [-n \"squeezelite-test3\"]",
-			"name":	"cfg-syst-name"
-		}, {
-			"help":	"Get version of chip and SDK",
-			"hascb":	false,
-			"name":	"version"
-		}, {
-			"help":	"Software reset of the chip",
-			"hascb":	false,
-			"name":	"restart"
-		}, {
-			"help":	"Resets and boot to recovery (if available)",
-			"hascb":	false,
-			"name":	"recovery"
-		}, {
-			"help":	"Selects the ota app partition to boot from and performa a software reset of the chip",
-			"hascb":	false,
-			"name":	"restart_ota"
+			"hint":	" --clock=<n> --wordselect=<n> --data=<n> [--clear]",
+			"name":	"cfg-hw-spdif"
 		}, {
 			"help":	"I2C Bus Parameters",
 			"hascb":	true,
@@ -310,14 +280,6 @@
 					"hasvalue":	true,
 					"mincount":	0,
 					"maxcount":	1
-				}, {
-					"glossary":	"Load Existing Configuration",
-					"longopts":	"load",
-					"shortopts":	"l",
-					"checkbox":	true,
-					"hasvalue":	false,
-					"mincount":	0,
-					"maxcount":	1
 				}, {
 					"glossary":	"Clear configuration",
 					"longopts":	"clear",
@@ -326,7 +288,7 @@
 					"mincount":	0,
 					"maxcount":	1
 				}],
-			"hint":	" [-l] [-p 0|1] [-f int] [-d <n>] [-c <n>] [--clear]",
+			"hint":	" [-p 0|1] [-f int] [-d <n>] [-c <n>] [--clear]",
 			"name":	"cfg-hw-i2c"
 		}, {
 			"help":	"SPI Bus Parameters",
@@ -359,7 +321,7 @@
 					"mincount":	0,
 					"maxcount":	1
 				}, {
-					"datatype":	"int",
+					"datatype":	"1|2",
 					"glossary":	"SPI Host Number",
 					"longopts":	"host",
 					"shortopts":	"h",
@@ -375,7 +337,7 @@
 					"mincount":	0,
 					"maxcount":	1
 				}],
-			"hint":	" [-d <n>] [-k <n>] [-c <n>] [-h int] [--clear]",
+			"hint":	" [-d <n>] [-k <n>] [-c <n>] [-h 1|2] [--clear]",
 			"name":	"cfg-hw-spi"
 		}, {
 			"help":	"Scan I2C bus for devices",
@@ -491,14 +453,23 @@
 					"mincount":	0,
 					"maxcount":	1
 				}, {
-					"datatype":	"<SH1106|SSD1306|SSD1322|SSD1326|SSD1327|SSD1675|SSD1351|ST77xx|ILI9341|>",
-					"glossary":	"Driver (default SSD1306)",
+					"datatype":	"<SH1106|SSD1306|SSD1322|SSD1326|SSD1327|SSD1675|SSD1351|ST7735|ST7789|ILI9341|>",
+					"glossary":	"Driver",
 					"longopts":	"driver",
 					"shortopts":	"d",
 					"checkbox":	false,
 					"hasvalue":	true,
 					"mincount":	0,
 					"maxcount":	1
+				}, {
+					"datatype":	"1|4",
+					"glossary":	"Bit Depth (only for SSD1326 displays)",
+					"longopts":	"depth",
+					"shortopts":	"p",
+					"checkbox":	false,
+					"hasvalue":	true,
+					"mincount":	0,
+					"maxcount":	1
 				}, {
 					"datatype":	"<n>",
 					"glossary":	"I2C address (default 60)",
@@ -515,7 +486,7 @@
 					"shortopts":	"w",
 					"checkbox":	false,
 					"hasvalue":	true,
-					"mincount":	0,
+					"mincount":	1,
 					"maxcount":	1
 				}, {
 					"datatype":	"<n>",
@@ -524,7 +495,7 @@
 					"shortopts":	"h",
 					"checkbox":	false,
 					"hasvalue":	true,
-					"mincount":	0,
+					"mincount":	1,
 					"maxcount":	1
 				}, {
 					"glossary":	"Rotate 180 degrees",
@@ -550,13 +521,22 @@
 					"maxcount":	1
 				}, {
 					"datatype":	"<n>",
-					"glossary":	"Bus Speed (Default 8000000 for SPI, 250000 for I2C). SPI interface can work up to 26MHz~40MHz",
+					"glossary":	"SPI Only. Bus Speed (Default 8000000). SPI interface can work up to 26MHz~40MHz",
 					"longopts":	"speed",
 					"shortopts":	"s",
 					"checkbox":	false,
 					"hasvalue":	true,
 					"mincount":	0,
 					"maxcount":	1
+				}, {
+					"datatype":	"<n>",
+					"glossary":	"SPI Only. CS GPIO (for SPI displays)",
+					"longopts":	"cs",
+					"shortopts":	"b",
+					"checkbox":	false,
+					"hasvalue":	true,
+					"mincount":	0,
+					"maxcount":	1
 				}, {
 					"datatype":	"<n>",
 					"glossary":	"Backlight GPIO (if applicable)",
@@ -566,6 +546,14 @@
 					"hasvalue":	true,
 					"mincount":	0,
 					"maxcount":	1
+				}, {
+					"datatype":	"<n>",
+					"glossary":	"Reset GPIO",
+					"longopts":	"reset",
+					"checkbox":	false,
+					"hasvalue":	true,
+					"mincount":	0,
+					"maxcount":	1
 				}, {
 					"glossary":	"clear configuration and return",
 					"longopts":	"clear",
@@ -574,77 +562,56 @@
 					"mincount":	0,
 					"maxcount":	1
 				}],
-			"hint":	" [-r] [-t <I2C|SPI>] [-d <SH1106|SSD1306|SSD1322|SSD1326|SSD1327|SSD1675|SSD1351|ST77xx|ILI9341|>] [-a <n>] [-w <n>] [-h <n>] [--hf] [--vf] [-s <n>] [-b <n>] [--clear]",
+			"hint":	" [-r] [-t <I2C|SPI>] [-d <SH1106|SSD1306|SSD1322|SSD1326|SSD1327|SSD1675|SSD1351|ST7735|ST7789|ILI9341|>] [-p 1|4] [-a <n>] -w <n> -h <n> [--hf] [--vf] [-s <n>] [-b <n>] [-b <n>] [--reset=<n>] [--clear]",
 			"name":	"cfg-hw-display"
-		}, {
-			"help":	"Shows display options and global i2c configuration",
-			"hascb":	false,
-			"name":	"getdisplay"
-		}, {
-			"help":	"Stop the I2C bus",
-			"hascb":	false,
-			"argtable":	[{
-					"datatype":	"<0|1>",
-					"glossary":	"I2C bus port number",
-					"longopts":	"port",
-					"shortopts":	"p",
-					"checkbox":	false,
-					"hasvalue":	true,
-					"mincount":	0,
-					"maxcount":	1
-				}],
-			"hint":	" [-p <0|1>]",
-			"name":	"i2cstop"
-		}, {
-			"help":	"Check if the I2C bus is installed",
-			"hascb":	false,
-			"argtable":	[{
-					"datatype":	"<0|1>",
-					"glossary":	"Set the I2C bus port number",
-					"longopts":	"port",
-					"shortopts":	"p",
-					"checkbox":	false,
-					"hasvalue":	true,
-					"mincount":	0,
-					"maxcount":	1
-				}],
-			"hint":	" [-p <0|1>]",
-			"name":	"i2ccheck"
 		}],
 	"values":	{
-		"cfg-syst-squeezelite":	{
-			"buffers":	"500:2000",
-			"header_format":	true,
-			"loglevel":	"all=info",
-			"output_device":	"I2S",
-			"name":	"squeezelite",
-			"timeout":	30
-		},
-		"cfg-hw-dac":	{
-			"model_name":	"i2s"
+		"cfg-syst-wifi":	{
+			"scanmode":	"Fast"
 		},
 		"cfg-syst-services":	{
-			"BT_Speaker":	false,
-			"AirPlay":	false,
-			"telnet":	"Telnet and Serial",
-			"stats":	true
+			"BT_Speaker":	true,
+			"AirPlay":	true,
+			"telnet":	"Telnet Only"
 		},
 		"cfg-syst-name":	{
-			"name":	"\"squeezelite-test3\""
+			"name":	"Bureau-OLED"
+		},
+		"cfg-audio-general":	{
+			"jack_behavior":	"Subwoofer"
+		},
+		"cfg-audio-bt_source":	{
+			"sink_name":	"SMSL BT4.2",
+			"pin_code":	"0000"
+		},
+		"cfg-hw-dac":	{
+			"clock":	33,
+			"wordselect":	25,
+			"data":	32,
+			"model_name":	"I2S"
+		},
+		"cfg-hw-spdif":	{
 		},
 		"cfg-hw-i2c":	{
-			"freq":	400000
+			"speed":	400000
 		},
 		"cfg-hw-spi":	{
+			"data":	4,
+			"clk":	5,
+			"dc":	18,
+			"host":	1
 		},
 		"cfg-hw-display":	{
-			"address":	0,
-			"width":	0,
-			"height":	0,
-			"driver":	"SSD1306",
+			"width":	256,
+			"height":	64,
+			"reset":	21,
+			"driver":	"SSD1322",
+			"cs":	19,
+			"speed":	16000000,
+			"type":	"SPI",
+			"rotate":	false,
 			"hf":	false,
-			"vf":	false,
-			"rotate":	false
+			"vf":	false
 		}
 	}
 }

components/wifi-manager/webapp/mock/messages.json

@@ -52,5 +52,27 @@
 		"class":	"MESSAGING_CLASS_STATS",
 		"sent_time":	141256,
 		"current_time":	147319
+	},
+	{
+		"message":	"Wifi connected",
+		"type":	"MESSAGING_INFO",
+		"class":	"MESSAGING_CLASS_SYSTEM",
+		"sent_time":	141256,
+		"current_time":	147319
+	},
+	{
+		"message":	"[{\n\t\t\"name\":\t\"SMSL BT4.2\",\n\t\t\"rssi\":\t-64\n\t}]",
+		"type":	"MESSAGING_INFO",
+		"class":	"MESSAGING_CLASS_BT",
+		"sent_time":	6245,
+		"current_time":	6364
+	}, {
+		"message":	"[{\n\t\t\"name\":\t\"SMSL BT4.2\",\n\t\t\"rssi\":\t-129\n\t}]",
+		"type":	"MESSAGING_INFO",
+		"class":	"MESSAGING_CLASS_BT",
+		"sent_time":	6259,
+		"current_time":	6364
 	}
+	
+	
 	]

components/wifi-manager/webapp/mock/status.json

@@ -1,6 +1,6 @@
 {
-	"project_name": "recovery",
-	"version": "custom.build",
+	"project_name": "dev-server",
+	"version": "webpack",
 	"recovery": 1,
 	"Jack": "1",
 	"Voltage": 0,
@@ -9,6 +9,8 @@
 	"is_i2c_locked": false,
 	"urc": 0,
 	"bt_status": 0,
+	"bt_sub_status": 0,
+	"rssi": -59,
 	"ssid": "MyTestSSID",
 	"ip": "192.168.10.225",
 	"netmask": "255.255.255.0",

components/wifi-manager/webapp/mock/statusdefinition.json

@@ -0,0 +1,24 @@
+{
+	"urc": {
+		"Wifi Connection OK": 0,
+		"Wifi Failed Connect Attempt": 1,
+		"WiFi User Disconnect": 2,
+		"WiFi Lost Connection": 3
+	},
+	"bt_status": {
+		"Idle": 0,
+		"Discovering": 1,
+		"Discovered": 2,
+		"Unconnected": 3,
+		"Connecting": 4,
+		"Connected": 5,
+		"Disconnecting": 6
+	},
+	"bt_sub_status": {
+		"Default": 0,
+		"Connected - Starting": 1,
+		"Connected - Started": 2,
+		"Connected - Pause": 3,
+		"Connected - Stop": 4
+	}
+}

components/wifi-manager/webapp/package.json

@@ -0,0 +1,133 @@
+{
+  "name": "squeezelite-esp32",
+  "version": "0.5.0",
+  "main": "src/index.html",
+  "repository": "git@github.com:sle118/squeezelite-esp32.git",
+  "author": "Andy K., Sebastien",
+  "license": "MIT",
+  "scripts": {
+    "dev": "webpack-dev-server --open --config webpack/webpack.dev.js",
+    "build": "webpack --config webpack/webpack.prod.js",
+    "prod": "webpack-dev-server --open --config webpack/webpack.prod.js"
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  },
+  "dependencies": {
+    "@popperjs/core": "^2.0.6",
+    "@types/bootstrap": "^4.3.1",
+    "animate.css": "^3.7.2",
+    "bootstrap": "^4.5.3",
+    "bootswatch": "^4.4.1",
+    "commander": "^6.2.0",
+    "expose-loader": "^1.0.3",
+    "hamburgers": "^1.1.3",
+    "jquery": "^3.3.1",
+    "line-awesome": "^1.3.0",
+    "lodash": "^4.17.15",
+    "perfect-scrollbar": "^1.5.0",
+    "popper": "^1.0.1",
+    "react": "^17.0.1",
+    "remixicon": "^2.5.0",
+    "stylelint-config-standard": "^20.0.0",
+    "svgo": "^1.3.2",
+    "webpack-icons-installer": "^2.0.0"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.12.10",
+    "@babel/plugin-proposal-nullish-coalescing-operator": "^7.12.1",
+    "@babel/plugin-proposal-optional-chaining": "^7.12.7",
+    "@babel/plugin-transform-runtime": "^7.12.10",
+    "@babel/preset-env": "^7.12.10",
+    "@babel/preset-typescript": "^7.8.3",
+    "@fullhuman/postcss-purgecss": "^1.3.0",
+    "@types/lodash": "^4.14.149",
+    "autoprefixer": "^9.7.4",
+    "babel-eslint": "^10.0.3",
+    "babel-loader": "^8.2.2",
+    "babel-preset-minify": "^0.5.1",
+    "body-parser": "^1.19.0",
+    "browser-sync": "^2.26.7",
+    "browser-sync-webpack-plugin": "^2.2.2",
+    "browserlist": "^1.0.1",
+    "clean-webpack-plugin": "^2.0.0",
+    "compression-webpack-plugin": "^2.0.0",
+    "cross-env": "^5.2.1",
+    "css-loader": "^0.28.11",
+    "cssnano": "^4.1.10",
+    "eslint": "^7.0.0",
+    "eslint-config-google": "^0.9.1",
+    "eslint-webpack-plugin": "^2.4.1",
+    "extract-text-webpack-plugin": "^4.0.0-beta.0",
+    "favicons-webpack-plugin": "0.0.9",
+    "file-loader": "^1.1.11",
+    "glob": "^7.1.6",
+    "glob-all": "^3.2.1",
+    "html-loader": "^0.5.5",
+    "html-webpack-plugin": "^3.0.7",
+    "image-webpack-loader": "^7.0.1",
+    "imagemin-mozjpeg": "^8.0.0",
+    "imagemin-webpack-plugin": "^2.4.2",
+    "img-loader": "^3.0.1",
+    "install": "^0.10.4",
+    "less": "^3.13.0",
+    "lodash-webpack-plugin": "^0.11.5",
+    "mini-css-extract-plugin": "^0.5.0",
+    "miragejs": "^0.1.41",
+    "node-sass": "^4.13.1",
+    "offline-plugin": "^5.0.7",
+    "on-build-webpack": "^0.1.0",
+    "optimize-css-assets-webpack-plugin": "^5.0.3",
+    "postcss-loader": "^3.0.0",
+    "preload-webpack-plugin": "^2.3.0",
+    "purgecss-webpack-plugin": "^3.1.3",
+    "purify-css": "^1.2.5",
+    "purifycss-webpack": "^0.7.0",
+    "raw-loader": "^2.0.0",
+    "resolve-url-loader": "^3.1.1",
+    "sass-loader": "^6.0.7",
+    "script-ext-html-webpack-plugin": "^2.1.4",
+    "source-map-loader": "^0.2.4",
+    "style-loader": "^0.20.3",
+    "stylelint": "^13.2.0",
+    "stylelint-config-recommended": "^3.0.0",
+    "stylelint-webpack-plugin": "^1.2.3",
+    "svg-sprite-loader": "^5.2.1",
+    "svg-transform-loader": "^2.0.13",
+    "svgo-loader": "^2.2.1",
+    "terser-webpack-plugin": "^1.4.3",
+    "ts-loader": "^6.2.1",
+    "tslint": "^5.20.1",
+    "tslint-webpack-plugin": "^2.1.0",
+    "typescript": "^3.7.5",
+    "url-loader": "^1.1.2",
+    "webpack": "^4.44.2",
+    "webpack-bundle-analyzer": "^4.3.0",
+    "webpack-cli": "^3.3.11",
+    "webpack-dev-server": "^3.10.3",
+    "webpack-merge": "^4.2.2",
+    "xml-loader": "^1.2.1"
+  },
+  "keywords": [
+    "webppack4",
+    "sass",
+    "bootstrap4",
+    "jquery",
+    "popperjs",
+    "livereload",
+    "dev-server",
+    "font-awesome",
+    "es-lint",
+    "typescript",
+    "line-awesome"
+  ]
+}

components/wifi-manager/webapp/postcss.config.js

@@ -0,0 +1,3 @@
+module.exports = {
+
+};

components/wifi-manager/webapp/src/.htaccess

@@ -0,0 +1,37 @@
+ <IfModule mod_expires.c>
+      ExpiresActive On
+      ExpiresDefault "access plus 1 days"
+      ExpiresByType text/html "access plus 5 minutes"
+      ExpiresByType text/xml "access plus 6 hours"
+      ExpiresByType text/css "access plus 1 weeks"
+      ExpiresByType text/javascript "access plus 1 weeks"
+      ExpiresByType application/javascript "access plus 1 weeks"
+      ExpiresByType application/x-javascript "access plus 1 weeks"
+      ExpiresByType text/ecmascript "access plus 1 weeks"
+      ExpiresByType image/gif "access plus 1 years"
+      ExpiresByType image/png "access plus 1 years"
+      ExpiresByType image/jpeg "access plus 1 years"
+      ExpiresByType image/ico "access plus 1 years"
+      ExpiresByType image/icon "access plus 1 years"
+      ExpiresByType image/x-icon "access plus 1 years"
+      ExpiresByType video/x-flv "access plus 1 years"
+      ExpiresByType video/quicktime "access plus 1 years"
+      ExpiresByType application/x-shockwave-flash "access plus 1 years"
+      ExpiresByType application/pdf "access plus 1 years"
+    </IfModule>
+
+    # gzip Compression if availiable
+AddEncoding gzip .gzip
+<IfModule mod_deflate.c>
+ AddOutputFilterByType DEFLATE text/plain
+ AddOutputFilterByType DEFLATE text/html
+ AddOutputFilterByType DEFLATE text/xml
+ AddOutputFilterByType DEFLATE text/css
+ AddOutputFilterByType DEFLATE text/javascript
+ AddOutputFilterByType DEFLATE application/xml
+ AddOutputFilterByType DEFLATE application/xhtml+xml
+ AddOutputFilterByType DEFLATE application/rss+xml
+ AddOutputFilterByType DEFLATE application/javascript
+ AddOutputFilterByType DEFLATE application/x-javascript
+ AddOutputFilterByType DEFLATE application/x-shockwave-flash
+</IfModule>

components/wifi-manager/webapp/src/index.ejs

@@ -0,0 +1,439 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+	<meta charset="utf-8" />
+	<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">
+	<meta name="apple-mobile-web-app-capable" content="yes" />
+	<title>SqueezeESP32</title>
+
+</head>
+ 
+<body>
+	<div style="display:none">
+        <% if (htmlWebpackPlugin.files.sprites) { %>
+            <% for (var spriteFileName in htmlWebpackPlugin.files.sprites) { %>
+              <%= htmlWebpackPlugin.files.sprites[spriteFileName] %>
+            <% } %>
+          <% }  %>
+        </div>          
+	<nav class="navbar navbar-expand-sm navbar-dark bg-primary" id="mainnav">
+		<a class="navbar-brand" id="navtitle" href="#">SqueezeESP32</a>
+		<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
+			aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
+			<span class="navbar-toggler-icon"></span>
+		</button>
+		<div class="collapse navbar-collapse" id="navbarSupportedContent">
+			<ul class="nav navbar-nav mr-auto">
+				<li class="nav-item"><a class="nav-link active" data-toggle="tab" href="#tab-wifi">WiFi</a></li>
+				<li class="nav-item"><a class="nav-link" data-toggle="tab" href="#tab-syslog">Status<span
+							class="badge badge-pill badge-success" id="msgcnt"></span></a></li>
+				<li class="nav-item"><a class="nav-link" data-toggle="tab" href="#tab-cfg-audio">Audio</a></li>
+				<li class="nav-item"><a class="nav-link" data-toggle="tab" href="#tab-cfg-syst">System</a></li>
+				<li class="nav-item"><a class="nav-link" data-toggle="tab" href="#tab-cfg-hw">Hardware</a></li>
+				<li class="nav-item"><a class="nav-link" data-toggle="tab" href="#tab-cfg-fw">Updates</a></li>
+				<div class="dropdown-divider"></div>
+				<li class="nav-item"><a class="nav-link" data-toggle="tab" href="#tab-nvs">NVS Editor</a></li>
+				<li class="nav-item"><a class="nav-link" data-toggle="tab" href="#tab-commands">Advanced</a></li>
+				<li class="nav-item"><a class="nav-link" data-toggle="tab" href="#tab-credits">Credits</a></li>
+			</ul>
+
+		</div>
+		<div class="info navbar-right" style="display: inline-flex;">
+			<svg class="recovery_element bg-primary" style="fill:orange; width:1.5rem; height: 1.5rem;">
+				<use xlink:href="#device-recover-fill"></use>
+			</svg>
+
+			<svg style="fill:white; width:1.5rem; height: 1.5rem;">
+				<use id="battery" xlink:href="#battery-fill"></use>
+			</svg>
+			<svg  id="o_jack"  style="fill:white; width:1.5rem; height: 1.5rem;">
+				<use  xlink:href="#headphone-fill"></use>
+			</svg>
+			<svg   style="fill:white; width:1.5rem; height: 1.5rem;">
+				<use id="o_bt"   xlink:href="#bluetooth-fill"></use>
+			</svg>	
+			<span data-toggle="tooltip" id="o_type" data-placement="top" title=""><svg
+					xmlns="http://www.w3.org/2000/svg" id="output" width="24" height="24" viewBox="0 0 24 24">
+					<g id="o_i2s" display="none">
+						<path
+							d="M2 7L2 8L2 9L2 10L2 11L2 12L2 13L2 14L2 15L2 16L2 17L3 17L3 16L3 15L3 14L3 13L3 12L3 11L3 10L3 9L3 8L2 7M6 7L6 8L6 9L7 9L7 8L8 8L9 8L10 8L10 9L11 9L11 10L11 11L10 11L10 12L9 12L9 13L8 13L8 14L7 14L7 15L6 15L6 16L6 17L7 17L8 17L9 17L10 17L11 17L12 17L12 16L11 16L10 16L9 16L8 16L8 15L9 15L9 14L10 14L10 13L11 13L11 12L12 12L12 11L12 10L12 9L12 8L11 8L11 7L10 7L9 7L8 7L6 7M16 7L16 8L15 8L15 9L15 10L15 11L16 11L16 12L17 12L18 12L18 13L19 13L20 13L21 13L21 14L21 15L20 15L20 16L19 16L18 16L17 16L16 16L16 15L15 15L15 16L15 17L16 17L17 17L18 17L19 17L20 17L21 17L21 16L22 16L22 15L22 14L22 13L21 13L21 12L20 12L20 11L19 11L18 11L17 11L16 11L16 10L16 9L17 9L17 8L18 8L19 8L20 8L21 8L21 9L22 9L22 8L22 7L21 7L20 7L19 7L18 7L16 7z" />
+					</g>
+					<g id="o_spdif" display="none">
+						<path
+							d="M3 1L3 2L2 2L2 3L2 4L2 5L3 5L3 6L4 6L5 6L5 7L6 7L7 7L8 7L8 8L8 9L7 9L7 10L6 10L5 10L4 10L3 10L3 9L2 9L2 10L2 11L3 11L4 11L5 11L6 11L7 11L8 11L8 10L9 10L9 9L9 8L9 7L8 7L8 6L7 6L7 5L6 5L5 5L4 5L3 5L3 4L3 3L4 3L4 2L5 2L6 2L7 2L8 2L8 3L9 3L9 2L9 1L8 1L7 1L6 1L5 1L3 1M13 1L13 2L13 3L13 4L12 4L12 5L12 6L12 7L12 8L11 8L11 9L11 10L11 11L10 11L10 12L10 13L11 13L11 12L11 11L12 11L12 10L12 9L12 8L13 8L13 7L13 6L13 5L14 5L14 4L14 3L14 2L15 2L15 1L13 1M16 1L16 2L16 3L16 4L16 5L16 6L16 7L16 8L16 9L16 10L16 11L17 11L17 10L17 9L17 8L17 7L18 7L19 7L20 7L21 7L21 6L22 6L22 5L22 4L22 3L22 2L21 2L21 1L20 1L19 1L18 1L16 1z" />
+						<path style="fill:#272B30;"
+							d="M17 2L17 3L17 4L17 5L17 6L18 6L19 6L20 6L20 5L21 5L21 4L21 3L20 3L20 2L19 2L17 2z" />
+						<path
+							d="M2 13L2 14L2 15L2 16L2 17L2 18L2 19L2 20L2 21L2 22L2 23L3 23L4 23L5 23L6 23L7 23L8 23L8 22L9 22L9 21L10 21L10 20L10 19L10 18L10 17L10 16L10 15L9 15L9 14L8 14L7 14L7 13L6 13L5 13L4 13L2 13M13 13L13 14L13 15L13 16L13 17L13 18L13 19L13 20L13 21L13 22L13 23L14 23L14 22L14 21L14 20L14 19L14 18L14 17L14 16L14 15L14 14L13 13M17 13L17 14L17 15L17 16L17 17L17 18L17 19L17 20L17 21L17 22L17 23L18 23L18 22L18 21L18 20L18 19L18 18L19 18L20 18L21 18L22 18L22 17L21 17L20 17L19 17L18 17L18 16L18 15L18 14L19 14L20 14L21 14L22 14L22 13L21 13L20 13L19 13L17 13z" />
+						<path style="fill:#272B30;"
+							d="M3 14L3 15L3 16L3 17L3 18L3 19L3 20L3 21L3 22L4 22L5 22L6 22L7 22L7 21L8 21L8 20L9 20L9 19L9 18L9 17L9 16L8 16L8 15L7 15L7 14L6 14L5 14L3 14z" />
+					</g>
+				</svg></span>
+				<svg   style="fill:white; width:1.5rem; height: 1.5rem;">
+					<use id="wifiStsIcon"   xlink:href="#signal-wifi-fill"></use>
+				</svg>	
+				
+
+
+		</div>
+	</nav>
+	<div id="message"></div>
+	<div id="content">
+		<div id="myTabContent" class="tab-content mt-3">
+			<div class="tab-pane fade" id="tab-cfg-hw"></div>
+			<div class="tab-pane fade" id="tab-cfg-syst"></div>
+			<div class="tab-pane fade" id="tab-cfg-gen"></div>
+			<div class="tab-pane fade" id="tab-cfg-fw">
+				<div id="boot-div">
+					<form id="boot-form" action="/recovery.json" method="post" target="dummyframe">
+						<button id="boot-button" type="submit" class="btn btn-primary">Recovery</button>
+					</form>
+				</div>
+				<h1>Check for firmware upgrade</h1>
+				<div class="buttons">
+					<input type="button" id="fwcheck" class="btn btn-info" value="Check for updates" />
+				</div>
+				<div id="searchfw" class="form-group">
+					<select class="custom-select" id="fwbranch">
+						<option selected="">Choose FW branch</option>
+					</select>
+					<input class="form-control form-control-sm" id="searchinput" type="text"
+						placeholder="search releases" id="inputSmall">
+				</div>
+				<table class="table table-hover">
+					<thead>
+						<tr>
+							<th scope="col">Firmware version</th>
+							<th scope="col">Release date/time</th>
+							<th scope="col">HW platform</th>
+							<th scope="col">IDF version</th>
+							<th scope="col">Branch</th>
+							<th scope="col">Flash this FW</th>
+						</tr>
+					</thead>
+					<tbody id="releaseTable">
+					</tbody>
+				</table>
+				<h2>Firmware URL:</h2>
+				<textarea id="fwurl" maxlength="1000"></textarea>
+				<div class="buttons">
+					<input type="button" id="flash" class="btn btn-danger" value="Flash!" /><span
+						id="flash-status"></span>
+				</div>
+				<div id="uploaddiv" class="recovery_element">
+					<p>OR</p>
+					<div class="form-group">
+						<input type="file" class="form-control-file" id="flashfilename" aria-describedby="fileHelp">
+						<div class="buttons">
+							<button type="button" class="btn btn-danger" id="fwUpload">Upload!</button>
+						</div>
+					</div>
+				</div>
+				<div id="otadiv" class="recovery_element">
+					<div class="progress" id="progress">
+						<div class="progress-bar" role="progressbar" aria-valuemin="0" aria-valuemax="100"
+							style="width:0%">
+							0%
+						</div>
+					</div>
+				</div>
+			</div>
+			<div class="tab-pane fade" id="tab-nvs">
+				<table class="table table-hover">
+					<thead>
+						<tr>
+							<th scope="col">Key</th>
+							<th scope="col">Value</th>
+						</tr>
+					</thead>
+					<tbody id="nvsTable">
+					</tbody>
+				</table>
+				<div class="buttons">
+					<div id="boot-div">
+						<form id="reboot-form" action="/reboot.json" method="post" target="dummyframe">
+							<button id="reboot-button" type="submit" class="btn btn-primary">Reboot</button>
+						</form>
+					</div>
+					<input id="save-nvs" type="button" class="btn btn-success" value="Commit">
+					<input id="save-as-nvs" type="button" class="btn btn-success" value="Download config">
+					<input id="load-nvs" type="button" class="btn btn-success" value="Load File">
+					<input aria-describedby="fileHelp" onchange="onChooseFile(event, onFileLoad.bind(this))"
+						id="nvsfilename" type="file" style="display:none">
+				</div>
+			</div>
+
+			<div class="tab-pane fade" id="tab-cfg-audio">
+				<div class="card text-white bg-primary mb-3">
+					<div class="card-header">Usage Templates</div>
+					<div class="card-body">
+						<fieldset>
+							<fieldset class="form-group" id="output-tmpl">
+								<legend>Output</legend>
+								<div class="form-check">
+									<label class="form-check-label">
+										<input type="radio" class="form-check-input" name="output-tmpl" id="i2s">
+										I2S Dac
+									</label>
+								</div>
+								<div class="form-check">
+									<label class="form-check-label">
+										<input type="radio" class="form-check-input" name="output-tmpl" id="spdif">
+										SPDIF
+									</label>
+								</div>
+								<div class="form-check">
+									<label class="form-check-label">
+										<input type="radio" class="form-check-input" name="output-tmpl" id="bt">
+										Bluetooth
+									</label>
+								</div>
+							</fieldset>
+							<div class="form-group"><label for="player">Player Name</label><input type="text"
+									class="form-control " placeholder="Squeezelite" id="player"></div>
+							<div class="form-group"><label for="optional">Optional setting (e.g. for LMS IP
+									address)</label><input type="text" class="form-control" id="optional"></div>
+							<div class="form-group">
+								<div class="form-check">
+									<label class="form-check-label">
+										<input class="form-check-input" type="checkbox" id="disable-squeezelite"
+											value="" checked="">
+										Disable Squeezelite
+									</label>
+								</div>
+							</div>
+							<div class="toast show" role="alert" aria-live="assertive" aria-atomic="true"
+								style="display: none;" id="toast_cfg-audio-tmpl">
+								<div class="toast-header"><strong class="mr-auto">Result</strong><button type="button"
+										class="ml-2 mb-1 close" data-dismiss="toast" aria-label="Close"
+										onclick="hideSurrounding(this)"><span aria-hidden="true">×</span></button></div>
+								<div class="toast-body" id="msg_cfg-audio-tmpl"></div>
+							</div>
+							<button id="save-autoexec1" type="submit" class="btn btn-info" cmdname="cfg-audio-tmpl"
+								onclick="saveAutoexec1(false)">Save</button>
+							<button id="commit-autoexec1" type="submit" class="btn btn-warning" cmdname="cfg-audio-tmpl"
+								onclick="saveAutoexec1(true)">Apply</button>
+						</fieldset>
+					</div>
+				</div>
+			</div>
+			<div class="tab-pane fade active show" id="tab-wifi">
+				<div class="card text-white bg-primary mb-3">
+					<div class="card-header">WiFi Status</div>
+					<div class="card-body">
+						<table class="table table-hover">
+							<thead>
+								<tr>
+									<th scope="col">Joined</th>
+									<th scope="col">Name</th>
+									<th scope="col">Signal</th>
+									<th scope="col">Security</th>
+								</tr>
+							</thead>
+							<tbody id="wifiTable"></tbody>
+						</table>
+						<button type="button" id="updateAP" class="btn btn-info btn-sm">Scan</button>
+
+					</div>
+					<div class="modal" id="WiFiDisconnectConfirm">
+						<div class="modal-dialog modal-dialog-centered" role="document">
+							<div class="modal-content">
+								<div class="modal-header">
+									<h5 class="modal-title">Disconnect</h5>
+									<button type="button" class="close" data-dismiss="modal" aria-label="Close">
+										<span aria-hidden="true">&times;</span>
+									</button>
+								</div>
+								<div class="modal-body">
+									<p>Disconnect from network? After disconnecting, the system won't be accessible from the current address and will expose itself as access point name <span id="apName"></span> with password <span id="apPass"></span>  </p>
+								</div>
+								<div class="modal-footer connecting-success connecting-status">
+									<button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
+									<button type="button" class="btn btn-warning" data-dismiss="modal"
+										onclick="handleDisconnect();">Ok</button>
+								</div>
+							</div>
+						</div>
+					</div>
+					<div class="modal" id="WifiConnectDialog">
+						<div class="modal-dialog modal-dialog-centered" role="document">
+							<div class="modal-content">
+								<div class="modal-header">
+									<h5 class="modal-title connecting connecting-init connecting-fail">Connect to WiFi</h5>
+									<h5 class="modal-title connecting-status connecting-success">Status</h5>
+									<button type="button" class="close" data-dismiss="modal" aria-label="Close">
+										<span aria-hidden="true">&times;</span>
+									</button>
+								</div>
+								<div class="modal-body">
+									<fieldset class="connecting-init connecting-fail">
+										<div class="form-group"><label for="manual_ssid">Wifi Name</label><input
+												type="text" class="form-control" placeholder="Enter Name"
+												id="manual_ssid"></div>
+										<div class="form-group"><label for="manual_pwd">Password</label><input
+												type="password" class="form-control" placeholder="Enter Name"
+												id="manual_pwd"></div>
+									</fieldset>
+									<div id="connect-wait" class="connecting">
+										<div>Connecting to <span id="ssid-wait"></span> </div>
+									<div>
+												You may lose wifi access while the esp32 recalibrates
+													its radio. Please
+													wait until your device automatically reconnects. This can take up to
+													30s.
+												</div>
+									</div>
+									<div id="connect-success" class="connecting-success connecting-status">
+										<div> Connected to Access Point : <span id="connectedToSSID"></span></div>
+										<div> Device IP address : <span id="ipAddress"></span></div>
+										<div>Subnet Mask:<span id="netmask"></span></div>
+										<div>Default Gateway:<span id="gateway"></span></div>
+									</div>
+									<div id="connect-fail" class="connecting-fail">
+										<h3 class="text-error">Connection failed</h3>
+										<p >Please double-check wifi password if any and make sure the access point has good signal.</p>
+									</div>
+								</div>
+								<div class="modal-footer ">
+									<button type="button" class="btn btn-secondary connecting-init connecting-fail connecting" data-dismiss="modal">Close</button>
+									<button type="button" id="btnJoin" class="btn btn-primary connecting-init connecting-fail"
+										onclick="handleConnect();">Join</button>
+									<button type="button" class="connecting btn btn-primary" disabled>
+										<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>
+											<span class="sr-only">Connecting...</span></button>
+								</div>
+
+								<div class="modal-footer connecting-success connecting-status">
+									<button type="button" class="btn btn-warning" data-toggle="modal"
+										data-dismiss="modal" data-target="#WiFiDisconnectConfirm">Disconnect</button>
+									<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
+								</div>
+
+							</div>
+						</div>
+					</div>
+
+				</div>
+			</div>
+			<div class="tab-pane fade " id="tab-commands">
+				<fieldset id="commands-list"></fieldset>
+			</div>
+			<!-- Status -->
+			<div class="tab-pane fade " id="tab-syslog">
+				<div class="card border-primary mb-3">
+					<div class="card-header">Logs</div>
+					<div class="card-body">
+						<table class="table table-hover">
+							<thead>
+								<tr>
+									<th scope="col">Timestamp</th>
+									<th scope="col">Message</th>
+								</tr>
+							</thead>
+							<tbody id="syslogTable">
+							</tbody>
+						</table>
+						<div class="buttons">
+							<input id="clear-syslog" type="button" class="btn btn-danger btn-sm" value="Clear" />
+						</div>
+					</div>
+				</div>
+				<div class="card border-primary mb-3">
+					<div class="card-header">Pin Assignments</div>
+					<div class="card-body">
+						<table class="table table-hover">
+							<thead>
+								<tr>
+									<th scope="col">Device</th>
+									<th scope="col">Pin Name</th>
+									<th scope="col">GPIO Number</th>
+									<th scope="col">Type</th>
+								</tr>
+							</thead>
+							<tbody id="gpiotable"></tbody>
+						</table>
+					</div>
+				</div>
+				<div class="card border-primary mb-3" style="visibility: collapse;" id="tasks_sect">
+					<div class="card-header">Tasks</div>
+					<div class="card-body">
+						<table class="table table-hover">
+							<!-- console.log(msg_time.toLocaleString() + '\tname' + '\tcpu' + '\tstate' + '\tminstk' + '\tbprio' + '\tcprio' + '\tnum'); -->
+							<thead>
+								<tr>
+									<th scope="col">#</th>
+									<th scope="col">Task Name</th>
+									<th scope="col">CPU</th>
+									<th scope="col">State</th>
+									<th scope="col">Min Stack</th>
+									<th scope="col">Base Priority</th>
+									<th scope="col">Cur Priority</th>
+								</tr>
+							</thead>
+							<tbody id="tasks"></tbody>
+						</table>
+					</div>
+				</div>
+			</div>
+			<!-- syslog -->
+			<div class="tab-pane fade " id="tab-credits">
+				<div class="card text-white bg-primary mb-3">
+					<div class="card-header">Credits</div>
+					<div class="card-body">
+						<p><strong><a
+									href="https://github.com/sle118/squeezelite-esp32">squeezelite-esp32</a><br></strong>&copy;
+							2020, philippe44, sle118, daduke<br /><a href="https://opensource.org/licenses/MIT">This
+								software is released under the MIT License.</a></p>
+						<p>
+							This app would not be possible without the following libraries:
+						</p>
+						<ul>
+							<li>squeezelite, &copy; 2012-2019, Adrian Smith and Ralph Irving. Licensed under the GPL
+								License.</li>
+							<li>esp32-wifi-manager, &copy; 2017-2019, Tony Pottier. Licensed under the MIT License.</li>
+							<li>SpinKit, &copy; 2015, Tobias Ahlin. Licensed under the MIT License.</li>
+							<li>jQuery, The jQuery Foundation. Licensed under the MIT License.</li>
+							<li>cJSON, &copy; 2009-2017, Dave Gamble and cJSON contributors. Licensed under the MIT
+								License.
+							</li>
+							<li>esp32-rotary-encoder, &copy; 2011-2019, David Antliff and Ben Buxton. Licensed under the
+								GPL
+								License.</li>
+							<li>tarablessd1306, &copy; 2017-2018, Tara Keeling. Licensed under the MIT license.</li>
+						</ul>
+					</div>
+				</div>
+				<div class="card text-white bg-primary mb-3">
+					<div class="card-header">Extras/Overrides</div>
+					<div class="card-body">
+						<fieldset>
+							<div class="form-check">
+								<label class="form-check-label"><input type="checkbox" id="show-nvs"
+										class="form-check-input " value="">Show NVS Editor</label>
+							</div>
+						</fieldset>
+						<fieldset>
+							<div class="form-check">
+								<label class="form-check-label"><input type="checkbox" id="show-commands"
+										class="form-check-input " value="">Show Advanced Commands</label>
+							</div>
+						</fieldset>
+					</div>
+				</div>
+			</div>
+			<!-- credits -->
+		</div>
+
+	</div>
+	<footer class="footer bg-primary text.primary">
+		<button class="btn-warning ota_element" id="reboot_nav" type="submit" onclick="handleReboot(false);"
+			style="display: none;">Reboot</button>
+		<button class="btn-danger recovery_element" id="reboot_ota_nav" type="submit" onclick="handleReboot(true);"
+			style="display: none;">Exit Recovery</button><br>
+		<span id="foot-fw"></span><span id="foot-wifi"></span>
+	</footer>
+	</div>
+</body>
+
+</html>

components/wifi-manager/webapp/src/index.ts

@@ -0,0 +1,24 @@
+//import $ from "jquery";
+import 'bootstrap';
+import '../src/sass/main.scss';
+import '../node_modules/remixicon/icons/Device/signal-wifi-fill.svg';
+import '../node_modules/remixicon/icons/Device/signal-wifi-3-fill.svg';
+import '../node_modules/remixicon/icons/Device/signal-wifi-2-fill.svg';
+import '../node_modules/remixicon/icons/Device/signal-wifi-1-fill.svg';
+import '../node_modules/remixicon/icons/Device/signal-wifi-line.svg';
+import '../node_modules/remixicon/icons/Device/battery-line.svg';
+import '../node_modules/remixicon/icons/Device/battery-low-line.svg';
+import '../node_modules/remixicon/icons/Device/battery-fill.svg';
+
+import '../node_modules/remixicon/icons/Media/headphone-fill.svg';
+import '../node_modules/remixicon/icons/Device/device-recover-fill.svg';
+import '../node_modules/remixicon/icons/Device/bluetooth-fill.svg';
+import '../node_modules/remixicon/icons/Device/bluetooth-connect-fill.svg';
+import '../node_modules/remixicon/icons/Media/stop-circle-fill.svg';
+import '../node_modules/remixicon/icons/Media/play-circle-fill.svg';
+import '../node_modules/remixicon/icons/Media/pause-circle-fill.svg';
+import '../node_modules/remixicon/icons/System/lock-fill.svg';
+import '../node_modules/remixicon/icons/System/lock-unlock-fill.svg';
+
+import './js/custom.js'; 
+// <%= `<svg><use xlink:href="#${htmlWebpackPlugin.files.sprites.svg.defs.symbol[s].id}"></use></svg>` %>

components/wifi-manager/webapp/src/js/test.js

@@ -0,0 +1,135 @@
+let sd = {};
+let rf=false;
+function getStatus() {
+        const config = {};
+        window.$(`#valuesTable input:text,  #valuesTable input:checked`).each(function(_index, entry) {
+            switch (entry.attributes.dtype.value) {
+                case 'string':
+                    config[entry.name] = entry.value;
+                    break;
+                    case 'number':
+                    config[entry.name] = Number(entry.value);
+                break;
+                case 'boolean':
+                    config[entry.name] = entry.value=='true';
+                break;
+                default:
+                    break;
+            }
+            
+        });     
+        return config;       
+    }   
+
+    // function getOptions(entry)  {
+    //     let output='';
+    //     for (const property in entry) { 
+    //         output+=`<option value="${entry[property]}">${property}</option>`;
+    //     }
+    //     return output;
+    // }
+    function getRadioButton(entry){
+        let output='';
+        for (const property in sd[entry]) { 
+            output+=`
+            <div class="custom-control custom-radio">
+            <input type="radio" class="custom-control-input" id="${entry}_${sd[entry][property]}" name="${entry}" value="${sd[entry][property]}" dtype='${typeof(sd[entry][property])}'>
+            <label class="custom-control-label" for="${entry}_${sd[entry][property]}">${property}</label>
+            </div>
+            `;
+        }
+        return output;
+
+    }
+
+    window.refreshStatus = function() {
+        if(Object.keys(sd).length>0){
+            if(rf) return;
+            rf=true;
+            window.$.getJSON('/status.json', function(data) {
+                for (const property in data) {
+                    const val = data[property];
+                    let input = $(`#val_${property}, #valuesTable input[name="${property}"]`) ;
+                    if(input.length>0){
+                        if(input.is(':radio') ){
+                            $(`#${property}_${val ?? 0}`).prop('checked',true);
+                        }
+                        else {
+                            if(input.val() !==val && !input.is(":focus")){
+                                input.val(val);
+                            }
+                        }
+
+                    }
+                    else {
+                        
+                        if(sd[property]){
+                            window.$('#valuesTable').append(
+                                `<tr><td>${property}</td>
+                                <td >
+                                ${getRadioButton(property)}
+                                </td></tr>`);
+                            $(`#${property}_${val ?? 0}`).prop('checked',true);
+                        }
+                        else {
+                            window.$('#valuesTable').append(`<tr><td>${property}</td><td><input type='text' class='value form-control nvs' id="val_${property}" name='${property}' dtype='${typeof(val)}' ></input></td></tr>`);
+                            window.$(`#val_${property}`).val(val);
+                        }
+
+
+                    }
+
+                }
+            })
+            .fail(function() {
+
+            })
+            .done(function(){
+                rf=false;
+            });
+
+        }
+        else {
+            window.$.getJSON('/statusdefinition.json', function(data) {
+                sd=data;
+            })
+            .fail(function() {
+
+            })
+            .done(function(){
+            });                                
+        }
+
+    }
+    function pushStatus(){
+        const data = {
+                timestamp: Date.now(),
+                status:  getStatus()
+            };
+            window.$.ajax({
+                url: '/status.json',
+                dataType: 'text',
+                method: 'POST',
+                cache: false,
+                contentType: 'application/json; charset=utf-8',
+                data: JSON.stringify(data),
+            });
+            console.log('sent config JSON with data:', JSON.stringify(data));
+    }
+
+    window.$(document).ready(function() {
+        window.$('#save_status').on('click', function() {
+            pushStatus();
+        });            
+        window.$( "#valuesTable" ).change(function() {
+            pushStatus();
+        });            
+        
+        setInterval(window.refreshStatus, 1000);
+        $('svg >> symbol').each(function() { 
+            $('#allIcons').append( `<svg style="fill:white; width:1.5rem; height: 1.5rem;">
+            <use xlink:href="#${this.id}"></use>
+          </svg>`);
+         });
+         
+    }) ;

components/wifi-manager/webapp/src/sass/layout/_features.scss

@@ -0,0 +1,34 @@
+.features:hover {
+  cursor: pointer;
+  animation: jello-horizontal 1.2s;
+}
+
+@keyframes jello-horizontal {
+  0% {
+    transform: scale3d(1, 1, 1);
+  }
+
+  30% {
+    transform: scale3d(1.25, .75, 1);
+  }
+
+  40% {
+    transform: scale3d(.75, 1.25, 1);
+  }
+
+  50% {
+    transform: scale3d(1.15, .85, 1);
+  }
+
+  65% {
+    transform: scale3d(.95, 1.05, 1);
+  }
+
+  75% {
+    transform: scale3d(1.05, .95, 1);
+  }
+
+  100% {
+    transform: scale3d(1, 1, 1);
+  }
+}

components/wifi-manager/webapp/src/sass/main.scss

@@ -0,0 +1,5 @@
+@import 'themes/darkly';
+@import "utils/style";
+@import "utils/mixins";
+@import "setup/normalize";
+@import "layout/features";

components/wifi-manager/webapp/src/sass/setup/_normalize.scss

@@ -0,0 +1,348 @@
+/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
+
+/* Document
+   ========================================================================== */
+
+/**
+ * 1. Correct the line height in all browsers.
+ * 2. Prevent adjustments of font size after orientation changes in iOS.
+ */
+
+html {
+  line-height: 1.15; /* 1 */
+  -webkit-text-size-adjust: 100%; /* 2 */
+}
+
+/* Sections
+   ========================================================================== */
+
+/**
+ * Remove the margin in all browsers.
+ */
+
+body {
+  margin: 0;
+}
+
+/**
+ * Render the `main` element consistently in IE.
+ */
+
+main {
+  display: block;
+}
+
+/**
+ * Correct the font size and margin on `h1` elements within `section` and
+ * `article` contexts in Chrome, Firefox, and Safari.
+ */
+
+h1 {
+  font-size: 2em;
+  margin: .67em 0;
+}
+
+/* Grouping content
+   ========================================================================== */
+
+/**
+ * 1. Add the correct box sizing in Firefox.
+ * 2. Show the overflow in Edge and IE.
+ */
+
+hr {
+  box-sizing: content-box; /* 1 */
+  height: 0; /* 1 */
+  overflow: visible; /* 2 */
+}
+
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+
+pre {
+  font-family: monospace; /* 1 */
+  font-size: 1em; /* 2 */
+}
+
+/* Text-level semantics
+   ========================================================================== */
+
+/**
+ * Remove the gray background on active links in IE 10.
+ */
+
+a {
+  background-color: transparent;
+}
+
+/**
+ * 1. Remove the bottom border in Chrome 57-
+ * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
+ */
+
+abbr[title] {
+  border-bottom: none; /* 1 */
+  text-decoration: underline; /* 2 */
+}
+
+/**
+ * Add the correct font weight in Chrome, Edge, and Safari.
+ */
+
+b,
+strong {
+  font-weight: bolder;
+}
+
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+
+code,
+kbd,
+samp {
+  font-family: monospace; /* 1 */
+  font-size: 1em; /* 2 */
+}
+
+/**
+ * Add the correct font size in all browsers.
+ */
+
+small {
+  font-size: 80%;
+}
+
+/**
+ * Prevent `sub` and `sup` elements from affecting the line height in
+ * all browsers.
+ */
+
+sub,
+sup {
+  font-size: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline;
+}
+
+sub {
+  bottom: -.25em;
+}
+
+sup {
+  top: -.5em;
+}
+
+/* Embedded content
+   ========================================================================== */
+
+/**
+ * Remove the border on images inside links in IE 10.
+ */
+
+img {
+  border-style: none;
+}
+
+/* Forms
+   ========================================================================== */
+
+/**
+ * 1. Change the font styles in all browsers.
+ * 2. Remove the margin in Firefox and Safari.
+ */
+
+button,
+input,
+optgroup,
+select,
+textarea {
+  font-family: inherit; /* 1 */
+  font-size: 100%; /* 1 */
+  line-height: 1.15; /* 1 */
+  margin: 0; /* 2 */
+}
+
+/**
+ * Show the overflow in IE.
+ * 1. Show the overflow in Edge.
+ */
+
+button,
+input { /* 1 */
+  overflow: visible;
+}
+
+/**
+ * Remove the inheritance of text transform in Edge, Firefox, and IE.
+ * 1. Remove the inheritance of text transform in Firefox.
+ */
+
+button,
+select { /* 1 */
+  text-transform: none;
+}
+
+/**
+ * Correct the inability to style clickable types in iOS and Safari.
+ */
+
+button,
+[type="button"],
+[type="reset"],
+[type="submit"] {
+  -webkit-appearance: button;
+}
+
+/**
+ * Remove the inner border and padding in Firefox.
+ */
+
+button::-moz-focus-inner,
+[type="button"]::-moz-focus-inner,
+[type="reset"]::-moz-focus-inner,
+[type="submit"]::-moz-focus-inner {
+  border-style: none;
+  padding: 0;
+}
+
+/**
+ * Restore the focus styles unset by the previous rule.
+ */
+
+button:-moz-focusring,
+[type="button"]:-moz-focusring,
+[type="reset"]:-moz-focusring,
+[type="submit"]:-moz-focusring {
+  outline: 1px dotted ButtonText;
+}
+
+/**
+ * Correct the padding in Firefox.
+ */
+
+fieldset {
+  padding: .35em .75em .625em;
+}
+
+/**
+ * 1. Correct the text wrapping in Edge and IE.
+ * 2. Correct the color inheritance from `fieldset` elements in IE.
+ * 3. Remove the padding so developers are not caught out when they zero out
+ *    `fieldset` elements in all browsers.
+ */
+
+legend {
+  box-sizing: border-box; /* 1 */
+  color: inherit; /* 2 */
+  display: table; /* 1 */
+  max-width: 100%; /* 1 */
+  padding: 0; /* 3 */
+  white-space: normal; /* 1 */
+}
+
+/**
+ * Add the correct vertical alignment in Chrome, Firefox, and Opera.
+ */
+
+progress {
+  vertical-align: baseline;
+}
+
+/**
+ * Remove the default vertical scrollbar in IE 10+.
+ */
+
+textarea {
+  overflow: auto;
+}
+
+/**
+ * 1. Add the correct box sizing in IE 10.
+ * 2. Remove the padding in IE 10.
+ */
+
+[type="checkbox"],
+[type="radio"] {
+  box-sizing: border-box; /* 1 */
+  padding: 0; /* 2 */
+}
+
+/**
+ * Correct the cursor style of increment and decrement buttons in Chrome.
+ */
+
+[type="number"]::-webkit-inner-spin-button,
+[type="number"]::-webkit-outer-spin-button {
+  height: auto;
+}
+
+/**
+ * 1. Correct the odd appearance in Chrome and Safari.
+ * 2. Correct the outline style in Safari.
+ */
+
+[type="search"] {
+  -webkit-appearance: textfield; /* 1 */
+  outline-offset: -2px; /* 2 */
+}
+
+/**
+ * Remove the inner padding in Chrome and Safari on macOS.
+ */
+
+[type="search"]::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+/**
+ * 1. Correct the inability to style clickable types in iOS and Safari.
+ * 2. Change font properties to `inherit` in Safari.
+ */
+
+::-webkit-file-upload-button {
+  -webkit-appearance: button; /* 1 */
+  font: inherit; /* 2 */
+}
+
+/* Interactive
+   ========================================================================== */
+
+/*
+ * Add the correct display in Edge, IE 10+, and Firefox.
+ */
+
+details {
+  display: block;
+}
+
+/*
+ * Add the correct display in all browsers.
+ */
+
+summary {
+  display: list-item;
+}
+
+/* Misc
+   ========================================================================== */
+
+/**
+ * Add the correct display in IE 10+.
+ */
+
+template {
+  display: none;
+}
+
+/**
+ * Add the correct display in IE 10.
+ */
+
+[hidden] {
+  display: none;
+}

components/wifi-manager/webapp/src/sass/themes/_darkly.scss

@@ -0,0 +1,3 @@
+@import "~bootswatch/dist/darkly/variables";
+@import "~bootstrap/scss/bootstrap";
+@import "~bootswatch/dist/darkly/bootswatch";

components/wifi-manager/webapp/src/sass/utils/_mixins.scss

@@ -0,0 +1,24 @@
+
+/* Device = Most of the Smartphones Mobiles (Portrait) */
+$screen-xxs-min: 320px;
+$screen-xxs-max: 480px;
+
+/* Device = Low Resolution Tablets, Mobiles (Landscape) */
+$screen-xs-min: 481px;
+$screen-xs-max: 767px;
+
+/* Device = Tablets, Ipads (portrait) */
+$screen-sm-min: 768px;
+$screen-sm-max: 1024px;
+
+/* Device = Laptops, Desktops */
+$screen-md-min: 1025px;
+$screen-md-max: 1280px;
+
+/* Device = Desktops */
+$screen-lg-min: 1281px;
+$screen-lg-max: 1440px;
+
+/* Higher Resolution Screens */
+$screen-xlg-min: 1441px;
+$screen-xlg-max: 2560px;

components/wifi-manager/webapp/src/sass/utils/_style.css

@@ -14,6 +14,9 @@ a:hover {
     color: #99f;
     text-decoration: none
 }
+.glyphicon {
+    font-size: 18px;
+}
 input:focus,
 select:focus,
 textarea:focus,
@@ -133,43 +136,36 @@ h3 {
     float: right;
     margin-right: 20px;
 }
-.w0 {
-    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAACxIAAAsSAdLdfvwAAAAZdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuMTJDBGvsAAABzUlEQVRIS+WUTShEURTH3zyRhjQ+8hWxmCJMoSzEwsbCgi1LZRYW9pONptiwka9iI81CWFpYaEqNMkVKmpWN1IhYKN9ZDL/z3p3mxZh5g9X4168799xz/vPefedeLeuVC+3gdTgc07CsmCQ2DI2gg21Jci30wSpGt/CeghickTsHPVACDkgqp67rPgpO4E0ZZMIj7OHhxSvPtEyomcVDeFXJv+EZNvEsNa01rZfAuSUhThR2wU+ObJkbyhRNMMDaDIThBqy1MdZ3wAPawqfFC2Lj0Ab5kpBGxdAJs9TeW72ITUhCPZMjFYwwbwXpnkwlDzOIx50yXwP5c0MeggHGanNqSDqqBqQ7/Kxvg2zHAfMN8IE8uZhYO6eBnBXGKnOakLWfaQZ9jMRjSPXhZUuC5A9JjVFpKkeNSVVA0Tq8KJN0yFl4gilqbW2tm+SQKoybXIG8jcT34RSsh1Byt6iVg2ZLlRCg6JpROqEDpFheXZ5S9rcLFsl5YJwHad+MVA5y13w5lRY5oRsKjdm/Vz/7LR86zG+5wr+9NX+iOowjEO+aELEic+lv1ILppeUPosRst6QduTANgnE2mC+BnYswI1VwfYzCCL9dZij7pWkf6UeSTYAuE/QAAAAASUVORK5CYII=') no-repeat right top;
+/* .w0 {
+    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAACxIAAAsSAdLdfvwAAAAZdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuMTJDBGvsAAABzUlEQVRIS+WUTShEURTH3zyRhjQ+8hWxmCJMoSzEwsbCgi1LZRYW9pONptiwka9iI81CWFpYaEqNMkVKmpWN1IhYKN9ZDL/z3p3mxZh5g9X4168799xz/vPefedeLeuVC+3gdTgc07CsmCQ2DI2gg21Jci30wSpGt/CeghickTsHPVACDkgqp67rPgpO4E0ZZMIj7OHhxSvPtEyomcVDeFXJv+EZNvEsNa01rZfAuSUhThR2wU+ObJkbyhRNMMDaDIThBqy1MdZ3wAPawqfFC2Lj0Ab5kpBGxdAJs9TeW72ITUhCPZMjFYwwbwXpnkwlDzOIx50yXwP5c0MeggHGanNqSDqqBqQ7/Kxvg2zHAfMN8IE8uZhYO6eBnBXGKnOakLWfaQZ9jMRjSPXhZUuC5A9JjVFpKkeNSVVA0Tq8KJN0yFl4gilqbW2tm+SQKoybXIG8jcT34RSsh1Byt6iVg2ZLlRCg6JpROqEDpFheXZ5S9rcLFsl5YJwHad+MVA5y13w5lRY5oRsKjdm/Vz/7LR86zG+5wr+9NX+iOowjEO+aELEic+lv1ILppeUPosRst6QduTANgnE2mC+BnYswI1VwfYzCCL9dZij7pWkf6UeSTYAuE/QAAAAASUVORK5CYII=') no-repeat left top;
     height: 24px;
-    margin-right: 20px;
 }
 .w1 {
-    background:  url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAALEQAACxEBf2RfkQAAABl0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMC4xNkRpr/UAAAHiSURBVEhL5dRPKINxHMfxPVskpA35F3FYEVasHBYHFwcHrhyVZ8vBfblIceEi/4qLtINwdHCQUpQVKcnJRYqIg/J3OYz399nv0YPNtuzEt149+31/v+/n4fGYLVHpup4Rnyregd+K27TIghe63+8fx7wySqsPdbAj3qzha0MOV6ETiwTd4u0HUZxydgrtKISGj0xreG4gEAgycIRXFZCOR2yTQZSebeaa4Q1s7iOiDv/GM1bJLDJv0EHjzHLAdIFNjHBGHpkbxUo9utmbQBg3sM5G2d+AR24w82XznN4QmpGjXrCExRkXfJhk9t6aRW9YDtSwOFDNE9ZNyFLzKRczOegh406FL8ElG8JDM8S1Qtaq7KhEO0Y0TVtHGHusVxCEDy5oMLNqyVrgWm5kqaYw3mdVdmqQsENE8JbAPbY43yszMqiyHOr66QayL5XH0DJeVEgyUTxhjNmPR/vtBpZyc3hHDZohV5DfRvq7OMYtrDdZY7YwFpG8yhBi6JrrMFogww7IT1mOVsxy5oHrNIqRVpWgDtnGKn7log35xurfVxfPW/7QYT57Ybz7mapqgk9gvjU79ApiW5mpRkIvLTe4oJfyK5lKOQndgvG/wXoOSb8I061Svj4G0M9nZ6z198tmeweYtIrMYP17VAAAAABJRU5ErkJggg==') no-repeat right top;
+    background:  url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAALEQAACxEBf2RfkQAAABl0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMC4xNkRpr/UAAAHiSURBVEhL5dRPKINxHMfxPVskpA35F3FYEVasHBYHFwcHrhyVZ8vBfblIceEi/4qLtINwdHCQUpQVKcnJRYqIg/J3OYz399nv0YPNtuzEt149+31/v+/n4fGYLVHpup4Rnyregd+K27TIghe63+8fx7wySqsPdbAj3qzha0MOV6ETiwTd4u0HUZxydgrtKISGj0xreG4gEAgycIRXFZCOR2yTQZSebeaa4Q1s7iOiDv/GM1bJLDJv0EHjzHLAdIFNjHBGHpkbxUo9utmbQBg3sM5G2d+AR24w82XznN4QmpGjXrCExRkXfJhk9t6aRW9YDtSwOFDNE9ZNyFLzKRczOegh406FL8ElG8JDM8S1Qtaq7KhEO0Y0TVtHGHusVxCEDy5oMLNqyVrgWm5kqaYw3mdVdmqQsENE8JbAPbY43yszMqiyHOr66QayL5XH0DJeVEgyUTxhjNmPR/vtBpZyc3hHDZohV5DfRvq7OMYtrDdZY7YwFpG8yhBi6JrrMFogww7IT1mOVsxy5oHrNIqRVpWgDtnGKn7log35xurfVxfPW/7QYT57Ybz7mapqgk9gvjU79ApiW5mpRkIvLTe4oJfyK5lKOQndgvG/wXoOSb8I061Svj4G0M9nZ6z198tmeweYtIrMYP17VAAAAABJRU5ErkJggg==') no-repeat left top;
     height: 24px;
-    margin-right: 20px;
 }
 .w2 {
-    background:  url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAALEQAACxEBf2RfkQAAABl0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMC4xNkRpr/UAAAHkSURBVEhL3dRLKERRGMDxuSPSkLzyilgo8iiUhVjYWFiwZancmSzsZSPFho28io1kISwtLKQURZGSrGykiFgo7yyG/zdzznRm5iK5Sk79uvd85/u++5hzx2Pb9q9yDLrJMWhIRB1sv98/ghlliFAXyuGFU21IbECSi9CKORrd4O0TQZyQO45mZMJCpKfZ3BcIBPooOMSravAdD9ikB63sJN1XN69kcQ8vKvknnrBMzyx9gRYCp0aCdo51DJIjr6wU2UoF2lkbxS6uYdYGWV9DtVxgMmbxjFg/apEM/ZQfyUADxqi9M3sRG5CEEib7KnjMvAaye2IbfUVupoMet6r5PDL0YjXBBY4Fai5kRxVCdscg66uQ17HDfAl9kDuXJzB3Thk5sxzzZa6DumHknN3QS+IBPvvh5ZVskN8ZU5+gz3XAlELRIp5Vk6/It/CIYWrjXm3URCkleUsV6iaXkKeR+DaOYH6EkrtCrXxoUf2iJoY8LFB0xXEA9ZBieXS5S3m/jZgi557jBGT7xvWKCxhyIP81ka/SgQ9NSDViURyDbvpTo82yrAPscl4HKxR1aRTT+BhvyhaxtPCSO6OKphfGBc6JZYaX3BnpNN1AUC7AfBrJoRUXR67X6+1BN+fp4dD/Hx7PO4o9VGuAapKIAAAAAElFTkSuQmCC') no-repeat right top;
+    background:  url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAALEQAACxEBf2RfkQAAABl0RVh0U29mdHdhcmUAcGFpbnQubmV0IDQuMC4xNkRpr/UAAAHkSURBVEhL3dRLKERRGMDxuSPSkLzyilgo8iiUhVjYWFiwZancmSzsZSPFho28io1kISwtLKQURZGSrGykiFgo7yyG/zdzznRm5iK5Sk79uvd85/u++5hzx2Pb9q9yDLrJMWhIRB1sv98/ghlliFAXyuGFU21IbECSi9CKORrd4O0TQZyQO45mZMJCpKfZ3BcIBPooOMSravAdD9ikB63sJN1XN69kcQ8vKvknnrBMzyx9gRYCp0aCdo51DJIjr6wU2UoF2lkbxS6uYdYGWV9DtVxgMmbxjFg/apEM/ZQfyUADxqi9M3sRG5CEEib7KnjMvAaye2IbfUVupoMet6r5PDL0YjXBBY4Fai5kRxVCdscg66uQ17HDfAl9kDuXJzB3Thk5sxzzZa6DumHknN3QS+IBPvvh5ZVskN8ZU5+gz3XAlELRIp5Vk6/It/CIYWrjXm3URCkleUsV6iaXkKeR+DaOYH6EkrtCrXxoUf2iJoY8LFB0xXEA9ZBieXS5S3m/jZgi557jBGT7xvWKCxhyIP81ka/SgQ9NSDViURyDbvpTo82yrAPscl4HKxR1aRTT+BhvyhaxtPCSO6OKphfGBc6JZYaX3BnpNN1AUC7AfBrJoRUXR67X6+1BN+fp4dD/Hx7PO4o9VGuAapKIAAAAAElFTkSuQmCC') no-repeat left top;
     height: 24px;
-    margin-right: 20px;
 }
 .w3 {
-    background:  url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAZdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuMTZEaa/1AAACAElEQVRIS7XUP0gbYRjH8VSpiBZJWvEflXYQKtqACg6ig4uDg651LPQSHLpLlyDoUhdpVdBFxEG0YwcHCQgRFJSCFKcuUohY6iC0VYtD9PuE9w3vXZ74h16HD3fv733e53KX9y7ied5/pYZhUkPHQ3TBSyQS7zFvTBC9RivKoK3NCwZS3IxBLNLoBFc3yOEbtR/Qj8d4gEJPt3lVMpkcY8E+Lk2D+/iDTXrQyquwfW3zdiZ38dcU/4tzrNHzib3AAMGhU2BlsYFxauSRtaDWaMMwc1PYwU+4a3PMryMuF5gJTH4ne4dOVMLeZSkx9GCatb/cXmQpKXjOYM+EB4w7ILsn2Og28mNe0ePUNF9CzE7GCZc5NpmxkB31FLI7xpn/DHkc24xXMQb55XIH7s55Qc0Cx0YZ29A2LJyzG95S+AU3/fHySNLUjwTWl9tzG7iqWbSCC9PkNvIunGGStUWP1jcwWijOmIW2yTHkbiTfwle4L6HUfmKtvGi+fr6BowHLLPrBMYVuyGK5dfmV8nx7MUvNb44fIdu3qFdR4KiDfGsKb6WiCn145GQ+ahgmNQyTGpYwxPOWP3qHc/mE+76apaih4hmND2B3TYasJlCjUkPFS5oeORfIkhVtSY0aKqI0TSP/bjCew10+hPf6D+r5fIziDefRwFxJahgmNQyPF7kGEsc1es+A2E4AAAAASUVORK5CYII=') no-repeat right top;
+    background:  url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAZdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuMTZEaa/1AAACAElEQVRIS7XUP0gbYRjH8VSpiBZJWvEflXYQKtqACg6ig4uDg651LPQSHLpLlyDoUhdpVdBFxEG0YwcHCQgRFJSCFKcuUohY6iC0VYtD9PuE9w3vXZ74h16HD3fv733e53KX9y7ied5/pYZhUkPHQ3TBSyQS7zFvTBC9RivKoK3NCwZS3IxBLNLoBFc3yOEbtR/Qj8d4gEJPt3lVMpkcY8E+Lk2D+/iDTXrQyquwfW3zdiZ38dcU/4tzrNHzib3AAMGhU2BlsYFxauSRtaDWaMMwc1PYwU+4a3PMryMuF5gJTH4ne4dOVMLeZSkx9GCatb/cXmQpKXjOYM+EB4w7ILsn2Og28mNe0ePUNF9CzE7GCZc5NpmxkB31FLI7xpn/DHkc24xXMQb55XIH7s55Qc0Cx0YZ29A2LJyzG95S+AU3/fHySNLUjwTWl9tzG7iqWbSCC9PkNvIunGGStUWP1jcwWijOmIW2yTHkbiTfwle4L6HUfmKtvGi+fr6BowHLLPrBMYVuyGK5dfmV8nx7MUvNb44fIdu3qFdR4KiDfGsKb6WiCn145GQ+ahgmNQyTGpYwxPOWP3qHc/mE+76apaih4hmND2B3TYasJlCjUkPFS5oeORfIkhVtSY0aKqI0TSP/bjCew10+hPf6D+r5fIziDefRwFxJahgmNQyPF7kGEsc1es+A2E4AAAAASUVORK5CYII=') no-repeat left top;
     height: 24px;
-    margin-right: 20px;
-}
-.pw {
-    background:  url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAACxIAAAsSAdLdfvwAAAAZdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuMTJDBGvsAAABIUlEQVRIS+3VsU7CUBTGcYhBJCwqwcmEJ2DkCQgzb8ADmLgYWXTzMVjcGNjYGEAXgoSRhTg5OroYIyFY/h+hWGwvtzQ0LpzkF8i5l/uRQ2kTjuPEKrC5T79vzHWJO4wxwzeGuMY5AitsQBFvmEObvNQboQBfhQk4gQ5wD+zgBrcYrHrSwzE2KkxAHVrQWB6QgiqJLB7xA+2pYaNsAWm8QAsa0Sn+1gU+oT1NHGFdtoAcJtBCSw1DuaPqQiNdly0gj1doQaMwleavPc+IJUDffKeADO7Rxxe08A4dEOQD2qPXJ1xh+VuYAirQVaNGFFPov2MM0OXm/UAUZRwCtjoEWP1vQBXuLTgKPYRKMAacoY0oIboDNLB8+PgC4hLY3B8nsQCQEf56jLJoQAAAAABJRU5ErkJggg==') no-repeat right top;
+} */
+/* .pw {
+    background:  url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAACxIAAAsSAdLdfvwAAAAZdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuMTJDBGvsAAABIUlEQVRIS+3VsU7CUBTGcYhBJCwqwcmEJ2DkCQgzb8ADmLgYWXTzMVjcGNjYGEAXgoSRhTg5OroYIyFY/h+hWGwvtzQ0LpzkF8i5l/uRQ2kTjuPEKrC5T79vzHWJO4wxwzeGuMY5AitsQBFvmEObvNQboQBfhQk4gQ5wD+zgBrcYrHrSwzE2KkxAHVrQWB6QgiqJLB7xA+2pYaNsAWm8QAsa0Sn+1gU+oT1NHGFdtoAcJtBCSw1DuaPqQiNdly0gj1doQaMwleavPc+IJUDffKeADO7Rxxe08A4dEOQD2qPXJ1xh+VuYAirQVaNGFFPov2MM0OXm/UAUZRwCtjoEWP1vQBXuLTgKPYRKMAacoY0oIboDNLB8+PgC4hLY3B8nsQCQEf56jLJoQAAAAABJRU5ErkJggg==') no-repeat left top;
     height: 24px;
-    margin-right: 20px;
-    height: 24px;
-    margin-right: 30px;
-}
+} */
 /* SpinKit is licensed under the MIT License. Copyright (c) 2015 Tobias Ahlin */
-
 .spinner {
     width: 40px;
     height: 40px;
+  
     position: relative;
     margin: 100px auto;
-}
-.double-bounce1,
-.double-bounce2 {
+  }
+  
+  .double-bounce1, .double-bounce2 {
     width: 100%;
     height: 100%;
     border-radius: 50%;
@@ -178,35 +174,34 @@ h3 {
     position: absolute;
     top: 0;
     left: 0;
-    -webkit-animation: sk-bounce 2.0s infinite ease-in-out;
-    animation: sk-bounce 2.0s infinite ease-in-out;
-}
-.double-bounce2 {
+    
+    -webkit-animation: bounce 2.0s infinite ease-in-out;
+    animation: bounce 2.0s infinite ease-in-out;
+  }
+  
+  .double-bounce2 {
     -webkit-animation-delay: -1.0s;
     animation-delay: -1.0s;
-}
-@-webkit-keyframes sk-bounce {
-    0%, 100% {
-        -webkit-transform: scale(0.0)
+  }
+  
+  @-webkit-keyframes bounce {
+    0%, 100% { -webkit-transform: scale(0.0) }
+    50% { -webkit-transform: scale(1.0) }
+  }
+  
+  @keyframes bounce {
+    0%, 100% { 
+      transform: scale(0.0);
+      -webkit-transform: scale(0.0);
+    } 50% { 
+      transform: scale(1.0);
+      -webkit-transform: scale(1.0);
     }
-    50% {
-        -webkit-transform: scale(1.0)
-    }
-}
-@keyframes sk-bounce {
-    0%, 100% {
-        transform: scale(0.0);
-        -webkit-transform: scale(0.0);
-    }
-    50% {
-        transform: scale(1.0);
-        -webkit-transform: scale(1.0);
-    }
-}
+  }
 /* end of SpinKit */
 
 /* daduke stuff */
-input[type='text'], input[type='password'], textarea {
+input[type='text'], input[type='password'], textarea, select, option {
   background: #999;
   border: 0;
   padding: 4px;
@@ -259,8 +254,8 @@ input[type='text'], input[type='password'], textarea {
 
 .custom-switch .custom-control-input:checked ~ .custom-control-label::after {
   background-color: #fff;
-  -webkit-transform: translateX(1.5rem); //translateX(0.75rem);
-  transform: translateX(1.5rem); //translateX(0.75rem);
+  -webkit-transform: translateX(1.5rem); 
+  transform: translateX(1.5rem); 
 }
 
 textarea#autoexec1, textarea#fwurl, div#upload {
@@ -314,12 +309,13 @@ span#flash-status {
     font-size: 120%;
 }
 
-#info {
+/* #info {
     padding-top: 7px;
     float: right;
-}
+    display: grid;
+} */
 
-svg#battery {
+/* svg#battery {
     fill: #ddd;
 }
 
@@ -331,15 +327,20 @@ svg#output {
 svg#jack {
     fill: #ddd;
     padding-right: 4px;
-}
-
+} */
+/* 
 ul#navbar {
     border-bottom: 0px;
 }
+.navbar-nav {
+    float: left;
+    margin: 0;
+    padding-top: 1rem;
 
+}
 #content {
     border-top: 1px solid black;
-}
+} */
 
 .footer {
   position: fixed;
@@ -365,12 +366,6 @@ td.value {
 #boot-div {
     float: right;
 }
-
-iframe#dummyframe {
-    float: right;
-    border: none;
-}
-
 div#message {
     display: none;
     color: #000;

components/wifi-manager/webapp/src/test.ejs

@@ -0,0 +1,122 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <title>esp32-wifi-manager testing</title>
+    <link rel="icon" type="image/png" sizes="32x32" href="assets/images/favicon-32x32.png">
+
+</head>
+
+<body>
+
+    <div style="display:none">
+        <% if (htmlWebpackPlugin.files.sprites) { %>
+            <% for (var spriteFileName in htmlWebpackPlugin.files.sprites) { %>
+                <%= htmlWebpackPlugin.files.sprites[spriteFileName] %>
+                    <% } %>
+                        <% } %>
+    </div>
+    <div id="allIcons"></div>
+    <div class="card border-primary mb-3">
+        <div class="card-header">Status Variables</div>
+        <div class="card-body">
+            <table class="table table-hover">
+                <thead>
+                    <tr>
+                        <th scope="col">Variable</th>
+                        <th scope="col">Value</th>
+                    </tr>
+                </thead>
+                <tbody id="valuesTable">
+                </tbody>
+            </table>
+            <input id="save_status" type="button" class="btn btn-success" value="Commit">
+
+        </div>
+    </div>
+
+
+
+    <div>
+        <table class="table table-hover">
+            <thead>
+                <tr>
+                    <th scope="col">#</th>
+                    <th scope="col">BT State</th>
+                    <th scope="col">Sub state #</th>
+                    <th scope="col">Sub state</th>
+                </tr>
+            </thead>
+            <tbody>
+                <tr>
+                    <td>0</td>
+                    <td>Idle</td>
+                    <td>0</td>
+                    <td>bt_neutral</td>
+                </tr>
+                <tr>
+                    <td>1</td>
+                    <td>Discovering</td>
+                    <td>0</td>
+                    <td>bt_searching</td>
+                </tr>
+                <tr>
+                    <td>2</td>
+                    <td>Discovered</td>
+                    <td>0</td>
+                    <td>bt_searching</td>
+                </tr>
+                <tr>
+                    <td>3</td>
+                    <td>Unconnected</td>
+                    <td>0</td>
+                    <td>bt_disabled</td>
+                </tr>
+                <tr>
+                    <td>4</td>
+                    <td>Connecting</td>
+                    <td>0</td>
+                    <td>bt_disabled</td>
+                </tr>
+                <tr>
+                    <td>5</td>
+                    <td>Connected</td>
+                    <td>0</td>
+                    <td>bt_connected</td>
+                </tr>
+                <tr>
+                    <td></td>
+                    <td></td>
+                    <td>1</td>
+                    <td>play_circle_outline</td>
+                </tr>
+                <tr>
+                    <td></td>
+                    <td></td>
+                    <td>2</td>
+                    <td>bt_playing</td>
+                </tr>
+                <tr>
+                    <td></td>
+                    <td></td>
+                    <td>3</td>
+                    <td>pause</td>
+                </tr>
+                <tr>
+                    <td></td>
+                    <td></td>
+                    <td>4</td>
+                    <td>stop</td>
+                </tr>
+                <tr>
+                    <td>6</td>
+                    <td>Disconnecting</td>
+                    <td>0</td>
+                    <td>bt_neutral</td>
+                </tr>
+            </tbody>
+        </table>
+    </div>
+</body>
+
+</html>

components/wifi-manager/webapp/src/test.ts

@@ -0,0 +1,23 @@
+import 'bootstrap';
+import '../src/sass/main.scss';
+import './js/test.js';
+import '../node_modules/remixicon/icons/Device/signal-wifi-fill.svg';
+import '../node_modules/remixicon/icons/Device/signal-wifi-3-fill.svg';
+import '../node_modules/remixicon/icons/Device/signal-wifi-2-fill.svg';
+import '../node_modules/remixicon/icons/Device/signal-wifi-1-fill.svg';
+import '../node_modules/remixicon/icons/Device/signal-wifi-line.svg';
+import '../node_modules/remixicon/icons/Device/battery-line.svg';
+import '../node_modules/remixicon/icons/Device/battery-low-line.svg';
+import '../node_modules/remixicon/icons/Device/battery-fill.svg';
+
+import '../node_modules/remixicon/icons/Media/headphone-fill.svg';
+import '../node_modules/remixicon/icons/Device/device-recover-fill.svg';
+import '../node_modules/remixicon/icons/Device/bluetooth-fill.svg';
+import '../node_modules/remixicon/icons/Device/bluetooth-connect-fill.svg';
+import '../node_modules/remixicon/icons/Media/stop-circle-fill.svg';
+import '../node_modules/remixicon/icons/Media/stop-circle-line.svg';
+import '../node_modules/remixicon/icons/Logos/google-play-fill.svg';
+import '../node_modules/remixicon/icons/Media/pause-fill.svg';
+import '../node_modules/remixicon/icons/Media/stop-fill.svg';
+import '../node_modules/remixicon/icons/System/lock-fill.svg';
+import '../node_modules/remixicon/icons/System/lock-unlock-fill.svg';

components/wifi-manager/webapp/test.js

@@ -0,0 +1,55 @@
+const stats='';
+// Merges webpack.common config with this production config
+const fs = require('fs');
+const glob = require('glob');
+var getDirectories = function (src, callback) {
+glob(src + '/**/*.gz', callback);
+};
+getDirectories('./webpack/', function (err, list) {
+if (err) {
+    console.log('Error', err);
+} else {
+    const regex = /^(.*\/)([^\/]*)$/
+    const relativeRegex = /(\w+\/[^\/]*)$/
+    const makePathRegex = /([^\.].*)$/
+    let exportDefHead=
+    '/***********************************\n'+
+    'webpack_headers\n'+
+    stats+'\n'+
+    '***********************************/\n'+
+    '#pragma once\n'+
+    '#include <inttypes.h>\n'+
+    'extern const char * resource_lookups[];\n'+
+    'extern const uint8_t * resource_map_start[];\n'+
+    'extern const uint8_t * resource_map_end[];\n';
+    let exportDef=  '// Automatically generated. Do not edit manually!.\n'+
+                    '#include <inttypes.h>\n';
+    let lookupDef='const char * resource_lookups[] = {\n';
+    let lookupMapStart='const uint8_t * resource_map_start[] = {\n';
+    let lookupMapEnd='const uint8_t * resource_map_end[] = {\n';
+    let cMake='';
+    list.forEach(fileName=>{
+        console.log(fileName);
+            let exportName=fileName.match(regex)[2].replace(/[\. \-]/gm,'_');
+            let relativeName=fileName.match(relativeRegex)[1];
+            exportDef+=	'extern const uint8_t '+exportName+'_start[] asm("_binary_'+exportName+'_start");\n'+
+                    'extern const uint8_t '+exportName+'_end[] asm("_binary_'+exportName+'_end");\n';
+            lookupDef+='\t"/'+relativeName+'",\n';
+            lookupMapStart+='\t'+ exportName+'_start,\n';
+            lookupMapEnd+= '\t'+ exportName+'_end,\n';
+            cMake+='target_add_binary_data( __idf_wifi-manager ./webapp'+fileName.match(makePathRegex)[1]+' BINARY)\n';
+            
+    });
+    lookupDef+='""\n};\n';
+    lookupMapStart=lookupMapStart.substring(0,lookupMapStart.length-2)+'\n};\n';
+    lookupMapEnd=lookupMapEnd.substring(0,lookupMapEnd.length-2)+'\n};\n';
+    try {
+        fs.writeFileSync('webapp.cmake', cMake);
+        fs.writeFileSync('webpack.c', exportDef+lookupDef+lookupMapStart+lookupMapEnd);
+        fs.writeFileSync('webpack.h', exportDefHead);
+        //file written successfully
+        } catch (err) {
+        console.error(err);
+        }        
+}
+});                

components/wifi-manager/webapp/test.txt

@@ -0,0 +1 @@
+Some content!

components/wifi-manager/webapp/test/test.js

@@ -0,0 +1,8 @@
+var assert = require('assert');
+describe('Array', function() {
+  describe('#indexOf()', function() {
+    it('should return -1 when the value is not present', function() {
+      assert.equal([1, 2, 3].indexOf(4), -1);
+    });
+  });
+});

components/wifi-manager/webapp/tsconfig.json

@@ -0,0 +1,17 @@
+{
+  "compilerOptions": {
+    "baseUrl": "./",
+    "paths": { "*": ["types/*"] },
+    "outDir": "./dist/",
+    "noImplicitAny": true,
+    "sourceMap": true,
+    "module": "es6",
+    "target": "es2018",
+    "composite": true,
+//    "jsx": "react",
+    "allowJs": true
+  },
+  "exclude": [
+    "./node_modules"
+  ]
+}

components/wifi-manager/webapp/tslint.json

@@ -0,0 +1,22 @@
+{
+  "defaultSeverity": "error",
+  "extends": [
+    "tslint:recommended"
+  ],
+  "jsRules": {},
+  "rules": {
+    "eofline": false,
+    "no-trailing-whitespace": false,
+    "comment-format": false,
+    "quotemark": false,
+    "no-console": false,
+    "one-line": false,
+    "no-consecutive-blank-lines": false,
+    "curly": false,
+    "ordered-imports": [false],
+    "object-literal-sort-keys": [false],
+    "only-arrow-functions": false,
+    "indent": false
+  },
+  "rulesDirectory": []
+}

components/wifi-manager/webapp/webapp.cmake

@@ -0,0 +1,5 @@
+target_add_binary_data( __idf_wifi-manager ./webapp/webpack/dist/favicon-32x32.png BINARY)
+target_add_binary_data( __idf_wifi-manager ./webapp/webpack/dist/index.html.gz BINARY)
+target_add_binary_data( __idf_wifi-manager ./webapp/webpack/dist/js/index.e644c0.bundle.js.gz BINARY)
+target_add_binary_data( __idf_wifi-manager ./webapp/webpack/dist/js/node-modules.e644c0.bundle.js.gz BINARY)
+target_add_binary_data( __idf_wifi-manager ./webapp/webpack/dist/js/runtime.e644c0.bundle.js.gz BINARY)

components/wifi-manager/webapp/webpack.c

@@ -0,0 +1,34 @@
+// Automatically generated. Do not edit manually!.
+#include <inttypes.h>
+extern const uint8_t _favicon_32x32_png_start[] asm("_binary_favicon_32x32_png_start");
+extern const uint8_t _favicon_32x32_png_end[] asm("_binary_favicon_32x32_png_end");
+extern const uint8_t _index_html_gz_start[] asm("_binary_index_html_gz_start");
+extern const uint8_t _index_html_gz_end[] asm("_binary_index_html_gz_end");
+extern const uint8_t _index_e644c0_bundle_js_gz_start[] asm("_binary_index_e644c0_bundle_js_gz_start");
+extern const uint8_t _index_e644c0_bundle_js_gz_end[] asm("_binary_index_e644c0_bundle_js_gz_end");
+extern const uint8_t _node_modules_e644c0_bundle_js_gz_start[] asm("_binary_node_modules_e644c0_bundle_js_gz_start");
+extern const uint8_t _node_modules_e644c0_bundle_js_gz_end[] asm("_binary_node_modules_e644c0_bundle_js_gz_end");
+extern const uint8_t _runtime_e644c0_bundle_js_gz_start[] asm("_binary_runtime_e644c0_bundle_js_gz_start");
+extern const uint8_t _runtime_e644c0_bundle_js_gz_end[] asm("_binary_runtime_e644c0_bundle_js_gz_end");
+const char * resource_lookups[] = {
+	"/dist/favicon-32x32.png",
+	"/dist/index.html.gz",
+	"/js/index.e644c0.bundle.js.gz",
+	"/js/node-modules.e644c0.bundle.js.gz",
+	"/js/runtime.e644c0.bundle.js.gz",
+""
+};
+const uint8_t * resource_map_start[] = {
+	_favicon_32x32_png_start,
+	_index_html_gz_start,
+	_index_e644c0_bundle_js_gz_start,
+	_node_modules_e644c0_bundle_js_gz_start,
+	_runtime_e644c0_bundle_js_gz_start
+};
+const uint8_t * resource_map_end[] = {
+	_favicon_32x32_png_end,
+	_index_html_gz_end,
+	_index_e644c0_bundle_js_gz_end,
+	_node_modules_e644c0_bundle_js_gz_end,
+	_runtime_e644c0_bundle_js_gz_end
+};

components/wifi-manager/webapp/webpack.h

@@ -0,0 +1,72 @@
+/***********************************
+webpack_headers
+Hash: e644c04d107606ae748d
+Version: webpack 4.44.2
+Time: 6142ms
+Built at: 2020-12-21 12 h 10 min 00 s
+                                Asset       Size  Chunks                                Chunk Names
+          ./js/index.e644c0.bundle.js    230 KiB       0  [emitted] [immutable]         index
+       ./js/index.e644c0.bundle.js.br   31.3 KiB          [emitted]                     
+       ./js/index.e644c0.bundle.js.gz   40.9 KiB          [emitted]                     
+   ./js/node-modules.e644c0.bundle.js    265 KiB       1  [emitted] [immutable]  [big]  node-modules
+./js/node-modules.e644c0.bundle.js.br   76.2 KiB          [emitted]                     
+./js/node-modules.e644c0.bundle.js.gz   88.6 KiB          [emitted]                     
+        ./js/runtime.e644c0.bundle.js   1.46 KiB       2  [emitted] [immutable]         runtime
+     ./js/runtime.e644c0.bundle.js.br  644 bytes          [emitted]                     
+     ./js/runtime.e644c0.bundle.js.gz  722 bytes          [emitted]                     
+                    favicon-32x32.png  578 bytes          [emitted]                     
+                           index.html   19.5 KiB          [emitted]                     
+                        index.html.br   4.48 KiB          [emitted]                     
+                        index.html.gz   5.46 KiB          [emitted]                     
+                           sprite.svg    4.4 KiB          [emitted]                     
+                        sprite.svg.br  912 bytes          [emitted]                     
+Entrypoint index [big] = ./js/runtime.e644c0.bundle.js ./js/node-modules.e644c0.bundle.js ./js/index.e644c0.bundle.js
+ [6] ./node_modules/bootstrap/dist/js/bootstrap-exposed.js 437 bytes {1} [built]
+[11] ./src/sass/main.scss 1.55 KiB {0} [built]
+[16] ./node_modules/remixicon/icons/Device/signal-wifi-fill.svg 340 bytes {1} [built]
+[17] ./node_modules/remixicon/icons/Device/signal-wifi-3-fill.svg 344 bytes {1} [built]
+[18] ./node_modules/remixicon/icons/Device/signal-wifi-2-fill.svg 344 bytes {1} [built]
+[19] ./node_modules/remixicon/icons/Device/signal-wifi-1-fill.svg 344 bytes {1} [built]
+[20] ./node_modules/remixicon/icons/Device/signal-wifi-line.svg 340 bytes {1} [built]
+[21] ./node_modules/remixicon/icons/Device/battery-line.svg 332 bytes {1} [built]
+[22] ./node_modules/remixicon/icons/Device/battery-low-line.svg 340 bytes {1} [built]
+[23] ./node_modules/remixicon/icons/Device/battery-fill.svg 332 bytes {1} [built]
+[24] ./node_modules/remixicon/icons/Media/headphone-fill.svg 335 bytes {1} [built]
+[25] ./node_modules/remixicon/icons/Device/device-recover-fill.svg 346 bytes {1} [built]
+[26] ./node_modules/remixicon/icons/Device/bluetooth-fill.svg 336 bytes {1} [built]
+[27] ./node_modules/remixicon/icons/Device/bluetooth-connect-fill.svg 352 bytes {1} [built]
+[37] ./src/index.ts + 1 modules 52.6 KiB {0} [built]
+     | ./src/index.ts 1.36 KiB [built]
+     | ./src/js/custom.js 51.2 KiB [built]
+    + 23 hidden modules
+
+WARNING in asset size limit: The following asset(s) exceed the recommended size limit (244 KiB).
+This can impact web performance.
+Assets: 
+  ./js/node-modules.e644c0.bundle.js (265 KiB)
+
+WARNING in entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (244 KiB). This can impact web performance.
+Entrypoints:
+  index (497 KiB)
+      ./js/runtime.e644c0.bundle.js
+      ./js/node-modules.e644c0.bundle.js
+      ./js/index.e644c0.bundle.js
+
+
+WARNING in webpack performance recommendations: 
+You can limit the size of your bundles by using import() or require.ensure to lazy load some parts of your application.
+For more info visit https://webpack.js.org/guides/code-splitting/
+Child html-webpack-plugin for "index.html":
+         Asset     Size  Chunks  Chunk Names
+    index.html  556 KiB       0  
+    Entrypoint undefined = index.html
+    [0] ./node_modules/html-webpack-plugin/lib/loader.js!./src/index.ejs 21.1 KiB {0} [built]
+    [1] ./node_modules/lodash/lodash.js 530 KiB {0} [built]
+    [2] (webpack)/buildin/global.js 472 bytes {0} [built]
+    [3] (webpack)/buildin/module.js 497 bytes {0} [built]
+***********************************/
+#pragma once
+#include <inttypes.h>
+extern const char * resource_lookups[];
+extern const uint8_t * resource_map_start[];
+extern const uint8_t * resource_map_end[];