Showing posts with label JavaScript. Show all posts
Showing posts with label JavaScript. Show all posts

Monday, March 1, 2010

First version of the UVisual

Hello. I deployed the first version of my project (universal visualizer) on the web. Currently it has limited functionality, yet it is possible to use it to fetch images from the flickr and organize them in a sequence of "items".
The page is divided on three sections: top-left, top-right, and bottom-center.
Top-left block has a table of items that can be sorted. Every item may be considered as a "point" in the presentation. When you click the item, the editor of the properties for this item will be open in the top-right block. You can make changes and save them by clicking "update" button. Additionally, in the top-left block you can press the "preview" button to start the "visualization" of the currently selected item. The visualization takes place in the bottom-center block. In the final version there will be an option to run the presentation in the "production" mode, so the user will see only the "visualization" itself - without editors.
Comments and questions are appreciated.

Monday, January 18, 2010

HTML5 canvas element

Arturo asked me to implement a simple program that can draw a Mandelbrot set. The first idea was to implement it using the good old way - java, yet there is nothing "innovative" for me. Working with 2D graphics in Java is a really simple task. Then I thought that may be Processing is a way to go. Nah. Processing is just a simplified java syntax. Finally I decided to reimplement it (I actually found an implementation in the internet of a simple draw algorithm in "C") using JavaScript and a new HTML5's element canvas. I had never used this element before, and I was surprised how easily it can be used. So here it is. After you press "draw" button, it will take about 1 minute to draw a Mandelbrot set inside the rectangle area (you should use a HTML5 compliant browser like Firefox or Opera).







You can check the source code here.

So, actually to do a 2D graphics, all you need is a browser! No compilers or IDEs. Just a browser!.

The "canvas" element is a new feature of an HTML standard that allows to draw a 2D graphics using just JavaScript. Another interesting feature of the standard is a "video" element that allows to include video content on any HTML page without using external players like Flash or Silverlight.
Isn't it amazing?