/*
 * Element extension
 */

Element.implement({

	disable: function(){
		this.disabled = true;
		this.addClass('disabled');
		return this;
	},

	enable: function(){
		this.disabled = false;
		this.removeClass('disabled');
		return this;
	},

	toggleEnable: function(){
		this.disabled ? this.enable() : this.disable();
	},

	hide: function(){
		this.isHidden = true;
		this.setStyle('display', 'none');
		return this;
	},

	show: function(){
		this.isHidden = false;
		this.setStyle('display', '');
		return this;
	},

	visible: function(){
		this.isVisible = true;
		this.setStyle('visibility', 'visible');
		return this;
	},

	invisible: function(){
		this.isHidden = false;
		this.setStyle('visibility', 'hidden');
		return this;
	},

	toggleShow: function(){
		this.isHidden ? this.show() : this.hide();
	},

	select: function(){
		this.isSelected = true;
		this.addClass('selected');
		return this;
	},

	deselect: function(){
		this.isSelected = false;
		this.removeClass('selected');
		return this;
	},

	toggleSelect: function(){
		this.hasClass('selected') ? this.deselect() : this.select();
	},

	highLight: function(){
		this.addClass('highLight');
		return this;
	},

	dehighLight: function(){
		this.removeClass('highLight');
		return this;
	}
});


var DOL = {};

DOL.Nav = {};

DOL.Nav.Bar = new Class({

    Implements: [Events, Options],

	options: {
		action: 'click',
		defaultTabIndex: 0
	},

	initialize: function( navBar, options ){
		var that = this;
		this.setOptions(options);

		this.timer = null;
		this.current = -1;

		this.navBar = $(navBar);
		this.navBar.widget = this;

		this.navs = this.navBar.getChildren();
		this.viewStack = $(this.navBar.getProperty('dataProvider'));
		this.views = this.viewStack.getChildren();
		this.views.each(function(view){view.setStyle('display', 'none')});
		this.switchTo(this.options.defaultTabIndex);

		this.navs.each( function(nav, i){
			nav.innerHTML = that.views[i].getProperty('viewTitle') || nav.innerHTML;
			nav.addEvent(that.options.action, function () {
				that.switchTo(i);
				that.fireEvent('click');
                return false;
			});
		});
	},

	switchTo: function( viewIndex ) {
		if(viewIndex == this.current) return;

		if( $chk(this.navs[this.current]) ) {
			this.navs[this.current].removeClass('active');
			this.views[this.current].setStyle('display', 'none');
		}
		this.navs[viewIndex].addClass('active');
		this.views[viewIndex].setStyle('display', '');
		this.current = viewIndex;
		this.fireEvent('onViewChange');
	}
});


window.addEvent('domready', function() {
    $$('.tabBar').each(function (bar) {
        new DOL.Nav.Bar(bar);
    });

    $$('.localNav a').each(function(a) {
        if (location.href.test(a.get('href'))) a.addClass('current').set('href', '');
    });
});


DOL.AdminConsole = new Class({

    initialize: function() {
        this.setView();
        this.setEventListeners();
    },

    setView: function() {
        this.view = {};
        this.view.wrapper = $('debug-console').hide();
        this.view.btnClose = this.view.wrapper.getElement('.btnClose');
    },

    setEventListeners: function() {
        this.view.btnClose.addEvent('click', function(e) {
            e.stop();
            this.view.wrapper.hide();
        }.bind(this));

        document.onkeydown = function(e) {
            var e = new Event(e);
            if (e.code == 192) this.view.wrapper.toggleShow();
        }.bind(this);
    }
});

window.addEvent('domready', function() {
    try {
        new DOL.AdminConsole();
    } catch (err) {}
});


DOL.Popup = new Class({

    Implements: [Events, Options],

    initialize: function(options) {
        this.setOptions(options);
        this.setView();
    },

    setView: function() {
        this.view = {};
        this.view.wrapper = this.options.view.wrapper
    },

    open: function() {
        this.view.wrapper.show();
    },

    close: function() {
        this.view.wrapper.hide();
    }
});


