/* -------------------------------------------------------------- 
  
   Pioneer AVR Landing Page
   custom.js
	 
-------------------------------------------------------------- */
	

var $j = jQuery.noConflict();

var ie6 = ($j.browser.msie && $j.browser.version < 7 ) ? true : false;
var ie7 = ($j.browser.msie && $j.browser.version == 7 ) ? true : false;
var ie8 = ($j.browser.msie && $j.browser.version > 7 ) ? true : false;
  
$j(document).ready(function () {

		// Slideshow
		$j('.slideshow').slideShow();		

		// Lightboxes
		$j('.open_lightbox').each( function() {
			$j(this).each( function() {																
				$j(this).click( function(e) { 
					var source = $j(this).attr('href');  
					var lightbox = jQuery.fn.lightbox({ 
						 overlayId : 'overlay_885-457',						
						 lightboxId : 'lightbox_885-457',
						 width : 887,
						 height : 459,
						 source: source
					});					
					lightbox.open() 
					e.preventDefault();
				});
			});
		});
		
		// Take a closer look: Combine with... product carousel
		$j('.carousel').carousel();		

		// Take a closer look: Switch between black / silver products
		$j('.product').switchColour();

		// Take a closer look: Tabs
    $j('.tabs').tabs();
		
		// Unboxing: Tooltip
		$j('.tooltip').tooltip({width:'175px',leftOffset:-15,tooltipContainer:'tooltip'});

		// Unboxing: Image map with rollovers Box page 
		$j('.image_map').imageMap();		

		// Solutions page combo tabs
		$j('#combo_tab_container').solutionsTabs();

});




/*
    SWITCH COLOUR
		Switch between Black & Silver products
*/

(function($) {
	jQuery.fn.switchColour = function(options) {
		
		// defaults, override with options
		settings = jQuery.extend({
			triggerSelector : '.colours a',
			contentSelector : '.detail>div',
			introSelector	: '.shortdesc'
		}, options);
		
		return this.each(function(){
	    
	      var $trigger = $(settings.triggerSelector,$(this));
			  var $content = $(settings.contentSelector,$(this));
				var $intro = $(settings.introSelector,$(this));
			  var switchIntro = 0;
				
			  if ($intro.hasClass('H')||$intro.hasClass('K')||$intro.hasClass('S')) {
					  $intro.hide();
						switchIntro = 1;
				}
			 
			  // if more than one colour
			  if( $trigger.size() > 1 ) {
				   
			      $trigger.each( function(i) {
						    $(this).click( function(e) {
							      activateColour(i);	
										e.preventDefault();
					      });											 
					  });
					 
					  function activateColour(index) {
					  		
								$trigger.removeClass('active');
								$content.css("left", "2000px");
								
								$($trigger[index]).addClass('active');
								$($content[index]).css("left", "0");

								if(switchIntro) {
									  $intro.hide();
										$($intro[index]).show();
								};
						
					  };
					  activateColour(0);
        };
			 
    });
		
	};
})(jQuery);

/*
    CAROUSEL
*/

