{"id":176,"date":"2013-02-18T15:21:22","date_gmt":"2013-02-18T22:21:22","guid":{"rendered":"http:\/\/www.meanboyfriend.com\/overdue\/?p=176"},"modified":"2013-02-18T16:20:49","modified_gmt":"2013-02-18T23:20:49","slug":"sound-the-octo-alert","status":"publish","type":"post","link":"http:\/\/www.meanboyfriend.com\/overdue\/2013\/02\/sound-the-octo-alert\/","title":{"rendered":"Sound the Octo-alert!"},"content":{"rendered":"

Both our children are currently big Octonauts<\/a>\u00a0fans – if you haven’t come across the Octonauts, they are a team of underwater explorers who featured in\u00a0a series of books<\/a>\u00a0by a Canadian duo jointly known as Meomi<\/a>. The books have been made into an incredibly popular TV cartoon shown in the UK on the CBeebies channel<\/a> (the BBC channel aimed at younger children).<\/p>\n

\u00a0\"Octoalert<\/a><\/p>\n

Whenever there is an emergency, Captain Barnacle will order “Sound the Octo-alert!” – the big button with the distinctive Octopus logo will be pressed, and alarms sounds, and the Octonauts report for duty. As I said, both our children are big fans, and Freya does a mean Octo-alert imitation, so when I was looking for a new Arduino project to do with Bryn, I thought building a working Octo-alert would be great fun.<\/p>\n

While you can get an extension (called a shield) for an Arduino to record and play sound (e.g.\u00a0http:\/\/www.ladyada.net\/make\/waveshield\/<\/a>) I hadn’t got one of these, and I thought a simpler (and in some ways more satisfying) approach would be to have the Arduino joined up to the computer and have a button on the Arduino trigger a sound\/video file on the computer. A quick search found the Octoalert website<\/a>\u00a0– with a clickable Octo-alert image which then plays an mp3 of the Octo-alert sound. Given this was already there and worked, my idea morphed into triggering the alert from this website by simulating a ‘click’ on the image.<\/p>\n

However, before we got to this point we needed to build an appropriate Arduino circuit and craft a button and console. The Arduino circuit is a very simple one – just a single button wired up to an LED and of course a pin on the Arduino. Once I’d put the circuit diagram on, Bryn was able to get going on the wiring. Some of the components are still a bit fiddly for Bryn to put into the breadboard by himself, but for the wires he can follow the diagram and put the wires in himself. I helped with the bits he couldn’t manage, and generally supervised him – but he could do a lot of this himself.<\/p>\n

To create the button we cut in half a small plastic ball, Damyanti drew the logo, and Bryn set to work glueing on orange tissue paper<\/p>\n

\"octoalert1\"<\/a><\/p>\n

 <\/p>\n

A simple ‘button press’ program for the Arduino is available from\u00a0http:\/\/www.oomlout.com\/oom.php\/products\/ardx\/circ-07 and I adapted this slightly so that the LED flashed several times on a single button press, and so the button also controlled the output to the serial port – which allows the Arduino to send data back to the computer it is joined to. The Arduino code looked like this:<\/p>\n

\/\/ set pin numbers:\r\nconst int buttonPin = 3;     \/\/ the number of the pushbutton pin\r\nconst int ledPin =  9;      \/\/ the number of the LED pin\r\n\r\n\/\/ variables will change:\r\nint buttonState = 0;         \/\/ variable for reading the pushbutton status\r\n\r\nvoid setup() {\r\n  \/\/ initialize the LED pin as an output:\r\n  pinMode(ledPin, OUTPUT);      \r\n  \/\/ initialize the pushbutton pin as an input:\r\n  pinMode(buttonPin, INPUT);\r\n  \/\/ initialize serial port\r\n  Serial.begin(9600);  \r\n}\r\n\r\nint interval_time = 500;\r\n\r\nvoid loop(){\r\n  \/\/ read the state of the pushbutton value:\r\n  buttonState = digitalRead(buttonPin);\r\n\r\n  \/\/ check if the pushbutton is pressed.\r\n  \/\/ if it is, the buttonState is HIGH:\r\n  if (buttonState == HIGH) {     \r\n    \/\/ LED off:    \r\n    digitalWrite(ledPin, LOW);\r\n    Serial.println(\"0\");\r\n    delay(interval_time);\r\n  } else {\r\n    \/\/ turn LED on:\r\n    Serial.println(\"1\");\r\n    for (int i=0;i < 10;i++) { \r\n      digitalWrite(ledPin, HIGH); \r\n      delay(500);\r\n      digitalWrite(ledPin, LOW);\r\n      delay(500);\r\n    }\r\n    delay(interval_time);\r\n  }\r\n}<\/pre>\n
On the computer side I needed a mechanism to read the output on the serial port – I found a hint on how to do this here\u00a0http:\/\/playground.arduino.cc\/Interfacing\/Ruby. I also needed a way of accessing the\u00a0Octoalert website<\/a>\u00a0– I knew there was a Ruby Gem to control a browser called Watir, so I got this installed, and after a few false starts (the task was complicated by the fact that clicking the button on the website actually runs some javascript) I got some code working that could read the input from the Arduino and trigger the necessary javascript on the website:<\/p>\n
#!\/usr\/bin\/ruby\r\nrequire 'rubygems'\t\r\nrequire 'watir-webdriver'\r\nrequire 'serialport'\r\n\r\n#params for serial port  \r\n port_str = \"\/dev\/tty.usbmodem1411\"\r\n baud_rate = 9600  \r\n data_bits = 8  \r\n stop_bits = 1  \r\n parity = SerialPort::NONE  \r\n\r\n sp = SerialPort.new(port_str, baud_rate, data_bits, stop_bits, parity) \r\n browser = Watir::Browser.new\r\n\r\n #just read forever  \r\n while true do\r\n   while (i = sp.gets) do\r\n   \tputs i\r\n    if i.to_i > 0\r\n    \tbrowser.goto \"http:\/\/octoalert.com\"\r\n\t\tbrowser.link(:id,\"playLink\").fire_event \"onclick\"\r\n\t\tsleep(7)\r\n\t\tbrowser.goto \"http:\/\/brynpatelstephens.com\"\r\n   \telse\r\n\t\tputs \"No Octoalert\"\r\n\tend\r\n   end \r\n end<\/pre>\n
With this code running on the computer, and the Arduino program loaded to the board we had a working button – we now needed to put the whole thing together.<\/p>\n
A bit of improvisation with some cardboard and we mounted the Octo-alert button in such a way it could sit over the Arduino and pushing down on it pushed the actual button on the Arduino. I cut a hole in a cardboard box for the button to be mounted in, and Bryn decorated it in the style of the Octonauts instrument panel.<\/p>\n
\"octoalert2\"<\/a><\/p>\n
This was a nice project, in that it mixed some nice crafting (glueing the tissue paper, making the control panel) with a very simple circuit – all of which Bryn could either do by himself, or with a small amount of help. The programming was slightly more tricky, and I just got on this with while Bryn did other stuff – but I explained a bit about how the Arduino was able to ‘talk’ to the computer which I think he got. He also was quite concerned that by using the sound\/graphic from the website that we were ‘stealing’ another’s work – which meant an opportunity to talk about the web and how it worked – although I’m not entirely sure he understood my explanation of using the website versus copying the files – and to be honest I’m not sure I quite understand it either – after all in both cases you end up with a copy of the file on your computer!<\/p>\n
And it wasn’t just fun for me and Bryn – Freya got to join in too as you can see in this video – yes, it’s time to sound the Octo-alert \ud83d\ude42<\/p>\n\t