Installer updates, Toronto Cubes to Gourds

Author: ewowi

docs/gettingstarted/installer.md

@@ -1,12 +1,14 @@
 # MoonLight Installer
 
-This page describes how to install <a href="https://github.com/MoonModules/MoonLight" target="_blank">MoonModules/MoonLight</a> on an ESP32 microcontroller. You need a compatible browser like Chrome, or Edge, not supported on Safari.
+Install <a href="https://github.com/MoonModules/MoonLight" target="_blank">MoonModules/MoonLight</a> on an ESP32 microcontroller. You need a compatible browser like Chrome, or Edge, not supported on Safari.
+
+For devices which have already MoonLight installed, go to [Update](#update-moonlight)
 
 <a href="https://www.youtube.com/watch?v=7DQOEWa-Kwg">
   <img width="380" src="https://img.youtube.com/vi/7DQOEWa-Kwg/maxresdefault.jpg" alt="Watch MoonLight Demo">
 </a>
 
-**[▶️ Watch the install tutorial](https://www.youtube.com/watch?v=7DQOEWa-Kwg)** or follow the instructions below
+**[▶️ Watch the install tutorial](https://www.youtube.com/watch?v=7DQOEWa-Kwg)** (v0.6.0) or follow the instructions below
 
 ## Prepare an ESP32 device 
 
@@ -22,12 +24,7 @@ Connect the device via a USB cable (which supports data transfer) to your PC.
 
 <script type="module" src="https://unpkg.com/esp-web-tools@10/dist/web/install-button.js?module"></script>
 
-Select your ESP32-device from the table below and press the corresponding Connect button. 
-
-* In the popup window, your device should show up in this list, press Connect, 
-* Press Install MoonLight. Erase when installing MoonLight first time, do not erase if already installed (to preserve settings). Press Next and Install
-* Press Next, go to Logs & Console and press Restart.
-* Close the installer.
+Select your ESP32-device from the table below, press the corresponding **Connect** button and follow the steps. Your device should show up in this list. Press the **Erase** checkbox when installing MoonLight for the first time. After succesful install, go to Logs & Console, press **Restart** and close the installer.
 
 !!! info "Bootloader mode"
     If install doesn't work: some boards have to be placed in bootloader mode the first time: press and hold the `Boot` button on the ESP32, press the `Reset` button on the ESP32 and then release the `Boot` button.
@@ -46,10 +43,10 @@ Select your ESP32-device from the table below and press the corresponding Connec
 | esp32-c3 | ![esp32-c3](../firmware/installer/images/esp32-c3.jpg){: style="width:100px"} | <esp-web-install-button manifest="https://moonmodules.org/MoonLight/firmware/installer/manifest_esp32-c3.json"></esp-web-install-button> | [Ali*](https://s.click.aliexpress.com/e/_EIl7NKw){:target="_blank"} |
 | esp32-c3-supermini | ![esp32-c3-supermini](../firmware/installer/images/esp32-c3-supermini.jpg){: style="width:100px"} | <esp-web-install-button manifest="https://moonmodules.org/MoonLight/firmware/installer/manifest_esp32-c3-supermini.json"></esp-web-install-button> | [Ali*](https://s.click.aliexpress.com/e/_EIl7NKw){:target="_blank"} |
 
-Installer steps:
+Install steps in pictures:
 
 <img width="250" src="https://github.com/user-attachments/assets/f092743f-a362-40da-b932-d31b203d966d" />
-<img width="200" alt="Screenshot 2025-06-07 at 20 54 31" src="https://github.com/user-attachments/assets/a0a8d92c-dae2-4cfe-ac78-bc7cacb24724" />
+<img width="200" src="https://github.com/user-attachments/assets/a0a8d92c-dae2-4cfe-ac78-bc7cacb24724" />
 <img width="250" src="https://github.com/user-attachments/assets/35045317-520d-427c-894e-418693877831" />
 <img width="200" src="https://github.com/user-attachments/assets/25c05a6c-d2ef-41cb-b83c-fc40a60c6ccc" />
 <img width="200" src="https://github.com/user-attachments/assets/b2391752-51c4-400e-b95c-4fa865e93595" />
@@ -81,23 +78,23 @@ Go back to your home WiFi open a browser and enter hostname.local to open MoonLi
 
 ### IO Board Presets
 
-Select the specific board you are running in [Module IO](../../moonbase/inputoutput), e.g. premade or custom boards as shown in [hardware](../hardware).
+Select your board in [Module IO](../../moonbase/inputoutput), if you have one of the premade boards supported (see above table), select this. If not sure, leave it as is.
 
-<img width="320" height="441" alt="io11" src="../../media/moonbase/inputoutput.png" />
+<img width="320" height="441" src="../../media/moonbase/inputoutput.png" />
 
 Make sure the defined LED pin(s) are the same as the physical connections on the ESP32 board.
 
 ### Drivers
 
 The drivers module contains [Layouts](../../moonlight/layouts) and [Drivers](../../moonlight/drivers).
 
-Add a layout first, this defines how your LEDs are arranged. Press (+)
+Layouts define how your LEDs are arranged. Add a layout first, Press (+)
 
-<img width="350" src="https://github.com/user-attachments/assets/8d8b9c2d-bed3-439e-a145-2bb204639c6c" />
+<img width="320" src="../../media/moonlight/layouts/PanelLayout.png"/>
 
 For LED strips, choose Single Column, for Panels choose Panel(s) or other layouts. Layouts are recognized by 🚥. Enter the size of your LEDs
 
-Add the LED driver by pressing the blue + button and select the Physical LED driver or FastLED driver. Drivers are recognized by ☸️
+Next add a LED driver by pressing the (+) button and select the Physical LED driver or FastLED driver. Drivers are recognized by ☸️
 
 <img width="350" src="https://github.com/user-attachments/assets/e7fab24f-3803-4aa5-8638-459cca8a9caf" />
 
@@ -109,6 +106,8 @@ The Effects module contains [Effects](../../moonlight/effects) and [Modifiers](.
 
 The effect should be visible on the Monitor in MoonLight and on your LEDs
 
+<img width="320" src="../../media/moonlight/effects/LissajousShot.png"/>
+
 ### Save and next steps
 
 Press save (💾). Saves your setup to the file system, so if a device is restarted, your settings are still there.

docs/media/moonlight/effects/LissajousShot.png

@@ -23,7 +23,7 @@ Want to add a a Layout to MoonLight, see [develop](https://moonmodules.org/MoonL
 | Rings | ![Ring](https://github.com/user-attachments/assets/7f60871d-30aa-4ad4-8966-cdc9c035c034) | <img width="320" alt="Rings" src="https://github.com/user-attachments/assets/ee2165aa-cf01-48cd-9310-9cfde871ac33" /> | 241 LEDs in 9 rings |
 | Wheel | ![Wheel](https://github.com/user-attachments/assets/52a63203-f955-4345-a97b-edb0b8691fe1) | <img width="320" alt="Wheel" src="https://github.com/user-attachments/assets/7b83e30b-e2e1-49e6-ad80-5b6925b23018" /> | |
 | Human Sized Cube | ![HCS](https://github.com/user-attachments/assets/8e475f9d-ab7a-4b5c-835a-e0b4ddc28f0f) | <img width="320" alt="HCS" src="https://github.com/user-attachments/assets/de1eb424-6838-4af4-8652-89a54929bb03" /> | |
-| Toronto Bar Cubes | ![cubes](../../media/moonlight/effects/lines.gif) | <img width="320" alt="cubes" src="../../media/moonlight/layouts/CeilingCubesControls.png"/> | |
+| Toronto Bar Gourds | ![gourds](../../media/moonlight/effects/lines.gif) | <img width="320" alt="gourds" src="../../media/moonlight/layouts/CeilingCubesControls.png"/> | |
 | Single Column | ![Single column](https://github.com/user-attachments/assets/a88cea0f-9227-4da4-9a43-b944fd8bef97) | <img width="320" alt="Single column" src="https://github.com/user-attachments/assets/9f9918b9-e1ee-43a8-a02d-7f1ee182888b" /> | Choose Single Column for LED strips |
 | Single Row | ![Single row](https://github.com/user-attachments/assets/4ba5a3ac-9312-4bac-876d-cfa3dce41215) | <img width="320" alt="Single row" src="https://github.com/user-attachments/assets/70455279-646c-467d-b8e5-492b1aeae0fa" /> | |
 | SE16 | ![SE16](https://github.com/user-attachments/assets/45c7bec7-2386-4c42-8f24-5a57b87f0df9) | <img width="320" alt="SE16" src="https://github.com/user-attachments/assets/0efe941a-acf5-4a2c-a7d6-bdfa91574d1a" /> | Layout(s) including pins for Stephan Electronics 16-Pin ESP32-S3 board<br>see below |

docs/media/moonlight/layouts/PanelLayout.png

@@ -84,7 +84,7 @@ class ModuleDrivers : public NodeManager {
     addControlValue(control, getNameAndTags<PanelsLayout>());
     addControlValue(control, getNameAndTags<CubeLayout>());
     addControlValue(control, getNameAndTags<HumanSizedCubeLayout>());
-    addControlValue(control, getNameAndTags<TorontoBarCubesLayout>());
+    addControlValue(control, getNameAndTags<TorontoBarGourdsLayout>());
     addControlValue(control, getNameAndTags<RingLayout>());
     addControlValue(control, getNameAndTags<Rings16Layout>());
     addControlValue(control, getNameAndTags<RingsLayout>());
@@ -125,7 +125,7 @@ class ModuleDrivers : public NodeManager {
     if (!node) node = checkAndAlloc<WheelLayout>(name);
     if (!node) node = checkAndAlloc<SpiralLayout>(name);
     if (!node) node = checkAndAlloc<HumanSizedCubeLayout>(name);
-    if (!node) node = checkAndAlloc<TorontoBarCubesLayout>(name);
+    if (!node) node = checkAndAlloc<TorontoBarGourdsLayout>(name);
     if (!node) node = checkAndAlloc<SingleRowLayout>(name);
     if (!node) node = checkAndAlloc<SingleColumnLayout>(name);
 

docs/moonlight/layouts.md

@@ -241,68 +241,68 @@ class CubeLayout : public Node {
   }
 };
 
-class TorontoBarCubesLayout : public Node {
+class TorontoBarGourdsLayout : public Node {
  public:
-  static const char* name() { return "Toronto Bar Cubes"; }
+  static const char* name() { return "Toronto Bar Gourds"; }
   static uint8_t dim() { return _3D; }
   static const char* tags() { return "🚥"; }
 
   // Coord3D size;
-  uint8_t nrOfLightsPerCube = 61;  // 5*12+1; mode 0 only
+  uint8_t nrOfLightsPerGourd = 61;  // 5*12+1; mode 0 only
   uint8_t granularity = 0;
 
   void setup() override {
     addControl(granularity, "granularity", "select");
-    addControlValue("One Cube One Light");
+    addControlValue("One Gourd One Light");
     addControlValue("One Side One Light");
     addControlValue("One LED One Light");
-    addControl(nrOfLightsPerCube, "nrOfLightsPerCube", "slider", 1, 128, "One cube");  // mode 0 only
+    addControl(nrOfLightsPerGourd, "nrOfLightsPerGourd", "slider", 1, 128, "One gourd");  // mode 0 only
   }
 
-  // One Cube One Light
-  void addCube(Coord3D pos) {
-    for (int i = 0; i < nrOfLightsPerCube; i++) addLight(Coord3D(pos.x, pos.y, pos.z));  // all cube lights on the same position for the time being
+  // One Gourd One Light
+  void addGourd(Coord3D pos) {
+    for (int i = 0; i < nrOfLightsPerGourd; i++) addLight(Coord3D(pos.x, pos.y, pos.z));  // all gourd lights on the same position for the time being
   }
 
   // One Side One Light
-  void addCubeSides(Coord3D pos) {
-    const uint8_t cubeLength = 3;  // each side can be mapped in a 3 * 3 * 3 grid (27 leds), 5 sides + 1 middle LED
+  void addGourdSides(Coord3D pos) {
+    const uint8_t gourdLength = 3;  // each side can be mapped in a 3 * 3 * 3 grid (27 leds), 5 sides + 1 middle LED
     Coord3D sides[] = {Coord3D(1, 1, 0), Coord3D(2, 1, 1), Coord3D(1, 1, 2), Coord3D(0, 1, 1), Coord3D(1, 2, 1)};
 
     for (Coord3D side : sides) {                                                                                                              // 5 sides
-      for (int i = 0; i < 12; i++) addLight(Coord3D(pos.x * cubeLength + side.x, pos.y * cubeLength + side.y, pos.z * cubeLength + side.z));  // each side has 12 leds, all mapped to the same virtual pixel
+      for (int i = 0; i < 12; i++) addLight(Coord3D(pos.x * gourdLength + side.x, pos.y * gourdLength + side.y, pos.z * gourdLength + side.z));  // each side has 12 leds, all mapped to the same virtual pixel
     }
 
     // + middleLED
     Coord3D side = {1, 1, 1};
-    addLight(Coord3D(pos.x * cubeLength + side.x, pos.y * cubeLength + side.y, pos.z * cubeLength + side.z));  // middleLED
+    addLight(Coord3D(pos.x * gourdLength + side.x, pos.y * gourdLength + side.y, pos.z * gourdLength + side.z));  // middleLED
   }
 
   // One LED One Light
-  void addCubePixels(Coord3D pos) {
-    const uint8_t cubeLength = 7;
+  void addGourdPixels(Coord3D pos) {
+    const uint8_t gourdLength = 7;
     Coord3D pixels[] = {Coord3D(0, 0), Coord3D(1, 0), Coord3D(2, 0), Coord3D(3, 0), Coord3D(3, 1), Coord3D(3, 2), Coord3D(3, 3), Coord3D(2, 3), Coord3D(1, 3), Coord3D(0, 3), Coord3D(0, 2), Coord3D(0, 1)};  // 12 pixels each
 
     // back and front: z constant, increasing x and y
-    for (Coord3D pixel : pixels) addLight(Coord3D(pos.x * cubeLength + pixel.x, pos.y * cubeLength + pixel.y, pos.z * cubeLength));                   // front
-    for (Coord3D pixel : pixels) addLight(Coord3D(pos.x * cubeLength + pixel.x, pos.y * cubeLength + pixel.y, pos.z * cubeLength + cubeLength - 1));  // back
+    for (Coord3D pixel : pixels) addLight(Coord3D(pos.x * gourdLength + pixel.x, pos.y * gourdLength + pixel.y, pos.z * gourdLength));                   // front
+    for (Coord3D pixel : pixels) addLight(Coord3D(pos.x * gourdLength + pixel.x, pos.y * gourdLength + pixel.y, pos.z * gourdLength + gourdLength - 1));  // back
 
     // left and right: x constant, increasing y and z
-    for (Coord3D pixel : pixels) addLight(Coord3D(pos.x * cubeLength, pos.y * cubeLength + pixel.x, pos.z * cubeLength + pixel.y));                   // left
-    for (Coord3D pixel : pixels) addLight(Coord3D(pos.x * cubeLength + cubeLength - 1, pos.y * cubeLength + pixel.x, pos.z * cubeLength + pixel.y));  // right
+    for (Coord3D pixel : pixels) addLight(Coord3D(pos.x * gourdLength, pos.y * gourdLength + pixel.x, pos.z * gourdLength + pixel.y));                   // left
+    for (Coord3D pixel : pixels) addLight(Coord3D(pos.x * gourdLength + gourdLength - 1, pos.y * gourdLength + pixel.x, pos.z * gourdLength + pixel.y));  // right
 
     // bottom : y constant: increasing x and z
-    for (Coord3D pixel : pixels) addLight(Coord3D(pos.x * cubeLength + pixel.x, pos.y * cubeLength + cubeLength - 1, pos.z * cubeLength + pixel.y));  // bottom
+    for (Coord3D pixel : pixels) addLight(Coord3D(pos.x * gourdLength + pixel.x, pos.y * gourdLength + gourdLength - 1, pos.z * gourdLength + pixel.y));  // bottom
 
     // + middleLED
     Coord3D middle = {3, 3, 3};
-    addLight(Coord3D(pos.x * cubeLength + middle.x, pos.y * cubeLength + middle.y, pos.z * cubeLength + middle.z));  // middleLED
+    addLight(Coord3D(pos.x * gourdLength + middle.x, pos.y * gourdLength + middle.y, pos.z * gourdLength + middle.z));  // middleLED
   }
 
   bool hasOnLayout() const override { return true; }
   void onLayout() override {
-    // modify to whatever cube order and nr of cubes in a 3D grid space
-    Coord3D cubes[] = {
+    // modify to whatever gourd order and nr of gourds in a 3D grid space
+    Coord3D gourds[] = {
         //
         Coord3D(0, 0, 0),
         Coord3D(1, 0, 0),
@@ -335,22 +335,22 @@ class TorontoBarCubesLayout : public Node {
         Coord3D(3, 2, 1)  //
     };
 
-    uint8_t cubeCounter = 0;
+    uint8_t gourdCounter = 0;
 
-    for (Coord3D cube : cubes) {
-      if (granularity == 0) {  // one cube one light
-        addCube(cube);
+    for (Coord3D gourd : gourds) {
+      if (granularity == 0) {  // one gourd one light
+        addGourd(gourd);
       } else if (granularity == 1) {  // one side one light
-        addCubeSides(cube);
+        addGourdSides(gourd);
       } else if (granularity == 2) {  // one LED one light
-        addCubePixels(cube);
+        addGourdPixels(gourd);
       }
 
-      cubeCounter++;
-      if (cubeCounter % 10 == 0) nextPin();  // will not be used by Art-Net but in case of using a LED driver, every 10 cubes (61 LEDs each) will be on a separate pin
+      gourdCounter++;
+      if (gourdCounter % 10 == 0) nextPin();  // will not be used by Art-Net but in case of using a LED driver, every 10 gourds (61 LEDs each) will be on a separate pin
     }
 
-    if (cubeCounter % 10 != 0) nextPin();  // add final pin
+    if (gourdCounter % 10 != 0) nextPin();  // add final pin
   }
 };