DOL.Window = DOL.Panel = new Class({

    Implements: [Events, Options],

    options: {
//        'onBeforeMoveStart': function() {
//            //window.console.log('start moving...');
//        }
    },

    initialize: function(options) {
        this.name = "panel";
        this.setOptions(options);
        this.setView();
        this.setEventListeners();
    },

    setView: function() {
        this.view = {};
        this.view.wrapper = $$('.windowContainerPattern')[0].clone().removeClass('windowContainerPattern');
        this.view.wrapper.addClass('windowContainer');
        this.view.wrapper.inject($$("body")[0]);

        this.view.title = this.view.wrapper.getElement('.title');
        this.view.window = this.view.wrapper.getElement('.window');
        this.view.content = this.view.wrapper.getElement('.content');
        this.view.lbtClose = this.view.wrapper.getElement('.lbtClose');
        this.view.lbtResize = this.view.wrapper.getElement('.lbtResize');

        if (this.options.movable) {
            this.view.window.addClass('movable');
            this.view.wrapper.makeDraggable({
                handle: this.view.title,
                container: $$('body')[0],
                onBeforeStart: function() {
                    this.fireEvent('beforeMoveStart');
                }.bind(this),
                onComplete: function() {
                    this.fireEvent('moveComplete');
                }.bind(this)
            });
        }

        if (this.options.resizable) {
            this.view.lbtResize.show();
            this.view.wrapper.makeDraggable({
                handle: this.view.lbtResize,
                modifiers: {'x': 'width', 'y': 'height'},
                onBeforeStart: function() {
                    this.fireEvent('beforeResizeStart');
                }.bind(this),
                onComplete: function() {
                    this.fireEvent('resizeComplete');
                }.bind(this)                
            });
        }
        
        this.view.title.set('text', this.options.title || '');
    },

    setEventListeners: function() {
        this.view.lbtClose.addEvent('click', function() {
            this.view.wrapper.hide();
            if (typeof this.options.onClose == 'function') this.options.onClose();
        }.bind(this));

        this.view.content.set('load', {
            onSuccess: function() {
                setTimeout(function() {this.fireEvent('load');}.bind(this), 100);
            }.bind(this)
        });

        this.view.content.load(this.options.url);
    },

    open: function() {
        this.view.wrapper.show();
        return this;
    },

    close: function() {
        this.view.wrapper.hide();
        return this;
    },

    resizeTo: function(width, height) {
        this.view.wrapper.style.width = width + 'px';
        this.view.wrapper.style.height = height + 'px';
        return this;
    },

    moveTo: function(top, left) {
        this.view.wrapper.setPosition({x: top, y: left});
        return this;
    },

    getSize: function() {
        return this.view.wrapper.getSize();
    },

    getPosition: function() {
        return this.view.wrapper.getPosition($$('body')[0]);
    }
});


DOL.PopupContainer = new Class({

    Implements: [Events, Options],

    initialize: function(options) {
        this.setOptions(options);
        this.setView();
        this.setEventListeners();
    },

    setView: function() {
        this.view = {};
        this.view.wrapper = (this.options.view.wrapper.clone().removeClass('popupContainer'));
        this.view.wrapper.inject($("body"));
        this.options.view.content.inject( this.view.wrapper.getElement('.content'));
        this.view.wrapper.addClass(this.options.view.className);
        this.view.lbtClose = this.view.wrapper.getElement('.lbtClose');
    },

    setEventListeners: function() {
        this.view.lbtClose.addEvent('click', function() {
            this.view.wrapper.hide();
            if (typeof this.options.onClose == 'function') this.options.onClose();
        }.bind(this));
    },

    reset: function(opts) {
        $extend(this.options, opts);
    },    

    open: function() {
       this.view.wrapper.show();
    },

    close: function() {
        this.view.wrapper.hide();
    }
});


