// JavaScript Document

//main and item page image rollovers
  if (document.images)
   {
     image_off= new Image(674,238);
     image_off.src="images/index_main_1_designstudio.gif";  

     image2= new Image(674,238);
     image2.src="images/index_main_2_wording.gif";
     image3= new Image(674,238);
     image3.src="images/index_main_3_matching.gif";  
 
     rollover1_off= new Image(224,24);
     rollover1_off.src="images/index_main_nav1.gif";  
 
     rollover2_off= new Image(224,24);
     rollover2_off.src="images/index_main_nav2.gif"; 
 
     rollover3_off= new Image(224,24);
     rollover3_off.src="images/index_main_nav3.gif"; 

  	 rollover1= new Image(224,24);
     rollover1.src="images/index_main_nav1_hover.gif";
     rollover2= new Image(224,24);
     rollover2.src="images/index_main_nav2_hover.gif"; 
	 rollover3= new Image(224,24);
     rollover3.src="images/index_main_nav3_hover.gif"; 
  
  	  
	 itemimage_off= new Image(263,380);
     itemimage_off.src="images/listpagesample_large.gif";  

     itemimage2= new Image(263,380);
     itemimage2.src="images/listpagesample2_large.gif";
     itemimage3= new Image(263,380);
     itemimage3.src="images/listpagesample3_large.gif";  
	 
	 qvimage_off= new Image(263,380);
     qvimage_off.src="../images/qvsample1_large.gif";  

     qvimage2= new Image(263,380);
     qvimage2.src="../images/qvsample2_large.gif";
     qvimage3= new Image(263,380);
     qvimage3.src="../images/qvsample3_large.gif";
 

	   
   }

function change1(picName,imgName)
 {
   if (document.images)
    {
      imgOn=eval(imgName + ".src");
      document[picName].src= imgOn;
    }
 }
 


//form input for email offer

 function clearMe(formfield){
  if (formfield.defaultValue==formfield.value)
   formfield.value = ""
 }
 
  function returnMe(formfield){
  if (formfield.value=="")
   formfield.value = formfield.defaultValue
 }
 
 
 /* MCB 2010.06.17  removed carousel stuff -- using a plugin */
   

/* MCB 2010.06.17  removed dd roundie stuff --
   put it in index 'cause it is a function in its own
   right and doesn't need to be re-wrapped to be used. */


//I'm not sure what this is for. I think DW wrote it to swap images or something
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}


/*
 Tooltip script
 powered by jQuery (http://www.jquery.com)

 written by Alen Grakalic (http://cssglobe.com)
 for more info visit http://cssglobe.com/post/1695/easiest-tooltip-and-image-preview-using-jquery

 ddrivetip conversion & tooltip modification by Rob G, aka Mottie (http://wowmotty.blogspot.com/)
 @updated (8/29/2009): Added Websnapr.com site screenshot option
*/

 // 'tooltipObjFlag' can be defined outside the script. It makes the script load tooltip content
 // from object id contained in the title, e.g. title='###test1'... will load content from #test1
 if (typeof(tooltipObjFlag)=='undefined') { var tooltipObjFlag = '###' }

 // 'tooltipSpeed' sets the display speed of the tooltip
 if (typeof(tooltipSpeed)=='undefined') { var tooltipSpeed = 300 }
 
 // 'tooltipLocal' is a flag that tells the script to attach the tooltip locally if set to true. If
 // false the tooltip is added to the body
 if (typeof(tooltipLocal)=='undefined') { var tooltipLocal = false }

 var xOffset = 10; // Don't use negative values here
 var yOffset = 10;

 var tooltipCSS = 'position:absolute;z-index:1000;';

