/**
* @file elSelect.js
* @downloaded from http://www.cult-f.net/2007/12/14/elselect/
* @author Sergey Korzhov aka elPas0
* @site  http://www.cult-f.net
* @date December 14, 2007
* 
*/
var elSelect = new Class({
	options: {
		container: false,
		baseClass : 'elSelect'
	},
	source : false,
	selected : false,
	_select : false,
	current : false,
	selectedOption : false,
	dropDown : false,
	optionsContainer : false,
	hiddenInput : false,
	/*
	pass the options,
	create html and inject into container
	*/
	
	initialize: function(options){
		this.setOptions(options)
		
		if ( !this.options.container ) return
		
		this.selected = false
		this.source = $(this.options.container).getElement('select')
		this.buildFrameWork()
		
		$(this.source).getElements('option').each( this.addOption, this )
		$(this.options.container).set('html', '')
		this._select.inject($(this.options.container))
		
		this.bindEvents()
		
	},
	
	buildFrameWork : function() {
		this._select = new Element('div').addClass( this.options.baseClass )
		this.current = new Element('div').addClass('selected').inject($(this._select))
		this.selectedOption = new Element('div').addClass('selectedOption').inject($(this.current))
		this.dropDown = new Element('div').addClass('dropDown').inject($(this.current))
		new Element('div').addClass('clear').inject($(this._select))
		this.optionsContainer = new Element('div').addClass('optionsContainer').inject($(this._select))
		var t = new Element('div').addClass('optionsContainerTop').inject($(this.optionsContainer))
		var o = new Element('div').inject($(t))
		var p = new Element('div').inject($(o))
		var t = new Element('div').addClass('optionsContainerBottom').inject($(this.optionsContainer))
		var o = new Element('div').inject($(t))
		var p = new Element('div').inject($(o))

		this.hiddenInput = new Element('input', {
			type  : 'hidden',
			name  : this.source.getProperty('name')
		}).inject(this._select, 'top')
				
	},
	
	bindEvents : function() {
		document.addEvent('click', function() { 
				if ( this.optionsContainer.getStyle('display') == 'block') 
					this.onDropDown()
			}.bind(this));
			
		$(this.options.container).addEvent( 'click', function(e) { new Event(e).stop(); } )		
		this.current.addEvent('click', this.onDropDown.bindWithEvent(this) )
		
	},
	
	//add single option to select
	addOption: function( option ){
    	var o = new Element('div').addClass('option').setProperty('value',option.value)
		if ( option.disabled ) { o.addClass('disabled') } else {
			o.addEvents( {
				'click': this.onOptionClick.bindWithEvent(this),
				'mouseout': this.onOptionMouseout.bindWithEvent(this),
				'mouseover': this.onOptionMouseover.bindWithEvent(this)
			})
		}
		
		if ( $defined(option.getProperty('class')) && $chk(option.getProperty('class')) ) 
			o.addClass(option.getProperty('class'))

	
		if ( option.selected ) { 
			if ( this.selected) this.selected.removeClass('selected');
			this.selected = o
			o.addClass('selected')
			this.selectedOption.set('text', option.text);
			this.hiddenInput.setProperty('value',option.value);
		}
		
		o.set('text', option.text)		
		o.injectBefore($(this.optionsContainer).getLast())
		
	},
	
	onDropDown : function( e ) {
			
			if ( this.optionsContainer.getStyle('display') == 'block') {
				this.optionsContainer.setStyle('display','none')
			} else {
				this.optionsContainer.setStyle('display','block')
				this.selected.addClass('selected')
				//needed to fix min-width in ie6
				var width =  this.optionsContainer.getStyle('width').toInt() > this._select.getStyle('width').toInt() ?
															this.optionsContainer.getStyle('width')
															:
															this._select.getStyle('width')
															
				this.optionsContainer.setStyle('width', width)
				this.optionsContainer.getFirst().setStyle('width', width)
				this.optionsContainer.getLast().setStyle('width', width)
			}						
	},
	onOptionClick : function(e) {
		var event = new Event(e)
		if ( this.selected != event.target ) {
			this.selected.removeClass('selected')
			event.target.addClass('selected')
			this.selected = event.target
			this.selectedOption.set('text', this.selected.get('text'));
			this.hiddenInput.setProperty('value',this.selected.getProperty('value'));
		}
		this.onDropDown()
	},
	onOptionMouseover : function(e){
		var event = new Event(e)
		this.selected.removeClass('selected')
		event.target.addClass('selected')
	},
	onOptionMouseout : function(e){
		var event = new Event(e)
		event.target.removeClass('selected')
	}
	
});
elSelect.implement(new Events);
elSelect.implement(new Options);



var images = ['skin/3di/images/homepage/home-image1.jpg', 'skin/3di/images/homepage/home2.jpg', 'skin/3di/images/homepage/home3.jpg', 'skin/3di/images/homepage/home4.jpg', 'skin/3di/images/homepage/home5.jpg'];
var image_count = images.length;
var image_index = 2;

var myFx = '';


function change_image() {
	$('background-buffer').fade('hide');

	var myImage = Asset.image(images[image_index-1], {
	    onLoad: function(){
		
			$('background-buffer').setProperty('src', images[image_index-1]);
			
			myFx.start('opacity', '0', '1');
		}
	});
		
}

	
window.addEvent('domready', function(){
	
	$$('.clear_field').each(function(item){
		
		item.set('rel', item.get('value'));
		
	});
	
	$$('.clear_field').addEvent('focus', function(){
		if (this.get('value') == this.get('rel')) {
			this.set('value', '');
		}
	});
	
	
	var mySelect = new elSelect( {container : 'industrySelect'} );

	
	var dynamicSelect = new Class( {
		Extends: elSelect,
		clearOptions : function() {
			
			$(this.optionsContainer).getChildren('.option').each(function(item){
				if (item.value != 0) { item.destroy(); }
			});
		}
	} );
	
	var subcategorySelect = new Class( {
		Extends: elSelect,
			
		onOptionClick : function(e) {
			this.parent(e)
			var t = this;
			
			var htmlRequest = new Request.JSON({url: "sub_category_search.php", onSuccess: function(responseJSON, responseText){
				subcategorySelect.clearOptions();

				responseJSON.each(function(item){
					
					new_option = new Element('option', {
						selected: false,
						value: item.id,
						text: item.name,
						disabled: false						
					});
					new_option.text = item.name;
					new_option.value = item.id;
					
					subcategorySelect.addOption(new_option);

					
				}.bind(t));
				
			}}).get({'categories_id': this.selected.getProperty('value')});
			
		}
	} );
	
	var categorySelect = new subcategorySelect( {container : 'categorySelect'} );
	
	// Set up banner image rotation
	myFx = new Fx.Tween($('background-buffer'), {duration: 'long', link: 'chain', onComplete: function(){
		
		$('hp_image_holder').setStyle('background-image', "url('" + $('background-buffer').getProperty('src') + "')");
		image_index = image_index + 1;
		
		if (image_index > image_count) {
			image_index = 1;
		}
	}});
	
	setInterval( change_image, 4000 );

	$('read_more_container').slide('hide');

	$$('#read_more_container DIV').each(function(item){
		item.slide('hide');
	});
	
	$$('#resources1 A').each(function(item){
		item.addEvent('click', function(event){
			event.stop();
			if ($(item.get('rel')) !== null) {
				$(item.get('rel')).slide('in');
				$('read_more_container').slide('in');
			}
		});
	})
	
});