function set_menu_height() {
	_content_height_str = $('listing_content').getStyle('height');
	_menu_height_str = $('nav_container').getStyle('height');
	_content_height = _content_height_str.substring(0, _content_height_str.length - 2);
	_menu_height = _menu_height_str.substring(0, _menu_height_str.length - 2);
	if (((_content_height * 1)) > (_menu_height * 1)) {
		$('nav_container').setStyle('height', (_content_height *1 ) - 10);
	}
}

var _out = false; 


function hide_extra_filters() {
	$('extra_filters_containerid').slide('hide');	
	
	if($defined($('filter_control')))
	{
	$('filter_control').addEvent('click', function() {
		$('extra_filters_containerid').slide('toggle');
		if (_out) {
			$('filter_control').src = 'skin/shadestation/images/listing/btn_moreFilters.gif';
			_out = false;
		} else {
			$('filter_control').src = 'skin/shadestation/images/listing/btn_lessFilters.gif';
			_out = true;
		}
	});
	set_menu_height();
	}
}

function submit_listing_form() {
	$('listing_data').addClass('loading_graphic');
	if (!$defined($('overlay'))) {
		_width = $('listing_data').getStyle('width');
		_height = $('listing_data').getStyle('height');
		var _overlay = new Element('DIV', {'id':'overlay'});
		_overlay.setStyle('width', _width);
		_overlay.setStyle('height', _height);
		_overlay.setStyle('position', 'absolute');
		_overlay.setStyle('top', '0');
		_overlay.setStyle('left', '0');
		_overlay.setStyle('background-color', 'white');
		_overlay.setStyle('opacity', '0.6');
		
		_overlay.inject($('listing_data'));
	}
	
	var myHTMLRequest = new Request.HTML({url:'generate_listing_data.php?osCsid=' + js_session,
		onSuccess: function(responseTree, responseElements, responseHTML, responseJavaScript) {
			$('listing_data').setProperty('html', responseHTML);
			$('listing_data').removeClass('loading_graphic');
			$$(".tags").each(function(item) {
				new tagScroller({'tagHolder': item});
			});
		}
	}).post($('filter_form'));	
}

function set_slider(_position, _slider) {
	_slider.set(_position);
}

window.addEvent('domready', function(){
	//$('filter_form').set('send', {url: 'app/core/code/product_listing/generate_listing_data.php'});
	set_menu_height();
	
	var _cont = $('scroller_container');
	var myEl = new Element('DIV', {'id':'myElement', 'class':'slider'});
	var _knob = new Element('DIV', {'class':'knob', 'id':'knob'});
	_knob.inject(myEl);
	myEl.inject(_cont);
	var _mouse_down = false;
	
	$('knob').addEvent('mousedown', function() {
		_mouse_down = true;
	});
	$('knob').addEvent('mouseup', function() {
		_mouse_down = false;
	});
	$('knob').addEvent('mouseout', function() {
		_mouse_down = false;
	});
	
	
	var el = $('myElement');
	var _initialized = false;
	var _is_resizing = false;
	var _width_array = ['86', '99', '118', '144', '184', '248'];
	// Create the new slider instance
	
	
	
	var myslider = new Slider(el, el.getElement('.knob'), {
			steps: 50,	// There are 50 steps
			range: [0],	// Minimum value is 0
			onChange: function(value){
		steps_value = Math.round(value /10); 
		value = 50 - value;
				_total_width = 720;
				// we set the begin resize variable
				// if initialising, change all product thumbnails into bordered boxes and add the loading overlay. 
				if (_initialized && !_is_resizing) {
					//$('listing_data').addClass('loading_graphic');
					_is_resizing = true;
					_width = $('listing_data').getStyle('width');
					_height = $('listing_data').getStyle('height');
					if (!$defined($('overlay'))) {
						var _overlay = new Element('DIV', {'id':'overlay'});
						_overlay.setStyle('width', _width);
						_overlay.setStyle('height', _height);
						_overlay.setStyle('position', 'absolute');
						_overlay.setStyle('top', '0');
						_overlay.setStyle('left', '0');
						_overlay.setStyle('background-color', 'white');
						_overlay.setStyle('opacity', '0.6');
						
						_overlay.inject($('listing_data'));
					}
					$$('.thumbnail_cont img').setStyle('display', 'none');
					
					$$('.thumbnail_cont').setStyle('border', '2px dashed #2e2e2e');
					$$('.thumbnail_cont').setStyle('margin-right', '0px');
					$$('.thumbnail_cont').setStyle('display', 'block');
					$$('.thumbnail_cont').setProperty('html', '');
					$$('.listing_item_right_side').removeClass('listing_item_right_side');
					$$('.listing_hr').setStyle('display', 'none');
					
					_thumb_width = _width_array[steps_value];
					// maintain aspect ration between width and height
					$$('.thumbnail_cont').setStyle('width', _thumb_width + 'px');
					$$('.thumbnail_cont').setStyle('height', _thumb_width + 'px');
				} else if (_initialized) {
					//$('listing_data').addClass('loading_graphic');
					_total_available_width = _total_width - ((steps_value *2)+40);
					_thumb_width = _width_array[steps_value];
					// maintain aspect ration between width and height
					//_thumb_height = Math.round(_thumb_width * 1.2);
					_thumb_height = _thumb_width;
					$$('.thumbnail_cont').setStyle('width', _thumb_width + 'px');
					$$('.thumbnail_cont').setStyle('height', _thumb_width + 'px');
				}
			},
			onComplete: function(step) {
				if ((!_mouse_down)||(step == 0)||(step == 50)) {
					_rounded = Math.round((step)/10);
					_closest = _rounded*10;
					_row_count = (5- _rounded) + 3;
					_current_row_count = $('current_image_size').getProperty('value');
					_is_resizing = false;
					if ((_initialized)&&(_row_count != _current_row_count)) {
						$('listing_data').addClass('loading_graphic');
								
						$('current_image_size').setProperty('value', _row_count);
						
						var myHTMLRequest = new Request.HTML({url:'generate_listing_data.php?osCsid=' + js_session,
							onSuccess: function(responseTree, responseElements, responseHTML, responseJavaScript) {
								$('listing_data').setProperty('html', responseHTML);
								$('listing_data').removeClass('loading_graphic');
								$$(".tags").each(function(item) {
										new tagScroller({'tagHolder': item});
								});
							}
						}).send($('filter_form'));
					} else {
						_initialized = true;
					}
					this.set(_closest);
				}
			}
	
		}).set(((_col_count-2)*10));
});