Getting Started

Sphero robots are fun, durable and programmable robots! The Sphero Edu JavaScript Wiki is a guide to learn how to program Sphero robots with JavaScript, the most common web programming language in the world. You will need a Sphero robot, the Sphero Edu app on a compatible device, and a hunger to learn.

Why JavaScript?

JavaScript is one of the most popular programming languages in the world. It is very useful for building modern websites, and it’s even possible to build website back-end services with extensions of the language. It was originally created in 1995 by Brendan Eich at Netscape, one of the first internet companies which built a popular web browser in the days of dial-up internet. It was originally named "Mocha" by the founder of Netscape, Marc Andreessen, one of Silicon Valley’s most famous entrepreneurs.

Netscape started working with Sun Microsystems, who developed Java, a popular language that powered apps on early computers, handhelds and cell phones. Both companies were motivated to build a plugin so existing Java apps could run natively inside the increasingly popular web browser so they wouldn't need to be rebuilt. So Netscape created a scripting language similar to the Java syntax so these apps could still be used, and just as important, all the Java programmers could quickly adapt without learning a new language from scratch. The language was also very powerful. Before JavaScript, most web pages were built of purely HTML and CSS; they were very static. JavaScript allowed pages to be more dynamic, use animations, take input from forms, and playback media.

After a period of competing languages on the web, JavaScript won out as the dominant language, and now you can write JavaScript that renders in all modern web browsers, like Chrome, Safari, Firefox and Internet Explorer on a variety of internet connected devices. If you are considering a career in software development, technology, or robotics, it is a valuable language to know as there are a lot of JavaScript jobs available around the world. Even if you aren't pursuing a career in these fields, you'll get to be creative and solve some intriguing problems through programming.

You might have already even programmed a little JavaScript; it powers the Draw and Blocks programming canvases in the Sphero Edu app, and you can view JavaScript code behind those programs. Now you will graduate from drawing lines and dragging blocks to writing the text code yourself.

Hello World!

Using your device with the Sphero Edu app, create a new text program, access this wiki from the 'Text Canvas Help' button, and copy and paste these code samples into the text canvas. Don't forget to aim your robot, and then tap the Start button to see what happens!

async function startProgram() {
 await speak("Hello World", true);
 setMainLed({ r: 0, g: 0, b: 255});
 setSpeed(60);
 await delay (2);
 setSpeed(0);

}

Hello Square!

Now transform your first program into a Square with more logic: 

async function startProgram() {

setMainLed({ r: 0, g: 0, b: 255 });

await speak("Hello Square", true);

await delay(1);

for (var _i1 = 0; _i1 < 4; _i1++) {

setMainLed(getRandomColor());

await Sound.Game.Coin.play(true);

await roll((getHeading() + 90), 60, 1);

await delay(1);

}

}

Streaming

Your code streams in real-time at 20 hertz (times per second) between your device and the robot, instead of running locally on the robot. This is pretty cool for a few reasons. The memory on Sphero robots is very small, so streaming allows you to use your device memory as the only constraint, which on today's mobile devices and computers is basically limitless. Also, it enables you to interact with the program in real-time through sensor data and other inputs. The streaming nature of your program requires async in certain cases such as before function startProgram(), indicating that data is transmitted to/from the robot whenever it's needed. One downside of streaming is that some commands are slower due to the latency between the device and robot. For example, running a raw motor command of async raw motor(255, 255, 0.05) is the fastest (shortest) amount of time you can run raw motor (1s / 20hz = 0.05s). If you used a shorter delay like 0.04s, it would still perform at 0.05s.

Syntax

Syntax is the rule set for how programs are constructed.

Character Case

Most identifiers are tough to describe with one word, so most are 2+ words known as "compound identifiers." Programming languages generally don't allow spaces in identifiers, so character case is the method by which you join compound identifiers to deliminate words. There are hundreds of programming languages in the world, but nearly all of them use one of these four joining methods:  thisIsCamelCase, ThisIsPascalCase, this-is-spinal-case, and this_is_snake_case. JavaScript is case sensitive and uses camelCase, such as setSpeed to set the speed.

Punctuation

Code needs to be structured so it can be interpreted by the robot, just like the way humans have agreed on punctuation standards in writing. If authors did not write with punctuation rules, readers would have a tough time learning new rules in every book they read. Pay very close attention to the use of these characters or your robot will not be able to "read" your program:

Errors

Errors tell you when the robot can't interpret your syntax. In the below example, notice that setSpeed is spelled incorrectly. In this case the robot can't read the command and the red error message displays below the erroneous line. Copy this program and fix it so it runs without an error:

async function startProgram(){
 setSpee(188.0)

//!ReferenceError: Can't find variable: setSpee!
 setMainLed({ r: 0, g: 255, b: 0 });
 delay(2);

}

Data Types

There are different types of data in programming that describe how much space a number occupies in storage and how it's interpreted.

Some languages define more data types than others. JavaScript uses the follow built-in types:

Most commonly used types

Special types with special uses

JavaScript also supplies the Object type which we will use to create custom types from the built-in ones.