DOL.Prompt = function () {
    var view = {};
    var options;

    function initialize(opts) {
        options = opts || {};
        setView();
        setEventListeners();
    }

    function setView() {
        view.wrapper = $('prompt');
        view.title = view.wrapper.getElement('.title');
        view.details = view.wrapper.getElement('.details');
        view.form = view.wrapper.getElement('form');
        view.input = view.wrapper.getElement('input[type=text]');
        view.btnOK = view.wrapper.getElement('.btnOK');
        view.btnCancel = view.wrapper.getElement('.btnCancel');

        view.popup = new DOL.PopupContainer({
            'view': {
                'wrapper': $$('.popupContainer')[0],
                'className': 'alertWindow',
                'content': view.wrapper
            }
        });
    }

    function setEventListeners() {
        view.form.addEvent('submit', function(e) {
            e.stop();
            view.btnOK.fireEvent('click');
        });
        
        view.btnOK.addEvent('click', function() {
            close();
            options.onOK();
        });

        view.btnCancel.addEvent('click', function() {
            close();
            options.onCancel();
        });
    }

    function open() {
        view.popup.open();
        setTimeout(function () {
            view.input.focus();
            view.input.select();
        }, 500);
    }

    function close() {
        view.popup.close();
    }

    return {

        prompt: function(opts) {
            view.title.set('text', opts.title || 'Please input');
            view.details.set('html', opts.details || '');
            view.btnOK.set('text', opts.ok || 'Ok');
            view.btnCancel.set('text', opts.cancel || 'Cancel');
            options.onOK = opts.onOK || function(){};
            options.onCancel = opts.onCancel || function(){};
            open();
        },

        init: function(opts) {
            initialize(opts);
            return this;
        }
    }
}();


DOL.Alert = function () {

    var view = {};
    var options;

    function initialize(opts) {
        options = opts || {};
        setView();
        setEventListeners();
    }

    function setView() {
        view.wrapper = $('alert');
        view.title = view.wrapper.getElement('.title');
        view.details = view.wrapper.getElement('.details');
        view.btnOK = view.wrapper.getElement('.btnOK');

        view.popup = new DOL.PopupContainer({
            'view': {
                'wrapper': $$('.popupContainer')[0],
                'className': 'alertWindow',
                'content': view.wrapper
            }
        });
    }

    function setEventListeners() {
        view.btnOK.addEvent('click', function() {
            close();
            options.onOK();
        });
    }

    function open() {
        view.popup.open();
        view.btnOK.focus();
    }

    function close() {
        view.popup.close();
    }

    return {

        alert: function(opts) {
            view.title.set('text', opts.title);
            view.details.set('html', opts.details);
            view.btnOK.set('text', opts.ok);
            options.onOK = opts.onOK;
            open();
        },

        init: function(opts) {
            initialize(opts);
            return this;
        }
    }
}();


DOL.Notification = function () {

    var view = {};
    var options;

    function initialize(opts) {
        options = opts || {};
        setView();
    }

    function setView() {
        view.wrapper = $('notification');
        view.title = view.wrapper.getElement('.title');
        view.details = view.wrapper.getElement('.details');

        view.popup = new DOL.PopupContainer({
            'view': {
                'wrapper': $$('.popupContainer')[0],
                'className': 'notificationWindow',
                'content': view.wrapper
            }
        });
    }

    return {

        open: function(opts) {
            view.title.set('text', opts.title);
            view.details.set('html', opts.details);
            view.popup.open();
        },

        close: function() {
            view.popup.close();
        },

        init: function(opts) {
            initialize(opts);
            return this;
        }
    }
}();


DOL.GlobalNotification = function () {
    var view = {};
    var toHideTimer;

    function show(text) {
        clearTimeout(toHideTimer);
        view.wrapper.set('text', text);
        view.wrapper.fade('in');
    }

    return {
        // Usage:
        // 1. DOL.GlobalNotification.alert('some text'); -- show some text.
        // 2. DOL.GlobalNotification.alert('some text', 1000); -- show some text for 1000 million seconds.
        alert: function() {                                                                             
            show(arguments[0]);

            var duration = arguments[1];
            if ($chk(duration)) toHideTimer = setTimeout(function(){ view.wrapper.fade('out'); }, duration);
        },

        init: function() {
            view.wrapper = $('global-notification');
        }
    }
}();


