$(document).ready(function(){
  /*  
  //Blur Links (Prevents Outline)
  $('a').click(function() {
    this.blur();
  });
  */
  //Hide all item descriptions in the info box
  $("#infobox > div").css("display", "none");
  $("#infobox").show();
  //Call in the info box
  $(".more a").click(function(){
    $("#infobox").animate({bottom: '233px' }, 300);
    $("#fade_bg").fadeIn();
    return false;
  });

  //Expand more info button on hover
  $(".more").hover(function(){
    //$(this).stop().animate({width: '250px'});//, height: '50px' }, 200).css({'z-index' : '10'}); //Change the width increase caption size
    $(this).stop().animate({width: '250px', height: '50px' }, 200).css({'z-index' : '10'}); //Change the width increase caption size
    //$('img',this).stop().animate({width: '50px'}, 100);//, height: '50px' }, 200); //Change the width of the img icon
  }, function () {
    //$(this).stop().animate({width: '30px'});//, height: '30px' }, 200).css({'z-index' : '1'});
    $(this).stop().animate({width: '30px', height: '30px' }, 200).css({'z-index' : '1'});
    //$('img',this).stop().animate({width: '30px'}, 100);//, height: '30px' }, 200);
});

//Show description for selected item
  $("#couch a").click(function(){
    $("#couch_info").show();
  });

  $("#plant a").click(function(){
    $("#plant_info").show();
  });

  $("#monitor a").click(function(){
    $("#monitor_info").show();
  });

  $("#board a").click(function(){
    $("#board_info").show();
  });

  //Remove background, info box and hide all descriptions
  $("#fade_bg, .close").click(function(){
    $("#fade_bg").fadeOut();
    $("#infobox").animate({bottom: '-200px' }, 300, function() {
      $("#infobox > div").css("display", "none");
    });
    return false;
  });

  var currentPosition = 0;
  var slideWidth = 920;
  var slides = $('.slide');
  var numberOfSlides = slides.length;
  // Remove scrollbar in JS
  $('#slidesContainer').css('overflow', 'hidden');
  //$('.view-hp-taxonomy-rotator2 .view-content').css('overflow', 'hidden');
 
  // Wrap all .slides with #slideInner div
  slides
    .wrapAll('<div id="slideInner"></div>')
    // Float left to display horizontally, readjust .slides width
	.css({
      'float' : 'left',
      'width' : slideWidth
    });
 
  // Set #slideInner width equal to total width of all slides
  $('#slideInner').css('width', slideWidth * numberOfSlides);
 
  // Insert controls in the DOM
  $('#slideshow')
//  $('.view-hp-taxonomy-rotator2')
    .prepend('<span class="control" id="leftControl">Clicking moves left</span>')
    .append('<span class="control" id="rightControl">Clicking moves right</span>');
 
  // Hide left arrow control on first load
  manageControls(currentPosition);
 
  // Create event listeners for .controls clicks
  $('.control')
    .bind('click', function(){
    // Determine new position
	currentPosition = ($(this).attr('id')=='rightControl') ? currentPosition+1 : currentPosition-1;
    
	// Hide / show controls
    manageControls(currentPosition);
    // Move slideInner using margin-left
    $('#slideInner').animate({
      'marginLeft' : slideWidth*(-currentPosition)
    });
  });
 
  // manageControls: Hides and Shows controls depending on currentPosition
  function manageControls(position){
    // Hide left arrow if position is first slide
	if(position==0){ $('#leftControl').hide() } else{ $('#leftControl').show() }
	// Hide right arrow if position is last slide
    if(position==numberOfSlides-1){ $('#rightControl').hide() } else{ $('#rightControl').show() }
  }	
});