diff --git a/assets/js/main.js b/assets/js/main.js
index 5cbde52..5185f4f 100644
--- a/assets/js/main.js
+++ b/assets/js/main.js
@@ -1,87 +1,18 @@
// The local/remote server URL
-//var ROBOT_SERVER = "10.42.0.1";
-var ROBOT_SERVER = "ws.achex.ca:4010";
+//var ROBOT_SERVER = '10.42.0.1';
+var ROBOT_SERVER = 'ws.achex.ca:4010';
+var workspace;
// The sumorobot object
-var sumorobot = null;
-// The sumorobot state
-var sumostart = false;
+var sumorobot;
// Disable / enable coding mode
var codingEnabled = false;
// Disable / enable live stream
var liveStreamVisible = false;
-// Where Blockly Python code is shown
-var readOnlyCodingEditor = null;
-// Last hightlighted block id
-var lastHighlighted = "";
-// Block highlight WebSocket
-var blockHighlight = null;
-
-window.addEventListener("load", function() {
- $("#robot-id").val(getLocalStorageItem("sumorobot.robotId"));
- // Load read only ace editor
- readOnlyCodingEditor = ace.edit("readOnlyBlocklyCode");
- // Set the style
- readOnlyCodingEditor.setTheme("ace/theme/textmate");
- readOnlyCodingEditor.session.setMode("ace/mode/python");
- readOnlyCodingEditor.session.setTabSize(2);
- // Make as read only
- readOnlyCodingEditor.setReadOnly(true);
- // Disable scrolling warning
- readOnlyCodingEditor.$blockScrolling = Infinity;
-
- // Load ace editor
- var codingEditor = ace.edit("blocklyCode");
- // Set the style
- codingEditor.setTheme("ace/theme/textmate");
- codingEditor.session.setMode("ace/mode/python");
- codingEditor.session.setTabSize(2);
- // Disable scrolling warning
- codingEditor.$blockScrolling = Infinity;
- // Enable autocomplete
- ace.require("ace/ext/language_tools");
- codingEditor.setOptions({
- enableSnippets: true,
- enableLiveAutocompletion: true,
- enableBasicAutocompletion: true
- });
- // Add autocomplete keywords
- codingEditor.completers.push({
- getCompletions: function(editor, session, pos, prefix, callback) {
- callback(null, [
- {value: "STOP", score: 1000, meta: "sumorobot"},
- {value: "LEFT", score: 1000, meta: "sumorobot"},
- {value: "RIGHT", score: 1000, meta: "sumorobot"},
- {value: "SEARCH", score: 1000, meta: "sumorobot"},
- {value: "FORWARD", score: 1000, meta: "sumorobot"},
- {value: "BACKWARD", score: 1000, meta: "sumorobot"},
- {value: "STATUS", score: 1000, meta: "sumorobot"},
- {value: "LEFT_LINE", score: 1000, meta: "sumorobot"},
- {value: "RIGHT_LINE", score: 1000, meta: "sumorobot"},
- {value: "sumorobot", score: 1000, meta: "sumorobot"},
- {value: "move", score: 1000, meta: "sumorobot"},
- {value: "sleep", score: 1000, meta: "sumorobot"},
- {value: "set_led", score: 1000, meta: "sumorobot"},
- {value: "is_line", score: 1000, meta: "sumorobot"},
- {value: "get_line", score: 1000, meta: "sumorobot"},
- {value: "set_servo", score: 1000, meta: "sumorobot"},
- {value: "is_opponent", score: 1000, meta: "sumorobot"},
- {value: "calibrate_line", score: 1000, meta: "sumorobot"},
- {value: "get_battery_voltage", score: 1000, meta: "sumorobot"},
- {value: "get_opponent_distance", score: 1000, meta: "sumorobot"}
- ]);
- }
- });
- // Set the code to the saved code from local storage or empty
- codingEditor.setValue(getLocalStorageItem("sumorobot.code") || "");
- // Clear the selection after setting the value
- codingEditor.clearSelection();
- // Add an change listener for the code editor
- codingEditor.on("change", function() {
- // When change occurs, save the new code to the localstorage
- setLocalStorageItem("sumorobot.code", codingEditor.getValue())
- });
+window.addEventListener('load', function() {
+ // Set the robot ID from the localstorage
+ $('#robot-id').val(getLocalStorageItem('sumorobot.robotId'));
// Key down event
$(document).keydown(function(e) {
@@ -94,29 +25,28 @@ window.addEventListener("load", function() {
// Select the hotkey
switch(e.which) {
case 32: // space bar
- sumostart = !sumostart;
- if (sumostart) {
- $(".btn-start").addClass("hover");
- $(".btn-start").click();
+ if (sumorobot.moving) {
+ $('.btn-stop').addClass('hover');
+ $('.btn-stop').click();
} else {
- $(".btn-stop").addClass("hover");
- $(".btn-stop").click();
+ $('.btn-start').addClass('hover');
+ $('.btn-start').click();
}
break;
case 37: // left
- sumorobot.send("left");
+ sumorobot.send('left');
break;
case 38: // up
- sumorobot.send("forward");
+ sumorobot.send('forward');
break;
case 39: // right
- sumorobot.send("right");
+ sumorobot.send('right');
break;
case 40: // down
- sumorobot.send("backward");
+ sumorobot.send('backward');
break;
case 67: // c
- $("#panel").toggle();
+ $('#panel').toggle();
break;
case 76: // l
// No live stream if cookies are disabled
@@ -124,24 +54,26 @@ window.addEventListener("load", function() {
// TODO: Open the cookie consent popup
return;
}
- // Load the Mixer stream
- if ($("#stream").is(':empty')) {
- $("#stream").html('');
+ // Load the Mixer stream when it is not yet loaded
+ if ($('#stream').is(':empty')) {
+ $('#stream').html('');
}
- $("#stream").toggle();
+ $('#stream').toggle();
// Toggle live steam visible
liveStreamVisible = !liveStreamVisible;
// If not in coding mode
if (codingEnabled == false) {
- $("#readOnlyBlocklyCode").toggle();
+ $('#readOnlyBlocklyCode').toggle();
}
break;
case 80: // p
- $("#blocklyDiv").toggle();
- $("#blocklyArea").toggle();
- $("#blocklyCode").toggle();
+ $('#blocklyDiv').toggle();
+ $('#blocklyArea').toggle();
+ $('#blocklyCode').toggle();
+ // When live stream is not active
if (liveStreamVisible == false) {
- $("#readOnlyBlocklyCode").toggle();
+ // Toggle Blockly Python code
+ $('#readOnlyBlocklyCode').toggle();
}
// Toggle coding enabled
codingEnabled = !codingEnabled;
@@ -156,15 +88,15 @@ window.addEventListener("load", function() {
// Implement something
break;
case 83: // s
- $(".btn-stop").addClass("hover");
- $(".btn-stop").click();
+ $('.btn-stop').addClass('hover');
+ $('.btn-stop').click();
break;
case 84: // t
- sumorobot.send("calibrate_line");
+ sumorobot.send('calibrate_line');
break;
case 87: // w
- $(".btn-start").addClass("hover");
- $(".btn-start").click();
+ $('.btn-start').addClass('hover');
+ $('.btn-start').click();
break;
}
});
@@ -177,72 +109,67 @@ window.addEventListener("load", function() {
$('.btn').removeClass('hover');
// If arrow keys were pressed
if (e.which == 37 || e.which == 38 || e.which == 39 || e.which == 40) {
- sumorobot.send("stop");
+ sumorobot.send('stop');
}
});
// Start button listener
- $(".btn-start").click(function() {
- sumostart = true;
- // When we are in coding mode
+ $('.btn-start').click(function() {
+ // When we are in Python coding mode
if (codingEnabled) {
- var parsedCode = codingEditor.getValue().replace(/"/g, '\\"').replace(/\n/g, ';;');
- // Send the code from the textarea to the SumoRobot
- sumorobot.send("code", parsedCode);
+ // Get the Python code
+ parsedCode = codingEditor.getValue();
// Otherwise when we are in Blockly mode
} else {
- // Send the code from the blocks to the SumoRobot
- var parsedCode = sumorobot.getBlocklyCode().replace(/"/g, '\\"').replace(/\n/g, ';;');
- sumorobot.send("code", parsedCode);
+ // Get the code from the blocks
+ parsedCode = sumorobot.getBlocklyCode().replace(/;;.{20}/g, '');
}
+ // Escape the qoutes, replace new lines and send the code
+ sumorobot.send('code', parsedCode.replace(/"/g, '\\"').replace(/\n/g, ';;'));
+ // TODO: Highlight the blocks and lines
+ /*var lines = sumorobot.getBlocklyCode().replace(/ /g, '').split('\n');
+ // Process code lines
+ for (i in lines) {
+ if (lines[i]) {
+ console.log(lines[i].split(';;'));
+ }
+ }*/
});
// Stop button listener
- $(".btn-stop").click(function() {
- sumostart = false;
- sumorobot.send("stop");
- //workspace.highlightBlock(lastHighlighted, false);
+ $('.btn-stop').click(function() {
+ sumorobot.send('stop');
+ // TODO: Stop highlighting blocks and lines
});
- // Enter listener on robot ID field
- $("#robot-id").keypress(function(e) {
+ // Enter (return) keypress listener on robot ID field
+ $('#robot-id').keypress(function(e) {
if (e.which == 13) {
// Simulate robot GO button click
- $(".btn-robot-go").click();
+ $('.btn-robot-go').click();
}
});
- // Robot number button listener
- $(".btn-robot-go").click(function() {
+ // Robot GO button listener
+ $('.btn-robot-go').click(function() {
// Extract and validate the selected robot ID
- var robotId = $("#robot-id").val().trim();
- if (robotId === "" || /^([a-f0-9]{6})$/.test(robotId) == false) {
- $("#robot-id, #robot-label").addClass("has-error");
+ var robotId = $('#robot-id').val().trim();
+ if (robotId === '' || /^([a-f0-9]{6})$/.test(robotId) == false) {
+ $('#robot-id, #robot-label').addClass('has-error');
return;
} else {
- $("#robot-id, #robot-label").removeClass("has-error");
+ $('#robot-id, #robot-label').removeClass('has-error');
}
- // Update robot IDs in local storage
- setLocalStorageItem("sumorobot.robotId", robotId);
- // In case there is a open connection
- if (sumorobot/* && blockHighlight*/) {
- // Close the connections
+ // Update robot ID in local storage
+ setLocalStorageItem('sumorobot.robotId', robotId);
+ // When a connection was already opened
+ if (sumorobot) {
+ // Close the connection
sumorobot.close();
- //blockHighlight.close();
}
// Connect to the selected robots WebSocket
sumorobot = new Sumorobot(`ws://${ROBOT_SERVER}`, robotId);
- // connect to the other block highlight WebSocket
- //blockHighlight = new WebSocket("ws://" + robotServer + ":80/p2p/browser/" + robotId + "-highlight/");
- // when there is a message from the WebSocket
- /*blockHighlight.onmessage = function(evt) {
- // when scope is received
- if (evt.data.length == 20 && sumostart) {
- workspace.highlightBlock(evt.data);
- lastHighlighted = evt.data;
- }
- };*/
// Hide the configuration panel
- $("#panel").hide();
+ $('#panel').hide();
});
});