
  var currentPosition = 0;
  var numberOfItem    = 5;
  var animationDelay  = 4000;
  var isAnime = true;
	
  function loadAllAnimationImages(animImages) {
	for(var i=0; i<animImages.length; i++) {
	  temp = animImages[i];
	  for(var j=0; j<temp.length; j++) {
		loadAnimationImage("img"+(i+1)+(j+1),temp[j]);
	  }
	}
  }
  
  function loadAnimationImages(animImages, currPos) {
    for(var i=0; i<animImages.length; i++) {
      loadAnimationImage("img"+currPos+(i+1),animImages[i]);
    }
  }

  function loadAnimationImage(imgID, imgURL) {
    var img = document.createElement('img');
    img.onload = function (e) {
      document.getElementById(imgID).width=this.width;
      document.getElementById(imgID).height=this.height;
      document.getElementById(imgID).src=this.src;
    }
    img.src = imgURL;
  }

	var animImages = [  ["cts-certif-mark-491-212.jpg",
                        "sgs_ar_09_homepage_image.jpg",
                        "cts-market-your-mark-491x212-new.jpg",
                        "envi-climate-change-491x212.jpg",
                        "ind-asset-integrity-491x212.jpg"
						],
						[
					    "gis-product-conformity-491x212.jpg",
						"min-real-time-analysis-491x212.jpg",
						"min-geological-analysis-491.jpg",
						"life-usp-regulation-491x212.jpg",
                        "ssc-food-safety-491-212.jpg"
						],
						["agri-seed-services-491x212.jpg",
                        "auto-public-service-veh-insp-491x212.jpg",
                        "cts-food-higiene-491x212.jpg",
                        "envi-emission-measurement-491x212.jpg",
                        "ind-wind-energy-491x212.jpg"
						],
						[
					    "gis-advanced-cargo-491x212.jpg",
						"min-geometallurgy-491x212.jpg",
						"ogc-oil-rig-491x212.jpg",
						"life-clinical-trial-491x212.jpg",
                        "auto-industry-491x212.jpg"
						]
					 ];

	$(function() {
      // this initialises scollpanes on the page.
	  $('#pane1').jScrollPane({showArrows:true});
	  $('#pane2').jScrollPane({showArrows:true});
	  $('#pane3').jScrollPane({showArrows:true});
	});
		
    // When the document loads do everything inside here ...
    function init() {
	  // load animation images for the first images set.
	  loadAnimationImages(animImages[0],1);
		
	// Left Tabs
	$("#tab1-content2").fadeOut("fast");
	$("#tab1-content3").fadeOut("fast");
		
	// When a link is clicked
	$("#leftTabbedPane a.tab").click(function () {
		// switch all tabs off
		$("#leftTabbedPane .active").removeClass("active");
			
		// switch this tab on
		$(this).addClass("active");
		
		// slide all content up
		var content_show = $(this).attr("title");        

		$("#leftTabbedPane .current").fadeOut("slow", function(){
			$("#leftTabbedPane .current").removeClass("current");
			$("#"+content_show).fadeIn("slow");
			$("#"+content_show).addClass("current");
		});

	});
		
	// Right Tabs
	$("#tab2-content2").fadeOut("fast");
	$("#tab2-content3").fadeOut("fast");
		
	// When a link is clicked
	$("#rightTabbedPane a.tab").click(function () {
		// switch all tabs off
		$("#rightTabbedPane .active").removeClass("active");
			
		// switch this tab on
		$(this).addClass("active");
		
		// slide all content up
		var content_show = $(this).attr("title");        

		$("#rightTabbedPane .current").fadeOut("slow", function(){
			$("#rightTabbedPane .current").removeClass("current");
			$("#"+content_show).fadeIn("slow");
			$("#"+content_show).addClass("current");
		});

	});
	
	//Create Slideshow Effect
	var slideWidth = 778;
	var slides = $('.slide');
	var numberOfSlides = slides.length;

	// Remove scrollbar in JS
    $('#slidesContainer').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')
		.prepend('<span class="control" id="leftControl">&nbsp;&nbsp;Previous</span>')
		.append('<span class="control" id="rightControl"> </span>');

		// Hide left arrow control on first load
		manageControls(currentPosition);

		// Create event listeners for .controls clicks
		$('.control').bind('click', function(){
		  isAnime = false;
		  moveSlideshow(this);
		 
		});
		
		// 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() }
		}
		
		var currentItem = 1;
		
		function animSlidshow(){
		  if(isAnime) {
			currentItem = currentItem + 1;
		  	  
			if(currentItem > numberOfItem) {
			  currentItem = 1;
			  slides = $('.slide');
			  numberOfSlides = slides.length;
		  
			  if(currentPosition==numberOfSlides-1){
			    currentPosition = -1;
			  }
			  moveSlideshow($('#rightControl'));
			} else {
			  changeItem($('#item'+(currentPosition+1)+(currentItem)));	
			}
			setTimeout(function(){animSlidshow();}, animationDelay);
		  }
		}

		function moveSlideshow(elem){
		   // Determine new position
		  currentPosition = ($(elem).attr('id')=='rightControl') ? currentPosition+1 : currentPosition-1;
	  
		  // Hide / show controls
		  manageControls(currentPosition);
	  
		  // Move slideInner using margin-left
		  $('#slideInner').animate({
		    'marginLeft' : slideWidth*(-currentPosition)
		  });

		  // test if images are loaded
		  nextImage = document.getElementById("img"+(currentPosition+1)+"1").src;
		  lastSepInd = nextImage.lastIndexOf("/")+1;
		  imageName = nextImage.substring(lastSepInd,nextImage.length);
		  if(imageName == "spacer.gif") {
			loadAnimationImages(animImages[currentPosition],currentPosition+1);
		  }
		  $("#slide"+(currentPosition+1)+"1").fadeIn("slow");
		  $(".description")[currentPosition].innerHTML = $("#slide"+[currentPosition+1]+"1 .text")[0].innerHTML;	
		  $(".right-zone .active").removeClass("active");
		  $('#item'+(currentPosition+1)+'1').addClass("active");
		}
		
		$('.right-zone .item').bind('click', function(){
		  isAnime = false;
		  changeItem(this);
		});
		
		function changeItem(item) {
		  $(".right-zone .active").removeClass("active");
		  $(item).addClass("active");
		  var item_show = $(item).attr("title");
			
		  $(".slider-container .slide-item").fadeOut("slow");	
		  $("#slide"+item_show).fadeIn("slow");
		  $(".description")[currentPosition].innerHTML = $("#slide"+item_show+" .text")[0].innerHTML;
		}
		
		setTimeout(function(){animSlidshow();}, animationDelay);
	  }
	  
