diff --git a/activity_1/arduino_blocks_def.js b/activity_1/arduino_blocks_def.js
new file mode 100644
index 0000000000000000000000000000000000000000..07da611f6f60f41051c15192e36c23e0e5c4bb16
--- /dev/null
+++ b/activity_1/arduino_blocks_def.js
@@ -0,0 +1,41 @@
+Blockly.Blocks['sendtoarduino'] = {
+ init: function() {
+ this.appendValueInput("MESSAGE")
+ .setCheck("String")
+ .appendField("Envoyer à l'arduino :");
+ this.setPreviousStatement(true, null);
+ this.setNextStatement(true, null);
+ this.setColour(330);
+ this.setTooltip("envoi d'un string à l'Arduino de la maquette");
+ this.setHelpUrl("");
+ }
+};
+
+Blockly.Blocks['turn_led'] = {
+ init: function() {
+ this.appendDummyInput()
+ .appendField("Mettre la LED en l'état")
+ .appendField(new Blockly.FieldDropdown([["allumée","on"], ["éteinte","off"]]), "val");
+ this.setPreviousStatement(true, null);
+ this.setNextStatement(true, null);
+ this.setColour(345);
+ this.setTooltip("Change l'état d'une LED");
+ this.setHelpUrl("");
+ }
+};
+
+Blockly.Blocks['arduino_wait'] = {
+ init: function() {
+ this.appendValueInput("time")
+ .setCheck("Number")
+ .appendField("Attendre");
+ this.appendDummyInput()
+ .appendField("secondes");
+ this.setInputsInline(true);
+ this.setPreviousStatement(true, null);
+ this.setNextStatement(true, null);
+ this.setColour(330);
+ this.setTooltip("");
+ this.setHelpUrl("");
+ }
+};
diff --git a/activity_1/arduino_blocks_gen.js b/activity_1/arduino_blocks_gen.js
new file mode 100644
index 0000000000000000000000000000000000000000..45a5cd607237fea18c537c7aea5c90b65123a869
--- /dev/null
+++ b/activity_1/arduino_blocks_gen.js
@@ -0,0 +1,20 @@
+Blockly.JavaScript['sendtoarduino'] = function(block) {
+ var value_message = Blockly.JavaScript.valueToCode(block, 'MESSAGE', Blockly.JavaScript.ORDER_ATOMIC);
+ // TODO: Assemble JavaScript into code variable.
+ var code = 'sendString("'+ value_message + ';"); \n';
+ return code;
+};
+
+Blockly.JavaScript['turn_led'] = function(block) {
+ var dropdown_val = block.getFieldValue('val');
+ // TODO: Assemble JavaScript into code variable.
+ var code = 'sendString("LED_'+ dropdown_val + ';");\n';
+ return code;
+};
+
+Blockly.JavaScript['arduino_wait'] = function(block) {
+ var value_time = Blockly.JavaScript.valueToCode(block, 'time', Blockly.JavaScript.ORDER_ATOMIC);
+ let time_ms = Math.round(value_time*1000);
+ var code = 'sendString("DELAY_'+time_ms+';");\n waitForUnlockFromArduino();\n';
+ return code;
+};
diff --git a/activity_1/index.html b/activity_1/index.html
index 2939ebd3b7e2b9c7db58a23979dc6ffe20b98580..136a565837113cfe14a97c665ee2cd228a6a5733 100644
--- a/activity_1/index.html
+++ b/activity_1/index.html
@@ -4,14 +4,16 @@
<title>Road to the Moon !</title>
<meta charset="utf-8" />
<link rel="stylesheet" href="../res/style.css" />
-
<!-- Import des bibliothèques js nécessaires -->
+ <script src="../res/lib/jquery.js"></script>
+ <script src="../res/lib/serial.js"></script>
+
<script src="../res/lib/blockly/blockly_compressed.js"></script>
<script src="../res/lib/blockly/blocks_compressed.js"></script>
<script src="../res/lib/blockly/javascript_compressed.js"></script>
<script src="../res/lib/blockly/msg/js/fr.js"></script>
<script src="../res/lib/JS-Interpreter/acorn_interpreter.js"></script>
- <script src="../res/lib/jquery.js"></script>
+
<script>
$(function(){
$("#header").load("../res/header.html");
@@ -26,22 +28,23 @@
<section class="mainSection">
<!-- Création de la div portant blockly et d'un conteneur supérieur pour le responsive-->
- <div id="blocklyArea"><div id="blocklyDiv" ></div></div>
+ <div id="blocklyArea">
+ <div id="blocklyDiv" ></div>
+ </div>
+
<div id="toolsArea">
- <a onclick="runCode()" id="runButton">Lancer le programme !</a>
+ <div id="animationArea"></div>
+ <a class="button" id="connectButton">Connecter à la maquette</a>
+ <a onclick="runCode()" class="button" id="runButton">Lancer le programme !</a>
</div>
</section>
-
<footer id="footer"></footer>
-
-
</body>
- <!-- Définition du contenu et de l'organisation de la "toolbox" -->
-
-
<!-- Script d'intanciation lancé au chargement, doit toujours être à la fin-->
+ <script src="arduino_blocks_def.js"></script>
+ <script src="arduino_blocks_gen.js"></script>
<script src="main-script.js"></script>
</html>
diff --git a/activity_1/main-script.js b/activity_1/main-script.js
index 3b77535312d2a1caddfca44eff1ba42f40e04f70..91be7ad2e25a62cef5bbec4a5b0bc43b3d46fcd5 100644
--- a/activity_1/main-script.js
+++ b/activity_1/main-script.js
@@ -1,6 +1,13 @@
var blocklyDiv = document.getElementById('blocklyDiv');
var blocklyArea = document.getElementById('blocklyArea');
+var connectButton = document.getElementById('connectButton');
+var receivedMsg = "";
+
+var port;
+let textEncoder = new TextEncoder();
+
+//Chargement de la toolbox
var xml = null;
var request = new XMLHttpRequest();
request.open('GET', 'toolbox.xml', false);
@@ -9,11 +16,14 @@ if (request.readyState == 4 && request.status == 200) {
xml = request.responseXML;
}
var toolbox = new XMLSerializer().serializeToString(xml.documentElement);
+
+//Instancie l'espace de travail blockly
var workspace = Blockly.inject(blocklyDiv,
{toolbox: toolbox});
-//Ca a l'air dégueulasse pour faire du responsive mais c'est le truc de la doc
-//officielle de google xD
+/* Adapte la taille du conteneur de l'espace du travail à l'environnement
+Ca a l'air dégueulasse pour faire du responsive mais c'est le truc de la doc
+officielle de google xD*/
var onresize = function(e) {
// Compute the absolute coordinates and dimensions of blocklyArea.
var element = blocklyArea;
@@ -35,6 +45,69 @@ var onresize = function(e) {
onresize();
Blockly.svgResize(workspace);
+//Instanciation de la liaison série à la fin du chargement de la page
+document.addEventListener('DOMContentLoaded', event => {
+ function connect() {
+ console.log('Connecting to ' + port.device_.productName + '...');
+ port.connect().then(() => {
+ console.log(port);
+ console.log('Connected.');
+ connectButton.textContent = 'Se déconnecter';
+ port.onReceive = data => {
+ let textDecoder = new TextDecoder();
+ receivedMsg = textDecoder.decode(data);
+ //console.log("Reçu :" + receivedMsg);
+ }
+ port.onReceiveError = error => {
+ console.log('Receive error: ' + error);
+ };
+ }, error => {
+ console.log('Connection error: ' + error);
+ });
+ };
+
+ connectButton.addEventListener('click', function() {
+ if (port) {
+ port.disconnect();
+ connectButton.textContent = 'Connecter à la maquette';
+ port = null;
+ } else {
+ serial.requestPort().then(selectedPort => {
+ port = selectedPort;
+ connect();
+ }).catch(error => {
+ console.log('Connection error: ' + error);
+ });
+ }
+ });
+
+ serial.getPorts().then(ports => {
+ if (ports.length == 0) {
+ console.log('No devices found.');
+ } else {
+ port = ports[0];
+ connect();
+ }
+ });
+});
+
+
+//Envoie ce string à l'Arduino
+function sendString(str) {
+ if (port !== undefined) {
+ port.send(textEncoder.encode(str)).catch(error => {
+ console.console.log('Send error: ' + error);
+ });
+ }
+}
+
+//Attend jusqu'à ce que le message "UNLOCK;" soit reçu de l'arduino
+function waitForUnlockFromArduino() {
+ if (receivedMsg != "UNLOCK;") {
+ setTimeout(waitForUnlockFromArduino, 10);
+ return;
+ }
+}
//Lance le code tel que rentré par le joueur
function runCode() {
@@ -44,6 +117,7 @@ function runCode() {
//Il est possible de lancer le code de façon séquencielle
}
+
//Interprétation des commandes par l'utiliseur (redéfinition des fonctions avec IO)
function initApi(interpreter, scope) {
// Add an API function for the alert() block.
@@ -53,10 +127,17 @@ function initApi(interpreter, scope) {
interpreter.setProperty(scope, 'alert',
interpreter.createNativeFunction(wrapper));
- // Add an API function for the prompt() block.
+ // Add an API function for the sendString() block.
wrapper = function(text) {
- return prompt(text);
+ return sendString(arguments.length ? text : '');
+ };
+ interpreter.setProperty(scope, 'sendString',
+ interpreter.createNativeFunction(wrapper));
+
+ // Add an API function for the waitForUnlockFromArduino() block.
+ wrapper = function() {
+ return waitForUnlockFromArduino();
};
- interpreter.setProperty(scope, 'prompt',
+ interpreter.setProperty(scope, 'waitForUnlockFromArduino',
interpreter.createNativeFunction(wrapper));
}
diff --git a/activity_1/toolbox.xml b/activity_1/toolbox.xml
index ef3fb0b8383dd0eedff31371e320020119200e5f..8eca1b88a7cc67205cc32d1cae25ee5cd31a8a65 100644
--- a/activity_1/toolbox.xml
+++ b/activity_1/toolbox.xml
@@ -1,311 +1,30 @@
-<xml xmlns="https://developers.google.com/blockly/xml">
- <category name="Logic" colour="%{BKY_LOGIC_HUE}">
- <category name="If">
- <block type="controls_if"></block>
- <block type="controls_if">
- <mutation else="1"></mutation>
- </block>
- <block type="controls_if">
- <mutation elseif="1" else="1"></mutation>
- </block>
- </category>
- <category name="Boolean" colour="%{BKY_LOGIC_HUE}">
- <block type="logic_compare"></block>
- <block type="logic_operation"></block>
- <block type="logic_negate"></block>
- <block type="logic_boolean"></block>
- <block type="logic_null"></block>
- <block type="logic_ternary"></block>
- </category>
- </category>
- <category name="Loops" colour="%{BKY_LOOPS_HUE}">
- <block type="controls_repeat_ext">
- <value name="TIMES">
- <block type="math_number">
- <field name="NUM">10</field>
- </block>
- </value>
- </block>
- <block type="controls_whileUntil"></block>
- <block type="controls_for">
- <field name="VAR">i</field>
- <value name="FROM">
- <block type="math_number">
- <field name="NUM">1</field>
- </block>
- </value>
- <value name="TO">
- <block type="math_number">
- <field name="NUM">10</field>
- </block>
- </value>
- <value name="BY">
- <block type="math_number">
- <field name="NUM">1</field>
- </block>
- </value>
- </block>
- <block type="controls_forEach"></block>
- <block type="controls_flow_statements"></block>
- </category>
- <category name="Math" colour="%{BKY_MATH_HUE}">
- <block type="math_number">
- <field name="NUM">123</field>
- </block>
- <block type="math_arithmetic"></block>
- <block type="math_single"></block>
- <block type="math_trig"></block>
- <block type="math_constant"></block>
- <block type="math_number_property"></block>
- <block type="math_round"></block>
- <block type="math_on_list"></block>
- <block type="math_modulo"></block>
- <block type="math_constrain">
- <value name="LOW">
- <block type="math_number">
- <field name="NUM">1</field>
- </block>
- </value>
- <value name="HIGH">
- <block type="math_number">
- <field name="NUM">100</field>
- </block>
- </value>
- </block>
- <block type="math_random_int">
- <value name="FROM">
- <block type="math_number">
- <field name="NUM">1</field>
- </block>
- </value>
- <value name="TO">
- <block type="math_number">
- <field name="NUM">100</field>
- </block>
- </value>
- </block>
- <block type="math_random_float"></block>
- <block type="math_atan2"></block>
- </category>
- <category name="Lists" colour="%{BKY_LISTS_HUE}">
- <block type="lists_create_empty"></block>
- <block type="lists_create_with"></block>
- <block type="lists_repeat">
- <value name="NUM">
- <block type="math_number">
- <field name="NUM">5</field>
- </block>
- </value>
- </block>
- <block type="lists_length"></block>
- <block type="lists_isEmpty"></block>
- <block type="lists_indexOf"></block>
- <block type="lists_getIndex"></block>
- <block type="lists_setIndex"></block>
- </category>
- <sep></sep>
- <category name="Variables" custom="VARIABLE" colour="%{BKY_VARIABLES_HUE}">
- </category>
- <category name="Functions" custom="PROCEDURE" colour="%{BKY_PROCEDURES_HUE}">
- </category>
- <sep></sep>
- <category name="Library" expanded="true">
- <category name="Randomize">
- <block type="procedures_defnoreturn">
- <mutation>
- <arg name="list"></arg>
- </mutation>
- <field name="NAME">randomize</field>
- <statement name="STACK">
- <block type="controls_for" inline="true">
- <field name="VAR">x</field>
- <value name="FROM">
- <block type="math_number">
- <field name="NUM">1</field>
- </block>
- </value>
- <value name="TO">
- <block type="lists_length" inline="false">
- <value name="VALUE">
- <block type="variables_get">
- <field name="VAR">list</field>
- </block>
- </value>
- </block>
- </value>
- <value name="BY">
- <block type="math_number">
- <field name="NUM">1</field>
- </block>
- </value>
- <statement name="DO">
- <block type="variables_set" inline="false">
- <field name="VAR">y</field>
- <value name="VALUE">
- <block type="math_random_int" inline="true">
- <value name="FROM">
- <block type="math_number">
- <field name="NUM">1</field>
- </block>
- </value>
- <value name="TO">
- <block type="lists_length" inline="false">
- <value name="VALUE">
- <block type="variables_get">
- <field name="VAR">list</field>
- </block>
- </value>
- </block>
- </value>
- </block>
- </value>
- <next>
- <block type="variables_set" inline="false">
- <field name="VAR">temp</field>
- <value name="VALUE">
- <block type="lists_getIndex" inline="true">
- <mutation statement="false" at="true"></mutation>
- <field name="MODE">GET</field>
- <field name="WHERE">FROM_START</field>
- <value name="AT">
- <block type="variables_get">
- <field name="VAR">y</field>
- </block>
- </value>
- <value name="VALUE">
- <block type="variables_get">
- <field name="VAR">list</field>
- </block>
- </value>
- </block>
- </value>
- <next>
- <block type="lists_setIndex" inline="false">
- <value name="AT">
- <block type="variables_get">
- <field name="VAR">y</field>
- </block>
- </value>
- <value name="LIST">
- <block type="variables_get">
- <field name="VAR">list</field>
- </block>
- </value>
- <value name="TO">
- <block type="lists_getIndex" inline="true">
- <mutation statement="false" at="true"></mutation>
- <field name="MODE">GET</field>
- <field name="WHERE">FROM_START</field>
- <value name="AT">
- <block type="variables_get">
- <field name="VAR">x</field>
- </block>
- </value>
- <value name="VALUE">
- <block type="variables_get">
- <field name="VAR">list</field>
- </block>
- </value>
- </block>
- </value>
- <next>
- <block type="lists_setIndex" inline="false">
- <value name="AT">
- <block type="variables_get">
- <field name="VAR">x</field>
- </block>
- </value>
- <value name="LIST">
- <block type="variables_get">
- <field name="VAR">list</field>
- </block>
- </value>
- <value name="TO">
- <block type="variables_get">
- <field name="VAR">temp</field>
- </block>
- </value>
- </block>
- </next>
- </block>
- </next>
- </block>
- </next>
- </block>
- </statement>
- </block>
- </statement>
- </block>
- </category>
- <category name="Jabberwocky">
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT">'Twas brillig, and the slithy toves</field>
- </block>
- </value>
- <next>
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT"> Did gyre and gimble in the wabe:</field>
- </block>
- </value>
- <next>
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT">All mimsy were the borogroves,</field>
- </block>
- </value>
- <next>
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT"> And the mome raths outgrabe.</field>
- </block>
- </value>
- </block>
- </next>
- </block>
- </next>
- </block>
- </next>
- </block>
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT">"Beware the Jabberwock, my son!</field>
- </block>
- </value>
- <next>
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT"> The jaws that bite, the claws that catch!</field>
- </block>
- </value>
- <next>
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT">Beware the Jubjub bird, and shun</field>
- </block>
- </value>
- <next>
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT"> The frumious Bandersnatch!"</field>
- </block>
- </value>
- </block>
- </next>
- </block>
- </next>
- </block>
- </next>
- </block>
- </category>
- </category>
-</xml>
+<xml xmlns="https://developers.google.com/blockly/xml" id="toolbox" style="display: none">
+ <category name="Arduino" colour="#a5745b">
+ <block type="sendtoarduino"></block>
+ <block type="turn_led">
+ <field name="val">on</field>
+ </block>
+ <block type="arduino_wait">
+ <value name="time">
+ <block type="math_number">
+ <field name="NUM">1</field>
+ </block>
+ </value>
+ </block>
+ </category>
+ <category name="Texte" colour="#5b80a5">
+ <block type="text">
+ <field name="TEXT"></field>
+ </block>
+ </category>
+ <category name="Variables" colour="#a55b80" custom="VARIABLE"></category>
+ <category name="Boucles" colour="#5ba55b">
+ <block type="controls_repeat_ext">
+ <value name="TIMES">
+ <shadow type="math_number">
+ <field name="NUM">10</field>
+ </shadow>
+ </value>
+ </block>
+ </category>
+</xml>
\ No newline at end of file
diff --git a/activity_2/arduino_blocks_def.js b/activity_2/arduino_blocks_def.js
new file mode 100644
index 0000000000000000000000000000000000000000..07da611f6f60f41051c15192e36c23e0e5c4bb16
--- /dev/null
+++ b/activity_2/arduino_blocks_def.js
@@ -0,0 +1,41 @@
+Blockly.Blocks['sendtoarduino'] = {
+ init: function() {
+ this.appendValueInput("MESSAGE")
+ .setCheck("String")
+ .appendField("Envoyer à l'arduino :");
+ this.setPreviousStatement(true, null);
+ this.setNextStatement(true, null);
+ this.setColour(330);
+ this.setTooltip("envoi d'un string à l'Arduino de la maquette");
+ this.setHelpUrl("");
+ }
+};
+
+Blockly.Blocks['turn_led'] = {
+ init: function() {
+ this.appendDummyInput()
+ .appendField("Mettre la LED en l'état")
+ .appendField(new Blockly.FieldDropdown([["allumée","on"], ["éteinte","off"]]), "val");
+ this.setPreviousStatement(true, null);
+ this.setNextStatement(true, null);
+ this.setColour(345);
+ this.setTooltip("Change l'état d'une LED");
+ this.setHelpUrl("");
+ }
+};
+
+Blockly.Blocks['arduino_wait'] = {
+ init: function() {
+ this.appendValueInput("time")
+ .setCheck("Number")
+ .appendField("Attendre");
+ this.appendDummyInput()
+ .appendField("secondes");
+ this.setInputsInline(true);
+ this.setPreviousStatement(true, null);
+ this.setNextStatement(true, null);
+ this.setColour(330);
+ this.setTooltip("");
+ this.setHelpUrl("");
+ }
+};
diff --git a/activity_2/arduino_blocks_gen.js b/activity_2/arduino_blocks_gen.js
new file mode 100644
index 0000000000000000000000000000000000000000..45a5cd607237fea18c537c7aea5c90b65123a869
--- /dev/null
+++ b/activity_2/arduino_blocks_gen.js
@@ -0,0 +1,20 @@
+Blockly.JavaScript['sendtoarduino'] = function(block) {
+ var value_message = Blockly.JavaScript.valueToCode(block, 'MESSAGE', Blockly.JavaScript.ORDER_ATOMIC);
+ // TODO: Assemble JavaScript into code variable.
+ var code = 'sendString("'+ value_message + ';"); \n';
+ return code;
+};
+
+Blockly.JavaScript['turn_led'] = function(block) {
+ var dropdown_val = block.getFieldValue('val');
+ // TODO: Assemble JavaScript into code variable.
+ var code = 'sendString("LED_'+ dropdown_val + ';");\n';
+ return code;
+};
+
+Blockly.JavaScript['arduino_wait'] = function(block) {
+ var value_time = Blockly.JavaScript.valueToCode(block, 'time', Blockly.JavaScript.ORDER_ATOMIC);
+ let time_ms = Math.round(value_time*1000);
+ var code = 'sendString("DELAY_'+time_ms+';");\n waitForUnlockFromArduino();\n';
+ return code;
+};
diff --git a/activity_2/index.html b/activity_2/index.html
index 2939ebd3b7e2b9c7db58a23979dc6ffe20b98580..136a565837113cfe14a97c665ee2cd228a6a5733 100644
--- a/activity_2/index.html
+++ b/activity_2/index.html
@@ -4,14 +4,16 @@
<title>Road to the Moon !</title>
<meta charset="utf-8" />
<link rel="stylesheet" href="../res/style.css" />
-
<!-- Import des bibliothèques js nécessaires -->
+ <script src="../res/lib/jquery.js"></script>
+ <script src="../res/lib/serial.js"></script>
+
<script src="../res/lib/blockly/blockly_compressed.js"></script>
<script src="../res/lib/blockly/blocks_compressed.js"></script>
<script src="../res/lib/blockly/javascript_compressed.js"></script>
<script src="../res/lib/blockly/msg/js/fr.js"></script>
<script src="../res/lib/JS-Interpreter/acorn_interpreter.js"></script>
- <script src="../res/lib/jquery.js"></script>
+
<script>
$(function(){
$("#header").load("../res/header.html");
@@ -26,22 +28,23 @@
<section class="mainSection">
<!-- Création de la div portant blockly et d'un conteneur supérieur pour le responsive-->
- <div id="blocklyArea"><div id="blocklyDiv" ></div></div>
+ <div id="blocklyArea">
+ <div id="blocklyDiv" ></div>
+ </div>
+
<div id="toolsArea">
- <a onclick="runCode()" id="runButton">Lancer le programme !</a>
+ <div id="animationArea"></div>
+ <a class="button" id="connectButton">Connecter à la maquette</a>
+ <a onclick="runCode()" class="button" id="runButton">Lancer le programme !</a>
</div>
</section>
-
<footer id="footer"></footer>
-
-
</body>
- <!-- Définition du contenu et de l'organisation de la "toolbox" -->
-
-
<!-- Script d'intanciation lancé au chargement, doit toujours être à la fin-->
+ <script src="arduino_blocks_def.js"></script>
+ <script src="arduino_blocks_gen.js"></script>
<script src="main-script.js"></script>
</html>
diff --git a/activity_2/main-script.js b/activity_2/main-script.js
index 3b77535312d2a1caddfca44eff1ba42f40e04f70..c49b0ae1c04f3d940195bee3c2a2996017289bd8 100644
--- a/activity_2/main-script.js
+++ b/activity_2/main-script.js
@@ -1,6 +1,14 @@
var blocklyDiv = document.getElementById('blocklyDiv');
var blocklyArea = document.getElementById('blocklyArea');
+var connectButton = document.getElementById('connectButton');
+var receivedMsg = "";
+var prevRecievedMsg = "";
+
+var port;
+let textEncoder = new TextEncoder();
+
+//Chargement de la toolbox
var xml = null;
var request = new XMLHttpRequest();
request.open('GET', 'toolbox.xml', false);
@@ -9,11 +17,14 @@ if (request.readyState == 4 && request.status == 200) {
xml = request.responseXML;
}
var toolbox = new XMLSerializer().serializeToString(xml.documentElement);
+
+//Instancie l'espace de travail blockly
var workspace = Blockly.inject(blocklyDiv,
{toolbox: toolbox});
-//Ca a l'air dégueulasse pour faire du responsive mais c'est le truc de la doc
-//officielle de google xD
+/* Adapte la taille du conteneur de l'espace du travail à l'environnement
+Ca a l'air dégueulasse pour faire du responsive mais c'est le truc de la doc
+officielle de google xD*/
var onresize = function(e) {
// Compute the absolute coordinates and dimensions of blocklyArea.
var element = blocklyArea;
@@ -35,6 +46,69 @@ var onresize = function(e) {
onresize();
Blockly.svgResize(workspace);
+//Instanciation de la liaison série à la fin du chargement de la page
+document.addEventListener('DOMContentLoaded', event => {
+ function connect() {
+ console.log('Connecting to ' + port.device_.productName + '...');
+ port.connect().then(() => {
+ console.log(port);
+ console.log('Connected.');
+ connectButton.textContent = 'Se déconnecter';
+ port.onReceive = data => {
+ let textDecoder = new TextDecoder();
+ receivedMsg = textDecoder.decode(data);
+ //console.log("Reçu :" + receivedMsg);
+ }
+ port.onReceiveError = error => {
+ console.log('Receive error: ' + error);
+ };
+ }, error => {
+ console.log('Connection error: ' + error);
+ });
+ };
+
+ connectButton.addEventListener('click', function() {
+ if (port) {
+ port.disconnect();
+ connectButton.textContent = 'Connecter à la maquette';
+ port = null;
+ } else {
+ serial.requestPort().then(selectedPort => {
+ port = selectedPort;
+ connect();
+ }).catch(error => {
+ console.log('Connection error: ' + error);
+ });
+ }
+ });
+
+ serial.getPorts().then(ports => {
+ if (ports.length == 0) {
+ console.log('No devices found.');
+ } else {
+ port = ports[0];
+ connect();
+ }
+ });
+});
+
+
+//Envoie ce string à l'Arduino
+function sendString(str) {
+ if (port !== undefined) {
+ port.send(textEncoder.encode(str)).catch(error => {
+ console.console.log('Send error: ' + error);
+ });
+ }
+}
+
+//Attend jusqu'à ce que le message "UNLOCK;" soit reçu de l'arduino
+function waitForUnlockFromArduino() {
+ if (receivedMsg != "UNLOCK;") {
+ setTimeout(waitForUnlockFromArduino, 10);
+ return;
+ }
+}
//Lance le code tel que rentré par le joueur
function runCode() {
@@ -44,6 +118,7 @@ function runCode() {
//Il est possible de lancer le code de façon séquencielle
}
+
//Interprétation des commandes par l'utiliseur (redéfinition des fonctions avec IO)
function initApi(interpreter, scope) {
// Add an API function for the alert() block.
@@ -53,10 +128,17 @@ function initApi(interpreter, scope) {
interpreter.setProperty(scope, 'alert',
interpreter.createNativeFunction(wrapper));
- // Add an API function for the prompt() block.
+ // Add an API function for the sendString() block.
wrapper = function(text) {
- return prompt(text);
+ return sendString(arguments.length ? text : '');
+ };
+ interpreter.setProperty(scope, 'sendString',
+ interpreter.createNativeFunction(wrapper));
+
+ // Add an API function for the waitForUnlockFromArduino() block.
+ wrapper = function() {
+ return waitForUnlockFromArduino();
};
- interpreter.setProperty(scope, 'prompt',
+ interpreter.setProperty(scope, 'waitForUnlockFromArduino',
interpreter.createNativeFunction(wrapper));
}
diff --git a/activity_2/toolbox.xml b/activity_2/toolbox.xml
index ef3fb0b8383dd0eedff31371e320020119200e5f..8eca1b88a7cc67205cc32d1cae25ee5cd31a8a65 100644
--- a/activity_2/toolbox.xml
+++ b/activity_2/toolbox.xml
@@ -1,311 +1,30 @@
-<xml xmlns="https://developers.google.com/blockly/xml">
- <category name="Logic" colour="%{BKY_LOGIC_HUE}">
- <category name="If">
- <block type="controls_if"></block>
- <block type="controls_if">
- <mutation else="1"></mutation>
- </block>
- <block type="controls_if">
- <mutation elseif="1" else="1"></mutation>
- </block>
- </category>
- <category name="Boolean" colour="%{BKY_LOGIC_HUE}">
- <block type="logic_compare"></block>
- <block type="logic_operation"></block>
- <block type="logic_negate"></block>
- <block type="logic_boolean"></block>
- <block type="logic_null"></block>
- <block type="logic_ternary"></block>
- </category>
- </category>
- <category name="Loops" colour="%{BKY_LOOPS_HUE}">
- <block type="controls_repeat_ext">
- <value name="TIMES">
- <block type="math_number">
- <field name="NUM">10</field>
- </block>
- </value>
- </block>
- <block type="controls_whileUntil"></block>
- <block type="controls_for">
- <field name="VAR">i</field>
- <value name="FROM">
- <block type="math_number">
- <field name="NUM">1</field>
- </block>
- </value>
- <value name="TO">
- <block type="math_number">
- <field name="NUM">10</field>
- </block>
- </value>
- <value name="BY">
- <block type="math_number">
- <field name="NUM">1</field>
- </block>
- </value>
- </block>
- <block type="controls_forEach"></block>
- <block type="controls_flow_statements"></block>
- </category>
- <category name="Math" colour="%{BKY_MATH_HUE}">
- <block type="math_number">
- <field name="NUM">123</field>
- </block>
- <block type="math_arithmetic"></block>
- <block type="math_single"></block>
- <block type="math_trig"></block>
- <block type="math_constant"></block>
- <block type="math_number_property"></block>
- <block type="math_round"></block>
- <block type="math_on_list"></block>
- <block type="math_modulo"></block>
- <block type="math_constrain">
- <value name="LOW">
- <block type="math_number">
- <field name="NUM">1</field>
- </block>
- </value>
- <value name="HIGH">
- <block type="math_number">
- <field name="NUM">100</field>
- </block>
- </value>
- </block>
- <block type="math_random_int">
- <value name="FROM">
- <block type="math_number">
- <field name="NUM">1</field>
- </block>
- </value>
- <value name="TO">
- <block type="math_number">
- <field name="NUM">100</field>
- </block>
- </value>
- </block>
- <block type="math_random_float"></block>
- <block type="math_atan2"></block>
- </category>
- <category name="Lists" colour="%{BKY_LISTS_HUE}">
- <block type="lists_create_empty"></block>
- <block type="lists_create_with"></block>
- <block type="lists_repeat">
- <value name="NUM">
- <block type="math_number">
- <field name="NUM">5</field>
- </block>
- </value>
- </block>
- <block type="lists_length"></block>
- <block type="lists_isEmpty"></block>
- <block type="lists_indexOf"></block>
- <block type="lists_getIndex"></block>
- <block type="lists_setIndex"></block>
- </category>
- <sep></sep>
- <category name="Variables" custom="VARIABLE" colour="%{BKY_VARIABLES_HUE}">
- </category>
- <category name="Functions" custom="PROCEDURE" colour="%{BKY_PROCEDURES_HUE}">
- </category>
- <sep></sep>
- <category name="Library" expanded="true">
- <category name="Randomize">
- <block type="procedures_defnoreturn">
- <mutation>
- <arg name="list"></arg>
- </mutation>
- <field name="NAME">randomize</field>
- <statement name="STACK">
- <block type="controls_for" inline="true">
- <field name="VAR">x</field>
- <value name="FROM">
- <block type="math_number">
- <field name="NUM">1</field>
- </block>
- </value>
- <value name="TO">
- <block type="lists_length" inline="false">
- <value name="VALUE">
- <block type="variables_get">
- <field name="VAR">list</field>
- </block>
- </value>
- </block>
- </value>
- <value name="BY">
- <block type="math_number">
- <field name="NUM">1</field>
- </block>
- </value>
- <statement name="DO">
- <block type="variables_set" inline="false">
- <field name="VAR">y</field>
- <value name="VALUE">
- <block type="math_random_int" inline="true">
- <value name="FROM">
- <block type="math_number">
- <field name="NUM">1</field>
- </block>
- </value>
- <value name="TO">
- <block type="lists_length" inline="false">
- <value name="VALUE">
- <block type="variables_get">
- <field name="VAR">list</field>
- </block>
- </value>
- </block>
- </value>
- </block>
- </value>
- <next>
- <block type="variables_set" inline="false">
- <field name="VAR">temp</field>
- <value name="VALUE">
- <block type="lists_getIndex" inline="true">
- <mutation statement="false" at="true"></mutation>
- <field name="MODE">GET</field>
- <field name="WHERE">FROM_START</field>
- <value name="AT">
- <block type="variables_get">
- <field name="VAR">y</field>
- </block>
- </value>
- <value name="VALUE">
- <block type="variables_get">
- <field name="VAR">list</field>
- </block>
- </value>
- </block>
- </value>
- <next>
- <block type="lists_setIndex" inline="false">
- <value name="AT">
- <block type="variables_get">
- <field name="VAR">y</field>
- </block>
- </value>
- <value name="LIST">
- <block type="variables_get">
- <field name="VAR">list</field>
- </block>
- </value>
- <value name="TO">
- <block type="lists_getIndex" inline="true">
- <mutation statement="false" at="true"></mutation>
- <field name="MODE">GET</field>
- <field name="WHERE">FROM_START</field>
- <value name="AT">
- <block type="variables_get">
- <field name="VAR">x</field>
- </block>
- </value>
- <value name="VALUE">
- <block type="variables_get">
- <field name="VAR">list</field>
- </block>
- </value>
- </block>
- </value>
- <next>
- <block type="lists_setIndex" inline="false">
- <value name="AT">
- <block type="variables_get">
- <field name="VAR">x</field>
- </block>
- </value>
- <value name="LIST">
- <block type="variables_get">
- <field name="VAR">list</field>
- </block>
- </value>
- <value name="TO">
- <block type="variables_get">
- <field name="VAR">temp</field>
- </block>
- </value>
- </block>
- </next>
- </block>
- </next>
- </block>
- </next>
- </block>
- </statement>
- </block>
- </statement>
- </block>
- </category>
- <category name="Jabberwocky">
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT">'Twas brillig, and the slithy toves</field>
- </block>
- </value>
- <next>
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT"> Did gyre and gimble in the wabe:</field>
- </block>
- </value>
- <next>
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT">All mimsy were the borogroves,</field>
- </block>
- </value>
- <next>
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT"> And the mome raths outgrabe.</field>
- </block>
- </value>
- </block>
- </next>
- </block>
- </next>
- </block>
- </next>
- </block>
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT">"Beware the Jabberwock, my son!</field>
- </block>
- </value>
- <next>
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT"> The jaws that bite, the claws that catch!</field>
- </block>
- </value>
- <next>
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT">Beware the Jubjub bird, and shun</field>
- </block>
- </value>
- <next>
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT"> The frumious Bandersnatch!"</field>
- </block>
- </value>
- </block>
- </next>
- </block>
- </next>
- </block>
- </next>
- </block>
- </category>
- </category>
-</xml>
+<xml xmlns="https://developers.google.com/blockly/xml" id="toolbox" style="display: none">
+ <category name="Arduino" colour="#a5745b">
+ <block type="sendtoarduino"></block>
+ <block type="turn_led">
+ <field name="val">on</field>
+ </block>
+ <block type="arduino_wait">
+ <value name="time">
+ <block type="math_number">
+ <field name="NUM">1</field>
+ </block>
+ </value>
+ </block>
+ </category>
+ <category name="Texte" colour="#5b80a5">
+ <block type="text">
+ <field name="TEXT"></field>
+ </block>
+ </category>
+ <category name="Variables" colour="#a55b80" custom="VARIABLE"></category>
+ <category name="Boucles" colour="#5ba55b">
+ <block type="controls_repeat_ext">
+ <value name="TIMES">
+ <shadow type="math_number">
+ <field name="NUM">10</field>
+ </shadow>
+ </value>
+ </block>
+ </category>
+</xml>
\ No newline at end of file
diff --git a/activity_3/arduino_blocks_def.js b/activity_3/arduino_blocks_def.js
new file mode 100644
index 0000000000000000000000000000000000000000..07da611f6f60f41051c15192e36c23e0e5c4bb16
--- /dev/null
+++ b/activity_3/arduino_blocks_def.js
@@ -0,0 +1,41 @@
+Blockly.Blocks['sendtoarduino'] = {
+ init: function() {
+ this.appendValueInput("MESSAGE")
+ .setCheck("String")
+ .appendField("Envoyer à l'arduino :");
+ this.setPreviousStatement(true, null);
+ this.setNextStatement(true, null);
+ this.setColour(330);
+ this.setTooltip("envoi d'un string à l'Arduino de la maquette");
+ this.setHelpUrl("");
+ }
+};
+
+Blockly.Blocks['turn_led'] = {
+ init: function() {
+ this.appendDummyInput()
+ .appendField("Mettre la LED en l'état")
+ .appendField(new Blockly.FieldDropdown([["allumée","on"], ["éteinte","off"]]), "val");
+ this.setPreviousStatement(true, null);
+ this.setNextStatement(true, null);
+ this.setColour(345);
+ this.setTooltip("Change l'état d'une LED");
+ this.setHelpUrl("");
+ }
+};
+
+Blockly.Blocks['arduino_wait'] = {
+ init: function() {
+ this.appendValueInput("time")
+ .setCheck("Number")
+ .appendField("Attendre");
+ this.appendDummyInput()
+ .appendField("secondes");
+ this.setInputsInline(true);
+ this.setPreviousStatement(true, null);
+ this.setNextStatement(true, null);
+ this.setColour(330);
+ this.setTooltip("");
+ this.setHelpUrl("");
+ }
+};
diff --git a/activity_3/arduino_blocks_gen.js b/activity_3/arduino_blocks_gen.js
new file mode 100644
index 0000000000000000000000000000000000000000..45a5cd607237fea18c537c7aea5c90b65123a869
--- /dev/null
+++ b/activity_3/arduino_blocks_gen.js
@@ -0,0 +1,20 @@
+Blockly.JavaScript['sendtoarduino'] = function(block) {
+ var value_message = Blockly.JavaScript.valueToCode(block, 'MESSAGE', Blockly.JavaScript.ORDER_ATOMIC);
+ // TODO: Assemble JavaScript into code variable.
+ var code = 'sendString("'+ value_message + ';"); \n';
+ return code;
+};
+
+Blockly.JavaScript['turn_led'] = function(block) {
+ var dropdown_val = block.getFieldValue('val');
+ // TODO: Assemble JavaScript into code variable.
+ var code = 'sendString("LED_'+ dropdown_val + ';");\n';
+ return code;
+};
+
+Blockly.JavaScript['arduino_wait'] = function(block) {
+ var value_time = Blockly.JavaScript.valueToCode(block, 'time', Blockly.JavaScript.ORDER_ATOMIC);
+ let time_ms = Math.round(value_time*1000);
+ var code = 'sendString("DELAY_'+time_ms+';");\n waitForUnlockFromArduino();\n';
+ return code;
+};
diff --git a/activity_3/index.html b/activity_3/index.html
index 2939ebd3b7e2b9c7db58a23979dc6ffe20b98580..136a565837113cfe14a97c665ee2cd228a6a5733 100644
--- a/activity_3/index.html
+++ b/activity_3/index.html
@@ -4,14 +4,16 @@
<title>Road to the Moon !</title>
<meta charset="utf-8" />
<link rel="stylesheet" href="../res/style.css" />
-
<!-- Import des bibliothèques js nécessaires -->
+ <script src="../res/lib/jquery.js"></script>
+ <script src="../res/lib/serial.js"></script>
+
<script src="../res/lib/blockly/blockly_compressed.js"></script>
<script src="../res/lib/blockly/blocks_compressed.js"></script>
<script src="../res/lib/blockly/javascript_compressed.js"></script>
<script src="../res/lib/blockly/msg/js/fr.js"></script>
<script src="../res/lib/JS-Interpreter/acorn_interpreter.js"></script>
- <script src="../res/lib/jquery.js"></script>
+
<script>
$(function(){
$("#header").load("../res/header.html");
@@ -26,22 +28,23 @@
<section class="mainSection">
<!-- Création de la div portant blockly et d'un conteneur supérieur pour le responsive-->
- <div id="blocklyArea"><div id="blocklyDiv" ></div></div>
+ <div id="blocklyArea">
+ <div id="blocklyDiv" ></div>
+ </div>
+
<div id="toolsArea">
- <a onclick="runCode()" id="runButton">Lancer le programme !</a>
+ <div id="animationArea"></div>
+ <a class="button" id="connectButton">Connecter à la maquette</a>
+ <a onclick="runCode()" class="button" id="runButton">Lancer le programme !</a>
</div>
</section>
-
<footer id="footer"></footer>
-
-
</body>
- <!-- Définition du contenu et de l'organisation de la "toolbox" -->
-
-
<!-- Script d'intanciation lancé au chargement, doit toujours être à la fin-->
+ <script src="arduino_blocks_def.js"></script>
+ <script src="arduino_blocks_gen.js"></script>
<script src="main-script.js"></script>
</html>
diff --git a/activity_3/main-script.js b/activity_3/main-script.js
index 3b77535312d2a1caddfca44eff1ba42f40e04f70..c49b0ae1c04f3d940195bee3c2a2996017289bd8 100644
--- a/activity_3/main-script.js
+++ b/activity_3/main-script.js
@@ -1,6 +1,14 @@
var blocklyDiv = document.getElementById('blocklyDiv');
var blocklyArea = document.getElementById('blocklyArea');
+var connectButton = document.getElementById('connectButton');
+var receivedMsg = "";
+var prevRecievedMsg = "";
+
+var port;
+let textEncoder = new TextEncoder();
+
+//Chargement de la toolbox
var xml = null;
var request = new XMLHttpRequest();
request.open('GET', 'toolbox.xml', false);
@@ -9,11 +17,14 @@ if (request.readyState == 4 && request.status == 200) {
xml = request.responseXML;
}
var toolbox = new XMLSerializer().serializeToString(xml.documentElement);
+
+//Instancie l'espace de travail blockly
var workspace = Blockly.inject(blocklyDiv,
{toolbox: toolbox});
-//Ca a l'air dégueulasse pour faire du responsive mais c'est le truc de la doc
-//officielle de google xD
+/* Adapte la taille du conteneur de l'espace du travail à l'environnement
+Ca a l'air dégueulasse pour faire du responsive mais c'est le truc de la doc
+officielle de google xD*/
var onresize = function(e) {
// Compute the absolute coordinates and dimensions of blocklyArea.
var element = blocklyArea;
@@ -35,6 +46,69 @@ var onresize = function(e) {
onresize();
Blockly.svgResize(workspace);
+//Instanciation de la liaison série à la fin du chargement de la page
+document.addEventListener('DOMContentLoaded', event => {
+ function connect() {
+ console.log('Connecting to ' + port.device_.productName + '...');
+ port.connect().then(() => {
+ console.log(port);
+ console.log('Connected.');
+ connectButton.textContent = 'Se déconnecter';
+ port.onReceive = data => {
+ let textDecoder = new TextDecoder();
+ receivedMsg = textDecoder.decode(data);
+ //console.log("Reçu :" + receivedMsg);
+ }
+ port.onReceiveError = error => {
+ console.log('Receive error: ' + error);
+ };
+ }, error => {
+ console.log('Connection error: ' + error);
+ });
+ };
+
+ connectButton.addEventListener('click', function() {
+ if (port) {
+ port.disconnect();
+ connectButton.textContent = 'Connecter à la maquette';
+ port = null;
+ } else {
+ serial.requestPort().then(selectedPort => {
+ port = selectedPort;
+ connect();
+ }).catch(error => {
+ console.log('Connection error: ' + error);
+ });
+ }
+ });
+
+ serial.getPorts().then(ports => {
+ if (ports.length == 0) {
+ console.log('No devices found.');
+ } else {
+ port = ports[0];
+ connect();
+ }
+ });
+});
+
+
+//Envoie ce string à l'Arduino
+function sendString(str) {
+ if (port !== undefined) {
+ port.send(textEncoder.encode(str)).catch(error => {
+ console.console.log('Send error: ' + error);
+ });
+ }
+}
+
+//Attend jusqu'à ce que le message "UNLOCK;" soit reçu de l'arduino
+function waitForUnlockFromArduino() {
+ if (receivedMsg != "UNLOCK;") {
+ setTimeout(waitForUnlockFromArduino, 10);
+ return;
+ }
+}
//Lance le code tel que rentré par le joueur
function runCode() {
@@ -44,6 +118,7 @@ function runCode() {
//Il est possible de lancer le code de façon séquencielle
}
+
//Interprétation des commandes par l'utiliseur (redéfinition des fonctions avec IO)
function initApi(interpreter, scope) {
// Add an API function for the alert() block.
@@ -53,10 +128,17 @@ function initApi(interpreter, scope) {
interpreter.setProperty(scope, 'alert',
interpreter.createNativeFunction(wrapper));
- // Add an API function for the prompt() block.
+ // Add an API function for the sendString() block.
wrapper = function(text) {
- return prompt(text);
+ return sendString(arguments.length ? text : '');
+ };
+ interpreter.setProperty(scope, 'sendString',
+ interpreter.createNativeFunction(wrapper));
+
+ // Add an API function for the waitForUnlockFromArduino() block.
+ wrapper = function() {
+ return waitForUnlockFromArduino();
};
- interpreter.setProperty(scope, 'prompt',
+ interpreter.setProperty(scope, 'waitForUnlockFromArduino',
interpreter.createNativeFunction(wrapper));
}
diff --git a/activity_3/toolbox.xml b/activity_3/toolbox.xml
index ef3fb0b8383dd0eedff31371e320020119200e5f..8eca1b88a7cc67205cc32d1cae25ee5cd31a8a65 100644
--- a/activity_3/toolbox.xml
+++ b/activity_3/toolbox.xml
@@ -1,311 +1,30 @@
-<xml xmlns="https://developers.google.com/blockly/xml">
- <category name="Logic" colour="%{BKY_LOGIC_HUE}">
- <category name="If">
- <block type="controls_if"></block>
- <block type="controls_if">
- <mutation else="1"></mutation>
- </block>
- <block type="controls_if">
- <mutation elseif="1" else="1"></mutation>
- </block>
- </category>
- <category name="Boolean" colour="%{BKY_LOGIC_HUE}">
- <block type="logic_compare"></block>
- <block type="logic_operation"></block>
- <block type="logic_negate"></block>
- <block type="logic_boolean"></block>
- <block type="logic_null"></block>
- <block type="logic_ternary"></block>
- </category>
- </category>
- <category name="Loops" colour="%{BKY_LOOPS_HUE}">
- <block type="controls_repeat_ext">
- <value name="TIMES">
- <block type="math_number">
- <field name="NUM">10</field>
- </block>
- </value>
- </block>
- <block type="controls_whileUntil"></block>
- <block type="controls_for">
- <field name="VAR">i</field>
- <value name="FROM">
- <block type="math_number">
- <field name="NUM">1</field>
- </block>
- </value>
- <value name="TO">
- <block type="math_number">
- <field name="NUM">10</field>
- </block>
- </value>
- <value name="BY">
- <block type="math_number">
- <field name="NUM">1</field>
- </block>
- </value>
- </block>
- <block type="controls_forEach"></block>
- <block type="controls_flow_statements"></block>
- </category>
- <category name="Math" colour="%{BKY_MATH_HUE}">
- <block type="math_number">
- <field name="NUM">123</field>
- </block>
- <block type="math_arithmetic"></block>
- <block type="math_single"></block>
- <block type="math_trig"></block>
- <block type="math_constant"></block>
- <block type="math_number_property"></block>
- <block type="math_round"></block>
- <block type="math_on_list"></block>
- <block type="math_modulo"></block>
- <block type="math_constrain">
- <value name="LOW">
- <block type="math_number">
- <field name="NUM">1</field>
- </block>
- </value>
- <value name="HIGH">
- <block type="math_number">
- <field name="NUM">100</field>
- </block>
- </value>
- </block>
- <block type="math_random_int">
- <value name="FROM">
- <block type="math_number">
- <field name="NUM">1</field>
- </block>
- </value>
- <value name="TO">
- <block type="math_number">
- <field name="NUM">100</field>
- </block>
- </value>
- </block>
- <block type="math_random_float"></block>
- <block type="math_atan2"></block>
- </category>
- <category name="Lists" colour="%{BKY_LISTS_HUE}">
- <block type="lists_create_empty"></block>
- <block type="lists_create_with"></block>
- <block type="lists_repeat">
- <value name="NUM">
- <block type="math_number">
- <field name="NUM">5</field>
- </block>
- </value>
- </block>
- <block type="lists_length"></block>
- <block type="lists_isEmpty"></block>
- <block type="lists_indexOf"></block>
- <block type="lists_getIndex"></block>
- <block type="lists_setIndex"></block>
- </category>
- <sep></sep>
- <category name="Variables" custom="VARIABLE" colour="%{BKY_VARIABLES_HUE}">
- </category>
- <category name="Functions" custom="PROCEDURE" colour="%{BKY_PROCEDURES_HUE}">
- </category>
- <sep></sep>
- <category name="Library" expanded="true">
- <category name="Randomize">
- <block type="procedures_defnoreturn">
- <mutation>
- <arg name="list"></arg>
- </mutation>
- <field name="NAME">randomize</field>
- <statement name="STACK">
- <block type="controls_for" inline="true">
- <field name="VAR">x</field>
- <value name="FROM">
- <block type="math_number">
- <field name="NUM">1</field>
- </block>
- </value>
- <value name="TO">
- <block type="lists_length" inline="false">
- <value name="VALUE">
- <block type="variables_get">
- <field name="VAR">list</field>
- </block>
- </value>
- </block>
- </value>
- <value name="BY">
- <block type="math_number">
- <field name="NUM">1</field>
- </block>
- </value>
- <statement name="DO">
- <block type="variables_set" inline="false">
- <field name="VAR">y</field>
- <value name="VALUE">
- <block type="math_random_int" inline="true">
- <value name="FROM">
- <block type="math_number">
- <field name="NUM">1</field>
- </block>
- </value>
- <value name="TO">
- <block type="lists_length" inline="false">
- <value name="VALUE">
- <block type="variables_get">
- <field name="VAR">list</field>
- </block>
- </value>
- </block>
- </value>
- </block>
- </value>
- <next>
- <block type="variables_set" inline="false">
- <field name="VAR">temp</field>
- <value name="VALUE">
- <block type="lists_getIndex" inline="true">
- <mutation statement="false" at="true"></mutation>
- <field name="MODE">GET</field>
- <field name="WHERE">FROM_START</field>
- <value name="AT">
- <block type="variables_get">
- <field name="VAR">y</field>
- </block>
- </value>
- <value name="VALUE">
- <block type="variables_get">
- <field name="VAR">list</field>
- </block>
- </value>
- </block>
- </value>
- <next>
- <block type="lists_setIndex" inline="false">
- <value name="AT">
- <block type="variables_get">
- <field name="VAR">y</field>
- </block>
- </value>
- <value name="LIST">
- <block type="variables_get">
- <field name="VAR">list</field>
- </block>
- </value>
- <value name="TO">
- <block type="lists_getIndex" inline="true">
- <mutation statement="false" at="true"></mutation>
- <field name="MODE">GET</field>
- <field name="WHERE">FROM_START</field>
- <value name="AT">
- <block type="variables_get">
- <field name="VAR">x</field>
- </block>
- </value>
- <value name="VALUE">
- <block type="variables_get">
- <field name="VAR">list</field>
- </block>
- </value>
- </block>
- </value>
- <next>
- <block type="lists_setIndex" inline="false">
- <value name="AT">
- <block type="variables_get">
- <field name="VAR">x</field>
- </block>
- </value>
- <value name="LIST">
- <block type="variables_get">
- <field name="VAR">list</field>
- </block>
- </value>
- <value name="TO">
- <block type="variables_get">
- <field name="VAR">temp</field>
- </block>
- </value>
- </block>
- </next>
- </block>
- </next>
- </block>
- </next>
- </block>
- </statement>
- </block>
- </statement>
- </block>
- </category>
- <category name="Jabberwocky">
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT">'Twas brillig, and the slithy toves</field>
- </block>
- </value>
- <next>
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT"> Did gyre and gimble in the wabe:</field>
- </block>
- </value>
- <next>
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT">All mimsy were the borogroves,</field>
- </block>
- </value>
- <next>
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT"> And the mome raths outgrabe.</field>
- </block>
- </value>
- </block>
- </next>
- </block>
- </next>
- </block>
- </next>
- </block>
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT">"Beware the Jabberwock, my son!</field>
- </block>
- </value>
- <next>
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT"> The jaws that bite, the claws that catch!</field>
- </block>
- </value>
- <next>
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT">Beware the Jubjub bird, and shun</field>
- </block>
- </value>
- <next>
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT"> The frumious Bandersnatch!"</field>
- </block>
- </value>
- </block>
- </next>
- </block>
- </next>
- </block>
- </next>
- </block>
- </category>
- </category>
-</xml>
+<xml xmlns="https://developers.google.com/blockly/xml" id="toolbox" style="display: none">
+ <category name="Arduino" colour="#a5745b">
+ <block type="sendtoarduino"></block>
+ <block type="turn_led">
+ <field name="val">on</field>
+ </block>
+ <block type="arduino_wait">
+ <value name="time">
+ <block type="math_number">
+ <field name="NUM">1</field>
+ </block>
+ </value>
+ </block>
+ </category>
+ <category name="Texte" colour="#5b80a5">
+ <block type="text">
+ <field name="TEXT"></field>
+ </block>
+ </category>
+ <category name="Variables" colour="#a55b80" custom="VARIABLE"></category>
+ <category name="Boucles" colour="#5ba55b">
+ <block type="controls_repeat_ext">
+ <value name="TIMES">
+ <shadow type="math_number">
+ <field name="NUM">10</field>
+ </shadow>
+ </value>
+ </block>
+ </category>
+</xml>
\ No newline at end of file
diff --git a/activity_4/arduino_blocks_def.js b/activity_4/arduino_blocks_def.js
new file mode 100644
index 0000000000000000000000000000000000000000..07da611f6f60f41051c15192e36c23e0e5c4bb16
--- /dev/null
+++ b/activity_4/arduino_blocks_def.js
@@ -0,0 +1,41 @@
+Blockly.Blocks['sendtoarduino'] = {
+ init: function() {
+ this.appendValueInput("MESSAGE")
+ .setCheck("String")
+ .appendField("Envoyer à l'arduino :");
+ this.setPreviousStatement(true, null);
+ this.setNextStatement(true, null);
+ this.setColour(330);
+ this.setTooltip("envoi d'un string à l'Arduino de la maquette");
+ this.setHelpUrl("");
+ }
+};
+
+Blockly.Blocks['turn_led'] = {
+ init: function() {
+ this.appendDummyInput()
+ .appendField("Mettre la LED en l'état")
+ .appendField(new Blockly.FieldDropdown([["allumée","on"], ["éteinte","off"]]), "val");
+ this.setPreviousStatement(true, null);
+ this.setNextStatement(true, null);
+ this.setColour(345);
+ this.setTooltip("Change l'état d'une LED");
+ this.setHelpUrl("");
+ }
+};
+
+Blockly.Blocks['arduino_wait'] = {
+ init: function() {
+ this.appendValueInput("time")
+ .setCheck("Number")
+ .appendField("Attendre");
+ this.appendDummyInput()
+ .appendField("secondes");
+ this.setInputsInline(true);
+ this.setPreviousStatement(true, null);
+ this.setNextStatement(true, null);
+ this.setColour(330);
+ this.setTooltip("");
+ this.setHelpUrl("");
+ }
+};
diff --git a/activity_4/arduino_blocks_gen.js b/activity_4/arduino_blocks_gen.js
new file mode 100644
index 0000000000000000000000000000000000000000..45a5cd607237fea18c537c7aea5c90b65123a869
--- /dev/null
+++ b/activity_4/arduino_blocks_gen.js
@@ -0,0 +1,20 @@
+Blockly.JavaScript['sendtoarduino'] = function(block) {
+ var value_message = Blockly.JavaScript.valueToCode(block, 'MESSAGE', Blockly.JavaScript.ORDER_ATOMIC);
+ // TODO: Assemble JavaScript into code variable.
+ var code = 'sendString("'+ value_message + ';"); \n';
+ return code;
+};
+
+Blockly.JavaScript['turn_led'] = function(block) {
+ var dropdown_val = block.getFieldValue('val');
+ // TODO: Assemble JavaScript into code variable.
+ var code = 'sendString("LED_'+ dropdown_val + ';");\n';
+ return code;
+};
+
+Blockly.JavaScript['arduino_wait'] = function(block) {
+ var value_time = Blockly.JavaScript.valueToCode(block, 'time', Blockly.JavaScript.ORDER_ATOMIC);
+ let time_ms = Math.round(value_time*1000);
+ var code = 'sendString("DELAY_'+time_ms+';");\n waitForUnlockFromArduino();\n';
+ return code;
+};
diff --git a/activity_4/index.html b/activity_4/index.html
index 2939ebd3b7e2b9c7db58a23979dc6ffe20b98580..136a565837113cfe14a97c665ee2cd228a6a5733 100644
--- a/activity_4/index.html
+++ b/activity_4/index.html
@@ -4,14 +4,16 @@
<title>Road to the Moon !</title>
<meta charset="utf-8" />
<link rel="stylesheet" href="../res/style.css" />
-
<!-- Import des bibliothèques js nécessaires -->
+ <script src="../res/lib/jquery.js"></script>
+ <script src="../res/lib/serial.js"></script>
+
<script src="../res/lib/blockly/blockly_compressed.js"></script>
<script src="../res/lib/blockly/blocks_compressed.js"></script>
<script src="../res/lib/blockly/javascript_compressed.js"></script>
<script src="../res/lib/blockly/msg/js/fr.js"></script>
<script src="../res/lib/JS-Interpreter/acorn_interpreter.js"></script>
- <script src="../res/lib/jquery.js"></script>
+
<script>
$(function(){
$("#header").load("../res/header.html");
@@ -26,22 +28,23 @@
<section class="mainSection">
<!-- Création de la div portant blockly et d'un conteneur supérieur pour le responsive-->
- <div id="blocklyArea"><div id="blocklyDiv" ></div></div>
+ <div id="blocklyArea">
+ <div id="blocklyDiv" ></div>
+ </div>
+
<div id="toolsArea">
- <a onclick="runCode()" id="runButton">Lancer le programme !</a>
+ <div id="animationArea"></div>
+ <a class="button" id="connectButton">Connecter à la maquette</a>
+ <a onclick="runCode()" class="button" id="runButton">Lancer le programme !</a>
</div>
</section>
-
<footer id="footer"></footer>
-
-
</body>
- <!-- Définition du contenu et de l'organisation de la "toolbox" -->
-
-
<!-- Script d'intanciation lancé au chargement, doit toujours être à la fin-->
+ <script src="arduino_blocks_def.js"></script>
+ <script src="arduino_blocks_gen.js"></script>
<script src="main-script.js"></script>
</html>
diff --git a/activity_4/main-script.js b/activity_4/main-script.js
index 3b77535312d2a1caddfca44eff1ba42f40e04f70..c49b0ae1c04f3d940195bee3c2a2996017289bd8 100644
--- a/activity_4/main-script.js
+++ b/activity_4/main-script.js
@@ -1,6 +1,14 @@
var blocklyDiv = document.getElementById('blocklyDiv');
var blocklyArea = document.getElementById('blocklyArea');
+var connectButton = document.getElementById('connectButton');
+var receivedMsg = "";
+var prevRecievedMsg = "";
+
+var port;
+let textEncoder = new TextEncoder();
+
+//Chargement de la toolbox
var xml = null;
var request = new XMLHttpRequest();
request.open('GET', 'toolbox.xml', false);
@@ -9,11 +17,14 @@ if (request.readyState == 4 && request.status == 200) {
xml = request.responseXML;
}
var toolbox = new XMLSerializer().serializeToString(xml.documentElement);
+
+//Instancie l'espace de travail blockly
var workspace = Blockly.inject(blocklyDiv,
{toolbox: toolbox});
-//Ca a l'air dégueulasse pour faire du responsive mais c'est le truc de la doc
-//officielle de google xD
+/* Adapte la taille du conteneur de l'espace du travail à l'environnement
+Ca a l'air dégueulasse pour faire du responsive mais c'est le truc de la doc
+officielle de google xD*/
var onresize = function(e) {
// Compute the absolute coordinates and dimensions of blocklyArea.
var element = blocklyArea;
@@ -35,6 +46,69 @@ var onresize = function(e) {
onresize();
Blockly.svgResize(workspace);
+//Instanciation de la liaison série à la fin du chargement de la page
+document.addEventListener('DOMContentLoaded', event => {
+ function connect() {
+ console.log('Connecting to ' + port.device_.productName + '...');
+ port.connect().then(() => {
+ console.log(port);
+ console.log('Connected.');
+ connectButton.textContent = 'Se déconnecter';
+ port.onReceive = data => {
+ let textDecoder = new TextDecoder();
+ receivedMsg = textDecoder.decode(data);
+ //console.log("Reçu :" + receivedMsg);
+ }
+ port.onReceiveError = error => {
+ console.log('Receive error: ' + error);
+ };
+ }, error => {
+ console.log('Connection error: ' + error);
+ });
+ };
+
+ connectButton.addEventListener('click', function() {
+ if (port) {
+ port.disconnect();
+ connectButton.textContent = 'Connecter à la maquette';
+ port = null;
+ } else {
+ serial.requestPort().then(selectedPort => {
+ port = selectedPort;
+ connect();
+ }).catch(error => {
+ console.log('Connection error: ' + error);
+ });
+ }
+ });
+
+ serial.getPorts().then(ports => {
+ if (ports.length == 0) {
+ console.log('No devices found.');
+ } else {
+ port = ports[0];
+ connect();
+ }
+ });
+});
+
+
+//Envoie ce string à l'Arduino
+function sendString(str) {
+ if (port !== undefined) {
+ port.send(textEncoder.encode(str)).catch(error => {
+ console.console.log('Send error: ' + error);
+ });
+ }
+}
+
+//Attend jusqu'à ce que le message "UNLOCK;" soit reçu de l'arduino
+function waitForUnlockFromArduino() {
+ if (receivedMsg != "UNLOCK;") {
+ setTimeout(waitForUnlockFromArduino, 10);
+ return;
+ }
+}
//Lance le code tel que rentré par le joueur
function runCode() {
@@ -44,6 +118,7 @@ function runCode() {
//Il est possible de lancer le code de façon séquencielle
}
+
//Interprétation des commandes par l'utiliseur (redéfinition des fonctions avec IO)
function initApi(interpreter, scope) {
// Add an API function for the alert() block.
@@ -53,10 +128,17 @@ function initApi(interpreter, scope) {
interpreter.setProperty(scope, 'alert',
interpreter.createNativeFunction(wrapper));
- // Add an API function for the prompt() block.
+ // Add an API function for the sendString() block.
wrapper = function(text) {
- return prompt(text);
+ return sendString(arguments.length ? text : '');
+ };
+ interpreter.setProperty(scope, 'sendString',
+ interpreter.createNativeFunction(wrapper));
+
+ // Add an API function for the waitForUnlockFromArduino() block.
+ wrapper = function() {
+ return waitForUnlockFromArduino();
};
- interpreter.setProperty(scope, 'prompt',
+ interpreter.setProperty(scope, 'waitForUnlockFromArduino',
interpreter.createNativeFunction(wrapper));
}
diff --git a/activity_4/toolbox.xml b/activity_4/toolbox.xml
index ef3fb0b8383dd0eedff31371e320020119200e5f..8eca1b88a7cc67205cc32d1cae25ee5cd31a8a65 100644
--- a/activity_4/toolbox.xml
+++ b/activity_4/toolbox.xml
@@ -1,311 +1,30 @@
-<xml xmlns="https://developers.google.com/blockly/xml">
- <category name="Logic" colour="%{BKY_LOGIC_HUE}">
- <category name="If">
- <block type="controls_if"></block>
- <block type="controls_if">
- <mutation else="1"></mutation>
- </block>
- <block type="controls_if">
- <mutation elseif="1" else="1"></mutation>
- </block>
- </category>
- <category name="Boolean" colour="%{BKY_LOGIC_HUE}">
- <block type="logic_compare"></block>
- <block type="logic_operation"></block>
- <block type="logic_negate"></block>
- <block type="logic_boolean"></block>
- <block type="logic_null"></block>
- <block type="logic_ternary"></block>
- </category>
- </category>
- <category name="Loops" colour="%{BKY_LOOPS_HUE}">
- <block type="controls_repeat_ext">
- <value name="TIMES">
- <block type="math_number">
- <field name="NUM">10</field>
- </block>
- </value>
- </block>
- <block type="controls_whileUntil"></block>
- <block type="controls_for">
- <field name="VAR">i</field>
- <value name="FROM">
- <block type="math_number">
- <field name="NUM">1</field>
- </block>
- </value>
- <value name="TO">
- <block type="math_number">
- <field name="NUM">10</field>
- </block>
- </value>
- <value name="BY">
- <block type="math_number">
- <field name="NUM">1</field>
- </block>
- </value>
- </block>
- <block type="controls_forEach"></block>
- <block type="controls_flow_statements"></block>
- </category>
- <category name="Math" colour="%{BKY_MATH_HUE}">
- <block type="math_number">
- <field name="NUM">123</field>
- </block>
- <block type="math_arithmetic"></block>
- <block type="math_single"></block>
- <block type="math_trig"></block>
- <block type="math_constant"></block>
- <block type="math_number_property"></block>
- <block type="math_round"></block>
- <block type="math_on_list"></block>
- <block type="math_modulo"></block>
- <block type="math_constrain">
- <value name="LOW">
- <block type="math_number">
- <field name="NUM">1</field>
- </block>
- </value>
- <value name="HIGH">
- <block type="math_number">
- <field name="NUM">100</field>
- </block>
- </value>
- </block>
- <block type="math_random_int">
- <value name="FROM">
- <block type="math_number">
- <field name="NUM">1</field>
- </block>
- </value>
- <value name="TO">
- <block type="math_number">
- <field name="NUM">100</field>
- </block>
- </value>
- </block>
- <block type="math_random_float"></block>
- <block type="math_atan2"></block>
- </category>
- <category name="Lists" colour="%{BKY_LISTS_HUE}">
- <block type="lists_create_empty"></block>
- <block type="lists_create_with"></block>
- <block type="lists_repeat">
- <value name="NUM">
- <block type="math_number">
- <field name="NUM">5</field>
- </block>
- </value>
- </block>
- <block type="lists_length"></block>
- <block type="lists_isEmpty"></block>
- <block type="lists_indexOf"></block>
- <block type="lists_getIndex"></block>
- <block type="lists_setIndex"></block>
- </category>
- <sep></sep>
- <category name="Variables" custom="VARIABLE" colour="%{BKY_VARIABLES_HUE}">
- </category>
- <category name="Functions" custom="PROCEDURE" colour="%{BKY_PROCEDURES_HUE}">
- </category>
- <sep></sep>
- <category name="Library" expanded="true">
- <category name="Randomize">
- <block type="procedures_defnoreturn">
- <mutation>
- <arg name="list"></arg>
- </mutation>
- <field name="NAME">randomize</field>
- <statement name="STACK">
- <block type="controls_for" inline="true">
- <field name="VAR">x</field>
- <value name="FROM">
- <block type="math_number">
- <field name="NUM">1</field>
- </block>
- </value>
- <value name="TO">
- <block type="lists_length" inline="false">
- <value name="VALUE">
- <block type="variables_get">
- <field name="VAR">list</field>
- </block>
- </value>
- </block>
- </value>
- <value name="BY">
- <block type="math_number">
- <field name="NUM">1</field>
- </block>
- </value>
- <statement name="DO">
- <block type="variables_set" inline="false">
- <field name="VAR">y</field>
- <value name="VALUE">
- <block type="math_random_int" inline="true">
- <value name="FROM">
- <block type="math_number">
- <field name="NUM">1</field>
- </block>
- </value>
- <value name="TO">
- <block type="lists_length" inline="false">
- <value name="VALUE">
- <block type="variables_get">
- <field name="VAR">list</field>
- </block>
- </value>
- </block>
- </value>
- </block>
- </value>
- <next>
- <block type="variables_set" inline="false">
- <field name="VAR">temp</field>
- <value name="VALUE">
- <block type="lists_getIndex" inline="true">
- <mutation statement="false" at="true"></mutation>
- <field name="MODE">GET</field>
- <field name="WHERE">FROM_START</field>
- <value name="AT">
- <block type="variables_get">
- <field name="VAR">y</field>
- </block>
- </value>
- <value name="VALUE">
- <block type="variables_get">
- <field name="VAR">list</field>
- </block>
- </value>
- </block>
- </value>
- <next>
- <block type="lists_setIndex" inline="false">
- <value name="AT">
- <block type="variables_get">
- <field name="VAR">y</field>
- </block>
- </value>
- <value name="LIST">
- <block type="variables_get">
- <field name="VAR">list</field>
- </block>
- </value>
- <value name="TO">
- <block type="lists_getIndex" inline="true">
- <mutation statement="false" at="true"></mutation>
- <field name="MODE">GET</field>
- <field name="WHERE">FROM_START</field>
- <value name="AT">
- <block type="variables_get">
- <field name="VAR">x</field>
- </block>
- </value>
- <value name="VALUE">
- <block type="variables_get">
- <field name="VAR">list</field>
- </block>
- </value>
- </block>
- </value>
- <next>
- <block type="lists_setIndex" inline="false">
- <value name="AT">
- <block type="variables_get">
- <field name="VAR">x</field>
- </block>
- </value>
- <value name="LIST">
- <block type="variables_get">
- <field name="VAR">list</field>
- </block>
- </value>
- <value name="TO">
- <block type="variables_get">
- <field name="VAR">temp</field>
- </block>
- </value>
- </block>
- </next>
- </block>
- </next>
- </block>
- </next>
- </block>
- </statement>
- </block>
- </statement>
- </block>
- </category>
- <category name="Jabberwocky">
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT">'Twas brillig, and the slithy toves</field>
- </block>
- </value>
- <next>
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT"> Did gyre and gimble in the wabe:</field>
- </block>
- </value>
- <next>
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT">All mimsy were the borogroves,</field>
- </block>
- </value>
- <next>
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT"> And the mome raths outgrabe.</field>
- </block>
- </value>
- </block>
- </next>
- </block>
- </next>
- </block>
- </next>
- </block>
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT">"Beware the Jabberwock, my son!</field>
- </block>
- </value>
- <next>
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT"> The jaws that bite, the claws that catch!</field>
- </block>
- </value>
- <next>
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT">Beware the Jubjub bird, and shun</field>
- </block>
- </value>
- <next>
- <block type="text_print">
- <value name="TEXT">
- <block type="text">
- <field name="TEXT"> The frumious Bandersnatch!"</field>
- </block>
- </value>
- </block>
- </next>
- </block>
- </next>
- </block>
- </next>
- </block>
- </category>
- </category>
-</xml>
+<xml xmlns="https://developers.google.com/blockly/xml" id="toolbox" style="display: none">
+ <category name="Arduino" colour="#a5745b">
+ <block type="sendtoarduino"></block>
+ <block type="turn_led">
+ <field name="val">on</field>
+ </block>
+ <block type="arduino_wait">
+ <value name="time">
+ <block type="math_number">
+ <field name="NUM">1</field>
+ </block>
+ </value>
+ </block>
+ </category>
+ <category name="Texte" colour="#5b80a5">
+ <block type="text">
+ <field name="TEXT"></field>
+ </block>
+ </category>
+ <category name="Variables" colour="#a55b80" custom="VARIABLE"></category>
+ <category name="Boucles" colour="#5ba55b">
+ <block type="controls_repeat_ext">
+ <value name="TIMES">
+ <shadow type="math_number">
+ <field name="NUM">10</field>
+ </shadow>
+ </value>
+ </block>
+ </category>
+</xml>
\ No newline at end of file
diff --git a/index.html b/index.html
index d9cb77635aa7c02bbfb859dfe60a3b3ee4543211..07c03267852fe56b38c0a956e665b36f625a59b1 100644
--- a/index.html
+++ b/index.html
@@ -21,17 +21,15 @@
<section class="mainSection">
<ul class="activitySelector">
<li class="activitySelector">
- <a href="activity_1/index.html">
+ <a href="activity_1">
<h2>Activité 1</h2>
<img src="res/img/activities_icons/1.png">
- <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus tempor eros lorem,
- sit amet porttitor lacus porta id. Fusce eu faucibus enim, sed dapibus mi.
- Nunc sed lectus sit amet orci egestas placerat. Suspendisse quam velit posuere.
+ <p>J'ai perdu au jeu.
</p>
</a>
</li>
<li class="activitySelector">
- <a href="activity_2/index.html">
+ <a href="activity_2/">
<h2>Activité 2</h2>
<img src="res/img/activities_icons/2.png">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus tempor eros lorem,
@@ -41,7 +39,7 @@
</a>
</li>
<li class="activitySelector">
- <a href="activity_3/index.html">
+ <a href="activity_3/">
<h2>Activité 3</h2>
<img src="res/img/activities_icons/3.png">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus tempor eros lorem,
@@ -51,7 +49,7 @@
</a>
</li>
<li class="activitySelector">
- <a href="activity_4/index.html">
+ <a href="activity_4/">
<h2>Activité 4</h2>
<img src="res/img/activities_icons/4.png">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus tempor eros lorem,
diff --git a/res/lib/serial.js b/res/lib/serial.js
new file mode 100644
index 0000000000000000000000000000000000000000..3dbbc8bcda5a4e2123983b7994f8582388723870
--- /dev/null
+++ b/res/lib/serial.js
@@ -0,0 +1,100 @@
+var serial = {};
+
+(function() {
+ 'use strict';
+
+ serial.getPorts = function() {
+ return navigator.usb.getDevices().then(devices => {
+ return devices.map(device => new serial.Port(device));
+ });
+ };
+
+ serial.requestPort = function() {
+ const filters = [
+ { 'vendorId': 0x2341, 'productId': 0x8036 }, // Arduino Leonardo
+ { 'vendorId': 0x2341, 'productId': 0x8037 }, // Arduino Micro
+ { 'vendorId': 0x2341, 'productId': 0x804d }, // Arduino/Genuino Zero
+ { 'vendorId': 0x2341, 'productId': 0x804e }, // Arduino/Genuino MKR1000
+ { 'vendorId': 0x2341, 'productId': 0x804f }, // Arduino MKRZERO
+ { 'vendorId': 0x2341, 'productId': 0x8050 }, // Arduino MKR FOX 1200
+ { 'vendorId': 0x2341, 'productId': 0x8052 }, // Arduino MKR GSM 1400
+ { 'vendorId': 0x2341, 'productId': 0x8053 }, // Arduino MKR WAN 1300
+ { 'vendorId': 0x2341, 'productId': 0x8054 }, // Arduino MKR WiFi 1010
+ { 'vendorId': 0x2341, 'productId': 0x8055 }, // Arduino MKR NB 1500
+ { 'vendorId': 0x2341, 'productId': 0x8056 }, // Arduino MKR Vidor 4000
+ { 'vendorId': 0x2341, 'productId': 0x8057 }, // Arduino NANO 33 IoT
+ { 'vendorId': 0x239A }, // Adafruit Boards!
+ ];
+ return navigator.usb.requestDevice({ 'filters': filters }).then(
+ device => new serial.Port(device)
+ );
+ }
+
+ serial.Port = function(device) {
+ this.device_ = device;
+ this.interfaceNumber_ = 2; // original interface number of WebUSB Arduino demo
+ this.endpointIn_ = 5; // original in endpoint ID of WebUSB Arduino demo
+ this.endpointOut_ = 4; // original out endpoint ID of WebUSB Arduino demo
+ };
+
+ serial.Port.prototype.connect = function() {
+ let readLoop = () => {
+ this.device_.transferIn(this.endpointIn_, 64).then(result => {
+ this.onReceive(result.data);
+ readLoop();
+ }, error => {
+ this.onReceiveError(error);
+ });
+ };
+
+ return this.device_.open()
+ .then(() => {
+ if (this.device_.configuration === null) {
+ return this.device_.selectConfiguration(1);
+ }
+ })
+ .then(() => {
+ var configurationInterfaces = this.device_.configuration.interfaces;
+ configurationInterfaces.forEach(element => {
+ element.alternates.forEach(elementalt => {
+ if (elementalt.interfaceClass==0xff) {
+ this.interfaceNumber_ = element.interfaceNumber;
+ elementalt.endpoints.forEach(elementendpoint => {
+ if (elementendpoint.direction == "out") {
+ this.endpointOut_ = elementendpoint.endpointNumber;
+ }
+ if (elementendpoint.direction=="in") {
+ this.endpointIn_ =elementendpoint.endpointNumber;
+ }
+ })
+ }
+ })
+ })
+ })
+ .then(() => this.device_.claimInterface(this.interfaceNumber_))
+ .then(() => this.device_.selectAlternateInterface(this.interfaceNumber_, 0))
+ .then(() => this.device_.controlTransferOut({
+ 'requestType': 'class',
+ 'recipient': 'interface',
+ 'request': 0x22,
+ 'value': 0x01,
+ 'index': this.interfaceNumber_}))
+ .then(() => {
+ readLoop();
+ });
+ };
+
+ serial.Port.prototype.disconnect = function() {
+ return this.device_.controlTransferOut({
+ 'requestType': 'class',
+ 'recipient': 'interface',
+ 'request': 0x22,
+ 'value': 0x00,
+ 'index': this.interfaceNumber_})
+ .then(() => this.device_.close());
+ };
+
+ serial.Port.prototype.send = function(data) {
+ return this.device_.transferOut(this.endpointOut_, data);
+ };
+})();
diff --git a/res/style.css b/res/style.css
index 8162f6fd168022edf5adcebc3cb3c81bcfb74cb3..da689c2fe5ee72b777c7984c9b44a8e86579b844 100644
--- a/res/style.css
+++ b/res/style.css
@@ -136,20 +136,24 @@ transition: color 1s;
/*PARAM SPECIFIQUES AUX PAGES D'ACTIVITES*/
+.button {
+border-radius:20px;
+display:block;
+cursor:pointer;
+font-family:Arial;
+font-size:25px;
+font-weight:bold;
+padding:30px;
+margin: 0% 2%;
+text-decoration:none;
+}
+
#runButton {
+ order: 3;
background:linear-gradient(to bottom, #77b55a 5%, #72b352 100%);
background-color:#77b55a;
- border-radius:20px;
border:3px solid #4b8f29;
- display:block;
- cursor:pointer;
color:#ffffff;
- font-family:Arial;
- font-size:25px;
- font-weight:bold;
- padding:30px;
- margin: 0% 2%;
- text-decoration:none;
text-shadow:0px 1px 0px #5b8a3c;
}
@@ -162,16 +166,45 @@ transition: color 1s;
top:3px;
}
+#connectButton {
+ order: 1;
+ background:linear-gradient(to bottom, #77b55a 5%, #72b352 100%);
+ background-color:#77b55a;
+ border:3px solid #4b8f29;
+ color:#ffffff;
+ text-shadow:0px 1px 0px #5b8a3c;
+
+}
+
+#connectButton:hover {
+ background:linear-gradient(to bottom, #72b352 5%, #77b55a 100%);
+ background-color:#72b352;
+}
+#connectButton:active {
+ position:relative;
+ top:3px;
+}
+
+#animationArea {
+ flex : 1;
+ order: 2;
+ background-color: grey;
+ margin: 2%;
+}
+
#blocklyArea {
width:50%;
-height:100%;
-float:left;
+flex-wrap: nowrap;
}
#toolsArea {
float:right;
+display: flex;
+flex-direction: column;
+flex-wrap: wrap;
+justify-content: space-between;
+text-align:center;
height:100%;
width:48%;
margin-right:2%;
-text-align:center;
}