DOL.Confirmation = function () {

    var view = {};
    var options;

    function initialize(opts) {
        options = opts || {};
        setView();
        setEventListeners();
    }

    function setView() {
        view.wrapper = $('confirmation');
        view.title = view.wrapper.getElement('.title');
        view.details = view.wrapper.getElement('.details');
        view.btnYes = view.wrapper.getElement('.btnYes');
        view.btnNo = view.wrapper.getElement('.btnNo');

        view.popup = new DOL.PopupContainer({
            'view': {
                'wrapper': $$('.popupContainer')[0],
                'className': 'confirmationWindow',
                'content': view.wrapper
            }
        });
    }

    function setEventListeners() {
        view.btnYes.addEvent('click', function() {
            close();
            options.onYes();
        });

        view.btnNo.addEvent('click', function() {
            close();
            options.onNo();
        });
    }

    function open() {
        view.popup.open();
        view.btnNo.focus();
    }

    function close() {
        view.popup.close();
    }

    return {

        confirm: function(opts) {
            view.title.set('text', opts.title || '');
            view.details.set('html', opts.details || '');
            view.btnYes.set('text', opts.yes || 'Yes');
            view.btnNo.set('text', opts.no || 'No');
            options.onYes = opts.onYes || function(){};
            options.onNo = opts.onNo || function(){};
            open();
        },

        init: function(opts) {
            initialize(opts);
            return this;
        }
    }
}();


DOL.PopupIframe = function () {

    var view = {};
    var options;

    function initialize(opts) {
        options = opts || {};
        setView();
        setEventListeners();
    }

    function setView() {
        view.links = $$('.popupFullScreenIframe');
        view.iframe = $('popupIframePattern').getElement('iframe');
        view.popup = new DOL.PopupContainer({
            'view': {
                'wrapper': $$('.fullScreenPopupContainer')[0],
                'className': 'fullscreenIframeWindow',
                'content': $('popupIframePattern')
            }
        });
    }

    function setEventListeners() {
        view.links.addEvent('click', function(e) {
            e.stop();
            open($(this).get('href'));
            view.popup.reset({
                onClose: function() {
                    //$(e.target).parent('form').submit();
                }
            });
        });
    }

    function open(url) {
        view.iframe.set('src', url);
        view.popup.open();
    }

    return {

        init: function(opts) {
            initialize(opts);
            return this;
        }
    }
}();


DOL.AjaxPopupWindow = function () {

    var view = {};
    var options;

    function initialize(opts) {
        options = opts || {};
        setView();
        setEventListeners();
    }

    function setView() {
        view.wrapper = $('popupWindowPattern').clone();
        view.title = view.wrapper.getElement('.title');
        view.links = $$('.popupWindow');
        view.popup = new DOL.PopupContainer({
            'view': {
                'wrapper': $$('.popupContainer')[0],
                'className': 'popupWindow',
                'content': view.wrapper
            }
        });

        view.lightBox = view.wrapper.getParent('.lightBox');
        view.lightBox.makeDraggable({
            handle: view.title
        });
        view.lightBox.setPosition({x: null, y: 150});
    }

    function setEventListeners() {
        view.links.each(function(link) {
            link.addEvent('click', function(e) {
                e.preventDefault();
                url = $(e.target).get('href');
                title = $(e.target).get('title') || '';
                open(title, url);
            });
        });
    }

    function open(title, url) {
        view.title.set('text', title);
        view.wrapper.getElement('.body').set('load', {
            onSuccess: function() {
                view.popup.open();
            }
        }).load(url);
    }

    return {

        close: function() {
            view.popup.close();
            view.wrapper.getElement('.body').set('html', '');
        },

        init: function(opts) {
            initialize(opts);
        }
    }
}();


DOL._AjaxWindow = function () {

    var view = {};

    function initialize() {
        view.wrapper = $('popupWindowPattern').clone();
        view.title = view.wrapper.getElement('.title');
        view.popup = new DOL.PopupContainer({
            'view': {
                'wrapper': $$('.popupContainer')[0],
                'className': 'popupWindow',
                'content': view.wrapper
            }
        }); 
        view.body  = view.wrapper.getElement('.body');
        view.body.set('load', {
            onSuccess: function() {
                view.popup.open();
            }
        })
    }

    return {
        open: function(title, url) {
            view.title.set('text', title);
            view.body.load(url);
        },

        close: function() {
            view.popup.close();
            view.wrapper.getElement('.body').set('html', '');
        },

        init: function() {
            initialize();
        }
    }
}();


