Category: Prototype


Thomas Fuchs just pushed out the alpha 5 release of scripty2. This is the first release to include the small handful of UI controls I’ve been writing. The controls are designed to be compatible with jQuery UI’s Theme API — meaning that, for instance, a theme built with ThemeRoller could be dropped into a site using scripty2, and vice‐versa. More to come!

The “Configurable” pattern

Posted in Articles, Prototype

If you don’t know about Raphaël, you’d better ask somebody. It provides a vector drawing API that works in all major browsers (by abstracting between SVG and VML). I’ve been working on a JavaScript charting library called Krang. Krang is designed to take a data set and produce any chart

Read more →

Panel audio from The Ajax Experience

Posted in Prototype

I just discovered the existence of audio (and slides) for two of the sessions I was involved with at The Ajax Experience 2008, held in Boston last September. Which is to say: I knew that audio existed, but didn’t know it was yet available anywhere. The first was PPK’s main‐hall

Read more →

Dean Edwards explains how the standard “callback” pattern in JavaScript is too brittle for something like a “DOM ready” event. Prototype appears to be the one major library that handles this “correctly.” WIN!


Auto-format Tweets

Used on my “About” page.

(function() {  
  var USERNAMES = /@([A-Za-z0-9_]*)\b/;
  var URLS      = /https?:\/\/([-\w\.]+)+(:\d+)?(\/([\w\/_\.]*(\?\S+)?)?)?/;
  function getInnerText(element) {
    element = $(element);
    return element.innerText && !window.opera ? element.innerText :
     element.innerHTML.stripScripts().unescapeHTML().replace(/[\n\r\s]+/g, ' ');
  function linkifyTweet(li) {
    var html = li.innerHTML, text = getInnerText(li);

    text.scan(URLS, function(match) {
      html = html.sub(match[0], '<a href="#{0}">#{0}');
    html = html.gsub(USERNAMES, '<a href="{1}/">#{0}');
  function init() {
    $('twitter').select('li > span.tweet').each(linkifyTweet);

  document.observe('dom:loaded', init);  

Pseudo-custom events in Prototype 1.6

Posted in Articles, Prototype

I’m calling these pseudo‐custom events because they serve the same purpose as standard browser events: they report on certain occurrences in the UI. Here we’re using custom events to act as uniform façades to inconsistently‐implemented events. Together we’ll write some code to generate mouse:wheel events. At the end of this article, you’ll know enough to be able to write code to generate mouse:enter and mouse:leave events document‐wide.

Read more →