We Keep Coding

Writing a custom widget set on top of canvas

I need to build a custom widget set on top of the canvas element. This is for a very specific problem domain (handling audio and text in an integrated fashion) so using an existing widget set is out of the question.
The resulting application centers around a Zooming User Interface on top of which our custom widgets are to be placed.
What are some standard approaches, pitfalls and design patterns to be aware of when writing a widget set from scratch?
I imagine that a lot of valuable experiences in this field will not be with the canvas element and HTML5 in particular since it's relatively young. But, of course, any answers that focuses specifically on canvas and javascript will get extra unicorn points.
I also imagine that a lot of experience in this field comes from rather heavy handed OO approaches. The GOF-book deals with GUIs extensively. To what extent are their approaches applicable in a more functionally oriented language like javascript?

Maybe I didn't satisfy your request, but I can share my experience in a similar developement with canvas and javascript.
I logically divide code in 3 parts (come kind of MVC of my scenario): initial setup with data collection, event listeners (mouse move, click, wheel etc), drawing functions. The architecture works well, as the fact that I don't have to modify it adding features.
I use the main common rules of programming as: good code design, document the code, don't do tricks (js offers a lot of tricks), test what you are doing.
I use javascript "as it is" with OOP, using singleton pattern (http://addyosmani.com/resources/essentialjsdesignpatterns/book/#singletonpatternjavascript); google closure library help me to document the code properly - because I need to compile it in advanced mode (https://developers.google.com/closure/compiler/docs/api-tutorial3) but even without any framework you can write good structured code in js.
So the answer to your final question is "yes, you can do it even in a poor structured language like js".
The main problem I found was test it, you can do only manually, I mean setup an automatic tool, for me was not enough.

JS framework to support Three.js on videogame development

I'd like to develop 3D videogames using three.js, but since that library it's for handling graphics only, I'm still need a framework that helps me build the game (define entities, handle events, collision detection, etc).
Is there any framework that could help me out with that?
I read about using sim.js, but I'm not really sure if that's what I'm looking for.
Thanks!

IMHO, the answer will much vary depending on what kind of game you want to make.
Because browser-based 3D games still require much attention about how you manage memory, assets, etc, I think the best framework for your game will be the one you build for it.
You will keep making tradeoffs between quality and performance, regardless of the framework you use.
Now, to answer your question: there are currently almost none complete three.js-based game framework.
Your best bets, in my opinion, are
to start from a recognized "base" library like Physijs and build your game on top of that
to start with little bricks done by others, like J.Etienne three.js extras
to start from an open-source "finished" project like voxeljs or cubeslam
Basically look on github to find something approaching your own goal.
Or, if you feel very adventurous, help me on my own cheap framework here. yes, that was a very shameless plug.

Accessing GPU via web browser

I came across this proof of concept earlier today (on TechCrunch.com) and was blown away and intrigued as to how they had managed to accomplish the end result. They state that they don't use webGL or any plugins yet they are able to interact directly with the GPU and render 3D visuals at up to 60 fps using nothing but Javascript. Any ideas how this could be done, or how to access the GPU from Javascript in general without the use of plugins?
Site Address is: famo.us
ps: Try using your arrow keys to shift orientation its far out!!

They're using standard HTML5 Javascript APIs to achieve this.
I saw several references to requestAnimationFrame in their code. This method allows one that uses a compatible browser, to display more fluid and optimized animations, with far better frame rates than setInterval based animations will ever allow you to have. This is certainly achieved by using the GPU and the available hardware background.
GPU or every other hardware component cannot be accessed directly using any Javascript routines. Instead, the browser, based on the called JS directives and the execution context, will use the GPU if possible to optimize some specific treatments, calculus and renderings.
EDIT
For future references, I recently found out (7 years after the original answer) that a new initiative - the W3C GPU for the Web Community Group, has recently been created in 2020 to do just that. It describes itself as follow.
The mission of the GPU on the Web Community Group is to provide an interface between the Web Platform and modern 3D graphics
and computation capabilities present in native system platforms. The
goal is to design a new Web API that exposes these modern technologies
in a performant, powerful and safe manner. It should work with
existing platform APIs such as Direct3D 12 from Microsoft, Metal from
Apple, and Vulkan from the Khronos Group. This API will also expose
the generic computational facilities available in today's GPUs to the
Web, and investigate shader languages to produce a cross-platform
solution.
In the long-term, this initiative might allow developers to directly interact with the GPU from all web browsers. You can track the implementation status of the WebGPU API Spec on Github here.

Concerning famo.us: they did analysed the bottlenecks of the Webkit rendering pipe and then found a way to bypass them while building the pages. Basically: the DOM tree construction, the Render tree construction, the Layout of Render Tree are bypassed. Take a look on this article for a whole explanation.

They're using CSS 3D transforms. Web browsers are increasingly using hardware acceleration to do these kinds of CSS3 things.

i think the webGL glsl.js library might be good for this, though i havnt seen benchmarks...
https://github.com/gre/glsl.js/
also this approach seems viable;
basically to use the gpu in the way we like to, hardware optimised functions (have a little look into "blas") are used, you do not want to write these! strangely it seems that people still use the old fortran blas.... there is some stuff with compiling via llvm and then using emscripten to turn it into javascript.
Use Emscripten with Fortran: LAPACK binding
the emscripten way seems the most versatile, im just about to check it out, but it looks like a mountain, also this topic seems to be somewhat of a call to arms, emscripten only works with fortran if you hack it (see links from the second link). i think what we are looking for is blas support in javascript, this is not a closed issue by any means, and for a few of us out here it is very frustrating! hopefully someone has a link to these blas libraries we cant find...
please let me know if i dont quite have my head round this issue, js is new to me.
also, suggesting html5 is sufficiently "optimised" to use the hardware, how can we trust this!? we need gpu optimised blas (basic linear algebra subprograms) e.g. dot product.
i think maybe also that these old fortran blas arnt actually the right thing for a modern gpu? node-cuda seems very likely the best thing i have found...

Can I create a 3D carousel for the web from models in 3ds max? Example included

Is it possible/what is the easiest way to take 3D model from max and create a Flash or Javascript carousel that can work on the web? It should function like a real world CD carousel with say 100 or so models built in.
(http://www.thechiplab.com/stacks/Untitled-2.jpg)
Buttons on each side scroll through the chips. Thanks so much for looking at my question. This is my first one and I didn't see any similar questions asked. Sorry for not embedding the image...it wouldn't let me because this is my first post.
Chase

For working with 3D graphics in Flash you can use a library like Away3D or Papervision3D (the latter used to be the main one, but the former seems to have more momentum these days.)
Away3D will get hardware acceleration once that is available in the next version of Flash, but for now the complexity of your graphics will be limited by the software renderers. As a result, I don't know if a 100 disc carousel is really feasible.
Another option for doing web 3D is WebGL (already mentioned) but that's not supported in every browser yet (if ever, darn IE.)
Yet another option is using Unity. Their plugin will work in more browsers than WebGL, but is not installed as widely (or rather WebGL doesn't require any plugin.)
The specific file format you would use varies with each platform/engine, but the most common file format for web 3D is Collada. The best Collada exporter for 3ds Max is at http://www.opencollada.org

I'll just add this to #jhocking's (correct) answer:
I've used this asConverter max script to convert 3dsmax models into native Flash AS3 classes on a few different projects. Whats nice is that it exports to / extends native classes (extending the TriangleMesh3D Papervision class, for example). This way, you manage to bypass some of the issues you run into when exporting models out of 3dsmax. I've found it to produced quite reliable results - well formed geometry, and good uvw maps. It has support for PV3d, Away3d, and Sandy.
It looks like a defunct project now, but it was reworked by Mr. Doob at some point.
btw #jhocking: did you know Unity is going to support AS3 / export to SWF in the "near future" (when molehill releases, I assume)? Unity is an amazing application, and export to SWF would be... great.

You can certainly do this with Flash, but it is also doable with WebGL in some HTML5 supported browsers.
If you haven't worked with programming/JavaScript, you could have a look at something like copperlicht. If you are interested in coding, there are plenty of good WebGL frameworks around such as:
scenejs
three.js
glge
spidergl
canvas3d
As for the models, you'll need to export them into a format supported by webgl, for example into json objects.
Flash is of course another option, but I'll leave that option for somebody else to go into detail with.

What are good JS libraries for game dev? (HTML5)

If i decide to write a simple game both text and graphical (2d) what libs may i use? Assuming we are using a HTML5 compatible browser.
The main things i can think of
Rendering text on screen
Animating sprites (using images/css)
Input (capturing the arrow keys and getting relative mouse positions)
Perhaps some preloading resource or dynamically loading resources and choosing order
Sound (but i am unsure how important this will be to me at first). Perhaps with mixing and chaining sounds or looping forever until stop.
Networking (low priority) to connect a user to another or to continuously GET data without multiple request (i know this exist but i dont know how easy it is to setup or use. But this isnt important to me. Its for the question).

Well.... there's Rocket Engine. I haven't used it, but it appears (on the surface) to do much of what you want.
I'd also recommend HTML5 Gamer, a blog on the issues for building games in HTML5/JS

GameJs does this:
Sprites, SpriteGroups
Text rendering
input handling (key/mouse)
collision detection
sound
resource preloading
http://gamejs.org, Disclaimer: I'm dev of GameJs.
The stuff above works good and I did games with it. The API is similar to http://PyGame.org which some people like a lot.
Networking is planned.

If you're familiar with jQuery then gamequery is a good one to try. Here's a great demo of what you can do with it: brainsnackers.
Here are some of the features:
multi layer-sprite animations sprite
hierarchies (grouping) collision
detection swappable sound support
periodic callbacks keyboard state
polling free and open source license

Check out cake js. It's been around a long time and it's really nice to use - especially if you've used actionscript before.

The http://js1k.com contest just ended and the 2D platform game Legend Of The Bouncing Beholder (by marijnjh) was the winning entry. You might want to look over the source since it would provide a very easy to grasp overview of sidescrollers without needing to read lots of code.
Another good one is the two-player crazy pong which is a lot of fun.
Plus, 1kb games are just awesome.

i would use RenderEngine i think it has all you need and solves one of the most important problems that would be collision detection, and it also has sprite support...
Tutorial <- this is a great tutorial i found
i hope this helps

I can recommend Cometd for using ajax push networking (ie. comet)

What about createJS (createjs.com) or melonJS (melonjs.github.io/tutorial)?
CreateJS has great support for those items you mentioned, not so sure about networking though.
MelonJS has native support for reading Tiled tilemap .tmx files.