83 lines
3.0 KiB
HTML
83 lines
3.0 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Behaviour Editor</title>
|
|
<script src="https://unpkg.com/blockly/blockly.min.js"></script>
|
|
<link rel="stylesheet" href="styles.css">
|
|
<script src="behaviourEditor.js" defer></script>
|
|
</head>
|
|
|
|
<body>
|
|
<h1>Behaviour Editor: Blockly</h1>
|
|
<div id="blocklyDiv" style="height: 920px; width: 1280px;"></div>
|
|
<xml id="toolbox" style="display: none">
|
|
<category name="Animation" colour="#66BB6A">
|
|
<block type="playAnimation"></block>
|
|
<block type="constant_variable"></block>
|
|
</category>
|
|
<category name="Functions" colour="#5C81A6">
|
|
<block type="onStartup"></block>
|
|
<block type="onFaceDetect"></block>
|
|
</category>
|
|
<category name="Logic" colour="#DDAA00">
|
|
<block type="controls_if"></block>
|
|
<block type="controls_if_else"></block>
|
|
<block type="logic_compare"></block>
|
|
<block type="logic_operation"></block>
|
|
<block type="logic_negate"></block>
|
|
<block type="logic_boolean"></block>
|
|
</category>
|
|
<category name="Control" colour="120">
|
|
<block type="controls_for"></block>
|
|
<block type="controls_whileUntil"></block>
|
|
</category>
|
|
<category name="Math" colour="230">
|
|
<block type="math_random_int"></block>
|
|
<block type="math_random_float"></block>
|
|
<block type="math_number">
|
|
<field name="NUM">0</field>
|
|
</block>
|
|
<block type="math_arithmetic">
|
|
<value name="A">
|
|
<shadow type="math_number">
|
|
<field name="NUM">5</field>
|
|
</shadow>
|
|
</value>
|
|
<value name="B">
|
|
<shadow type="math_number">
|
|
<field name="NUM">3</field>
|
|
</shadow>
|
|
</value>
|
|
</block>
|
|
</category>
|
|
<category name="Variables" colour="330" custom="VARIABLE" />
|
|
</xml>
|
|
<button onclick="saveWorkspace()">Save Workspace</button>
|
|
<button onclick="loadWorkspace()">Load Workspace</button>
|
|
<script>
|
|
const workspace = Blockly.inject('blocklyDiv', {
|
|
toolbox: document.getElementById('toolbox')
|
|
});
|
|
|
|
function saveWorkspace() {
|
|
const state = Blockly.serialization.workspaces.save(workspace);
|
|
const jsonString = JSON.stringify(state);
|
|
localStorage.setItem('blocklyWorkspace', jsonString);
|
|
}
|
|
|
|
function loadWorkspace() {
|
|
const jsonString = localStorage.getItem('blocklyWorkspace');
|
|
if (jsonString) {
|
|
const state = JSON.parse(jsonString);
|
|
Blockly.serialization.workspaces.load(state, workspace);
|
|
} else {
|
|
console.error('No workspace found in local storage.');
|
|
}
|
|
}
|
|
</script>
|
|
</body>
|
|
|
|
</html> |