//##################################################
LiveField = new Class({
	Implements: Options,
	options: {
		field: false,
		request: false,
		url: '',
		event: '',
		autoHide: 0, 
		listeners: [],
		speakers: []
	},
	
	//:::::::::::::::::::::::::::::::
	initialize: function(options){
		this.setOptions(options);
		if (this.field = $(options.field)) {
			if (this.options.event.length>0) this.field.addEvent(options.event, this.onFieldChange.bind(this));
			this.updateField();
		}
    },

    //:::::::::::::::::::::::::::::::
	addSpeaker: function(speaker){
		this.options.speakers.push(speaker);
	},
	
    //:::::::::::::::::::::::::::::::
	addListener: function(listener){
		this.options.listeners.push(listener);
		listener.addSpeaker(this);
	},
    
	//:::::::::::::::::::::::::::::::
    onFieldChange: function(event) {
    	this.options.listeners.each(function(listener) {
    		listener.onReset();
    		listener.onAfterChange();
    	});
    },
    
    //:::::::::::::::::::::::::::::::
    onReset: function(event) {
    	this.toggleEditable(false);
    	this.toggleDisplay(true);
    },
    
    //:::::::::::::::::::::::::::::::
    toggleEditable: function(editable) {
    	if (editable) {
			this.field.disabled = false;
			this.field.setStyle('color', '');
    		this.field.setStyle('background-color', '');			
		} else {
			this.field.disabled = true;
			this.field.setStyle('color', 'gray');
			this.field.setStyle('background-color', '#CCCCCC');
		}	
    },
    
    //:::::::::::::::::::::::::::::::
	toggleDisplay: function(visible) {
		if (this.options.autoHide) {
			if (visible) {
				$(this.field.name+'_header').setStyle('display', '');
				$(this.field.name+'_field').setStyle('display', '');
	    	} else {
				$(this.field.name+'_header').setStyle('display', 'none');
				$(this.field.name+'_field').setStyle('display', 'none');
			}
		}
	},
    
	//:::::::::::::::::::::::::::::::
	toggleLoading: function(loading) {
		var parent = this.field.getParent();
		if (parent) {
			if (loading) {
				//parent.setStyle('padding-left', '20px');
				parent.setStyle('background', 'url(../../images/loading.gif) no-repeat');
				this.field.setStyle('visibility', 'hidden');
			} else {
				//parent.setStyle('padding-left', '0');
				parent.setStyle('background', '');
				this.field.setStyle('visibility', 'visible');
			}
		}
	},
	
    //:::::::::::::::::::::::::::::::
    onAfterChange: function(event) {
		// FIELDS TO SEND
		var speaker;
		var query = ['l=' + this.field.name];
		for (var i=0; i<this.options.speakers.length; i++) {
			speaker = this.options.speakers[i].field;
			if (speaker.value.length>0) {
				query.push(speaker.name + '=' + speaker.value);
			}
		}
		
		// IF ALL VALUES SET SEND REQUEST
		if ((query.length-1)==this.options.speakers.length) {
			if (!this.request) {
				this.request = new Request.JSON({
					url: this.options.url,
					method: 'get', 
					autoCancel: true});
				this.request.addEvent('complete', this.onJSONLoad.bind(this));	
			} else {
				this.request.cancel();
			}
			
			this.toggleLoading(true);
			this.request.send(query.join('&'));
			
		// NOT ALL VALUES SET
		} else {
			this.onJSONLoad();
		}
		
		// FIRE CHANGE EVENT
		this.field.fireEvent('change');
    },
    
    //:::::::::::::::::::::::::::::::
    onJSONLoad: function(data, text) {
		this.updateField();
		this.toggleLoading(false);
    },
    
    //:::::::::::::::::::::::::::::::
    updateField: function() {
    	var haveData = true;
		this.toggleEditable(haveData);
    	this.toggleDisplay(haveData);
    }
});

//##################################################
LiveOptionsField = new Class({
	Extends: LiveField,
	options: {
		useHeader: 0
		//header: ''
	},
	
	//:::::::::::::::::::::::::::::::
	initialize: function(options) {
		this.parent(options);
		//if (this.options.useHeader) this.options.header = this.field.options[0].text;
	},
	
	//:::::::::::::::::::::::::::::::
    onReset: function(event) {
		
		// EMPTY AND SET LOADING
		while(this.field.options.length > this.options.useHeader) this.field.options[this.options.useHeader]=null;
		//this.field.options[0] = new Option('Loading, please wait ...', '');
		this.field.selectedIndex = 0;
		this.field.fireEvent('change');	
		
    	this.toggleEditable(false);
    	this.toggleDisplay(true);
    },
    
    //:::::::::::::::::::::::::::::::
    onJSONLoad: function(list, text) {
    	// ADD NEW
    	var index = this.options.useHeader;
    	var lastSection = '';
    	var desc, className;
		if ($type(list)=='array') for (var i=0; i<list.length; i++) {
			if (list[i].section) {
				desc = '   - ' + list[i].desc;
				className = 'optSubitem';
				if ((list[i].section!=lastSection)) {
					this.field.options[index] = new Option(list[i].section, '');
					this.field.options[index].className = 'optSection';
					index++;
					lastSection = list[i].section;
				}
			} else {
				desc = list[i].desc;
				className = '';
			}
			this.field.options[index] = new Option(desc, list[i].value);
			if (className.length>0) this.field.options[index].className = className;
			index+= 1;
		}
		
		// UPDATE
		this.updateField();
		this.toggleLoading(false);
    },
     
    //:::::::::::::::::::::::::::::::
    updateField: function() {
    	var haveData = this.field.options.length> Math.min(1, this.options.useHeader);
		this.toggleEditable(haveData);
    	this.toggleDisplay(haveData);
    }
     
});