SelectDropOver = Class.create();
Object.extend(SelectDropOver.prototype, {
	initialize: function(element, url, options) {
		this.url = url;
		this.element = $(element);
		this.options = Object.extend({
			current: false,
			draggable: true,
			resizable: true,
			overlay: false,
			opacity: 1,
			fadeTime: 0.25,
			left: false,
			top: false,
			highlightcolor: "#CCAAFF",
			backgroundcolor: "#f7f7f7",
			onComplete: function(transport, element) {
				new Effect.Highlight(element, {startcolor: this.options.highlightcolor, endcolor: this.options.backgroundcolor, restorecolor: this.options.backgroundcolor});
			},
			onFailure: function(transport) {
				alert("Error communicating with the server: " + transport.responseText.stripTags());
			},
			onSuccess: function(transport) {
			},
			onSelect: this.onSelect.bind(this),
			ajaxOptions: {}
		}, options);
	    this.onclickListener = this.show.bindAsEventListener(this);
	    this.mouseoverListener = this.enterHover.bindAsEventListener(this);
	    this.mouseoutListener = this.leaveHover.bindAsEventListener(this);
	    Event.observe(this.element, 'click', this.onclickListener);
	    Event.observe(this.element, 'mouseover', this.mouseoverListener);
	    Event.observe(this.element, 'mouseout', this.mouseoutListener);
	},
	makeWindow: function() {
		this.d2 = document.createElement('div');
		this.d2.className = 'SDO_overlay';   
		this.d2.style.display = 'none';
		if(this.options.overlay == true) {
			Element.setOpacity(this.d2, 0.5);
		}
		document.body.appendChild(this.d2);
		this.d2.onclick = function() {this.manager.remove(true)};
		this.d2.manager = this;

		this.d = document.createElement('div');
		this.d.className = 'SDO_window';
		if(this.options.height)
			this.d.style.height = parseInt(this.options.height) + 'px';
		document.body.appendChild(this.d);
		
		offsets = Position.cumulativeOffset(this.element);
		this.element_offsets = { left: offsets[0], top: offsets[1] };
	},
	setOptions: function(options) {
		if(!this.d)
			this.makeWindow()
		for(var i = 0; i < options.length; i++) {
			var a = options[i];
			var op = document.createElement('div');
			if(typeof(a) == 'object') {
				if(a.image) {
					var im = document.createElement('img')
					im.align = "absmiddle";
					if(typeof(a.image) == 'object') {
						im.src = a.image.src;
						if(a.image.alt && a.image.alt != "") { im.alt = a.image.alt; }
						if(a.image.align && a.image.align != "") { im.align = a.image.align; }
						if(a.image.height > 0) { im.height = a.image.height; }
						if(a.image.width > 0) { im.width = a.image.width; }
					} else {
						im.src = a.image;
					}
					op.appendChild(im);
				}
				if(a.text && a.text != "") {
					var t = document.createTextNode(a.text);
					op.appendChild(t);
				}
				op.value = a.value;
			} else {
				var t = document.createTextNode(a);
				op.appendChild(t);
				op.value = a;
			}

			if(op.value == this.options.current) {
				op.style.background = this.options.highlightcolor;
			}
			op.style.cursor = "pointer";

			op.manager = this;
			op.onclick = function() {this.manager.doSelect(this)};
			this.d.appendChild(op);
		}
	},
	doSelect: function(option) {
		var value = option.value || option.innerHTML;

	    this.onLoading();

		new Ajax.Request(
			this.url, Object.extend({
			parameters: "value=" + value,
			onComplete: this.onComplete.bind(this),
			onFailure: this.onFailure.bind(this),
			onSuccess: this.onSuccess.bind(this),
			asynchronous:true, 
			evalScripts:true
		}, this.options.ajaxOptions));

		this.options.current = value;
		this.options.onSelect(this.element, option);
//        this.element.innerHTML = option.innerHTML;
		new Effect.Highlight(this.element, {startcolor: this.options.highlightcolor, endcolor: this.options.backgroundcolor, restorecolor: this.options.backgroundcolor});

		this.remove();
	},
	onSelect: function(element, option) {
        element.innerHTML = option.innerHTML;
	},

    show: function() {
		this.makeWindow();
		this.setOptions(this.options.options);
		Element.setOpacity(this.d, 0);
		this.position();
		Element.setOpacity(this.d, 1);
		this.d2.style.display = 'block';
	},
	remove: function(fast){
		var fadeTime = (fast == true) ? .15 : this.options.fadeTime;
		Element.remove(this.d);
		Element.remove(this.d2);
		return false;
	},
	position: function(){
		var de = document.documentElement;
		var w = self.innerWidth || (de&&de.clientWidth) || document.body.clientWidth;
		var h = self.innerHeight || (de&&de.clientHeight) || document.body.clientHeight;

		if (window.innerHeight && window.scrollMaxY) {	
			yScroll = window.innerHeight + window.scrollMaxY;
		} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
			yScroll = document.body.scrollHeight;
		} else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
			yScroll = document.body.offsetHeight;
		}
		if(this.options.width)
			this.d.style.width = this.options.width + 'px';

		this.d.style.top = '0'; this.d.style.left='0';
		this.d.style.display = 'block';

		if(!this.options.left || this.options.left < 0){
			this.d.style.left = (this.element_offsets.left - 4) + "px";
		} else {
			this.d.style.left=parseInt(this.options.left)+'px';
		}

		var pagesize = getPageSize();
		var arrayPageScroll = getPageScrollTop();
		if(this.d.offsetHeight > h - 100) {
			if(!this.options.top || this.options.top < 0){
				this.d.style.top = "45px";
			}else{
				this.d.style.top=parseInt(this.options.top)+'px';
			}
			this.d.style.height=h-100 + 'px';
			//this.d4.style.overflow ='auto';
		} else {   
			if(!this.options.top || this.options.top < 0){
				this.d.style.top = (this.element_offsets.top - 4) + "px";
				// this.d.style.top = (arrayPageScroll[1] + ((pagesize[1]-this.d.offsetHeight)/2))+"px";
			}else{
				this.d.style.top=parseInt(this.options.top)+'px';
			}
		}
		if(this.d2){this.d2.style.height =   yScroll +"px";}
	},
	onLoading: function() {
	},
	onComplete: function(transport) {
		this.options.onComplete.bind(this)(transport, this.element);
	},
	onFailure: function(transport) {
		this.options.onFailure.bind(this)(transport);
		return false;
	},
	onSuccess: function(transport) {
		this.options.onSuccess.bind(this)(transport);
	},
	enterHover: function() {
		this.element.style.backgroundColor = this.options.highlightcolor;
		if (this.effect) {
			this.effect.cancel();
		}
	},
	leaveHover: function() {
		this.effect = new Effect.Highlight(this.element, {
			startcolor: this.options.highlightcolor,
			endcolor: this.options.backgroundcolor,
			restorecolor: this.options.backgroundcolor,
			duration: 0.25
		});
	}
});

