27. October 2011

WebGL – Mine3D

Three.js is amazing 3D library written in JavaScript.

Eberhard Gräther wrote very interesting port of old Minesweeper. Now you can play it in 3D space :)

Checkout Ebehard’s web site. You can find there other cool examples of WebGL and JavaScript. Like this one:

15. October 2011

Composing and playing music with HTML5

I was searching for a web based music note editor. I found HTML5 Cloud Composer from Greg Jopa.

Then I found something more like good old FastTracker: Sonant Live composer.

You can use Sonant Live composer to create tracks with music.

What is even more interesting about this composer is that you can store your song into pure JavaScript file and replay it with js-sonant.

The princeple of js-sonant is quite simple. You just store music structure into song variable and then you call createAudio. It will produce HTML5 audio object with wav rendered from your song tracks.

Here is sample code:

var songGen = new sonant();

for (var t = 0; t < 8; t++)

audio = songGen.createAudio();
audio.loop = true;

Here you can play my simple attempt to make music. :-)

Note: Your browser must support HTML5 audio in order to play this music. Browsers which have support for HTML5 audio: Google Chrome, Firefox, Opera, Safari.

Note 2: Please wait few seconds after you clicked the Play button. You browser will render JavaScript music notation into playable Wav.

5. October 2011

EurOpen – Security in context of RIA apps

You can find here slides from my talk about security in context of RIA applications.

Conference EurOpen.czŽeliv. Slides are Slovak only.

29. May 2011

Flex ExternalInterface – sending big amount of data

When you want to exchange data between Flash Player and JavaScript then you can use ExternalInterface.

There are two issues that you should be aware of:

1. Binary data must be encoded.

You could not send binary data directly from JavaScript to ExternalInterface. Data will be garbled. You have to encode it e.g. using Base64.

2. Send small chunks of data.

When you need to send 2 MB via ExternalInterface, you need to chop it into smaller pieces. E.g. 256 KB. Bigger chunks cause big load and it slows down transfer.

It takes 15 seconds to transfer 2 MB big chunk in Google Chrome 11. When you chop 2MB into 256 KB chunks, then it’s less than second.

25. April 2011

D3.js – JavaScript charts and graphs that rocks!

Project D3.js is simply great. Visual look of charting components is cool.

Another great charting library written in JavaScript is Flot.