﻿ZOOMIN.namespace("ZOOMIN.util");
(function() {
    var util = ZOOMIN.util.Util;
    var DEFAULT_OPTIONS = {
        classHover: "text-hover",
        classSelect: "text-select",
        classDefault: "text-normal",
        classDisabled: "text-disabled",
        maxLength: 20,
        editDisabled: false,
        hoverTitle: 'Click to edit',
        onHoverSelected: 'Press enter to save',
        emptyTitle: 'Click to edit'
    };

    ZOOMIN.util.Edit = function(obj, origValue, fnSave, options) {
        var THIS = this;
        this.textEl = $(obj);
        this.origVal = origValue;
        this.blurTimeOut;
        this.options = util.initializeOptions(options, DEFAULT_OPTIONS);
        this.editDisabled = this.options.editDisabled;
        this.cancelButton = null;
        if (!this.editDisabled) {

            if (typeof this.options.saveButton === "undefined") {
                throw new Error("Error: need save button element");
            }

            this.saveButton = $(this.options.saveButton);

            if (typeof (this.options.cancelButton) != "undefined") {
                this.cancelButton = $(this.options.cancelButton);
            }
            this.fnSave = fnSave;
            // Textbox Events ...
            this.spanEl = $("<span></span>").text(this.textEl.val() == "" ? this.options.emptyTitle : this.textEl.val());
            this.spanEl.addClass(this.options.classDefault);
            this.textEl.after(this.spanEl);
            this.spanEl.hover(function() { $(this).addClass(THIS.options.classHover); }, function() { $(this).removeClass(THIS.options.classHover); });
            this.spanEl.attr('title', this.options.hoverTitle);
            this.spanEl.click(util.bind(this.onClick, this));
            this.textEl.hover(util.bind(this.onHover, this));
            this.textEl.mouseout(util.bind(this.onMouseout, this));
            this.textEl.focus(function() {
                THIS.edit();

            });

            this.textEl.attr('title', this.options.hoverTitle);


            this.textEl.blur(util.bind(this.onBlur, this));
            this.textEl.keydown(util.bind(this.onKeyDown, this));
            this.textEl.hide();
        }
        else {
            this.spanEl = $("<span></span>").text(this.textEl.val() == "" ? this.options.emptyTitle : this.textEl.val());
            this.spanEl.addClass(this.options.classDisabled);
            this.textEl.after(this.spanEl);
            this.textEl.hide();            
        }
        this.setValue(origValue);

    };
    ZOOMIN.util.Edit.prototype = {
        fnSave: null,
        options: null,
        textEl: null,
        selected: false,
        setValue: function(value) {

            if (value == "" || !value) {
                if (!this.editDisabled) {
                    this.textEl.val(this.options.emptyTitle);
                }
            } else {
                this.textEl.val(value);
            }
        },
        onClick: function(e) {
            this.textEl.show();
            this.textEl.focus();
            this.spanEl.hide();
        },
        onKeyDown: function(e) {
            if (e.which == 27) {    // esc
                this.cancel();
            } else if (e.which == 13) {   // enter <=
                this.textEl.blur();
                this.save();
            }
        },
        onBlur: function() {
            this.blurTimeOut = setTimeout(util.bind(this.cancel, this), 250);
        },
        close: function() {
            if (this.textEl) {
                this.textEl
			.removeClass(this.options.classHover)
			.removeClass(this.options.classSelect)
			.addClass(this.options.classDefault);
                if (this.cancelButton != null) this.cancelButton.hide();
                this.saveButton.hide();
                this.selected = false;
                this.textEl.attr('title', this.options.hoverTitle);
                this.textEl.hide();
                this.spanEl.text(this.textEl.val());
                this.spanEl.removeClass(this.options.classHover);
                this.spanEl.show();
            }
        },
        onMouseout: function() {
            if (!this.selected) {
                this.textEl
				.removeClass(this.options.classHover)
				.addClass(this.options.classDefault);
            }
        },
        onHover: function() {
            if (!this.selected) {
                this.textEl
				.addClass(this.options.classHover);
            }
        },
        unregister: function() {
            if (!this.editDisabled) {
                this.textEl.unbind();
                this.textEl = null;
                this.saveButton.unbind();
                this.saveButton = null;
                if (this.cancelButton != null) this.cancelButton.unbind();
                this.cancelButton = null;
            }
        },
        edit: function() {
            this.textEl
			.removeClass(this.options.classHover)
			.removeClass(this.options.classDefault)
            .addClass(this.options.classSelect)
            .val(this.origVal);
            setTimeout(util.bind(this.showButtons, this), 300);
            this.selected = true;
            this.textEl.attr('title', this.options.onHoverSelected);
        },
        cancel: function() {
            this.setValue(this.origVal);
            this.close();
        },
        save: function() {
            try {
                clearTimeout(this.blurTimeOut);
                this.fnSave(this.textEl.val(), {
                    id: this.options.identifier,
                    originalValue: this.origVal
                });

            } catch (e) {
                //console.log(e);	
            }
            this.origVal = this.textEl.val();
            this.setValue(this.textEl.val());

            this.close();
        },
        showButtons: function() {
            //unregister all prev handlers
            if (this.cancelButton != null) {
                this.cancelButton.unbind();
                this.cancelButton.insertAfter(this.saveButton);
                this.cancelButton.show();
                this.cancelButton.click(util.bind(this.cancel, this));
            }
            this.saveButton.unbind();
            //show those buttons
            this.saveButton.insertAfter(this.textEl);
            this.saveButton.show();
            //register for click events           
            this.saveButton.click(util.bind(this.save, this));
        }
    };
    ZOOMIN.util.Edit.truncate = function(text, len) {
        if (text.length > len) {
            return text.substring(0, len) + '...';
        } else {
            return text;
        }
    };
    var truncate = ZOOMIN.util.Edit.truncate;

})();