//-------------------------------------------------------------------------------------
//	JibberBook v2.1
//	(c) 2008 Chris Jaure
//	license: MIT License
//	website: http://www.jibberbook.com/
//
//	inc/jbscript.js
//-------------------------------------------------------------------------------------

Element.extend({
    injectHTML: function(content, where){
        new Element('div').setHTML(content).getChildren().inject(this, where);
        return this;
    }
});

var Guestbook = {

    // object variables
    obj: {},
    fx: {},
    mouseDown: false,
    offset: 2,
    
    /*
     Function: submitForm
     
     Captures form submission event and uses ajaxReq instead.
     It also sets the form value _ajax to true, enabling the server-side script to differentiate regular submissions from ajax submissions.
    */
    submitForm: function(event){
        this.loading();
        this.obj.form.elements['_ajax'].value = true;
        this.ajaxReq.send(this.obj.form.getProperty('action'), this.obj.form.toQueryString());
        event.stop();
    },
    
    /*
     Function: processAddResponse
     
     Attached to onComplete event of ajaxReq. Expects JSON object to be returned from the server with 'value', 'content', and 'message' properties.
     
     value:
     1 indicates successful addition of comment
     2 indicates comment flagged as spam
     >=3 indicates validation error
     content: contains comment html if value == 1
     message: contains descriptive text associated with response
    */
    processAddResponse: function(){
        var response = Json.evaluate.attempt(this.ajaxReq.response.text);
        if (response) {
            if (response.value != '1') {
                this.showMessage(response.message, 'error');
                if (response.value == '2') 
                    this.obj.form.reset();
            }
            else {
                this.obj.commentWrapper.injectHTML(response.content, 'top');
                var new_comment = this.obj.commentWrapper.getFirst();
                if (this.obj.scroller == window) {
                    this.fx.scroll.toElement(this.obj.commentWrapper).chain(function(){
                        this.showMessage(response.message, 'confirm');
                    }.bind(this));
                }
                else {
                    this.fx.scroll.toTop();
                    this.showMessage(response.message, 'confirm');
                }
                this.obj.form.reset();
            }
        }
        else 
            this.showMessage(this.text.SERVER_ERROR, 'error');
        this.loaded();
    },
    
    /*
     Function: processLoadComments
     
     Attached to onComplete event of loadComments. Expects JSON object to be returned from the server with 'value' and 'content' properties.
     
     value:
     0 indicates no additional comments to load
     content: contains comment html
    */
    processLoadComments: function(){
        var response = Json.evaluate(this.loadComments.response.text);
        if (response.value == '0') {
            this.obj.scroller.removeEvents();
            this.obj.loadingMessage.setText(this.text.COMMENTS_LOADED);
        }
        this.obj.loadingMessage.injectHTML(response.content, 'before');
    },
    
    /*
     Function: loading
     
     Used to indicate ajax activity.
    */
    loading: function(){
        this.obj.submitButton.setProperties({
            'disabled': true,
            'value': this.text.LOADING
        });
    },
    
    /*
     Function: loaded
     
     Reverses actions of loading().
    */
    loaded: function(){
        this.obj.submitButton.setProperties({
            'disabled': false,
            'value': this.obj.submitButton.orgVal
        });
    },
    
    /*
     Function: show
     
     Attached to obj.scroller scroll event. Determines when to load additional comments.
    */
    show: function(){
        if (!this.mouseDown) {
            var dimensions = this.obj.scroller.getSize();
            var offset = (this.obj.scroller == window) ? 0 : this.obj.scroller.getTop();
            if (this.obj.loadingMessage.getTop() - offset < dimensions.scroll.y + dimensions.size.y) {
                if (!this.loadComments.running) {
                    this.loadComments.send('actions/loadcomments.php', 'offset=' + this.offset);
                    this.offset++;
                }
            }
        }
    },
    
    /*
     Function: showMessage
     
     Shows a message based on text and type.
     
     Parameters:
     text - Message text to show.
     type - Class to be applied to message container (overwrites all previous classes).
     
    */
    showMessage: function(text, type){
        this.obj.messageWrapper.setStyles({
            'left': (window.getWidth() / 2 - 150),
            'top': window.getScrollTop() + 30,
            'opacity': 0
        });
        this.obj.messageWrapper.className = type;
        this.obj.messageWrapper.getFirst().setText(text);
        this.fx.message.start(0.9);
    },
    
    /*
     Function: initialize
     
     This method must be called to start the script and enable ajax functionality.
     
     Parameters:
     form - id of the form
     comments - id of comments wrapper
     message - id of the message wrapper
    */
    initialize: function(form, comments, message, loading, text){
    
        // set objects
        this.obj.form = $(form);
        this.obj.commentWrapper = $(comments);
        this.obj.comments = this.obj.commentWrapper.getChildren();
        this.obj.messageWrapper = $(message);
        this.obj.submitButton = this.obj.form.getElement('input[type=submit]');
        this.obj.submitButton.orgVal = this.obj.submitButton.value;
        this.obj.loadingMessage = $(loading);
        this.text = text;
        var parent = this.obj.commentWrapper;
        while (parent) {
            if (parent.getTag() == 'body') {
                this.obj.scroller = window;
                parent = null;
                break;
            }
            var overflow = parent.getStyle('overflow');
            if (overflow == 'auto' || overflow == 'scroll') {
                this.obj.scroller = parent;
                parent = null;
            }
            else {
                parent = parent.getParent();
            }
        }
        
        // set effects
        this.fx.message = new Fx.Style(this.obj.messageWrapper, 'opacity');
        this.fx.scroll = new Fx.Scroll(this.obj.scroller, {
            'duration': 1000,
            'transition': Fx.Transitions.Circ.easeInOut
        });
        
        // set hxr objects 
        this.loadComments = new XHR({
            method: 'get',
            'onSuccess': this.processLoadComments.bind(this)
        });
        this.ajaxReq = new XHR({
            method: 'post',
            'onSuccess': this.processAddResponse.bind(this),
            'onFailure': function(){
                this.showMessage(this.text.ERROR, 'error');
                this.loaded();
            }.bind(this)
        });
        
        // attach events
        this.obj.messageWrapper.addEvent('mouseover', function(){
            this.fx.message.start(0);
        }.bind(this));
        if (this.obj.loadingMessage) {
            this.obj.loadingMessage.setText(this.text.COMMENTS_LOADING);
            this.obj.scroller.addEvents({
                'scroll': this.show.bind(this),
                'mousedown': function(){
                    this.mouseDown = true;
                }.bind(this),
                'mouseup': function(){
                    this.mouseDown = false;
                    this.show();
                }.bind(this)
            });
        }
        this.obj.form.addEvent('submit', this.submitForm.bindWithEvent(this));
        
        // misc
        if (window.ie6) {
            this.obj.messageWrapper.setStyle('zoom', 1);  // fix background issue in ie6
        }
    }
};