Recording Audio With Chrome Using HTML5

December 1, 2012 by Mike Szczys 11 Comments

recording-audio-with-chrome

The Dubjoy project was stopped dead in its tracks when the newest version of the Google Chrome browser stopped using Adobe’s flash plugin and transitioned to their own called Pepper Flash. The aim of development was to produce a browser-based editor for translating the audio track of a video clip. After a bit of head scratching and a lot of research they decided to try ditching the use of Flash and implemented a way to record audio using HTML5.

There were quite a few issues along the way. The initial recording technique generated raw audio files, which are not playable by Chrome’s HTML5 audio player. This can be worked around by buffering the raw audio, then converting it to a different format once the recording is finished. The user also needs to monkey with the Chromes flags to enable HTML5 audio. So they did get it working, but it’s not yet a smooth process.

We love seeing the neat stuff you can do with HTML5. One of our favorites is the use of a tablet’s accelerometer as a browser game controller.

[via Reddit]

NXT Android Telepresence Robot

August 2, 2012 by Mike Szczys 3 Comments

Here is a telepresence robot that uses an Android device and LEGO NXT parts. [Wolfgang] had an extra phone on hand and decided to put it to good use. The Mindstorm parts make it really easy to produce a small robot, and adding the phone really ups the computing and connectivity options available to him.

The Android device is able to control the NXT bot via Bluetooth. [Wolfgang] didn’t go into detail on that part, but you can get some pointers on the topic from this other Android controlled Mindstorm project. [Wolfgang] wanted the ability to check in at home when he’s travelling. He uses nanohttpd on the Android device to serve up a simple web interface. It uses HTML5 to push a snapshot from the phone’s camera as user feedback, and provides a set of directional arrows which let him drive the bot around.

Obviously this thing is going to run out of juice if he’s away for too long. To combat that problem he included a battery which powers both the NXT parts and the phone. Now he just needs to build an inductive charging station and he’ll really be set.

Continue reading “NXT Android Telepresence Robot” →

Accelerometer-based Game Control Using An IOS Device Courtesy Of HTML5

March 26, 2012 by Mike Szczys 14 Comments

This game of Space Invaders is played by tilting your iPhone to the left or right. It’s a demonstration of HTML5 used to link devices in-browser. The only setup that’s required is for the base device to load up a webpage, then the control device scans a QR code (or just types in a link) to connect with the game. You can give it a try right now if you want.

It only works with iOS devices but we believe that’s because mobile Safari has the ability to poll accelerometer data and other browsers do not. If this was using on-screen buttons rather than the tilt controls it would work on any device that implements HTML5. The connection is facilitated by Node.js and Socket.IO. The QR code that is generated by the host machine’s page includes a unique ID which allows the control device to link with it. Once loaded, commands from the controller are sent via Socket.IO to the node on the host machine.

As with this HTML5-based sensor data application, we think this method is important because it allows control without the need for a standalone application. We’re hoping to see a lot of this in embedded projects in the future. By serving data to a smart phone or other device you remove to need for a physical user interface in your projects, which means you can make great things while spending less.

[via Reddit]

Say Hello To Our Little Friend, The BeagleBone

November 1, 2011 by Mike Szczys 57 Comments

Small and more powerful… what more can you want? This is the newest BeagleBoard offering, called the BeagleBone. It’s packed with some pretty intriguing features, but let’s take a tour of the hardware first.

Like its predecessors, the BeagleBone sports an ARM processor. This time around it’s a TI AM3358 ARM Cortex-A8. It will ship with a 2 GB microSD card and has an Ethernet port and USB connection. The dual pin headers on either side of the board are designed to receive ‘Capes’ for expansion. Currently a DVI cape is in the works, with HDMI and others to follow.

Linux is running on board and one of the best features we see in the video after the break is the browser-based programming interface. When connected to a network, the BeagleBone serves HTML5 web pages. One of these is an IDE that lets you write and execute code directly from your browser.

Now, can we finally have our open-hardware set top box (hopefully running XBMC)?? At an MSRP of $89 this should be able to give AppleTV 2 a run for its money as an easy way to get your television some network connectivity. Continue reading “Say Hello To Our Little Friend, The BeagleBone” →

Wicked Use Of HTML5 To Display Sensor Data

October 25, 2011 by Mike Szczys 33 Comments

This project shows you one possible way to use HTML5 to fully integrate sensor data from a microcontroller into our technological lives. Now, when we saw this tip come through our inbox we thought it would be an interesting example to learn from but we weren’t ready for how truly cool the setup is. Take a look at the video after the break and you’ll see that scanning the QR code on the project box will immediately start a 10ms resolution live stream of the accelerometer data. Furthermore, the browser page that the phone loads allows you to send what you’re currently viewing to the main frame of a browser running on a different computer with the touch of a button. In this way you can build a dashboard of streaming sensor data. Talk about the future of home automation. Imagine a QR code on your thermostat that allows you gain access to your home’s heating, air conditioning, humidifier, and water heater performance and controls just by snapping a pic? The sky’s the limit on this one so let us know what you’d use it for by leaving a comment.

In this case an mbed microcontroller is handling the data acquisition and pushing that to a server via a WiFly module using the WebSockets library. This data is pushed in the form of a JSON packet which is distributed by the server as a data stream. Clients can access it via a browser through a page that makes use of JavaScript.

Continue reading “Wicked Use Of HTML5 To Display Sensor Data” →