this.tooltip = function(){
// Tooltips
 $('.tooltip').live('mouseover',function(e) {
  this.t = (this.title == '') ? this.t : this.title;
  var ttt = this.t;
  this.title = '';
  // Load tooltip content from an object
  var rx = new RegExp('^' + tooltipObjFlag);
  if (rx.test(ttt)) {
   tte = ttt.replace(rx,'#').split(' ')[0];
   // ignore the tooltipObjFlag if too short or too long (20 characters seemed reasonable)
   if (tte.length < 1 || tte.length > 20) {
    ttt = this.t;
   } else {
    ttt = $(tte).html();
   }
  }
  // replace new line with <br> (thanks Zbigniew!), or you can just use <br> in the title ;)
  ttt = ttt.replace(/\\n/g,'<br>');

  // retrieves width and color information from the rel attribute
  // rel='250,#000000;color:#ffffff;' => tooltip width = 250, background color = #000000, text = #ffffff
  var tmp = (typeof($(this).attr('rel'))=='undefined') ? '' : $(this).attr('rel').split(',');
  this.w = (tmp[0] == '') ? $('#tooltip').width() : tmp[0];
  this.c = (typeof(tmp[1])=='undefined') ? '' : 'background-color:' + tmp[1];
  var tmp = "<div id='tooltip' style='" + tooltipCSS + "width:" + this.w + "px;" + this.c + "'>" + ttt + "</div>";
  if (tooltipLocal){
   $(this).before(tmp);
  } else {
   $('body').append(tmp);
  }
  ttrelocate(e,'#tooltip');
  $('#tooltip').fadeIn(tooltipSpeed);
 })
 $('.tooltip').live('mouseout',function(e) {
  this.title = this.t;
  $('#tooltip').remove();
 });
 $('.tooltip').live('mousemove',function(e) {
  ttrelocate(e,'#tooltip');
 });
// Image & URL screenshot preview
 $('a.preview,a.screenshot').live('mouseover',function(e){
  this.t = this.title;
  this.title = '';
  var tmp = "<div id='preview' style='" + tooltipCSS + "'><img src='";
  var c = (this.t != '') ? '<br/>' + this.t : '';
  /* use websnapr.com to get website thumbnail preview if rel="#" */
  var ss = ($(this).hasClass('screenshot') && this.rel=="#") ? 'http://images.websnapr.com/?url=' + this.href : this.rel;
  tmp += ($(this).hasClass('preview')) ? this.href + "' alt='Image preview' />" : ss + "' alt='URL preview' />";
  tmp += c +"</div>";
  if (tooltipLocal){
   $(this).before(tmp);
  } else {
   $('body').append(tmp);
  }
  ttrelocate(e,'#preview');
  $('#preview').fadeIn(tooltipSpeed);
 })
 $('a.preview,a.screenshot').live('mouseout',function(e){
  this.title = this.t;
  $('#preview').remove();
 }); 
 $('a.preview,a.screenshot').live('mousemove',function(e){
  ttrelocate(e,'#preview');
 });
}
function ttrelocate(e,ttid){
 var ttw = $(ttid).width();
 var tth = $(ttid).height();
 var wscrY = $(window).scrollTop();
 var wscrX = $(window).scrollLeft();
 var curX = (document.all) ? event.clientX + wscrX : e.pageX;
 var curY = (document.all) ? event.clientY + wscrY : e.pageY;
 var ttleft = ((curX - wscrX + xOffset*2 + ttw) > $(window).width()) ? curX - ttw - xOffset : curX + xOffset;
 if (ttleft < wscrX + xOffset) ttleft = wscrX + xOffset;
 var tttop = ((curY - wscrY + yOffset*2 + tth) > $(window).height()) ? curY - tth - yOffset : curY + yOffset;
 if (tttop < wscrY + yOffset) tttop = curY + yOffset;
 $(ttid).css('top', tttop + 'px').css('left', ttleft + 'px');
}

function ddrivetip(ttt,ttc,ttw){
 var ttc = (ttc == '') ? '' : 'background-color:' + ttc;
 $('body').append("<div id='tooltip2' style='" + tooltipCSS + "width:" + ttw + "px;" + ttc + "'>" + ttt + "</div>");
 $('#tooltip2').fadeIn(tooltipSpeed);
}
function hideddrivetip(){
 $('#tooltip2').remove();
}
function positiontip(evt){
 if ($('#tooltip2').length) ttrelocate(evt,'#tooltip2');
}
document.onmousemove = positiontip;

$(document).ready(function(){
 tooltip();
});


//homepage content slider

$(document).ready(function() {
	//Show the paging and activate its first link
$(".paging").show();
$(".paging a:first").addClass("active");

//Get size of the image, how many images there are, then determin the size of the image reel.
var imageWidth = $(".window").width();
var imageSum = $(".image_reel img").size();
var imageReelWidth = imageWidth * imageSum;

//Adjust the image reel to its new size
$(".image_reel").css({'width' : imageReelWidth})

;
//Paging  and Slider Function
rotate = function(){
    var triggerID = $active.attr("rel") - 1; //Get number of times to slide
    var image_reelPosition = triggerID * imageWidth; //Determines the distance the image reel needs to slide

    $(".paging a").removeClass('active'); //Remove all active class
    $active.addClass('active'); //Add active class (the $active is declared in the rotateSwitch function)

    //Slider Animation
    $(".image_reel").animate({
        left: -image_reelPosition
    }, 500 );

}; 

//Rotation  and Timing Event
rotateSwitch = function(){
    play = setInterval(function(){ //Set timer - this will repeat itself every 7 seconds
        $active = $('.paging a.active').next(); //Move to the next paging
        if ( $active.length === 0) { //If paging reaches the end...
            $active = $('.paging a:first'); //go back to first
        }
        rotate(); //Trigger the paging and slider function
    }, 7000); //Timer speed in milliseconds (7 seconds)
};

rotateSwitch(); //Run function on launch

});