function openPageLargerMrTed(href) {
	if(href!=""){
	
		(href.substr(0,5)!="corp-")?window.open(href, '_blank', 'toolbar=yes,location=yes,status=yes,menubar=yes,personalbar=yes,scrollbars=yes,resizable=yes,screenx=50,left=50,screenY=50,top=50'):window.location=href.substr(5,href.length);
	}
}

function openPageLargerMrTedSpont(href) {
	if(href!=""){
	
		(href.indexOf("spont")==-1)?window.open(href, '_blank', 'toolbar=yes,location=yes,status=yes,menubar=yes,personalbar=yes,scrollbars=yes,resizable=yes,screenx=50,left=50,screenY=50,top=50'):window.location=href.substr(href.indexOf("spont")+6,href.length);
	}
}

function openFullPage(href) {
	if(href!=""){
		var wOptions = "toolbar=yes,location=yes,status=yes,menubar=yes,personalbar=yes," +
			"scrollbars=yes,resizable=yes,outerHeight=" + screen.availHeight + ",outerWidth=" +
			screen.availWidth + ",screenX=0,screenY=0,height=" + screen.availHeight + ",width=" +
			screen.availWidth + ",left=0,top=0";
		window.open(href, '_blank', wOptions);
	}
}

// default search text clear
function clearDefault(inputField)
{   
    if (inputField.type == "text") {
        if (inputField.value != "")
           {
                inputField.value = "";
                inputField.style.color='';
           }
    }
}

function putDefault(inputField)
{   
    if (inputField.type == "text") {
           if (inputField.value == "")
           {
              inputField.value = "Search Term...";
              inputField.style.color='#aaaaaa';
           }
    }        
}

