hello world

The tradition of learning a new system by writing a “hello world” program reached the wider public in 1978 in the book The C Programming Language by Brian Kernighan and Dennis Ritchie:

This is the the basic hurdle; to leap over it you have to be able to create the program text somewhere, compile it successfully, load it, run it, and find out where your output went. With these mechanical details mastered, everything else is comparatively easy.

Of course, that was written in the days of shared computers, teletypes and line printers. In these days of embedded systems, rather than outputting the text “hello world”, the program might turn on an LED. On Rascal you can do both. Here’s how:

hello world

Browse to your Rascal’s home page

http://rascalNN.local/

where NN is the serial number of your Rascal. You should see the Rascal’s home page. Change the browser address to:

http://rascalNN.local/editor/

Click the add page icon, enter the name “hello.html”, then click Create.

In the file list, click templates, then click hello.html. In the editing pane, change the section “rascalcontent” to:

Click the Save button, then click the file name “templates/hello.html” at the top of the editing pane. This completes Kernighan’s exercise.

hello world

Rascal hello world page

Flashing the LED

To flash the LED, first add a button. Click the browser back button to go back to the editor, open templates, click hello.html and update “rascalcontent”:

Save and test as above. There is now a red button which interacts nicely with the mouse but doesn’t yet do anything when you click it. Go back to editor, open hello.html and change the script section below “rascalcontent” to:


Save and test. Clicking the button should now open a dialogue box saying “Click!”.
If it doesn’t, make sure you saved your changes, then check the punctuation in the script section, especially the parentheses, curly braces and semicolons. If it did, congratulations – you have just written some JavaScript!

The strange looking line starting with a dollar sign is a jQuery statement. Rascal includes the jQuery library whose motto is “write less, do more”. Here we are using it to capture the button click and do something.

Before we can make the button flash the Rascal’s LED, we need to dive into Rascal’s engine room. Go back to editor but this time open the file server.py. This is a file of small functions written in Python which can be called from a web page to make things happen. Scroll down to the bottom of server.py just above the line if __name__ == "__main__": and insert the following code:

@public.route('/flash_led', methods=['POST'])
def flash_led():
    import pytronics
    if pytronics.read_pin('LED') == '1':
        pytronics.set_pin_low('LED')
        message = "LED off"
    else:
        pytronics.set_pin_high('LED')
        message = "LED on"
    return (message)

Python is quite fussy about indentation so if you haven’t used it before, it might be best to copy and paste this code. This function tests whether the LED is already on (the value of the pin is 1) and if so turns it off (set_pin_low), otherwise it turns it on. It also returns a message saying whether the LED is off or on which we can ignore for now.

After editing server.py, you need to do two things – click the Save button and then click Reload pytronics. The latter restarts the Rascal web server so that it uses the new version of server.py.

Finally, we need to change hello.html to call the new Python function but before doing that, check that the current version is still working. Click hello.html in templates, then click its name at the top of the editing window. Does clicking the button still display an alert? This isn’t a complete test but it does demonstrate that your change to server.py appears not to have stopped things working. We can now add a call to the new server function. Change the script section to the following:

Save and test. Clicking the button should turn the Rascal’s second LED on and off (this is the LED at the opposite end of the Rascal board to the Ethernet connector).

To make the button flash the LED, we added another jQuery statement $.post() which sends a request to server.py. This completes the embedded systems version of “hello world”.

Extra Credit: Display the LED status on the screen

jQuery $.post() expects to receive a reply. That’s why the flash_led function in server.py returns a message which we are currently ignoring. We can retrieve the message by adding a “callback function” to the jQuery post statement:

Save this change and make sure that the alert message is correct.

It would be even better to display the message next to the button. To do this we have to add somewhere for the message to go. Add a line to “rascalcontent”:

As before, save and test. Incremental testing makes it easier to find mistakes! Finally, replace the alert in the jQuery post callback function:

This new jQuery statement replaces the text in the <span> tag with the post response.

The finished Rascal hello world page

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s