/*  
 * Rating star using Mootools.  
 *   
 * Modified from Dynamic Rating stars @copyright 2006 Beau D. Scott  
 * http://beauscott.com  
 *  
 * Note:valueBox must use continuous integers.If not, there could be some bugs.  
 * messageBox and valueBox keys must begin from zero.  
 */  
mooRating = new Class( {   
    
    initialize : function(options) {   
    
        this.options = $extend( {   
            bindField : null,   
            maxRating : 10,   
            container : null,   
            imageDirectory : "/images/rating/",   
            callback : null,   
            actionURL : null,   
            value : 0,   
            locked : false,   
            useOpacityStyle : true,   
            messageBox : $H( {   
                0 : "DIE!!!",   
                1 : "Worthless",   
                2 : "This is terrible",   
                3 : "Hrmmm",   
                4 : "I've seen better",
                5 : "Not bad",   
                6 : "Good stuff",   
                7 : "This is pretty good",   
                8 : "Wow, I'm impressed",   
                9 : "Awesome!"
            }),   
            valueBox : $H( {   
                0 : 1,   
                1 : 2,   
                2 : 3,   
                3 : 4,   
                4 : 5,  
                5 : 6,   
                6 : 7,   
                7 : 8,   
                8 : 9,   
                9 : 10  
            })   
        }, options || {});   

        /**  
         * hover and empty ratings imageSrc.  
         */  
        this.hoverImages = {   
            EMPTY : this.options.imageDirectory + "empty.gif",   
            HALF : this.options.imageDirectory + "hover-half.gif",   
            FULL : this.options.imageDirectory + "hover.gif"  
        };   
    
        /**  
         * preload images  
         */  
        for (var x in this.hoverImages) {   
            var y = document.createElement("img");   
            y.src = this.hoverImages[x];   
        }   
    
        /**  
         * selected and empty ratings imageSrc.  
         */  
        this.selectedImages = {   
            EMPTY : this.options.imageDirectory + "empty.gif",   
            HALF : this.options.imageDirectory + "selected-half.gif",   
            FULL : this.options.imageDirectory + "selected.gif"  
        };   
        /**  
         * preload images  
         */  
        for (var x in this.selectedImages) {   
            var y = document.createElement("img");   
            y.src = this.selectedImages[x];   
        }   
    
        if ($defined(this.options.container)) {   
            this.container = $(this.options.container);   
        } else {   
            this.id = "ratecontainer" + Math.random(0, 10000);   
            document.write('<span id="' + this.id + '"></span>');   
            this.container = $(this.id);   
        }   
    
        this.initialized = false;   
        this.rated = false;   
        this.ratings = [];   
        this.value = -1;   
        this.locked = this.options.locked ? true : false;   
        this.useOpacityStyle = this.options.useOpacityStyle ? true : false;   
    
        this.display();   
        this.setValue(this.options.value);   
        this.initialized = true;   
    },   

    display : function() {   
        for (var i = 0;i < this.options.maxRating; i++) {   
            var rating = new Element('img');   
            rating.src = this.locked   
                    ? this.selectedImages.EMPTY   
                    : this.hoverImages.EMPTY;   
            rating.style.cursor = "pointer";   
            rating.title = this.options.messageBox.get(i);   
            if (!this.locked) {   
                rating.addEvent("mouseover", this.hover.bind(this));   
                rating.addEvent("click", this.rate.bind(this));   
                rating.addEvent("mouseout", this.clear.bind(this));   
            }   
            this.ratings.push(rating);   
            this.container.appendChild(rating);   
        }   
    },   
    
    setValue : function(val) {   
        if (this.locked && this.initialized)   
            return;   

        var rem = val % 1;
        var add = 0;
        if (rem > 0) {
            add = .5
        }
        
        val = Math.floor(val) -1 + add;
        this.value = val;
        
        if (this.options.bindField) {   
            $(this.options.bindField).value = val;   
        }   
       
        if (this.initialized) {   
            if (this.options.actionURL) {   
                // ajax submit.   
                new Ajax(this.options.actionURL + (val + 1), {   
                    method : "get",   
                    onComplete : this.options["callback"]   
                }).request();   
            } else if (this.options.callback) {   
                this.options["callback"](val);   
            }   
        }   
        this.clear();   
    },   
    
    hover : function(ev) {   
        if (this.locked)   
            return;   
        var rating = new Event(ev).target;   
        var greater = false;   
    
        this.ratings.each(function(el) {   
            el.src = greater ? this.hoverImages.EMPTY : this.hoverImages.FULL;   
            if (rating == el) {   
                greater = true;   
                // TODO use opacity style, maybe more beautiful styles should be   
                // added.   
                if (this.useOpacityStyle) {   
                    var fx = new Fx.Style(el, "opacity", {   
                        duration : 500,   
                        wait : false  
                    });   
                    fx.start(.5, 1);   
                }   
            }   
        }, this);   
    },   
    
    rate : function(ev) {   
        if (this.locked)   
            return;   
        var rating = new Event(ev).target;   
        this.rated = true;   
    
        this.ratings.some(function(el, i) {   
            if (el == rating) {   
                this.setValue(this.options.valueBox.get(i));   
                return true;   
            }   
        }, this);   
    },   
    
    clear : function(ev) {   
        if (this.locked && this.initialized)   
            return;   
        var greater = false;   
        this.ratings.each(function(el, i) {   
            if (i > this.value)   
                greater = true;   
            if ((this.initialized && this.rated) || this.value == -1)   
                el.src = greater ? (this.value + .5 == i)   
                        ? this.hoverImages.HALF   
                        : this.hoverImages.EMPTY : this.hoverImages.FULL;   
            else  
                this.ratings[i].src = greater ? (this.value + .5 == i)   
                        ? this.selectedImages.HALF   
                        : this.selectedImages.EMPTY : this.selectedImages.FULL;   
        }, this)   
    }   
});