DOL.AjaxWindow = new (new Class({

    Implements: [Events, Options],

    initialize: function() {
        this.setOptions({});
    },

    init: function() {
        this.view = {};
        this.view.wrapper = $('popupWindowPattern').clone();
        this.view.title = this.view.wrapper.getElement('.title');

        this.view.popup = new DOL.PopupContainer({
            'view': {
                'wrapper': $$('.popupContainer')[0],
                'className': 'popupWindow',
                'content': this.view.wrapper
            }
        });
        this.view.body  = this.view.wrapper.getElement('.body');
        this.view.body.set('load', {
            onSuccess: function() {
                this.view.popup.open();
                setTimeout(function() {this.fireEvent('load');}.bind(this), 100);
            }.bind(this)
        });
    },

    open: function(title, url) {
        this.view.title.set('text', title);
        this.view.body.load(url);
    },

    close: function() {
        this.view.popup.close();
        this.view.wrapper.getElement('.body').set('html', '');
    }
}))();


DOL.Tooltip = function() {
    
    var view = {};
    var toShowTimer, toHideTimer;

    function initialize(scope) {
        setView(scope);
        setEventListeners();
    }

    function setView(scope) {
        view.scope = $(scope)
        view.helper = $("inline-helper");
        view.needs = $(scope).getElements(".help");
    }

    function setEventListeners() {

        view.needs.each(function (need) {
            var html = $(need).get("help");
            
            $(need).addEvent('click', function() {
                view.helper.fade('toggle');
                return false;
            });

            $(need).addEvents({
                'mouseenter': function (e) {
                    clearTimeout(toHideTimer);
                    toShowTimer = setTimeout(function() {
                        var left = $(need).getPosition().x - 10;
                        var bottom = $$('body')[0].getSize().y - $(e.target).getPosition().y + $$('body')[0].getPosition().y + 10;
                        view.helper.set('styles', {"bottom": bottom, "left": left}).set('html', html).fade('show');
                    }, 500);
                },

                'mouseleave': function (e) {
                    clearTimeout(toShowTimer);
                    toHideTimer = setTimeout(function() {
                        view.helper.fade('out');
                    }, 500);
                }
            });
        });

        view.helper.addEvent('mouseover', function() {
            clearTimeout(toHideTimer);
        });

        view.helper.addEvent('mouseleave', function() {
            clearTimeout(toShowTimer);
            toHideTimer = setTimeout(function() {
                view.helper.fade('out');
            }, 500);
        });

        $(document).addEvent('click', function() {
            view.helper.fade('hide');
        });
    }

    return {

        reset: function() {
            if ($chk(view.scope)) {
                view.needs = $(arguments[0]).getElements(".help");
                setEventListeners();
            } else {
                this.init(arguments[0]);
            }
        },

        init: function() {
            initialize(arguments[0] || $$('body')[0]);
        }
    }
}();


DOL.AdvancedTooltip = function () {

    var view = {};
    
    function initialize() {
        setView();
        setEventListeners();
    }

    function setView() {
        view.helper = $("advanced-tooltip");
        view.container = view.helper.getElement(".inner");
        view.needs = $$(".in-place-help");
    }

    function setEventListeners() {
        view.needs.each(function (need) {
            var url = $(need).get("href"),
                left = $(need).getPosition().x + $(need).getSize().x + 10 - $('page').getPosition().x;

            $(need).addEvent('click', function (e) {
                e.stop();
                view.helper.toggleShow();
                return false;
            });

            $(need).addEvent('mouseover',
                function (e) {
                    var top = $(e.target).getPosition().y + 0;
                    view.helper.setPosition({x: left, y: top});
                    view.container.set('html', 'Loading...');
                    view.helper.show();
                    view.container.load(url);
                }
            );
        });

        $(document).addEvent('click', function() {
            view.helper.hide();
        });
    }

    return {

        init: function() {
            initialize();
        }
    }
}();


