Tooltip effect using Script.aculo.us

Nick Stakenburg has written a nice simple tooltip built on Script.aculo.us called Effect.Tooltip

Cool and very simple to use

Prototype Library that helps store JSON data in cookies

Lalit Patel wrote JavaScript Library that helps to use JSON to store data in cookies.
The nice library is built on top of Prototype and gives you a simple API to put and get JSON values into cookies.

Full information and download:
Yummy JSON Cookies (using Prototype)

Code Example:
var jar = new CookieJar({
expires:3600, // seconds
path: '/'
});

var dog = {name: 'Jacky', breed: 'Alsatian', age:5};

jar.put('mydog', dog);
mydog = jar.get('mydog');

alert("My dog's name is " + mydog.name);
alert("He is " + mydog.age + " years old");
alert("He is an " + mydog.breed);

Enjoy :-)

Compressed versions of Prototype

John-David Dalton Compressed some prototype version like:
1.4, 1.5rc0, 1.5rc1, 1.5 final.
His package can be download from:
Compressed prototype

He managed to get it down to 14.4kb.

moo.fx javascript effects library for prototype.js or mootools framework.

moo.fx is a superlightweight, ultratiny, megasmall javascript effects library, to be used with prototype.js or the mootools framework.
It's very easy to use, blazing fast, cross-browser, standards compliant, provides controls to modify any CSS property of any HTML element, including colors, with builtin checks that won't let a user break the effect with multiple, crazy clicks. Optimized to make you write the lesser code possible, the new moo.fx is so modular you can create any kind of effect with it.

more information on moo.fx:
http://moofx.mad4milk.net/

Prototype Event Extension: Event.wheel(e)

Frank Monnerjahn created a Prototype Event extension which makes it trivial to use the mouse wheel in Prototype with Event.observe(..).
The demo shows this in action.
The Code:

/*
* Orginal: http://adomas.org/javascript-mouse-wheel/
* prototype extension by "Frank Monnerjahn" themonnie @gmail.com
*/

extend(Event, {

wheel:function (event){

var delta = 0;

if (!event) event = window.event;

if (event.wheelDelta) {

delta = event.wheelDelta/120;

if (window.opera) delta = -delta;

} else if (event.detail) { delta = -event.detail/3; }

return Math.round(delta); //Safari Round

}

});

/*

* end of extension

*/

var counterSite=0;

function handleSite(e) {

counterSite += Event.wheel(e);

$('delta').innerHTML = counterSite +'#'+ Event.wheel(e) + ": " + (Event.wheel(e) <0 ? 'down' : 'up' );

}

var counterDIV=0;

function handleDIV(e) {

counterDIV += Event.wheel(e);

$('divdelta').innerHTML = counterDIV +'#'+ Event.wheel(e) + ": " + (Event.wheel(e) <0 ? 'down' : 'up' );

}

Usage:
Event.observe(document, "mousewheel", handleSite, false);

Event.observe(document, "DOMMouseScroll", handleSite, false); // Firefox

Event.observe($('divdelta'), "mousewheel", handleDIV, false);

Event.observe($('divdelta'), "DOMMouseScroll", handleDIV, false); // Firefox

Developer Notes for prototype.js

Hi,
Here is a great link that have full explanation on prototype.js, can used as Developer Notes.
http://www.sergiopereira.com/articles/prototype.js.html

JavaScript AJAX framework prototype dissected

Detail every method and property that was available on prototype AJAX framwork:
http://snook.ca/archives/javascript/prototype_disse/

JavaScript actsAsAspect

The idea is that you run actsAsAspect() on any JavaScript object,
and then your object receives 3 extra methods:

1. before()
2. after()
3. around()

You then can use those methods to setup the callbacks you need.

The Code:
function actsAsAspect(object) {
object.yield = null;
object.rv = { };
object.before = function(method, f)
{
var original = eval("this." + method);
this[method] = function()
{
this.rv[method] = f.apply(this, arguments);
if (this.rv[method] == false)
return false;
return original.apply(this, arguments);
};
};
object.after = function(method, f)
{
var original = eval("this." + method);
this[method] = function()
{
this.rv[method] = original.apply(this, arguments);
return f.apply(this, arguments);
}
};
object.around = function(method, f)
{
var original = eval("this." + method);
this[method] = function() {
this.yield = original;
return f.apply(this, arguments);
}
};
}

Example: Applying actsAsAspect() to window

actsAsAspect(window);
function haha() { return "HA Ha ha ha..."; }
after('haha', function() { alert(this.rv['haha']); });
haha();


Full information can be found:

http://beppu.lbox.org/articles/2006/09/06/actsasaspect