Add C4A-Script support and documentation

- Generate OneShot js code geenrator - Introduced a new C4A-Script tutorial example for login flow using Blockly. - Updated index.html to include Blockly theme and event editor modal for script editing. - Created a test HTML file for testing Blockly integration. - Added comprehensive C4A-Script API reference documentation covering commands, syntax, and examples. - Developed core documentation for C4A-Script, detailing its features, commands, and real-world examples. - Updated mkdocs.yml to include new C4A-Script documentation in navigation.
2025-06-07 23:07:19 +08:00
parent ca03acbc82
commit 08a2cdae53
46 changed files with 6914 additions and 326 deletions
--- a/docs/examples/c4a_script/tutorial/test_blockly.html
+++ b/docs/examples/c4a_script/tutorial/test_blockly.html
@@ -0,0 +1,69 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Blockly Test</title>
+    <style>
+        body {
+            margin: 0;
+            padding: 20px;
+            background: #0e0e10;
+            color: #e0e0e0;
+            font-family: monospace;
+        }
+        #blocklyDiv {
+            height: 600px;
+            width: 100%;
+            border: 1px solid #2a2a2c;
+        }
+        #output {
+            margin-top: 20px;
+            padding: 15px;
+            background: #1a1a1b;
+            border: 1px solid #2a2a2c;
+            white-space: pre-wrap;
+        }
+    </style>
+</head>
+<body>
+    <h1>C4A-Script Blockly Test</h1>
+    <div id="blocklyDiv"></div>
+    <div id="output">
+        <h3>Generated C4A-Script:</h3>
+        <pre id="code-output"></pre>
+    </div>
+    
+    <script src="https://unpkg.com/blockly/blockly.min.js"></script>
+    <script src="assets/c4a-blocks.js"></script>
+    <script>
+        // Simple test
+        const workspace = Blockly.inject('blocklyDiv', {
+            toolbox: `
+                <xml>
+                    <category name="Test" colour="#1E88E5">
+                        <block type="c4a_go"></block>
+                        <block type="c4a_wait_time"></block>
+                        <block type="c4a_click"></block>
+                    </category>
+                </xml>
+            `,
+            theme: Blockly.Theme.defineTheme('dark', {
+                'base': Blockly.Themes.Classic,
+                'componentStyles': {
+                    'workspaceBackgroundColour': '#0e0e10',
+                    'toolboxBackgroundColour': '#1a1a1b',
+                    'toolboxForegroundColour': '#e0e0e0',
+                    'flyoutBackgroundColour': '#1a1a1b',
+                    'flyoutForegroundColour': '#e0e0e0',
+                }
+            })
+        });
+        
+        workspace.addChangeListener((event) => {
+            const code = Blockly.JavaScript.workspaceToCode(workspace);
+            document.getElementById('code-output').textContent = code;
+        });
+    </script>
+</body>
+</html>