DOL.Form = new Class({

    Implements: [Events, Options],

    initialize: function(options) {
        this.setOptions(options);
        this.setView();
        this.setEventListeners();
    },

    setView: function() {
        this.view = {};
        this.view.form = this.options.form;
        this.view.invalidFields = this.view.form.getElements('.validation');
    },

    setEventListeners: function() {
        this.view.form.addEvent('submit', function() {
            this.view.invalidFields.each(function(el) {
                el.hide();
            });
            var invalidFields = this.getInvalidFields();
            if (invalidFields.length == 0) return true;

            invalidFields.each(function(el) {
                el.getNext().show();
            });
            invalidFields[0].focus();
            return false;
        }.bind(this));
    },

    getInvalidFields: function() {
        return [];
    }
});


DOL.AjaxForm = new Class({

    Extends: DOL.Form,

    initialize: function(options) {
        this.parent(options);
        this.view.btnCancel  = this.view.form.getElement('.btnCancel');
        this.view.btnSubmit  = this.view.form.getElement('.btnSubmit');

        this.view.form.addEvent('submit', function(e) {
            e.preventDefault();
            this.submit();
        }.bind(this));
        
        this.view.btnCancel.addEvent('click', function() {
            this.fireEvent('cancel')
        }.bind(this));

        this.view.btnSubmit.addEvent('click', function() {
            this.submit();
        }.bind(this));

        setTimeout(function() {
            try {
                var el = this.view.form.getElement('input[type=text]');
                el.focus();
                el.select();
            } catch (err) {}
        }.bind(this), 200);
    },

    submit: function() {
        var method = this.view.form.get('method') || 'post',
            url    = this.view.form.get("action"),
            data   = this.view.form.toQueryString();
        
        new Request({ method: method, url: url,
            onRequest: function() { this.fireEvent('request') }.bind(this),
            onSuccess: function() { this.fireEvent('success') }.bind(this),
            onFailure: function() { this.fireEvent('failure') }.bind(this)
        }).send(data);
    }
});


DOL.StatucBar = new Class({
    
    Implements: [Events, Options],

    initialize: function(options) {
        this.setOptions(options);
        this.setView();
    },

    setView: function() {
        this.view = this.options.view;
        this.view.wrapper.fade('hide');
    },

    display: function(message, howLong) {
        this.view.wrapper.set('text', message);
        this.show();
        if (howLong > 0) {
            this.toHide = setTimeout(function() {
                this.hide();
            }.bind(this), howLong);
        }
    },

    show: function() {
        try { clearTimeout(this.toHide); } catch (err) {};
        this.view.wrapper.fade('in');
    },

    hide: function() {
        this.view.wrapper.fade('out');
    }
});


DOL.ViewStack = new Class({

	Implements: [Events, Options],

	initialize: function(options){
		this.setOptions(options);
		this.setView();
	},

	setView: function () {
		this.view = this.options.view;
        this.view.views = {};
        this.view.views.length = 0;
        
		this.view.viewStack.getChildren().each(function(view) {
			view.hide();
			this.view.views[view.id] = view;
			this.view.views.length += 1;
		}.bind(this));
	},

	switchTo: function (viewIndex) {
		this.fireEvent('beforeSwitch');
        if ($chk(this.current) && this.current == viewIndex) return;

		this.view.views[viewIndex].show();
		this.current = viewIndex;
		this.fireEvent(this.current + 'Show');
	}
});


