New web GUI based on bootstrap.js

[exilaus]

Requirements

• Needs WIFISUPPORT only.
• Replaces current data\www files.
• v1.1 for marlin.zip

Description

Advanced web socket for default Marlin websocket (no esplib no esp3d).

Unique part no work are upload file, have issue to sync with M28 G-code on web socket, feel need improve Marlin to have direct access of SD (for cpu like ESP32).

Tested on E4d@box board.

Live Demo: https://e4d.atbox.tech/Gui/?ip=10.10.10.10 (upload version in this post no have any reference to e4d@box)

Benefits

improve web gui and no use external projects

Issues

Sync issue on upload file via M28 G-code. Need help to improve default Marlin web implementation.

[thinkyhead]

Thanks! I did a large merge to bring this up to date, and since this PR was originally based on code from ancient times you may want to recheck to make sure it still functions with the latest codebase.

[exilaus]

I did a large merge to bring this up to date, and since this PR was originally based on code from ancient times you may want to recheck to make sure it still functions with the latest codebase.

Sure, that developed on 2.0.6 bugfix...anyway give me 2 day recheck all with last bugfix.

Next steps are:

• implement another method for upload file from web
• where possible ,like in esp32 , move webserver/websocket process on core1 for dedicate core0 to Marlin .

[thisiskeithb]

Can the main title/header be simplified to just “Marlin WebUI” or use the printer’s name like “3D Printer WebUI” (since there’s already a Marlin logo).

The “E4d@box” credit would still be listed on the info page, so it wouldn’t be removed.

[exilaus]

little issue guys, i just upload last bugfix with new GUI and old GUI same result http server on wesocket feel down.. start to dig for undestand why.

[exilaus]

found why no see websocket never start MYSERIAL1 from marlincore.cpp and never start.
now force start to use MYSERIAL1 and now web socket open but feel other changed continue to investigate.

[luc-github]

looks like now NUM_SERIAL is not set like before in ESP32 Hal (https://github.com/MarlinFirmware/Marlin/blob/bugfix-2.0.x/Marlin/src/HAL/ESP32/HAL.h#L56-L62) but in main Hal (https://github.com/MarlinFirmware/Marlin/blob/bugfix-2.0.x/Marlin/src/HAL/HAL.h#L28-L32) and so not set anymore for ESP32 and wifi bridge

#ifdef SERIAL_PORT_2
  #define NUM_SERIAL 2
#else
  #define NUM_SERIAL 1
#endif

since :
4b928b2#diff-b433648b73ac70dda9c5db91bedfecab3660ca687743277c040cd870fa60c5ec

[exilaus]

Luc you are right ...
But resolved without touching code setting configuration.h Need enable SERIAL_PORT_2 -1 and websocket working fine with that parameter.

[vivian-ng]

While this is being added, how about a minor fix to HAL.cpp for ESP32? Haven't had time to look into it, but it affects the stepper control on ESP32-based boards that do not implement I2S stepper stream.

Change:

void HAL_init() { i2s_init(); }

to:

void HAL_init(void) {
#if ENABLED(I2S_STEPPER_STREAM)
    i2s_init();
#endif
}

Linked to this issue.

[exilaus]

While this is being added, how about a minor fix to HAL.cpp for ESP32? Haven't had time to look into it, but it affects the stepper control on ESP32-based boards that do not implement I2S stepper stream.

Vivian-ng please can contact me and check and fix thogheter that part ok? regards Mauro.
ok checked post linked too verify and put in pull that fix too.

[thinkyhead]

Let's continue to refine and improve. It would be good to see the build info, machine name, etc., in the title, meta info, and on the page.

The word on the street is that Duet3D / RepRapFirmware dropped bootstrap.js for their web interface in favor of vue.js because they were hitting limitations.

[rhapsodyv]

Let's continue to refine and improve. It would be good to see the build info, machine name, etc., in the title, meta info, and on the page.

The word on the street is that Duet3D / RepRapFirmware dropped bootstrap.js for their web interface in favor of vue.js because they were hitting limitations.

I use react in my startup. But, for Marlin, react, vue or angular, could add complexity for the users, we will need a JS bundler to build and process the Javascript. Bootstrap+html just run as it is...

I'm not against it, just a warning point.

[thinkyhead]

This is a good starting-point and should be refined, quite a lot. Modern displays have a lot of space, and this seems to be optimized for a small Raspberry Pi display. I would like to see a clean aesthetic similar to that of the OctoPrint default theme applied to all of our interfaces.

[darkberg]

This is a good starting-point and should be refined, quite a lot. Modern displays have a lot of space, and this seems to be optimized for a small Raspberry Pi display. I would like to see a clean aesthetic similar to that of the OctoPrint default theme applied to all of our interfaces.

Actually, it was made for mobile phone control, with minimal data usage. Of course, it's a starting point, to test / control E4d@box board. Any updates are / will be more than welcomed.