k-space/sumorobot-web
10
0
Fork 0
forked from marva/sumorobot-web
Code Issues Pull Requests Projects Wiki Activity

update block highlighting

Browse Source
This commit is contained in:
Silver Kuusik 2018-08-12 12:37:02 +02:00
parent 5a8e0a1127
commit 607825ed17
1 changed files with 26 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

49
assets/js/blockly.js
View File

@ -1,6 +1,6 @@
window.addEventListener("load", function() { window.addEventListener('load', function() {
// To remember the control_if blockId // To remember the control_if blockId
var controlBlockId = ""; var controlBlockId = '';
// Change the if block to be more cheerful // Change the if block to be more cheerful
Blockly.Msg.LOGIC_HUE = '#44CC00'; Blockly.Msg.LOGIC_HUE = '#44CC00';
@ -62,7 +62,7 @@ window.addEventListener("load", function() {
var target = e.target; var target = e.target;
// When control_if block is in use // When control_if block is in use
if (controlBlockId != "") { if (controlBlockId != '') {
// When the user clicks anywhere outside the mutator and not on the mutator icon // When the user clicks anywhere outside the mutator and not on the mutator icon
if (!$(target).is('.blocklyBubbleCanvas') && !$(target).parents().is('.blocklyBubbleCanvas')) { if (!$(target).is('.blocklyBubbleCanvas') && !$(target).parents().is('.blocklyBubbleCanvas')) {
if (!$(target).is('.blocklyIconGroup') && !$(target).parents().is('.blocklyIconGroup')) { if (!$(target).is('.blocklyIconGroup') && !$(target).parents().is('.blocklyIconGroup')) {
@ -77,9 +77,9 @@ window.addEventListener("load", function() {
Blockly.Blocks['sumorobot_sleep'] = { Blockly.Blocks['sumorobot_sleep'] = {
init: function() { init: function() {
this.setColour("#E64C00"); this.setColour('#E64C00');
this.appendDummyInput() this.appendDummyInput()
.appendField("sleep") .appendField('sleep')
.appendField(new Blockly.FieldTextInput('1000', .appendField(new Blockly.FieldTextInput('1000',
Blockly.FieldNumber.numberValidator), 'SLEEP'); Blockly.FieldNumber.numberValidator), 'SLEEP');
this.setPreviousStatement(true); this.setPreviousStatement(true);
@ -97,7 +97,7 @@ window.addEventListener("load", function() {
['move forward', 'FORWARD'], ['move forward', 'FORWARD'],
['move backward', 'BACKWARD'] ['move backward', 'BACKWARD']
]; ];
this.setColour("#E60000"); this.setColour('#E60000');
var dropdown = new Blockly.FieldDropdown(OPERATORS); var dropdown = new Blockly.FieldDropdown(OPERATORS);
this.appendDummyInput().appendField(dropdown, 'MOVE'); this.appendDummyInput().appendField(dropdown, 'MOVE');
this.setPreviousStatement(true); this.setPreviousStatement(true);
@ -107,7 +107,7 @@ window.addEventListener("load", function() {
Blockly.Blocks['sumorobot_opponent'] = { Blockly.Blocks['sumorobot_opponent'] = {
init: function() { init: function() {
this.setColour("#0099E6"); this.setColour('#0099E6');
this.appendDummyInput().appendField('opponent'); this.appendDummyInput().appendField('opponent');
this.setOutput(true, 'Boolean'); this.setOutput(true, 'Boolean');
} }
@ -119,7 +119,7 @@ window.addEventListener("load", function() {
['line left', 'LEFT'], ['line left', 'LEFT'],
['line right', 'RIGHT'] ['line right', 'RIGHT']
]; ];
this.setColour("#E6BF00"); this.setColour('#E6BF00');
var dropdown = new Blockly.FieldDropdown(OPERATORS); var dropdown = new Blockly.FieldDropdown(OPERATORS);
this.appendDummyInput().appendField(dropdown, 'LINE'); this.appendDummyInput().appendField(dropdown, 'LINE');
this.setOutput(true, 'Boolean'); this.setOutput(true, 'Boolean');
@ -127,29 +127,29 @@ window.addEventListener("load", function() {
}; };
Blockly.Python['sumorobot_sleep'] = function(block) { Blockly.Python['sumorobot_sleep'] = function(block) {
var code = 'sumorobot.sleep(' + parseFloat(block.getFieldValue('SLEEP')) + ', "' + block.id + '")\n'; var code = 'sumorobot.sleep(' + parseFloat(block.getFieldValue('SLEEP')) + ');;' + block.id + '\n';
return code; return code;
}; };
Blockly.Python['sumorobot_move'] = function(block) { Blockly.Python['sumorobot_move'] = function(block) {
var code = 'sumorobot.move(' + block.getFieldValue('MOVE') + ', "' + block.id + '")\n'; var code = 'sumorobot.move(' + block.getFieldValue('MOVE') + ');;' + block.id + '\n';
return code; return code;
}; };
Blockly.Python['sumorobot_opponent'] = function(block) { Blockly.Python['sumorobot_opponent'] = function(block) {
var code = 'sumorobot.is_opponent("' + block.id + '")'; var code = 'sumorobot.is_opponent();;' + block.id + '\n';
return [code, Blockly.Python.ORDER_ATOMIC]; return [code, Blockly.Python.ORDER_ATOMIC];
}; };
Blockly.Python['sumorobot_line'] = function(block) { Blockly.Python['sumorobot_line'] = function(block) {
var code = 'sumorobot.is_line(' + block.getFieldValue('LINE') + ', "' + block.id + '")'; var code = 'sumorobot.is_line(' + block.getFieldValue('LINE') + ');;' + block.id + '\n';
return [code, Blockly.Python.ORDER_ATOMIC]; return [code, Blockly.Python.ORDER_ATOMIC];
}; };
// Inject Blockly // Inject Blockly
var blocklyArea = document.getElementById('blocklyArea'); var blocklyArea = document.getElementById('blocklyArea');
var blocklyDiv = document.getElementById('blocklyDiv'); var blocklyDiv = document.getElementById('blocklyDiv');
var workspace = Blockly.inject(blocklyDiv, { workspace = Blockly.inject(blocklyDiv, {
scrollbars: false, scrollbars: false,
media: 'assets/blockly/media/', media: 'assets/blockly/media/',
trashcan: true, trashcan: true,
@ -183,14 +183,15 @@ window.addEventListener("load", function() {
Blockly.svgResize(workspace); Blockly.svgResize(workspace);
// Retrieve the blocks // Retrieve the blocks
var xml = Blockly.Xml.textToDom(getLocalStorageItem("sumorobot.blockly")); var xml = Blockly.Xml.textToDom(getLocalStorageItem('sumorobot.blockly'));
// Resume the blocks // Resume the blocks
Blockly.Xml.domToWorkspace(xml, workspace); Blockly.Xml.domToWorkspace(xml, workspace);
// On Blockly code change // On Blockly code change
function onCodeChanged(event) { function onCodeChanged(event) {
// When the if condition block was created // When the if condition block was created
if (event.type == Blockly.Events.CREATE && event.xml.getAttributeNode("type").nodeValue == "controls_if") { if (event.type == Blockly.Events.CREATE &&
event.xml.getAttributeNode('type').nodeValue == 'controls_if') {
// Remember the control_if block id // Remember the control_if block id
controlBlockId = event.blockId; controlBlockId = event.blockId;
// Get the control_if block object // Get the control_if block object
@ -202,30 +203,32 @@ window.addEventListener("load", function() {
block.updateShape_(); block.updateShape_();
} }
// When the if condition block was removed // When the if condition block was removed
} else if (event.type == Blockly.Events.DELETE && event.oldXml.getAttributeNode("type").nodeValue == "controls_if") { } else if (event.type == Blockly.Events.DELETE &&
event.oldXml.getAttributeNode('type').nodeValue == 'controls_if') {
// Remove the control_if block id // Remove the control_if block id
controlBlockId = ""; controlBlockId = '';
// Enable the if condition block // Enable the if condition block
workspace.updateToolbox(document.getElementById("toolbox")); workspace.updateToolbox(document.getElementById('toolbox'));
} }
// Only process change and move commands // Only process change and move commands
if (event.type != Blockly.Events.CHANGE && event.type != Blockly.Events.MOVE) return; if (event.type != Blockly.Events.CHANGE && event.type != Blockly.Events.MOVE) return;
// Generate code from the used blocks // Generate code from the used blocks
sumorobot.setBlocklyCode(Blockly.Python.workspaceToCode(workspace)); sumorobot.setBlocklyCode(Blockly.Python.workspaceToCode(workspace));
// Show the code in the ace editor, filter out block IDs // Show the code in the ace editor, filter out block IDs
readOnlyCodingEditor.setValue("\n" + sumorobot.getBlocklyCode().replace(/[,]?[ ]?"(.*?)"/g, "")); readOnlyCodingEditor.setValue('\n' + sumorobot.getBlocklyCode().replace(/;;.{20}/g, ''));
readOnlyCodingEditor.clearSelection(); readOnlyCodingEditor.clearSelection();
// Save the code to the local storage // Save the code to the local storage
var xml = Blockly.Xml.workspaceToDom(workspace); var xml = Blockly.Xml.workspaceToDom(workspace);
localStorage.setItem("sumorobot.blockly", Blockly.Xml.domToText(xml)); localStorage.setItem('sumorobot.blockly', Blockly.Xml.domToText(xml));
// When control_if block is used // When control_if block is used
if (controlBlockId != "") { if (controlBlockId != '') {
// Disable the if condition block // Disable the if condition block
workspace.updateToolbox(document.getElementById("toolbox_no_if")); workspace.updateToolbox(document.getElementById('toolbox_no_if'));
} }
} }
@ -237,7 +240,7 @@ window.addEventListener("load", function() {
var target = e.target; var target = e.target;
// When control_if block is in use // When control_if block is in use
if (controlBlockId != "") { if (controlBlockId != '') {
// When the user clicks anywhere outside the mutator and not on the mutator icon // When the user clicks anywhere outside the mutator and not on the mutator icon
if (!$(target).is('.blocklyBubbleCanvas') && !$(target).parents().is('.blocklyBubbleCanvas')) { if (!$(target).is('.blocklyBubbleCanvas') && !$(target).parents().is('.blocklyBubbleCanvas')) {
if (!$(target).is('.blocklyIconGroup') && !$(target).parents().is('.blocklyIconGroup')) { if (!$(target).is('.blocklyIconGroup') && !$(target).parents().is('.blocklyIconGroup')) {