DOL.Wizard = new Class({

	Implements: [Events, Options],

    options: {
        onFinish: function() {
            alert("Finished!");
        },
        
        onCancel: function() {
            alert("Cancelled!");
        },

        onAfterSwitch: function() {
            try {
                var el = this.view.views[this.current].getElement('input[type=text]');
                el.focus();
                el.select();
            } catch (err) {}
        }
    },

	initialize: function(options){
		this.setOptions(options);
		this.setView();
        this.setEventListeners();
	},

	setView: function () {
		this.view = this.options.view;
		this.view.views = this.view.viewStack.getChildren();
        this.btnsCancel = this.view.viewStack.getElements('.btnCancel');
        this.btnsNext = this.view.viewStack.getElements('.btnNext');
        this.btnFinish = this.view.viewStack.getElement('.btnFinish');
	},

    setEventListeners: function() {
        this.btnsCancel.each(function(btnCancel) {
            btnCancel.addEvent('click', function() {
                this.fireEvent('cancel');
            }.bind(this));
        }, this);

        this.btnsNext.each(function(btnNext) {
            btnNext.addEvent('click', function() {
                this.next();
                this.fireEvent('next');
            }.bind(this));
        }, this);

        this.btnFinish.addEvent('click', function() {
            var method = this.view.viewStack.get('method') || 'post',
                url    = this.view.viewStack.get("action"),
                data   = this.view.viewStack.toQueryString();
            this.fireEvent('finish', [method, url, data]);
        }.bind(this));
    },

    next: function () {
        this.switchTo(this.current + 1);
    },

	switchTo: function (viewIndex) {
		this.fireEvent('beforeSwitch');
        if ($chk(this.current)) {
            if (this.current == viewIndex) return;
            this.view.views[this.current].hide();
        }
		this.view.views[viewIndex].show();
		this.current = viewIndex;
        this.fireEvent('afterSwitch');
	}    
});


DOL.InlineEditor = function () {
    var view = {};
    var data = {
        text: '',
        position: {},
        size: {}
    };

    function initialize(opts) {
        setView();
        setEventListeners();
    }

    function setView() {
        view.wrapper = $('inline-editor');
        view.btnSave = view.wrapper.getElement('.btnSave');
        view.btnCancel = view.wrapper.getElement('.btnCancel');
        view.textarea = view.wrapper.getElement('textarea');
    }

    function setEventListeners() {
        view.btnSave.addEvent('click', function(e) {
            e.stop();
            save();
        });

        view.btnCancel.addEvent('click', function(e) {
            e.stop();
            cancel();
        });
    }

    function setPosition() {
        view.wrapper.setPosition(data.position);
    }

    function setSize() {
        view.textarea.set('styles', data.size);
    }

    function setText() {
        view.textarea.set('value', data.text || '');
    }

    function show() {
        var t = data.editable.view.target;

        data.text = t.get('text');
        data.position.x = t.getPosition().x - $('page').getPosition().x;
        data.position.y  = t.getPosition().y - $('page').getPosition().y;
        data.size.width  = t.getSize().x;
        data.size.height = t.getSize().y;

        setText();
        setSize();
        setPosition();

        view.wrapper.show();
        view.textarea.focus();
        view.textarea.select();
    }

    function hide() {
        view.wrapper.hide();
    }

    function getText() {
        return view.textarea.get('value');
    }

    function save() {
        hide();
        data.editable.save(getText());
    }

    function cancel() {
        hide();
        view.textarea.set('text', '');
    }

    return {
        edit: function(editable) {
            data.editable = editable;
            show();
        },
        
        init: function() {
            initialize();
        }
    }
}();


DOL.InlineEditable = new Class({

    Implements: [Events, Options],

    initialize: function(options) {
		this.setOptions(options);
		this.setView();
        this.setData();
        this.setEventListeners();
	},

	setView: function() {
		this.view = this.options.view;
    },

    setData: function() {
        this.data = {};
        this.data.left = this.view.target.getPosition().x - $('page').getPosition().x;
        this.data.top  = this.view.target.getPosition().y - $('page').getPosition().y;
        this.data.width  = this.view.target.getSize().x;
        this.data.height = this.view.target.getSize().y;
	},

    setEventListeners: function() {
        this.view.target.addEvents({
            'mouseenter': function() {
                this.view.wrapper.addClass('hovered');
            }.bind(this),

            'mouseleave': function() {
                this.view.wrapper.removeClass('hovered');
            }.bind(this),

            'click': function() {
                this.view.wrapper.addClass('editing');
                DOL.InlineEditor.edit(this)
            }.bind(this)
        });
    },

    save: function(text) {
        this.fireEvent('save', text);
        //this.view.target.set('text', text);
    },

    show: function() {
        this.view.wrapper.removeClass('editing');
    }
});