// JavaScript Document
// SMSOLD
<!--
window.addEvent('domready', function(){
									 
	// CONFIG
	var sliding_speed = 500; // miliseconds
	var mouse_event_sliding = "mouseenter"; // For sliding effect
	var mouse_event_menu = "click"; // To show information on pages
	var page_random = 1; // Apply random feature on pages
	var menu_random = 0; // Appy random feature on menu
	
	// Please don't change anything below this line if you don't know what you are doing
	
	// Core	
	var image_height = $$("#slider_menu .slider .image")[0].getStyle('height').toInt(); // Get the height of images. All images are supposed to have same height.
	var all_elements = $$("#slider_menu .slider"); // Extract elements
	var fx = new Fx.Elements(all_elements, {wait: false, duration: sliding_speed, transitions: Fx.Transitions.Quint.easeOut}); // Effect
	var	elements_margin = [];
	var slider_random = $random(0, all_elements.length-1);
	var all_pages = $$(".sub_page"); // All pages
	var all_images = $$(".image_left") // All images
	var all_text = $$("#slider_menu .slider .text"); // All text
	
	// For display
	$('slider_menu').setStyle('position', 'absolute');
	
	all_elements.each(function(slider, i ){
		elements_margin.extend([slider.getStyle('margin-top').toInt()]);
		slider.addEvent(mouse_event_sliding, function(event){
			var object = {};
			all_text.each(function(each_text, k){
				all_text[k].setStyles('background: url(js/images/rolloverBkg2.jpg) no-repeat;');
			});
			all_text[i].setStyles('background: url(js/images/rolloverBkg2.jpg) -200px no-repeat;');
			all_elements.each(function(other, j) {
				if(j < i) {
					before_margin = other.getStyle('margin-top').toInt();
					destination_margin = elements_margin[j] - image_height;
					object[j] = {'margin-top': [before_margin, destination_margin]};
					fx.start(object);
					after_margin =  other.getStyle('margin-top').toInt();
				} else if(j>=i) {
					before_margin = other.getStyle('margin-top').toInt();
					destination_margin = elements_margin[j];
					object[j] = {'margin-top': [before_margin, destination_margin]};
					fx.start(object);
					after_margin =  other.getStyle('margin-top').toInt();
				} // End if
			}); // End each() of all_elements (other)
		}); // End sliding effect
		
		slider.addEvent(mouse_event_menu, function(event){
			all_elements.each(function(other, j){
				if (i == j) {
					all_pages[j].setStyle('display', 'block'); // Page
					all_images[j].setStyle('display', 'block');  // Image
				} else {
					all_pages[j].setStyle('display', 'none');  // Page
					all_images[j].setStyle('display', 'none');  // Image
				}
			});
		}); // End event for menu
	}); // End each() of all_elements
	
	// Hide all pages
	all_pages.each(function(each_page, i){
		each_page.setStyle('display', 'none'); // Hide a page
	});
	
	// Hide all images
	all_images.each(function(each_image, i){
		each_image.setStyle('display', 'none'); // Hide an image
	});

	// RANDOM OPTION
	if(page_random == 1) {
		all_elements[slider_random].fireEvent(mouse_event_menu);
	}
	
	if(menu_random == 1) {
		all_elements[slider_random].fireEvent(mouse_event_sliding);
	}
	
}); // End domready
-->