//
//  mooditions
//
//  A bunch of additions to the mootools javascript framework
//  Created Marca Tatem on 2007-02-07.
//  Copyright 2007 Marca Tatem. All rights reserved.
//

//
//  Standard Effects
//

Element.extend(
{
    blindDown: function( options )
    {
        // get current values
        var div = this ; div.show() ; var h = div.getStyle('height').split('p')[0] ;
        // initialize object
        div.setStyle( 'height', '0' ) ; div.setStyle( 'overflow', 'hidden' ) ;
        // grow the object
        div.effect( 'height', options ).start( 0, h ) ;
    },

    blindUp: function( options )
    {
        // get current values
        var div = this ; var h = div.getStyle('height').split('p')[0] ;
        // initialize object
        div.setStyle( 'overflow', 'hidden' ) ;
        // add on complete event
        if( options == null ){ options = new Object() }
        Object.extend( options, { onInternalCompletion: function(){
            div.setStyle( 'overflow', 'unchanged' ) ; div.hide() ; div.setStyle( 'height', h + 'px' ) ;
        } }) ;
        // fold the object
        div.effect( 'height', options ).start( h, 0 ) ;
    },

    fade: function( options )
    {
        // get current values
        var div = this ; div.show() ;
        // add on complete event
        if( options == null ){ options = new Object() }
        Object.extend( options, { onInternalCompletion: function(){
            div.hide() ;
        } }) ;
        // fade the object
        div.effect( 'opacity', options ).start( 1, 0 ) ;
    },

    appear: function( options )
    {
        // get current values
        var div = this ; div.show() ; this.style.visibility = 'hidden' ;
        // add on complete event
        if( options == null ){ options = new Object() }
        Object.extend( options, { onInternalCompletion: function(){
            div.show() ;
        } }) ;
        // fade the object
        div.effect( 'opacity', options ).start( 0, 1 ) ;
    },

    show: function()
    {
        this.style.display = '' ;
    },

    hide: function()
    {
        this.style.display = 'none' ;
    },

    highlight: function( options )
    {
        // create the options hash if unavailable
        if( options == null ){ options = new Object() }
        if( options.endcolor == null ){ options.endcolor = new Color( '#ffff99' ) }else{ options.endcolor = new Color( options.endcolor ) }
        if( options.startcolor == null ){ options.startcolor = new Color( '#ffffff' ) }else{ options.startcolor = new Color( options.startcolor ) }
        if( options.duration == null ){ options.duration = 1000 }
        options.transition = Fx.Transitions.quadIn ;
        this.setStyle( 'background-color', options.endcolor ) ;
        new Fx.Style( this, 'background-color', options ).start( options.endcolor, options.startcolor );
    },

    slide_to: function( v, options )
    {
        this.setStyle('width','10000px');
        p = this.getStyle('margin-left').split('p')[0] ; d = Math.abs( v - Math.abs( p ) )
        if( options == null ){ options = new Object() }
        options.duration = d ;
        new Fx.Style( this, 'margin-left', options ).start( this.getStyle('margin-left') , -v );
    },

    is_visible: function()
    {
        return this.style.display != 'none' ;
    }

});

//
//  General Function
//

function $F(id)
{
    return $(id).value ;
}

//
//  Implementation (overiding existing classes)
//

Fx.Base.implement(
{
    step: function(){
        var time = new Date().getTime();
        if (time < this.time + this.options.duration){
            this.cTime = time - this.time;
            this.setNow();
            this.increase();
        } else {
            this.stop(true);
            this.now = this.to;
            this.increase();
            this.fireEvent('onInternalCompletion', this.element, 10);
            this.fireEvent('onComplete', this.element, 10);
            this.callChain();
        }
    }
}
);

//
//  Observer
//

var Observer = new Class({
    initialize: function(el, fn, options){
        this.options = Object.extend({
                event: 'keyup',
                delay: 1000
        }, options || {});
        this.element = $(el);
        this.callback = fn;
        this.timeout = null;
        this.listener = this.fired.bind(this);
        this.value = this.element.value;
        this.element.addEvent(this.options.event, this.listener);
    },
    fired: function() {
        this.clear();
        if (this.value == this.element.value) return;
        this.value = this.element.value;
        this.timeout = this.callback.delay(this.options.delay, null, [this.element]);
    },
    clear: function() {
        this.timeout = $clear(this.timeout);
    },
    stop: function() {
        this.element.removeEvent(this.options.event, this.listener);
        this.clear();
    }
});