Skip to content

Move Forward: Use case example

Matt Blickem edited this page Jul 13, 2015 · 6 revisions

This document outlines what happens when a user opens the control page and uses the forward button.

Open the control page

  1. Flask-Babel (the python webserver) prepares the template control.html by replacing any {% %} tagged elements with valid HTML. This includes config data and natural language translations.

  2. The page is sent to the client web browser and rendered on their screen (including the button with the id id="b_forward").

  3. JavaScript code is tied to elements in the page $(document).on("pagecreate",'#page-control', function(event) {} as defined in control.js

  4. For the button with id="b_forward" (and with a browser on a touch-capable device) the following JavaScript code events are attached to the button when the page loads:

     $('#b_forward')
     .on("touchstart", function (){bot.move(CODERBOT_CTRL_FW_SPEED,CODERBOT_CTRL_FW_ELAPSE);})
     .on("touchend", function (){bot.stop();});
    

Touch the forward button

  1. The "touchstart" event is fired and the anonymous function above is triggered. The function executes bot.move() referring to an object called bot which is initialized at the top of the file control.js.

  2. The object bot is of type Coderbot whose definition is found in coderbot.js. The function bot.move, the one executed on the "touchstart" event, actually translates to CoderBot.prototype.move = function(speed, amount) {...}, which then refers to this.command(), which is defined by CoderBot.prototype.command = function(cmd, param1, param2) {...}. (these are all contained in coderbot.js)

  3. In the command() function definition, the line $.ajax({url: this.url, data: data, async: true, type: "GET"}); executes a python function on the server in main.py. The function that handles this kind of request is called handle_bot(). Recall that the cmd parameter sent was 'move'.

  4. handle_bot() results in execution of bot.move(speed=int(param1), elapse=float(param2)). Note that when the server was started via run_server() in main.py the object bot was initialized.

  5. The definition for bot_move() is located in coderbot.py and finally results in servo actuation.

Clone this wiki locally