Canvas Articles
-
BrowserQuest – a massively multiplayer HTML5 (WebSocket + Canvas) game experiment
It’s time for some gaming action with a new HTML5 game demo: BrowserQuest, a massively multiplayer adventure game created by Little Workshop (@glecollinet & @whatthefranck) and Mozilla. Play the game: browserquest.mozilla.org BrowserQuest is a tribute to classic video-games with a multiplayer twist. You play as a young warrior driven by the thrill of adventure. No […]
-
what does tracemonkey feel like?
One of our goals with Firefox 3.5 is to help upgrade the web. Over the lifecycle of this release we’ve invested heavily in developer features. One of the features that we’ve invested in is TraceMonkey – a tracing interpreter that turns commonly-run JavaScript code into machine code so that it can run at near-native speeds. […]
-
getUserMedia is ready to roll!
We blogged about some of our WebRTC efforts back in April. Today we have an exciting update for you on that front: getUserMedia has landed on mozilla-central! This means you will be able to use the API on the latest Nightly versions of Firefox, and it will eventually make its way to a release build. […]
-
How to develop a HTML5 Image Uploader
HTML5 comes with a set of really awesome APIs. If you combine these APIs with the <canvas> element, you could create a super/modern/awesome Image Uploader. This article shows you how. All these tips work well in Firefox 4. I also describe some alternative ways to make sure it works on Webkit-based browsers. Most of these […]
-
How fast is PDF.js?
Hi, my name is Thorben and I work at Opera Software in Oslo, not at Mozilla. So, how did I end up writing for Mozilla Hacks? Maybe you know that there is no default PDF viewer in the Opera Browser, something we would like to change. But how to include one? Buy it from Adobe […]
-
content aware image resizing
Note: The author of the demo, Stéphane Roucheray, is a member of the PIMS team. The demo was first posted on the Pims World Labs weblog. View the demo in Firefox 3.5. Content Aware Image Resizing is a way to re-target an image size without modifying its content ratio, in other words : non-linear image […]
-
audio player – HTML5 style
Last week we featured a demo from Alistair MacDonald (@F1LT3R) where he showed how to animate SVG with Canvas and a bunch of free tools. This week he has another demo for us that shows how you can use the new audio element in Firefox 3.5 with some canvas and JS to build a nice-looking […]
-
connecting html5 video to the web
This is a screencast of a demo that I gave at the open video conference in NYC on June 19th, 2009. The demo itself was created by the ever wonderful Paul Rouget. Download .ogv or .mp4 version. A version hosted on blip.tv.
-
animating SVG with canvas and burst
Today’s demo is short, but it also includes a long screencast that describes how it’s put together. The demo’s author, Alistair MacDonald (@F1LT3R), is one of the maintainers of Processing.js and the Burst engine, which is the basis for today’s demo and tutorial. If you haven’t clicked through to his site, I strongly suggest that […]
-
pushing pixels with canvas
This post was written by Paul Rouget, who is a member of the Mozilla Evangelism team. Paul lives in Paris, France and is well known for some of his amazing work with open video on the web among other things. Canvas, at its most simple level, is an easy way to draw bitmap data into […]