wow thats a lot of changes

src/blocks/monitors.js

@@ -0,0 +1,90 @@
+import * as Blockly from "blockly";
+import * as BlocklyJS from "blockly/javascript";
+
+Blockly.Blocks["show_variable"] = {
+  init: function () {
+    this.appendDummyInput()
+      .appendField("show variable")
+      .appendField(new Blockly.FieldDropdown(this.getVariables), "VAR");
+    this.appendDummyInput()
+      .appendField("at x:")
+      .appendField(new Blockly.FieldNumber(10), "X")
+      .appendField("y:")
+      .appendField(new Blockly.FieldNumber(10), "Y");
+    this.setPreviousStatement(true, "default");
+    this.setNextStatement(true, "default");
+    this.setColour("#FF8C1A");
+    this.setInputsInline(true);
+  },
+  getVariables: function() {
+    const variables = window.projectVariables || {};
+    const varNames = Object.keys(variables);
+    if (varNames.length === 0) {
+      return [["no variables", ""]];
+    }
+    return varNames.map(name => [name, name]);
+  }
+};
+
+BlocklyJS.javascriptGenerator.forBlock["show_variable"] = function (block) {
+  const varName = block.getFieldValue("VAR");
+  const x = block.getFieldValue("X") || 10;
+  const y = block.getFieldValue("Y") || 10;
+  return `showVariableMonitor("${varName}", ${x}, ${y});\n`;
+};
+
+Blockly.Blocks["hide_variable"] = {
+  init: function () {
+    this.appendDummyInput()
+      .appendField("hide variable")
+      .appendField(new Blockly.FieldDropdown(this.getVariables), "VAR");
+    this.setPreviousStatement(true, "default");
+    this.setNextStatement(true, "default");
+    this.setColour("#FF8C1A");
+  },
+  getVariables: function() {
+    const variables = window.projectVariables || {};
+    const varNames = Object.keys(variables);
+    if (varNames.length === 0) {
+      return [["no variables", ""]];
+    }
+    return varNames.map(name => [name, name]);
+  }
+};
+
+BlocklyJS.javascriptGenerator.forBlock["hide_variable"] = function (block) {
+  const varName = block.getFieldValue("VAR");
+  return `hideVariableMonitor("${varName}");\n`;
+};
+
+// Block to MOVE the variable monitor to a position
+Blockly.Blocks["move_variable_to"] = {
+  init: function () {
+    this.appendDummyInput()
+      .appendField("move variable")
+      .appendField(new Blockly.FieldDropdown(this.getVariables), "VAR")
+      .appendField("to x:")
+      .appendField(new Blockly.FieldNumber(10), "X")
+      .appendField("y:")
+      .appendField(new Blockly.FieldNumber(10), "Y");
+    this.setPreviousStatement(true, "default");
+    this.setNextStatement(true, "default");
+    this.setColour("#FF8C1A");
+  },
+  getVariables: function() {
+    const variables = window.projectVariables || {};
+    const varNames = Object.keys(variables);
+    if (varNames.length === 0) {
+      return [["no variables", ""]];
+    }
+    return varNames.map(name => [name, name]);
+  }
+};
+
+BlocklyJS.javascriptGenerator.forBlock["move_variable_to"] = function (block) {
+  const varName = block.getFieldValue("VAR");
+  const x = block.getFieldValue("X") || 10;
+  const y = block.getFieldValue("Y") || 10;
+  console.log('Generating move_variable_to code:', varName, x, y);
+  return `moveVariableMonitor("${varName}", ${x}, ${y});\n`;
+};