Arduboy.js - Arduboy in JavaScript

17th May 2015

There is now a github repo for this: https://github.com/mrboggieman/Arduboy.js

The Arduboy main code has been ported to JavaScript and a javascript version of an arduboy program can be ran in the window below. Good for quick development of Arduboy applications without needing to build and deploy on a real device.

Controls: use the interactive buttons above or use the following keyboard mappings:

Note: delay not supported in js

Up: W / Up arrow
Left: A / Left arrow
Right: D / Right arrow
Down: S / Down arrow
A: L / Z
B: P / X

Comments

Planning to do tetris?
James - 18th May 2015 10:53
@James Think someone else has already done it: http://www.team-arg.org/TEAM-arg/BKS-manual.html
Andrew Lowndes - 18th May 2015 17:47
This is awesome! Would be nice if there was an easy way to export a screenshot from the simulated screen.
Albert Filice - 22nd May 2015 01:49
In Chrome, you can right click on the virtual screen and save the image - undrawn pixels come out as transparent but this can be placed on a black background if needed.
Andrew Lowndes - 25th May 2015 20:23
Cooool :-) great work. I tried drawing an image, this way: var byte img[] = { B00111000, B10111010, B11111110, B10101010, B00101000, B10101010, B11111110, B10111010,
}; display.drawBitmap(x, y, img, 8, 8, 1); Dosn´t work, what did I do wrong?
Steen - 28th May 2015 14:34
@Steen. Currently only Javascript code is supported in the Javascript simulator above. The equivalent to your image would be the following: var img = [ 0x38, 0xBA, 0xFE, 0xAA, 0x28, 0xAA, 0xFE, 0xBA ]; display.drawBitmap(x, y, img, 8, 8, 1);
Andrew Lowndes - 28th May 2015 17:40
Thnx Andrew :-) That´s working...
Steen - 29th May 2015 07:42
How can I convert an img I have to this kind of array?
Thank you.
Alon Z - 30th May 2015 22:15
@Alon Use the image converter here: http://www.andrewlowndes.co.uk/blog/graphics/arduboy-image-converter
Andrew Lowndes - 1st Jun 2015 12:02
Hello guys !
How to display variables value ?
.print("%d",toto);
does not work
anyway, thanks for the tool !
maxC - 25th Oct 2015 14:31
//BEAUTFULL , i almost cryed... var display = new Arduboy(); var x = 0;
var y = 0; var img = [ 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x30, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x40, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x18, 0x00, 0x00, 0x00, 0x16, 0x80, 0x00, 0x00, 0x00, 0x00, 0x00, 0x20, 0x00, 0x00, 0x00, 0x20, 0x40, 0x00, 0x01, 0x80, 0x00, 0x00, 0x0B, 0x40, 0x00, 0x00, 0x4D, 0x60, 0x00, 0x02, 0x00, 0x00, 0x00, 0x10, 0x20, 0x00, 0x00, 0x2F, 0x20, 0x00, 0x00, 0xB4, 0x00, 0x00, 0x26, 0xB0, 0x00, 0x00, 0x3E, 0x9F, 0x00, 0x01, 0x02, 0x00, 0x00, 0x17, 0x90, 0x00, 0x00, 0x0C, 0xB8, 0x80, 0x02, 0x6B, 0x00, 0x00, 0x1F, 0x4F, 0x80, 0x00, 0x1D, 0x77, 0x00, 0x01, 0x78, 0xF8, 0x00, 0x06, 0x5C, 0x40, 0x00, 0x02, 0xEF, 0x80, 0x01, 0xF5, 0xC4, 0x00, 0x0E, 0xBB, 0x80, 0x00, 0x56, 0xEF, 0x80, 0x00, 0x65, 0xB8, 0x00, 0x31, 0x77, 0xC0, 0x00, 0xA5, 0xEB, 0x80, 0x00, 0xEB, 0x7C, 0x00, 0x68, 0x77, 0xC0, 0x00, 0xA5, 0xF7, 0xC0, 0x02, 0x17, 0x7C, 0x00, 0x52, 0xB3, 0xC0, 0x01, 0xA4, 0x33, 0x80, 0x06, 0xAF, 0x3C, 0x00, 0x56, 0x17, 0x80, 0x01, 0xA5, 0x4F, 0xC0, 0x05, 0x07, 0x7C, 0x00, 0x55, 0xA3, 0x80, 0x00, 0xA3, 0x17, 0xC0, 0x05, 0x29, 0x38, 0x00, 0xD3, 0xAD, 0x80, 0x03, 0xA2, 0xD7, 0xC0, 0x05, 0x62, 0xF0, 0x01, 0xD0, 0x6F, 0x00, 0x0D, 0xA5, 0xD7, 0xC0, 0x05, 0x5A, 0xF8, 0x00, 0x52, 0x1F, 0x00, 0x1A, 0xB4, 0x00, 0x00, 0x05, 0x3A, 0xF8, 0x01, 0x92, 0xCF, 0x00, 0x14, 0xDD, 0xF8, 0x00, 0x05, 0x04, 0x78, 0x03, 0x5A, 0xF0, 0x00, 0x19, 0xCA, 0xF8, 0x00, 0x09, 0xA1, 0x80, 0x02, 0x8E, 0xFC, 0x00, 0x00, 0x05, 0x64, 0x00, 0x06, 0xEF, 0xE0, 0x03, 0x05, 0x78, 0x00, 0x00, 0x00, 0x1E, 0x00, 0x0D, 0x57, 0xC0, 0x00, 0x02, 0x80, 0x00, 0x00, 0x06, 0x7F, 0x00, 0x0A, 0x2B, 0x80, 0x00, 0x08, 0x38, 0x00, 0x00, 0x06, 0xBD, 0x00, 0x0C, 0x14, 0x00, 0x00, 0x0E, 0x7C, 0x00, 0x00, 0x1E, 0xBD, 0x80, 0x00, 0x41, 0xC0, 0x00, 0x1D, 0x7E, 0x00, 0x00, 0x22, 0x9C, 0x80, 0x00, 0xEB, 0xE0, 0x00, 0x39, 0x7E, 0x00, 0x00, 0x1C, 0x04, 0x00, 0x01, 0xEB, 0xA0, 0x00, 0x22, 0x42, 0x00, 0x00, 0x1E, 0x89, 0x00, 0x02, 0x27, 0xB0, 0x00, 0x10, 0x3C, 0x00, 0x00, 0x3E, 0x2F, 0x00, 0x01, 0xC7, 0x10, 0x00, 0x24, 0xFE, 0x00, 0x00, 0x3F, 0x2F, 0x00, 0x03, 0xC0, 0xC0, 0x00, 0x3E, 0x7E, 0x00, 0x00, 0x7F, 0x3F, 0x00, 0x07, 0xD7, 0xE0, 0x00, 0x3E, 0x7E, 0x00, 0x00, 0x7F, 0x3F, 0x00, 0x07, 0xD7, 0xE0, 0x00, 0x7E, 0x3F, 0x00, 0x00, 0x7E, 0x3F, 0x00, 0x0F, 0xC7, 0xF0, 0x00, 0x7C, 0x3F, 0x00, 0x00, 0xFE, 0x1F, 0x00, 0x0F, 0xC3, 0xF0, 0x00, 0x7C, 0x1F, 0x00, 0x00, 0xFC, 0x1F, 0x00, 0x1F, 0x83, 0xE0, 0x00, 0xFC, 0x1F, 0x80, 0x00, 0xF8, 0x1F, 0x80, 0x1F, 0x01, 0xF8, 0x00, 0xF8, 0x0F, 0x80, 0x00, 0xF0, 0x0F, 0x80, 0x1F, 0x01, 0xF8, 0x00, 0xF8, 0x1F, 0x80, 0x00, 0x7E, 0x0F, 0xC0, 0x1E, 0x01, 0xF8, 0x01, 0xF8, 0x3F, 0x00, 0x00, 0x3F, 0x0F, 0xC0, 0x0F, 0x01, 0xF8, 0x01, 0xF0, 0x3F, 0x00, 0x00, 0x3F, 0x07, 0xE0, 0x1F, 0x03, 0xE0, 0x03, 0xF0, 0x1E, 0x00, 0x00, 0x3F, 0x87, 0xE0, 0x1F, 0x03, 0xF0, 0x03, 0xE0, 0x7E, 0x00, 0x00, 0x3F, 0x87, 0xE0, 0x1F, 0x03, 0xF0, 0x07, 0xE0, 0x3C, 0x00, 0x00, 0x1F, 0x43, 0xE0, 0x16, 0x01, 0xF0, 0x07, 0xE0, 0xBC, 0x00, 0x00, 0x1C, 0xC3, 0x90, 0x01, 0x02, 0xD0, 0x03, 0xC1, 0xC0, 0x00, 0x00, 0x03, 0xC0, 0x70, 0x1F, 0x03, 0x00, 0x04, 0x01, 0xE0, 0x00, 0x00, 0x03, 0xC0, 0xF8, 0x3F, 0x03, 0xC0, 0x0F, 0x01, 0xE0, 0x00, 0x00, 0x03, 0xC0, 0xF8, 0x3C, 0x03, 0xE0, 0x0F, 0x01, 0xF0, 0x00, 0x00, 0x0F, 0x80, 0xF8, 0x7C, 0x01, 0xF0, 0x1F, 0x00, 0xF8, 0x00, 0x00, 0x00, 0x00, 0xE0, 0x00, 0x01, 0xF0, 0x1F, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00, 0x00 ]; function btnDown(btn) { return !digitalRead(btn);
} function drawText() { display.clearDisplay(); display.setCursor(x, y); display.print("."); display.display(); display.drawBitmap(x, y, img, 88, 62, 1);
} function setup() { SPI.begin(); display.start(); display.setTextSize(1); drawText();
} function loop() { drawText();
}
Raphael - 24th May 2017 21:46
How did you convert the code from the arduboy to java script (sorry im a novice)? This is a perfect teaching environment within the classroom (primary - 7-11 year olds) if i can find a converter to do that bit for them.
zanners59 - 3rd Jun 2017 16:42
var display = new Arduboy(); var up = 8;
var left = 9;
var right = 5;
var down = 10;
var a = A0;
var b = A1;
var T = 0; var x = 0;
var y = 0;
var x1 = 0;
var y1 = 0; var speed = 1; var img = [ ]; function btnDown(btn) { return !digitalRead(btn);
} function drawText() {
display.clearDisplay();
display.setCursor(54, 0); display.print(String("T")+String(T)+String(" x")+String(x)+String(" y")+String(y)); display.display(); //display.drawBitmap(x, y, img, 82, 62, 1);
display.drawLine(x, y, x1, y1, 1);
display.drawRect(0, 0, x, y, 1);
} function setup() { SPI.begin(); display.start();
} function loop() { if (btnDown(up)) y-=speed; if (btnDown(down)) y+=speed; if (btnDown(left)) x-=speed; if (btnDown(right)) x+=speed; if (btnDown(A0)) x1+=speed; if (btnDown(A1)) y1+=speed; drawText(); T = T+=speed; if (T>=100) T=0; }
Priomitives - 13th Apr 2019 00:48

Make a comment

Contribute to this article and have your say.