(function($) {
	jQuery.fn.carousel = function(options) {
		
		// defaults, override with options
		settings = jQuery.extend({
			
		}, options);
		
		return this.each(function(){
	     
			 var $scroller = $(this);
			 var $mover = $('ul',$scroller);
		   var $scrollerItems = $('li',$mover);
			 var $next;
			 var $prev;
			 var selectedItem = 0;
			 var currentPos = 1;
			 var nrVisibleItems = 1;
			 var itemWidth = $($scrollerItems[0]).width();
			 
			 //alert(itemWidth);
				  $next = $('<a class="next"></a>').appendTo($scroller); 
					$prev = $('<a class="prev"></a>').appendTo($scroller); 
			 
			 if($scrollerItems.size()<=nrVisibleItems) {
				  $next.addClass('next_button_disabled');
					$prev.addClass('previous_button_disabled');
			 } else {
			 	  $next.click( function(e) { 
					  moveScroller(currentPos+nrVisibleItems);
					  e.preventDefault(); 
				  });
				  $prev.click( function(e) { 
					  moveScroller(currentPos-nrVisibleItems);
				 	  e.preventDefault(); 
				  });					 
			 }
		  
       function moveScroller(pos) {
         if (pos<0) { pos = 0 }
		     else if ($scrollerItems.size()>nrVisibleItems && pos>$scrollerItems.size()-nrVisibleItems) { pos = $scrollerItems.size()-nrVisibleItems; }
				 
				 var left = Number($mover.css('left').replace('px',''));
			   $mover.animate({'left':(-itemWidth*pos)+'px'}, 300);
				 currentPos = pos;
				 if ($prev) {
					 if (pos==0) $prev.addClass('previous_button_disabled');
					 else $prev.removeClass('previous_button_disabled');
				 };
				 if ($next) {
					 if (pos==$scrollerItems.size()-nrVisibleItems) { $next.addClass('next_button_disabled'); }
					 else { $next.removeClass('next_button_disabled'); }
				 };
			 };

			moveScroller(0);
			 
		});
		
	};
})(jQuery);


/*
    IMAGE MAP with custom ROLLOVERS
*/

(function($){
	jQuery.fn.imageMap = function(options) {
		return this.each(function() { 
			var $map = $(this);
      var $areas = $('area',$(this));
			// replace map areas by transparent links
      $areas.each( function(i) {
				var $area = $(this);
				var href = $(this).attr('href');						
        var text = $(this).attr('alt');
				var pos = $area.attr('coords').split(',');
				var left = pos[0];
				var top = pos[1];				
				var width = pos[2]-pos[0];
				var height = pos[3]-pos[1];
				$map.prepend('<a href="'+href+'" style="cursor:help;display:block;position:absolute;z-index:'+(i+1100)+';left:'+left+'px;top:'+top+'px;width:'+width+'px;height:'+height+'px;" title="'+text+'"><img src="img/blank.gif" width="'+width+'" height="'+height+'" /></a>');
				$area.remove();
			});
			// add mouseover/out tooltip
			$('a',$map).click( function(e) { e.preventDefault(); });
			$('a',$map).tooltip({width:'auto',leftOffset:'center'});
		});
	};
})(jQuery);



/*
    TOOLTIP
*/

(function($){
  jQuery.fn.tooltip = function(options) {
		
		ttSettings = jQuery.extend({
			tooltipContainer : 'tooltip',										 
			leftOffset : 0,  // nr of pixels to move tooltip to left(-) or right(+), or 'center' ( tooltip is centered tov link ) 
			width: 'auto'    // width in px or auto (width automatically takes width of tooltip content )
		}, options);
		
		return this.each(function() {

      var $a = $(this); // link
			var offset;	
			
			// change TITLE attribute of link to REL attr
			$a.attr('rel',$a.attr('title'));
			$a.attr('title','');

      // add mouseover/out event on link
      $(this).mouseover( function(e) { showTooltip(); } ).mouseout( function() { hideTooltip() } );

			// show tooltip
			function showTooltip() { 
			
			  // Append #tooltip container to the page if it doesn't exist
				if ($('#'+ttSettings.tooltipContainer).length == 0 ) { $('body').append('<div id="'+ttSettings.tooltipContainer+'" style="width:'+ttSettings.width+'"><div class="tl"><div class="tr"></div></div><div class="bg_l clearfix"><div class="bg_r"><div id="tooltip_content"></div></div></div><div class="bl"><div class="br"></div></div></div>');  
				}
				var $tooltip = $('#'+ttSettings.tooltipContainer);
				
				// Set tooltip text
				$('#tooltip_content',$tooltip).html($a.attr('rel'));
				
				// Position tooltip and show it
				var pos = $a.offset();			
				if (ttSettings.leftOffset == 'center' ) {
					offset = Math.round(pos.left+$a.width()/2)-20;
			  } else { 
					offset = pos.left+ttSettings.leftOffset; 
				}
				var height = $tooltip.height();
				
				$('#'+ttSettings.tooltipContainer).css({'position':'absolute','left':+offset+'px','top':Math.round(pos.top-height),'z-index':'999'}).show();
		    
				// Take care of width 'auto' in ie6
				if (ie7 ) { if(ttSettings.width=='auto') { $('#'+ttSettings.tooltipContainer).css({'width':'150px'}); } }
				if (ie6) {
					if(ttSettings.width=='auto') {
						$('#'+ttSettings.tooltipContainer).css({'width':'100px'});
						$('#'+ttSettings.tooltipContainer+' .tl').css({'width': $('#tooltip_content',$tooltip).width()+33});
						$('#'+ttSettings.tooltipContainer+' .bl').css({'width': $('#tooltip_content',$tooltip).width()+47});
						$('#tooltip_content',$tooltip).css({'white-space':'nowrap'});
					}
				}
				// hide selectboxes in ie6
				if (ie6) $('select').css({'visibility':'hidden'}); 
				
			};
			function hideTooltip() { 
			  $('#'+ttSettings.tooltipContainer).hide(); 
				// show selectboxes in ie6
			  if(ie6) $('select').css({'visibility':'visible'}); 
			};
		});
  };
})(jQuery);


