Home. Badass JavaScript - Exploding HTML5 Video with JavaScript and Canvas. Sean Christmann has written another HTML5 Video and canvas demo that makes the video explode wherever it is clicked. Even when it is exploded, the pieces still continue to play the section of video that they were playing when the video was entirely together. After a few seconds, the pieces animate back together, reforming into a complete video once again. A very cool effect! One of the things that Sean had to do to get this implementation to run smoothly, was to have a second canvas act as a buffer to the final product. All very good information to know when writing your own crazy demos! Remixing Reality. JavaScript Augmented Reality – JavaScript Augmented Reality – Bocoup Web Log.
Augmented Reality: using JSARToolkit with WebGL & HTML5 Video Last week I spent some time running tests and generally familiarizing myself with the JSARToolkit code. I also built a JavaScript wrapper for the library to make it easier to use. JSARToolkit is a JavaScript library converted from FLARToolkit (Flash), and is developed for tracking AR Markers in video footage. The ARToolkit converts the data from the markers into 3D coordinates with-which you can super-impose images and other 3D or 2D content. What is Augmented Reality? “Augmented reality (AR) is a term for a live direct or an indirect view of a physical, real-world environment whose elements are augmented by computer-generated sensory input, such as sound or graphics. You may have already seen JSARToolkit in action on Ilmari Heikkinen’s awesome “Remixing Reality” demo.
Resources: JSARToolkit-Wrapper on Github You will need the latest version of Firefox 4 or Chrome to see these demos working. HTML5 Music-Video Research Conclusions. JavaScript Garden. Although JavaScript deals fine with the syntax of two matching curly braces for blocks, it does not support block scope; hence, all that is left in the language is function scope. function test() { // a scope for(var i = 0; i < 10; i++) { // not a scope // count } console.log(i); // 10} There are also no distinct namespaces in JavaScript, which means that everything gets defined in one globally shared namespace.
Each time a variable is referenced, JavaScript will traverse upwards through all the scopes until it finds it. In the case that it reaches the global scope and still has not found the requested name, it will raise a ReferenceError. The Bane of Global Variables // script Afoo = '42'; // script Bvar foo = '42' The above two scripts do not have the same effect. Again, that is not at all the same effect: not using var can have major implications. // global scopevar foo = 42;function test() { // local scope foo = 21;}test();foo; // 21 Local Variables var foo = 3; bar = 4;}test(10); Hoisting. JavaScript Source: Free JavaScripts, Tutorials, Example Code, Reference, Resources, and Help - JS. jQuery Ajax tutorials, jQuery UI examples and more! - The Ultimate jQuery List.