/**
 * Filename:	o2009.js
 * 
 * Javascript for 'global_frame_o2009.php'
 * 
 * @version		12/23/08
 * @author		Tobias Preuss
 * 
 */


function startList() {
	if (document.all&&document.getElementById){
		navRoot = document.getElementById("menu");
		for (i=0; i<navRoot.childNodes.length; i++){
			node = navRoot.childNodes[i];
			if (node.className=="menuitem"){
				node.onmouseover=function(){
					this.className+=" over";
					}
				node.onmouseout=function(){
					this.className=this.className.replace(" over", "");
				}
			} // if
		} // for
	} // if
} // function

window.onload=function() {
	// init the content-init-function - see home.js, discover.js, ...
	if (typeof(init)=="function") init();				
	startList();	// init the dropdown menu for IE
}



// jQuery starts here; needs include in global_frame_o2009.php
$(document).ready( function() {
	
	/**
	 * Class to store products picture menu items
	 * 
	 * @param $id is the HTML attibute id without
	 */								
	function SourceElements( id) {
		this._id = id;						/* HTML attribute id */
		this._isOver = false;				/* mouseOverState */					
		this.getId 			= function() 				{ return this._id; 				}
		this.getIsOver 		= function() 				{ return this._isOver; 			}
		this.toggleIsOver 	= function() 				{ this._isOver = !this._isOver; }
		this.setIsOver 		= function( $booleanState) 	{ this._isOver = $booleanState; }
	}


	/**
	 * Data structure to store and work on SourceElements objects
	 */
	function ArrayList() {
		this.array 	= new Array();
		this.add 	= function( $obj) 	{		this.array[this.array.length] = $obj;	}
		this.length = function() 		{		return this.array.length;				}
		this.get 	= function( index) 	{		return this.array[index];				}
		
		this.getById = function( $id) {
			for($i=0; $i<this.length(); ++$i) {
				if ( this.array[$i].getId() == $id) {
					return this.array[$i];
				}
			}
		}
		this.set = function( $id, $booleanState) {
			for($i=0; $i<this.length(); ++$i) {
				if ( this.array[$i].getId() == $id) {
					this.array[$i].setIsOver( $booleanState);
				}
			}
		}	
		this.print = function( $color) {
			for ($i = 0; $i<this.length(); ++$i) {
				$('#o2009_menu').append('<p style="color:' + $color + ';">' + this.array[$i].getId() + ' | ' + this.array[$i].getIsOver() + '</p>');
			}
			$('#o2009_menu').append('<br />');
		}
	}


	/**
	 * Resolves the x position of the specified element
	 * 
	 * @param $element is an HTML element
	 */
	function getBackgroundPositionX( $element) {
		if (!$element) {
			alert("Error in getBackgroundPositionX(): $element has the value " + $element);
		} else {
			$pos = $element.css("backgroundPosition");
			if ($pos == 'undefined' || $pos == null) {
				$pos = $element.css("background-position-x"); //IE hack
			}
			else {
				$pos = $pos.split(" ")[0];
			}
			return $pos;
		}
	}
	
	/**
	 * Sets the x position of the specified element
	 * 
	 * @param $id is the string expression of an html id attribute
	 * @param $prefix means either negative (false) or positive (true) offset
	 */
	function setBackgroundPositionX( $id, $prefix) {
			$OFFSET = 150;										
			$anker = $("#" + $id + " a:first");					
			$x = parseInt( getBackgroundPositionX( $anker),10);
			if ($prefix) $anker.css("backgroundPosition", $x + $OFFSET + "px 0px"); /* positive offset */
			else $anker.css("backgroundPosition", $x - $OFFSET + "px 0px"); /* negative offset */				
	}
	
	// Init
	var $myStorage = new ArrayList();				
	setBackgroundPositionX( "item1", false);
	$( '.product_pictures_event_source').children().each( function(){
		// Collect all items into data structure
		$myStorage.add( new SourceElements( this.id));
	});
	$myStorage.set( "item1", true);
							
	/**
	 * Product page / Product picture substitution
	 * 
	 * @version 	12/22/08
	 * @autor		Tobias Preuss
	 * @see 		Used in unordered list and image map in product pages
	 * 				also copied into popup_navigation.php, please update also
	 */
	$( '.product_pictures_event_source').children().each( function(){
		$( this)
			// Event source elements hover function: in
			.mouseover( function() {
				
			/* --- Advanced image hover function / Start ------------------------------------------------------ */	
				
				// Reset all items to init position
				for($i=0; $i<$myStorage.length(); ++$i) {
					$current = $myStorage.get( $i);
					if ( $current.getIsOver()) {
						$currentId = $current.getId();
						setBackgroundPositionX( $currentId, true);
						$myStorage.set( $currentId, false);
					}
				}
				// Set over state for current item
				setBackgroundPositionX( this.id, false);
				$myStorage.set( this.id, true);
				
			/* --- Advanced image hover function / End -------------------------------------------------------- */	
				
			/* --- Advanced image substitution / Start -------------------------------------------------------- */	
				
				$num_target_elements = $( '#image_item1').parent().children().length;
				$num_source_elements = $( this).parent().children().length;
				// For debugging: Prints the number of sub elements
				//$('#o2009_menu').append('<p style="color:red;">elements: ' + $num_source_elements + ' / ' + $num_target_elements + '</p>');
				for( $i=1; $i<=$num_source_elements; ++$i) {
					// Sometimes (connection pages) more event sources exists
					// this is made for double amount only
					if( $num_target_elements <= $num_source_elements ) {
						// Hide number of target elements (not more)								
						$( '#image_item'+$i).addClass('hide');
					}
				}
				$current_source = $( this).attr( "id");
				$current_source_id = $( this).attr( "id").substr( 4, $current_source.length);
				// Sometimes (connection pages) more event sources exists, this is made for double amount only
				if ($num_target_elements == $num_source_elements / 2 && $current_source_id > $num_target_elements) {
					// Modify target pointer
					$current_source_id = $current_source_id - $num_target_elements;	
				}
				$current_target = '#image_item'+$current_source_id;
				$( $current_target).removeClass( 'hide');
				
			/* --- Advanced image substitution / End ---------------------------------------------------------- */
			})
		;
	});
	
	// Product page Navigation
	// Source: http://www.aliaspooryorik.com/blog/index.cfm/e/posts.details/post/expanding-menus-with-jquery-81
/*
	$('#nav>li>ul').hide();
	$('#nav>li').mouseover(function(){
		// check that the menu is not currently animated
		if ($('#nav ul:animated').size() == 0) {
			// create a reference to the active element (this)
			// so we don't have to keep creating a jQuery object
			$heading = $(this);
			// create a reference to visible sibling elements
			// so we don't have to keep creating a jQuery object
			$expandedSiblings = $heading.siblings().find('ul:visible');
			if ($expandedSiblings.size() > 0) {
				$expandedSiblings.slideUp(500, function(){
					$heading.find('ul').slideDown(500);
				});
			}
			else {
				$heading.find('ul').slideDown(1000);
			}
		}
	});
*/

/* --- Image substitution for worldmap / Start ---------------------------------------------------- */	
	
	/**
	 * Store page / Swaps the images displayed at the store page by adding and removing the hidden class attribute
	 * 
	 * @version 	01/21/09
	 * @autor		Tobias Preuss
	 * @see 		Used in image map in store page / with IP filter alternative page
	 */
	$( '.world_map_event_source').children().each( function(){
		$num_target_elements = $( '#o2009_pictures_map').children().length;  //6
		$( this)
			// Show color country image
			.mouseover( function() {
				
				$num_source_elements = $( this).parent().children().length; //1
				$current_source_element_name = $( this).attr( "id");
				
				// Hide all country images
				for ($i = 0; $i < $num_target_elements; ++$i) {
					$( '#image_item'+$i).addClass( 'hide');
				}
				// Disable current country image
				$( '#image_'+$current_source_element_name).removeClass( 'hide');				
			})
			// Show uncolored world map
			.mouseout( function() {
				for ($i = 1; $i < $num_target_elements; ++$i) {
					$( '#image_item'+$i).addClass( 'hidden');
				}
				$( '#image_item0').removeClass( 'hidden');
			})
		;
	});
		
/* --- Image substitution for worldmap / End ---------------------------------------------------- */


	
}); // eo jQuery