/* 
    TABS
*/

(function($) {
	jQuery.fn.tabs = function(options) {
		
		settings = jQuery.extend({
			tabs : '.tabs .tab_menu a',										 
			contentContainer : '.tab_content_container',
			contentItems : '.tab_content'
		}, options);
	
		return this.each(function(){
			//
			var $tabs = $(settings.tabs);
			var $contentContainer = $(settings.contentContainer);
			var $contentItems = $(settings.contentItems);
			var selectedTabIndex;
			
			// if the url does not contain a tab ID, the first tab is shown by default
			var h = window.location.hash;
			var initTab = ( h!='' && $(h).size()>0 ) ? h : '#VSX-920';
			
			// hide content items and show initial tab
			//$contentItems.each( function() { $(this).css("top", "2000px"); });
			
			showTab(initTab);
			
			
			$tabs.each( function() {
				//$(this).click( function(e) {
				$(this).click( function(e) {
			    var id = $(this).attr('href');
				  showTab(id); 
					//e.preventDefault();					
			  });										
		  }); 
	
			function showTab(tabId) { 
			   // get index of tab
				 var tabIndex;
				 $tabs.each( function(i) { if($(this).attr('href') == tabId) tabIndex = i; });
				 // deselect previous tab
				 if(selectedTabIndex!= undefined) {
					 $($tabs[selectedTabIndex]).removeClass('selected');		
					 //$($contentItems[selectedTabIndex]).css("top", "2000px");
					 $($contentItems[selectedTabIndex]).css("z-index", "10");
				 }			 
				 // select this tab
				 $($tabs[tabIndex]).addClass('selected');	
				 //$($contentItems[tabIndex]).css({"top": "10px"});
				 $($contentItems[tabIndex]).css("z-index", "12");
				 selectedTabIndex = tabIndex;
			};
	
		});
	
	};	
})(jQuery);
 



/* 
    SLIDESHOW
		Pass the number of the slide you want to show initially, eg. play_entertainment#1 shows 2nd slide
*/

