Amiga pinball wizard.
To view the emulator, which was written by developer Rupert Hausberger, you’ll need a browser with support for WebGL and WebAudio, as well as a few other HTML5 APIs. I tested the emulator in the latest version of both Chrome and Firefox and it worked just fine.
If you’d like to see the code behind the Scripted Amiga Emulator, head on over to GitHub.
Happy Friday afternoon time wasting.
This post with tweetable sentences highlighted by Save Publishing. Image: Screenshot/Webmonkey
Save Publishing is a bookmarklet that highlights any tweetable sentences on a given page. You can grab it from SavePublishing.com or head over to GitHub if you’d like to see the source (Save Publishing is written in CoffeeScript).
The bookmarklet is the work of former Harper’s editor Paul Ford, perhaps better known as @ftrain. Ford says the project started as a joke, but “now it’s serious and I use it all day.”
I expected the novelty to wear off quickly after I used it a few times, but now it’s been a few days and I still find myself using it. Sometimes the faintly ridiculous manages to become useful. What would make Save Publishing more useful is a way to use it within Twitter clients like Tweetbot, but thus far that’s not possible.
WT Monkey is in your photobooth.js, changin’ hues. Image: Screenshot/Webmonkey
The latest WebRTC hotness to catch our eye is developer Wolfram Hempel’s Photobooth.js, a JavaScript library for working with a device’s camera. Photobooth.js allows users to take pictures directly on your website, for example, to add an avatar. It also acts a bit like the OS X Photobooth app, offering real-time adjustments for hue, saturation and brightness (one word of warning, hue can really slow down Firefox).
Want to add a Photobooth-style camera app to your site? Just download Photobooth.js and add this code to your page:
myPhotobooth = new Photobooth( document.getElementById( "container" ) );
That’s it. Of course there’s a little more to do if you actually want to do something with your newly instantiated Photobooth — like capture images or resize and save them. But Photobooth.js makes the whole process pretty simple; see the documentation for more details.
Photobooth.js works in current versions of Chrome, Firefox, Opera, and any other browser that supports the WebRTC getUserMedia method. You can see a complete list of browsers that support getUserMedia over on caniuse.
Hempel’s code is available on GitHub (BSD license) and can be used as a standalone app or a JQuery plugin.
The holidays are here and for web nerds that means only one thing — another wave of advent tutorials is hitting the web.
It doesn’t feel much like winter right now at the Webmonkey lair, but that’s okay because we mark the start of the holiday season by the launch of 24Ways, the grand poobah of advent calendars for web nerds. 24Ways has been an annual tradition since 2005, offering 24 articles packed with new tips and tricks showcasing some of the year’s best new ideas in web development.
This year’s 24Ways kicked off with a tutorial on HTML5 Video “Bumpers” by 24Ways founder Drew McLellan. Other articles thus far include how to start a project on the right foot, how to contribute code to the community and Geri Coady’s excellent article on Color Accessibility.
While 24Ways may be the biggest name in advent tutorials, it’s not lacking for competition these days. We also recommend the Performance Calendar, which tackles the often confusing world of website optimization. There’s also Digitpaint’s advent calendar which we enjoyed last year and has already published some nice articles this year, including this look at CSS filters.
If you’re missing another favorite, the PHP Advent Calendar, fear not, it has returned, but with a new name and domain: PHP Advent is now Web Advent. The name may have changed, but Web Advent offers similarly great content, like this article on Sharing What You Know by Heather Payne, the founder of Ladies Learning Code.
Mozilla is making good on its promise to take its fledgling Social API beyond the simple Facebook integration it showcased for the launch of Firefox 17. In fact, the company’s newest Social API demo removes the need for social websites entirely, tapping emerging web standards to create a real-time video calling, data sharing app — one part Skype, one part Facebook, all parts web-native.
The direct peer-to-peer video calls and file sharing features come from WebRTC, a proposed web standard that Mozilla and others are working on in conjunction with the W3C. The RTC in WebRTC stands for Real-Time Communications, and the core of WebRTC is the getUserMedia JavaScript API, which gives the browser access to hardware features like the camera and microphone.
Much of the enthusiasm around WebRTC comes from the fact that it enables web apps to do many of the same things that, without WebRTC support, require platform-native APIs. WebRTC will help developers build web apps that can compete with native apps, but it has other tricks up its sleeve — like a whole new way to connect with your friends on the web.
“While many of us are excited about WebRTC because it will enable several cool gaming applications and improve the performance and availability of video conferencing apps, WebRTC is proving to be a great tool for social apps,” writes Mozilla’s Maire Reavy on the Mozilla blog.
Reavy goes on to paint a picture of seamless social sharing through WebRTC and Mozilla’s Social API:
Sometimes when you’re chatting with a friend, you just want to click on their name and see and talk with them in real-time. Imagine being able to do that without any glitches or hassles, and then while talking with them, easily share almost anything on your computer or device: vacation photos, memorable videos — or even just a link to a news story you thought they might be interested in — simply by dragging the item into your video chat window.
Mozilla’s Social API-WebRTC mashup goes beyond previous demos, using a new WebRTC feature, one which Firefox is the first to support, DataChannels. DataChannels offer a way to send data from one WebRTC-enabled browser to another. DataChannels can send pretty much any data the browser can access, be it images, videos, webpages or local files.
For more details on how the DataChannel API works, check out this earlier post on the Mozilla Hacks blog. If you’d like to see exactly what’s happening behind the scenes of Mozilla’s Social API-WebRTC demo, the code is available on GitHub.
Browse Our Tutorials
HTML, JavaScript, design and more
Cheat Sheets
HTML, CSS and special characters 
Color Charts
Brighten up your pages
Cut & Paste Code
Templates and snippets you can steal 
Recent Tweets