ProtoFish is an advanced hover menu based on Prototype, written by Peter Slagter. You can easily add a delay to your menu (on mouseout) and choose your own hover class. All ProtoFish menu's will respond to users who use the TAB-key to navigate through your page.
It is trivial to use. Once you load up the script (requires Prototype 1.6+) you can:
Andrew has posted on Prototype 1.6.1 RC 2, a new release that "is fully compatible — and fully optimized for — Internet Explorer 8’s “super-standards” mode. In particular, Prototype now takes advantage of IE8’s support of the Selectors API and its ability to extend the prototypes of DOM elements."
New Features
Full compatibility with Internet Explorer 8. Juriy has spearheaded the effort to replace most of our IE “sniffs” into outright capability checks — making it far easier to support IE8 in both “super-standards” mode and compatibility mode.
Element storage, a feature announced previously. Safely associate complex metadata with individual elements.
mouseenter and mouseleave events — simulating the IE-proprietary events that tend to be far more useful than mouseover and mouseout.
An Element#clone method for cloning DOM nodes in a way that lets you perform “cleanup” on the new copies.
What’s been improved?
Better housekeeping on event handlers in order to prevent memory leaks.
Better performance in Function#bind, Element#down, and a number of other often-used methods.
A number of bug fixes.
In addition to the code itself, the 1.6.1 release features Prototype’s embrace of two other excellent projects we’ve been working on: Sprockets (JavaScript concatenation) and PDoc (inline documentation). Sprockets is now used to “build” Prototype into a single file for distribution. PDoc will be the way we document the framework from now on.
Just a few days ago they announced Mamoo, short for "Motionbox Advanced Model Observer Observer". In a nutshell, Mamoo builds on the foundation of observing events in a browser to provide a higher-level abstraction based on the same concept.
You create a model that contains your data, a controller to observe the model for changes, and the controller updates a view that updates the DOM with changes. Here's a code sample of the model and controller pieces:
The team at Nextpoint has released the open source project Growl4Rails, a component providing Growl-like functionality in Rails web applications.
Nextpoint's e-discovery product deals with many very large documents. Indexing, imaging and PDF-ing of those documents can take a bit of time, which requires us to execute these tasks asynchronously. Background processing demands a solid way of notifying users when that process has completed. We're a Mac shop, and one of the first things most Mac users install is Growl. We thought that Growl's interface could really be successful on the web and provide a great way of notifying our users when this background processing has completed.
Growl4Rails is available as a Rails plugin on Github. It requires Prototype 1.6 and Scriptaculous 1.7, and it has been tested on FF, IE 6-8, Safari, Opera and Chrome.
Andrew Dupont has done what the threatened to do and created part one of series critiquing Prototype code.
The first installment has him taking a version of Element.Storage by Sébastien Grosjean and tweaking it out. Andrew discusses Prototype style issues, naming, feature design, fun common things such as:
An often occuring UI pattern is “use the value of a textfield as hint what to input”. These fields all auto-clear when the user first focuses it (by clicking or tabbing it), and if nothing it entered, the hint will be shown once again once the user leaves it.
Because we decided to go this path for the “Quick entry” box we’re using for freckle time tracking, I dug out an older script I wrote and refreshed it a bit, and I present you defaultValueActsAsHint.
This is all there’s to it, and the file to include is merely 18 lines of code. It works with textareas, too. Just specify whatever should be displayed as hint in the value attribute of the input (or as text within the textarea tag) and off you go. Define a ‘hint’ style if you like to show the text in gray, italics or whatever you fancy.
Thomas Fuchs and Amy Hoy are back with another web site, this time Freckle, a new take on time tracking.
Thomas posted about it on his site and shared that it uses an early build of scripty2 which lead me to peak around on GitHub. It looks nice indeed.
You can see the evidence of Script.aculo.us throughout the UI. The calendar morphs between months as you flip around. Jumping between headers rolls around nicely (e.g. reporting mode from insertion). Inline modal popups. Nicely done.
Voting has started in Dojo land to take in John Resig's Sizzle next-gem CSS selector engine.
This is incredibly exciting, as it shows how Ajax libraries are working together more and more. Instead of reinventing the wheel in different ways for each project, is it possible to find some core pieces that can be nicely shared? Of course, if our world was nicer and we could share code by linking in a nice way maybe this would happen more.
As I mentioned in my thanksgiving note, the work that the Ajax library developers do is hugely important and impactful, and having them work together can only be great news.
Take a look at this public email to the Dojo Foundation on the vote:
Overview
The Sizzle project is a JavaScript library for performing selections
across a DOM tree using CSS selectors. The library is designed to be
standalone (have no external dependencies), lightweight, fast, and
extensible. This culminates in a library that is perfectly suited for
integration into other libraries. While it's feasible that a developer
may use Sizzle directly the target audience for it is other library
authors.
All of the code for the project has been written by John Resig and is
released under an MIT license. There are some patches pending from
some other contributors (namely Prototype).
Right now the following libraries are adopting or are looking to adopt
Sizzle as their primary CSS selector engine:
It's likely that Sizzle will become the unified engine behind a
majority of the JavaScript libraries on the market (if not in numbers
then certainly in market share).
The project is owned by John Resig who will serve as BDFL/Project lead
if the project is accepted. There is no formal voting process, as of
yet, but it's likely that one will come about, considering the number of
projects using the codebase.
If the project is accepted to the foundation then all contributors to
the project will be required to have a CLA and follow the policies of
the Dojo foundation.
It's very likely that Sizzle will eventually expand into other areas
of JavaScript libraries (such as DOM manipulation and event binding).
That last line excites me too! It is interesting to see this happen in the Dojo Foundation. Remember, Dojo was founded out of toolkits coming together to aggregate forces. Kudos to everyone involved, and good luck!
Just a short one, Prototype has a new point release that is a drop in replacement for your 1.6.* code:
Yesterday we released Prototype 1.6.0.3, the result of some much-needed bug fixes, and a stopgap release on the road to 1.6.1.
It’s a backwards-compatible, drop-in replacement recommended for all users of Prototype 1.6. We’ve fixed 30 bugs and made 25 other improvements to our already-rock-solid library.
Developers who follow along in Git might’ve noticed that the repository has seen a lot of disruptive activity in the last few days as we reassessed many of the commits that had gone into the library since April. Rather than try to fit too many fixes into one release, we decided to scale back and release 1.6.0.3 with the set of improvements we were in complete agreement on.
We also updated the Google CDN so you can use Google to host your file via: http://ajax.googleapis.com/ajax/libs/prototype/1.6.0.3/prototype.js. We have also aliased "1.6", and "1.6.0" to this latest release, so if you are using that version, you automatically have the latest.
We talked a few months ago about something new we're doing at the Ajax Experience this year: the "Framework Summit." Basically, we're providing space for Prototype, jQuery, and Dojo to hold their own half-day events on-site, and these events are free and open to the general public.
- State of jQuery (Rey Bango)
- Progressively Enhancing the User Experience Using jQuery (Karl Swedberg)
- An In-Depth Look at jQuery UI (Paul Bakaus)
- jQuery Team Code Review (jQuery Team)
Other Frameworks?
Some have asked why we didn't also include Framework X, Y, and Z at the summit. We have a simple answer: we only had room for three frameworks so we choose the three most popular frameworks (according to every survey we've seen). If the concept is successful this time around, we hope to do it on a bigger scale next year.
Obviously we hope you can make it to the entire Ajax Experience event, but if you can't do that, consider coming to one of the Framework Summit events. See you there!
Tripeedo is a new little site that uses Prototype to power a command line for travel. You just type in where you want to go and when, and it will launch you into a search. I really enjoy the command line interfaces, and much prefer them to the long forms that travel sites put up for you. The calendar components normally always suck.
Tripeedo is a showcase of the wundrbar that has been customized for the world of travel.
Instead of popping up the book, music, dvd information quickly we are required to watch the talent of the developer to sloooowly animate the box into place. Come on folks, we can do better than this!
There is no need to see utility objects like this animate into place.
Here is the general rule. Try your feature without animation. Is the meaning clear? If so then don't add ANY animation. If it is not, try adding a quick animation. Did that get it? Then stop there.
Save animation for when you need it. Animation is good for at least seven reasons:
Maintain context while changing views. Carousels are a good example of this. The scroll animation helps the user maintain context as they move through information.
Explain what just happened. The Apple store Customize your Mac uses this to highlight price changes while configuring a Mac for purchase.
Show relationships between objects. The Mac Genie effect when closing or opening windows. It is fast enough and it ties the iconified window to the dock.
Focus attention. Backpackit's Spotlight technique focuses attention on the change that happened.
, Prototype