(function($){
	jQuery.fn.slideShow = function(options) {
		
		settings = jQuery.extend({
			 menuContainer:   '.thumbs',
			 slidesContainer: '.slideshow_content',
			 animation:		''
		}, options);
	
		return this.each(function() {

			var $container = $(this);
			var $slides = $(settings.slidesContainer,$(this)).children();		
			var $menu = $(settings.menuContainer,$(this));
			$menu.append('<ul></ul>');
			var $menuItems;
			var previousSlide;
			
			$slides.each( function(i){
			
				$($slides[i]).css({'z-index':$slides.length-i,'position':'absolute','top':0,'left':0}).hide();
				var data = (new Function("return " + $($slides[i]).attr('rel')))(); 
				var thumbStr = '<li style="background:url('+data.thumb+')"><a href="#'+$($slides[i]).attr('id')+'" title="'+data.title+'"';
				if ( $($slides[i]).hasClass('video_item') ) { thumbStr += ' class="play" '; };
				thumbStr += '><span>'+data.title+'</span>';
				if ( $($slides[i]).hasClass('video_item') ) thumbStr += '<span class="icon"></span>';
				thumbStr += '</a></li>';
				$('ul',$menu).append(thumbStr);
				
			});
			$menuItems = $('li a',$menu);
     
	    $menuItems.each(function(i) {
						$(this).click(function(e) { e.preventDefault(); gotoSlide(i); });											 
			});
			
			
			// determine which slide to show initially
			// you can pass the ID of the slide or the slide number ( only if there is only one lightbox, e.g. in lightboxes )
			var initSlide;
      var h = window.location.hash.replace('#','');
		  
			if (h=='') {
				initSlide = 0;
			} else {
				if(isInteger(h)) {
					initSlide = Number(h);					 
				} else { 
					initSlide = getSlideNumber(h);
				}
	    }
			
			// go to initial slide
		  gotoSlide(initSlide);

			// Get slidenumber, you pass the id of the slide, you get the slide index in return
			function getSlideNumber(id) {
				  var index;
					 
					$slides.each( function(i){
				 		  if( $($slides[i]).attr('id') == id ) { index = i; return;}
							
			   	});
					
					if (index == undefined) { index = 0; }; 
					 
				  return index;	
			}


			// Go to slide 
			function gotoSlide(index) {
				 //alert('goToSlide '+ index + ' - ' + previousSlide);
				 if (index!=previousSlide) {
					 
					 // hide previous slide
						 if (previousSlide!=undefined) { 
							 $($menuItems[previousSlide]).removeClass('selected');						 
							 // remove video
							
							 if ( $($slides[previousSlide]).hasClass('video_item') ) { 
							   $('.flash_container',$($slides[previousSlide])).remove();
							 }
							 
							 $($slides[previousSlide]).hide();
						 }
					
					 // show current slide
					   $($menuItems[index]).addClass('selected');
					 	 // embed video
						 
						 if ( $($slides[index]).hasClass('video_item') ) { 
						   
							 var $slide = $($slides[index]);
							 var $videoLink = $('.video a',$slide);
						   
							 if ( $videoLink.size() == 0 ) {
									 //alert('please define a link to youtube'); 
							 } else {
								  
									 var videoData = (new Function("return " + $videoLink.attr('rel')))();
									 
									 var url = $videoLink.attr('href');
									 var id = videoData.id;
									 var w = videoData.width;
									 var h = videoData.height;
									 
									 var flashvars = {};
									 var params = {
										 scale: 'noScale',
										 allowfullscreen: 'true',
										 bgcolor: '#000000',
										 wmode: 'opaque',
										 allowscriptacces: 'always'
									 };
									 var attributes = {};
									 
									 $videoLink.hide();
									 $videoLink.after('<div class="flash_container"><div id="'+id+'" ></div></div>');
								 
									 // YOU TUBE EMBED
 								   if ( $('#'+id).size() > 0 ) { 
									   swfobject.embedSWF(url,id,w,h,"9.0.0","swf/expressInstall.swf", flashvars, params, attributes);	
									 }  
										
							 }
							 
						 };
						
					   $($slides[index]).show();
					   previousSlide = index;
						 
				 };
			};	
			
		});
	};
})(jQuery);








/*
    LIGHTBOX
*/

