/*
---
description: TextLabelInput class makes it so the initial value of a text input field acts as the label

license: MIT-style

authors:
- Greggory Hernandez

requires: [core:/1.2.4:'*']

provides: [TextLabelInput]

...
*/
var TextLabelInput = new Class({
    initialize: function (elem, options) {
        this.e = $(elem);
        
        this.setDefaultOptions();
        
        if (options) {
            this.initializeOptions(options);
        }
        
    //    this.replace();
        
        this.e.addEvent('focus', this.toggle.bind(this));
        this.e.addEvent('blur', this.toggle.bind(this));
    },
    initializeOptions: function (options) {
        this.options.label = (options.label) ? options.label : this.options.label;
        this.options.inactive_color = (options.inactive_color) ? options.inactive_color : this.options.inactive_color;
        this.options.active_color = (options.active_color) ? options.active_color : this.options.active_color;
        this.options.beforeRemove = (options.beforeRemove) ? options.beforeRemove.bind(this) : this.options.beforeRemove.bind(this);
        this.options.afterRemove = (options.afterRemove) ? options.afterRemove.bind(this) : this.options.afterRemove.bind(this);
        this.options.beforeReplace = (options.beforeReplace) ? options.beforeReplace.bind(this) : this.options.beforeReplace.bind(this);
        this.options.afterReplace = (options.afterReplace) ? options.afterReplace.bind(this) : this.options.afterReplace.bind(this);
    },
    setDefaultOptions: function () {
        this.options = {
            label: this.e.title,
            inactive_color: '#8a8a8a',
            active_color: 'black',
            beforeRemove: function () {},
            afterRemove: function () {},
            beforeReplace: function () {},
            afterReplace: function () {}
        }
	//	this.e.set('title','');
    },
    toggle: function () {
        if (this.e.value == this.options.label) {
            this.remove();
        }
        else if (this.e.value == '') {
            this.replace();
        }
    },
    remove: function () {
        this.options.beforeRemove();
        this.e.value = '';
        this.applyActiveColor();
        this.options.afterRemove();
    },
    replace: function () {
        this.options.beforeReplace();
        this.e.value = this.options.label;
        this.applyInactiveColor();
        this.options.afterReplace();
    },
    applyInactiveColor: function () {
        this.e.setStyle('color', this.options.inactive_color);
    },
    applyActiveColor: function () {
        this.e.setStyle('color', this.options.active_color);
    }
});