feat: add RTC blocks

package.json

@@ -31,7 +31,7 @@
     "dist",
     "media"
   ],
-  "version": "3.1.1",
+  "version": "3.2.0",
   "description": "Leaphy custom Blockly blocks and arduino code generator",
   "name": "@leaphy-robotics/leaphy-blocks"
 }

src/blocks/blocks.ts

@@ -7,6 +7,7 @@ import * as leaphyClick from "./leaphy_click";
 import * as arduino from "./arduino";
 import * as loops from "./alternatives";
 import * as mesh from "./mesh";
+import * as rtc from "./rtc";
 
 const blocks = [
     ...lists.blocks,
@@ -18,6 +19,7 @@ const blocks = [
     ...loops.blocks,
     ...leaphyCommon.blocks,
     ...mesh.blocks,
+    ...rtc.blocks,
 ];
 
 export { blocks };

src/blocks/extensions.ts

@@ -1,7 +1,16 @@
 import * as Blockly from "blockly/core";
 import { listManager } from "../categories/lists";
-import { Block, BlockSvg, Connection, Workspace } from "blockly/core";
+import {
+    Block,
+    BlockSvg,
+    Connection,
+    Menu,
+    MenuItem,
+    Workspace,
+    WorkspaceSvg,
+} from "blockly/core";
 import { procedureManager } from "../generators/arduino/procedures";
+import { DateItem } from "../generators/arduino/rtc";
 
 const xmlUtils = Blockly.utils.xml;
 
@@ -340,14 +349,147 @@ export default function registerExtensions(blockly: typeof Blockly) {
         },
     };
 
+    function loadFormat(topBlock: BlockSvg, format: DateItem[]) {
+        let connection = topBlock.getInput("STACK")!.connection!;
+        connection.targetBlock()?.dispose?.(false);
+
+        format.forEach((item) => {
+            const block = topBlock.workspace.newBlock(
+                item.type === "text" ? "fmt_text" : `fmt_${item.item}`,
+            );
+            if (item.type === "text") block.setFieldValue(item.value, "TEXT");
+            else block.setFieldValue(item.fmt, "FMT");
+
+            block.initSvg();
+            block.render();
+            connection.connect(block.previousConnection);
+            connection = block.nextConnection;
+        });
+
+        topBlock.render();
+    }
+
+    const DATE_FORMAT_MUTATOR = {
+        structure: [] as DateItem[],
+
+        loadExtraState(state: DateItem[]) {
+            this.structure = state;
+        },
+        saveExtraState() {
+            return this.structure;
+        },
+
+        updateStructure(block: BlockSvg, newStructure: DateItem[]) {
+            const field = block.getField("FORMAT") as FormatField;
+            if (
+                JSON.stringify(newStructure) !==
+                JSON.stringify(field.selectedStructure())
+            ) {
+                field.setValue("custom");
+            }
+
+            this.structure = newStructure;
+        },
+
+        decompose(workspace: WorkspaceSvg) {
+            const topBlock = workspace.newBlock("fmt_head");
+            topBlock.initSvg();
+
+            const field = topBlock.getField("FORMAT") as FormatField;
+            field.onRefresh(() => this.compose(topBlock));
+
+            loadFormat(topBlock, this.structure);
+            return topBlock;
+        },
+        compose(topBlock: BlockSvg) {
+            const result: DateItem[] = [];
+            let block: BlockSvg | null = topBlock.getChildren(true)[0];
+            if (!block) return this.updateStructure(topBlock, []);
+
+            while (block) {
+                if (block.type === "fmt_text")
+                    result.push({
+                        type: "text",
+                        value: block.getFieldValue("TEXT"),
+                    });
+                else
+                    result.push({
+                        type: "item",
+                        item: block.type.split("fmt_")[1],
+                        fmt: block.getFieldValue("FMT"),
+                    });
+
+                block = block.getNextBlock();
+            }
+
+            this.updateStructure(topBlock, result);
+        },
+    };
+
+    type FormatOption = [string, DateItem[]];
+    class FormatField extends blockly.FieldDropdown {
+        private refreshListeners: (() => void)[] = [];
+
+        constructor(private options: FormatOption[]) {
+            const values = options.map(
+                ([option]) => [option, option] as [string, string],
+            );
+            super([...values, ["%{BKY_LEAPHY_TEMPLATE_CUSTOM}", "custom"]]);
+        }
+
+        protected onItemSelected_(menu: Menu, menuItem: MenuItem) {
+            const option = this.options.find(
+                (option) => option[0] === menuItem.getValue(),
+            );
+            if (option && this.sourceBlock_)
+                loadFormat(this.sourceBlock_ as BlockSvg, option[1]);
+            if (menuItem.getValue() === "custom" && this.sourceBlock_)
+                loadFormat(this.sourceBlock_ as BlockSvg, []);
+            this.sourceBlock_?.getRootBlock()?.compose?.(this.sourceBlock_);
+
+            super.onItemSelected_(menu, menuItem);
+            this.refreshListeners.forEach((listener) => listener());
+        }
+
+        selectedStructure() {
+            const option = this.options.find(
+                (option) => option[0] === this.getValue(),
+            );
+            if (option && this.sourceBlock_) return option[1];
+            if (this.getValue() === "custom" && this.sourceBlock_) return [];
+        }
+
+        onRefresh(listener: () => void) {
+            this.refreshListeners.push(listener);
+        }
+    }
+
+    blockly.fieldRegistry.register("field_format", FormatField);
     blockly.Extensions.register("list_select_extension", LIST_SELECT_EXTENSION);
     blockly.Extensions.register(
         "appendStatementInputStack",
         APPEND_STATEMENT_INPUT_STACK,
     );
-    blockly.Extensions.registerMixin(
+    blockly.Extensions.registerMutator(
         "l_controls_if_mutator",
         CONTROLS_IF_MUTATOR_MIXIN,
+        undefined,
+        ["controls_if_elseif", "controls_if_else"],
+    );
+    Blockly.Extensions.registerMutator(
+        "l_format_date_mutator",
+        DATE_FORMAT_MUTATOR,
+        undefined,
+        [
+            "fmt_text",
+            "fmt_second",
+            "fmt_minute",
+            "fmt_hour",
+            "fmt_weekday",
+            "fmt_day",
+            "fmt_month",
+            "fmt_year",
+        ],
     );
     blockly.Extensions.register(
         "procedure_select_extension",