A platform for casual encounters with interactive technology – Making Noise

…you should be able to get this working about 2 minutes…

(Looking for Part 1 of this series?)

Next we are going to let people specify a value rather than just on or off.  Let’s let them pick the frequency of a tone!

Here is what it looks like…

Step-by-step setup instructions…

  1. We will start with a stock Yun out of the box. You can reset your Yun back to this state by pushing and holding the “Wifi Reset” button for 30 seconds.
  2. Connect a speaker between pin 8 and ground on the Yun, like this…
    Yun With Speaker
  3. Connect the Yun to your computer – probably via USB. Make sure you select the correct port under Tools->Port and the Yun board under Tools->Board.
  4. Copy/paste the BeepMeSetup sketch [GET CODE] into your Arduino IDE and upload it to the Yun.  You can connect via Serial Monitor in the IDE after the upload completes if you want to watch the action, but it is not necessary.
  5. Wait for the red LED to start blinking a steady once per second. This will let you know that the setup script has completed. It takes about a minute to finish – longer if you recently rebooted the board.
  6. Copy/paste the BlinkMe sketch [GET CODE] into your Arduino IDE and upload it to the Arduino Yun.
  7. Take out your cellphone and connect to the new BeepMe Wifi network coming from the Yun.
  8. Make some noise! Yeay!

The full code for this project is available on GitHub here.

HOW IT WORKS

To get the value from the webpage to the Arduino sketch, we added a new “TONE” command that consists of the letter “T” followed by a 5 digit number specifying the frequency of the tone. So, “T0100″ would request a 0100Hz tone.

First let’s a the new tone command to the Arduino sketch. Note we also have to increase the size of the command buffer since this new command can be 6 bytes long. Here is the updated Arduino code…

[code language=”c”]
// Connect a speaker here
#define TONE_PIN 8

 // Forgiving parse of an unsigned int from a string. All non-digits simply ignored.

unsigned int parseUnsignedInt( const char *s , int len ) {

   unsigned int x=0;
 
   while (len–) {
 
      if (isdigit(*s)) {
 
        x*=10;
         x+=(*s)-‘0’;
 
      }
 
      s++;
 
   }
 
 return(x);

}

// Understood command string formats:
// ‘Tnnnnn’ where nnnnn is 5 digit frequency specifier – Geneate a tone
// ‘N’ – Stop any playing tone

#define COMMAND_LEN 6

void processCommand( const char *commandString ) {

  // Use the first byte to specifiy action…
 
  switch (commandString[0]) {
      
    case ‘T’:  { // Generate a tone of the frequency specified by the 5 digit number after the action…
    
      unsigned int freq = parseUnsignedInt( commandString + 1 , 5 );
    
      if (freq >=50 && freq<=5000 ) {    // Just some sanity checks…
        
          tone( TONE_PIN , freq );   // Play the specified tone
      }
      
      break;
    }
      
    case ‘N’: {  // Stop any currently playing tone
    
      noTone( TONE_PIN );
      break;
      
    }
      
  }
   
}

// This is the default baud rate for the serial link
#define LININOBAUD 250000

void setup() {

    Serial1.begin(LININOBAUD); // open serial connection to Linino

}

// We to use this string to indicate where the command is inside the request string…
// Mast match the command string sent by the HTML code
#define COMMAND_PREFIX "COMMAND="

// This is the expected length of the incoming command. For now just turnong on/off so only need 1 bytes

char commandBuffer[COMMAND_LEN];

void loop() {

 // Does this look like a command request?
 if (Serial1.find(COMMAND_PREFIX)) {

    // Read it into the command buffer and only process if long enough…
    if ( Serial1.readBytes( commandBuffer , COMMAND_LEN ) == COMMAND_LEN ) {
      
      processCommand( commandBuffer );
      
    }
  }
}

[/code]

I also added a new “N” command to turn the tone off (it can get annoying). Note again that our code will fail harmlessly if it gets anything unexpected – this is important because we can’t control what hackers might send us over the HTTP link.

Next wel need to update the HTML to let people send the new command.

 

Here is what the new HTML looks like…

[code language=”html”]
<!DOCTYPE html><title>Beep Me</title><body><center>
<script>
  function send(s) {
     r=new XMLHttpRequest();
     r.open(‘GET’,’/cgi-bin/control.cgi?COMMAND=’+s+’&’+(new Date()).getTime(),false);
     r.send(null);
  }
</script>
<H1>TONE GOES</H1>
<input type=’range’ id=’freq’ min=’50’ max=’5000’><br>
<button onclick=’send( "T"+("00000"+document.getElementById("freq").value).slice(-5));’>Play</button>
<button onclick=’send( "N");’>Stop</button>
</center></body>
[/code]

..and let the tones play!

Hopefully now you can new imagine how you might let people control anything using this system.

Leave a Reply