(function($) {
	jQuery.fn.lightbox = function(options) {
		
		// defaults, override with options
		settings = jQuery.extend({
		  overlayId : 'overlay_885-457',
			lightboxId : 'lightbox_885-457',
			overlayClass: 'lightbox_overlay',
			lightboxClass: 'lightbox',
			closeButtonClass: 'lightbox_close',
			contentClass: 'lightbox_content',
			width : 885,
			height : 457,
			source: 'blank.html'
		}, options);
	  
		return this.each(function(){
			// lightbox html
		  var lightbox = '';
			lightbox += '<div id="' + settings.overlayId + '" class="' + settings.overlayClass + '"></div>';
			lightbox += '<div id="' + settings.lightboxId + '" class="' + settings.lightboxClass + '" style="width:' + (settings.width) + 'px; height:' + (settings.height) + 'px; margin-top:-' + Math.round(settings.height/2) + 'px; margin-left:-' + Math.round(settings.width/2) + 'px;">';
			lightbox += '<div class="' + settings.closeButtonClass + '"></div><div class="' + settings.contentClass + '">';
			lightbox += '<iframe width="'+(settings.width)+'" height="'+(settings.height)+'" frameborder="0" scrolling="no" allowtransparency="true" id="lightbox_iframe" src="">&lt/iframe>';
			lightbox += '</div></div>';	

			jQuery.fn.open = function() {
			  			
				$lightbox = $('body').append(lightbox);
				
				
				if (ie6) {
					// position for IE6
					$('html').css({'height':'100%','overflow-y':'hidden'});
					// position background overlay
					lightboxPos = $('.'+settings.lightboxClass).offset();
					$('.'+settings.overlayClass).css({'background-position':'center '+(lightboxPos.top-150)});
					$('.'+settings.overlayClass).focus();				
					$(window).resize( function() { 
					  if ($('.'+settings.lightboxClass).length!=0) {												 
					  	lightboxPos = $('.'+settings.lightboxClass).offset();
					  	$('.'+settings.overlayClass).css({'background-position':'center '+(lightboxPos.top-150)}); 
						};
				  });
					
					
				} else { 
				  $('html').css({'height':'100%','overflow-y':'hidden'});
				}

	      $('#lightbox_iframe').attr('src',settings.source);
	      $('#lightbox_iframe').load( function() { $(this.contentDocument).find(".lightbox_footer").hide();	});
 
				$('.'+settings.closeButtonClass).click(function(){$lightbox.close();});
				$('.'+settings.overlayClass).click(function(){$lightbox.close();});
				
			}	
			
			

			jQuery.fn.close = function() {
			  $('html').css({'height':'auto','overflow-y':'scroll'});
				$('.'+settings.overlayClass).remove();
				$('.'+settings.lightboxClass).remove();
			}
			
			
    });

	};	
})(jQuery);


/*
    SOLUTIONS PAGE COMBO TABS
*/
(function($) {
	jQuery.fn.solutionsTabs = function(options) {

		settings = jQuery.extend({
			tabs : '#combo_tabs li',
			contentContainer : '#combo_tab_content',
			contentItems : '#combo_tab_content>div'
		}, options);

		return this.each(function(){
			var $tabs = $(settings.tabs);
			var $contentContainer = $(settings.contentContainer);
			var $contentItems = $(settings.contentItems);

			$tabs.each( function() {
				$(this).bind('mouseenter', function() {
					$(this).addClass("hover").siblings().removeClass("hover");
				});
				$(this).bind('mouseleave', function() {
					$(this).removeClass("hover");
				});
				$(this).bind('click', function() {
					$(this).addClass("currentTab").siblings().removeClass("currentTab");
					var index = $tabs.index($(this));
					$contentItems.eq(index).show().siblings().hide();
				});
			});

		});

	};
})(jQuery);


function isInteger(value) {
	return Math.floor(value) == value ? true : false; 
}