// JavaScript Document
<!--
var navflag = 0;
var img_name;
var img_src;
var img_src_off;
var layer;
var info_layer = 'featuresL';
var info_button = 'button_features';
var tobeoffsource = '../../images/layout/key_features.jpg';

function printLayer() {
   //alert("Hello");
   
   document.write('<div id="nav001"  onMouseOver="showMenu(this.id)" onMouseOut="offMenu(this.id)" style="position:absolute; left:700; top:210; width:100; height:60; z-index:1; background-color: #F1F1F2; layer-background-color: #F1F1F2; border: 1px none #000000; visibility: hidden;">' +
   '<table width="100" height="60" border="0" cellpadding="0" cellspacing="0">' +
   '<tr><td id="nav001_01" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../blank_media/cdrs/index.htm">CDRs</a></div></td></tr>' + 
   '<tr><td id="nav001_02" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../blank_media/dvds/index.htm">DVDs</a></div></td></tr>' +
   '<tr><td id="nav001_04" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../blank_media/labelling/index.htm">Labelling</a></div></td></tr>' +
   '</table></div>');

   document.write('<div id="nav002"  onMouseOver="showMenu(this.id)" onMouseOut="offMenu(this.id)" style="position:absolute; left:700px; top:240px; width:100; height:40; z-index:1; background-color: #F1F1F2; layer-background-color: #F1F1F2; border: 1px none #000000; visibility: hidden;">' +
   '<table width="100" height="40" border="0" cellpadding="0" cellspacing="0">' +
   '<tr><td id="nav002_01" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../pc_acc/pc_acc/index.htm">PC Accessories</a></div></td></tr>' +
   '<tr><td id="nav002_02" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../pc_acc/card_reader/index.htm">Card Reader </a></div></td></tr>' +
   '</table></div>');
   
   document.write('<div id="nav003" onMouseOver="showMenu(this.id)" onMouseOut="offMenu(this.id)" style="position:absolute; left:700; top:270; width:100; height:60; z-index:1; background-color: #F1F1F2; layer-background-color: #F1F1F2; border: 1px none #000000; visibility: hidden;">' +
   '<table width="100" height="60" border="0" cellpadding="0" cellspacing="0">' +
   '<tr><td id="nav003_01" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../input_device/mice/index.htm">Mice</a></div></td></tr>' +
   '<tr><td id="nav003_02" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../input_device/keyboard/index.htm">Keyboard</a></div></td></tr>' +
   '<tr><td id="nav003_03" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../input_device/combo_set/index.htm">Combo Set </a></div></td></tr>' +
   '</table></div>');
   
   document.write('<div id="nav004" onMouseOver="showMenu(this.id)" onMouseOut="offMenu(this.id)" style="position:absolute; left:700; top:300; width:100; height:40; z-index:1; background-color: #F1F1F2; layer-background-color: #F1F1F2; border: 1px none #000000; visibility: hidden;">' +
   '<table width="100" height="40" border="0" cellpadding="0" cellspacing="0">' +
   '<tr><td id="nav004_01" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../flash_memory/usb_flash/index.htm">USB Flash </a></div></td></tr>' +
   '<tr><td id="nav004_02" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../flash_memory/sd_card/index.htm">SD Card </a></div></td></tr>' +
   '</table></div>');
   
   document.write('<div id="nav006"  onMouseOver="showMenu(this.id)" onMouseOut="offMenu(this.id)" style="position:absolute; left:700; top:360; width:100; height:60; z-index:1; background-color: #F1F1F2; layer-background-color: #F1F1F2; border: 1px none #000000; visibility: hidden;">' +
   '<table width="100" height="40" border="0" cellpadding="0" cellspacing="0">' +
   '<tr><td id="nav006_01" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="http://www.precisiongaming.com.au">PRECISION</a></div></td></tr>' +
   '<tr><td id="nav006_02" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../gaming_acc/gtek1_index.html">G-Tek</a></div></td></tr>' + 
   '</table></div>');

   document.write('<div id="nav007"  onMouseOver="showMenu(this.id)" onMouseOut="offMenu(this.id)" style="position:absolute; left:700px; top:390px; width:100; height:80; z-index:1; background-color: #F1F1F2; layer-background-color: #F1F1F2; border: 1px none #000000; visibility: hidden;">' +
   '<table width="100" height="80" border="0" cellpadding="0" cellspacing="0">' +
   '<tr><td id="nav007_01" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../notebook_acc/stands/index.htm">Stands</a></div></td></tr>' +
   '<tr><td id="nav007_02" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../notebook_acc/chargers/index.htm">Chargers</a></div></td></tr>' +
   '<tr><td id="nav007_03" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../notebook_acc/cases/index.htm">Cases</a></div></td></tr>' +
   '<tr><td id="nav007_04" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../notebook_acc/security/index.htm">Security</a></div></td></tr>' +
   '</table></div>');
   
   document.write('<div id="nav008" onMouseOver="showMenu(this.id)" onMouseOut="offMenu(this.id)" style="position:absolute; left:700px; top:420px; width:150; height:80; z-index:1; background-color: #F1F1F2; layer-background-color: #F1F1F2; border: 1px none #000000; visibility: hidden;">' +
   '<table width="150" height="80" border="0" cellpadding="0" cellspacing="0">' +
   '<tr><td id="nav008_01" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../hardware/removable_hdd_racks/index.htm">Removable HDD Racks</a></div></td></tr>' +
   '<tr><td id="nav008_02" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../hardware/hdd_external_cases/index.htm">HDD External Cases</a></div></td></tr>' +
   '<tr><td id="nav008_03" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../hardware/kvm_switches/index.htm">KVM Switches </a></div></td></tr>' +
   '<tr><td id="nav008_04" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../hardware/duplicator/index.htm">Duplicator</a></div></td></tr>' +
   '</table></div>');
   
   document.write('<div id="nav009" onMouseOver="showMenu(this.id)" onMouseOut="offMenu(this.id)" style="position:absolute; left:700; top:450; width:100; height:60; z-index:1; background-color: #F1F1F2; layer-background-color: #F1F1F2; border: 1px none #000000; visibility: hidden;">' +
   '<table width="100" height="60" border="0" cellpadding="0" cellspacing="0">' +
   '<tr><td id="nav009_01" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../cables/transguard/index.htm">TransGuard</a></div></td></tr>' +
   '<tr><td id="nav009_02" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../cables/goldx_cables/index.htm">GoldX Cables </a></div></td></tr>' +
   '<tr><td id="nav009_03" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../cables/usb/index.htm">USB</a></div></td></tr>' +
   '<tr><td id="nav009_04" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../cables/ps2/index.htm">PS/2</a></div></td></tr>' +
   '</table></div>');
   
   document.write('<div id="nav011"  onMouseOver="showMenu(this.id)" onMouseOut="offMenu(this.id)" style="position:absolute; left:700px; top:510px; width:100; height:80; z-index:1; background-color: #F1F1F2; layer-background-color: #F1F1F2; border: 1px none #000000; visibility: hidden;">' +
   '<table width="100" height="80" border="0" cellpadding="0" cellspacing="0">' +
   '<tr><td id="nav011_01" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../media_storage/cd_cases/index.htm">CD Cases </a></div></td></tr>' +
   '<tr><td id="nav011_02" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../media_storage/dvd_cases/index.htm">DVD Cases </a></div></td></tr>' +
   '<tr><td id="nav011_03" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../media_storage/cd_dvd_sleeves/index.htm">CD/DVD Sleeves</a></div></td></tr>' +
   '<tr><td id="nav011_04" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../media_storage/bulk_storage/index.htm">Bulk Storage </a></div></td></tr>' +
   '</table></div>');
   
   document.write('<div id="nav012"  onMouseOver="showMenu(this.id)" onMouseOut="offMenu(this.id)" style="position:absolute; left:700; top:540; width:150; height:40; z-index:1; background-color: #F1F1F2; layer-background-color: #F1F1F2; border: 1px none #000000; visibility: hidden;">' +
   '<table width="150" height="40" border="0" cellpadding="0" cellspacing="0">' +
   '<tr><td id="nav012_01" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../multimedia/speaker_headset/index.htm">Speaker &amp; Headset</a></div></td></tr>' +
   '<tr><td id="nav012_02" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../multimedia/portable_audio_device/index.htm">Portable Audio Device <br> &amp; MP3/MP4</a></div></td></tr>' +
   '<tr><td id="nav012_03" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../multimedia/iRange/index.htm">iRange </a></div></td></tr>' +
	 '</table></div>');
   
   /* -- Reserve for Networking & GPS sub categories --
   document.write('<div id="nav013"  onMouseOver="showMenu(this.id)" onMouseOut="offMenu(this.id)" style="position:absolute; left:700; top:570; width:150; height:40; z-index:1; background-color: #F1F1F2; layer-background-color: #F1F1F2; border: 1px none #000000; visibility: hidden;">' +
   '<table width="150" height="40" border="0" cellpadding="0" cellspacing="0">' +
   '<tr><td id="nav013_01" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../multimedia/speaker_headset/index.htm">Speaker &amp; Headset</a></div></td></tr>' +
   '<tr><td id="nav013_02" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../multimedia/portable_audio_device/index.htm">Portable Audio Device <br> &amp; MP3</a></div></td></tr>' +
   '</table></div>');
   
   document.write('<div id="nav014"  onMouseOver="showMenu(this.id)" onMouseOut="offMenu(this.id)" style="position:absolute; left:700; top:600; width:150; height:40; z-index:1; background-color: #F1F1F2; layer-background-color: #F1F1F2; border: 1px none #000000; visibility: hidden;">' +
   '<table width="150" height="40" border="0" cellpadding="0" cellspacing="0">' +
   '<tr><td id="nav014_01" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../multimedia/speaker_headset/index.htm">Speaker &amp; Headset</a></div></td></tr>' +
   '<tr><td id="nav014_02" bgcolor="#F1F1F2" onMouseOver="selectColor(this.id)" onMouseOut="originalColor(this.id)"><div align="center"><a class="three" href="../../multimedia/portable_audio_device/index.htm">Portable Audio Device <br> &amp; MP3</a></div></td></tr>' +
   '</table></div>');
   -- Reserve -- */ 
}

function run() {
   repositionInfo(info_layer);
   document.getElementById(info_layer).style.visibility = "visible"; 
}

function checkbuttonOn(layer, img, source) {
   if (layer != info_layer) {
      //alert(img);
	  document.getElementById(img).src = source;
   }
}

/* Reposition for product info layers. i.e. Features, Specifications and Others*/
function repositionInfo(layer) {
   if (document.body.clientWidth > 950) {
      var cal = ((((document.body.clientWidth) - 950)/2) + 420);
         document.getElementById(layer).style.left = cal;
   } else document.getElementById(layer).style.left = 420;
} //end repositionInfo()

/**/
function changeVisProd(layer, img, off_source) {
   if (layer == info_layer) {
      //alert("Same Layer Clicked");
   }  else {
	  repositionInfo(layer); //check 
      document.getElementById(info_layer).style.visibility = "hidden"; 
      document.getElementById(layer).style.visibility = "visible"; 

      document.getElementById(info_button).src = tobeoffsource; 
	  
	  info_button = img;
	  tobeoffsource = off_source;
      info_layer = layer;
   }
} // end changeVisProd

function bookmark(url,title){
  if ((navigator.appName == "Microsoft Internet Explorer") && (parseInt(navigator.appVersion) >= 4)) {
  window.external.AddFavorite(url,title);
  } else if (navigator.appName == "Netscape") {
    window.sidebar.addPanel(title,url,"");
  } else {
    alert("Press CTRL-D (Netscape) or CTRL-T (Opera) to bookmark");
  }
}

function selectColor(name) {
   //document.getElementById(name).style.backgroundColor = "#cccccc";
}

function originalColor(name) {
   //document.getElementById(name).style.backgroundColor = "#F1F1F2";
}

var newx = 1300;
var newy = 50;
var newxr = -400;

function startAnimation() {
   newx = 1300;
   newy = 50;
   newxr = -400;
   window.setTimeout ("startAnimation()", 30000);
   alert("Damn");
   animation();
} // end startAnimation

function animation() {
   if (newx > -400) {
	   document.getElementById("container").style.left = newx;
	   document.getElementById("container").style.top = newy;
	   window.setTimeout ("animation()", 100);
       newx = newx - 50;
       newy = newy + 8;
   } else if (newxr < 1000) {
	   document.getElementById("container").style.left = newxr;
	   document.getElementById("container").style.top = newy;
       newxr = newxr + 50;
       newy = newy + 5;
	   window.setTimeout ("animation()", 50);
   }
} // end animation

/* This function generates a real time clock, copy from mastery task
 * It gets the current time and print it on the page. It has been used in the assignment 1
 */
function changeTime() {
   // initalize variables
   var ih, im, is;
   var today;
   var ihs, ims, iss;
   var timetext = ""; // text that represents the clock
   today = new Date();
   ih = today.getHours(); // get the current hours
   im = today.getMinutes(); // get the current minutes
   is = today.getSeconds(); // get the current seconds

   // check the time units are under 10, if yes, add "0" in front
   if (ih < 10) {ihs = "0" + ih;} else {ihs = ih;}
   if (im < 10) {ims = "0" + im;} else {ims = im;}
   if (is < 10) {iss = "0" + is;} else {iss = is;}

   timetext = ihs + ":" + ims + ":" +iss; // create the time text 
   time.innerHTML = timetext; // print the clock on the page
   window.setTimeout ("changeTime()", 200); // set the timer and call the function itself
}// end changeTime()


/* This function is using array to generate the current day, month, and year
 * and print it out on the page one by one using the timer. has been also used in assignment 1 
 */
var j = 0; // counter for loop an array
var datetext = ""; // stores the text which contains the day, , date, month, and year 
var datearray = new Array(); // stores the date 
function printDay() {   
   var dt = new Array(); // stores all the days
   var dm = new Array(); // stores all the months
   var dateLast = new Date(document.lastModified);
	 // initalize the arrays
   dt[0] = "Sunday";   dt[1] = "Monday";
   dt[2] = "Tuesday";  dt[3] = "Wednesday";
   dt[4] = "Thursday"; dt[5] = "Friday";
   dt[6] = "Saturday";

   dm[0] = "January";   dm[1] = "February";
   dm[2] = "March"; dm[3] = "April";
   dm[4] = "May";   dm[5] = "June";
   dm[6] = "July";  dm[7] = "August";
   dm[8] = "September";   dm[9] = "October";
   dm[10] = "November";  dm[11] = "December";
   
   datearray = ["Welcome ", "to ", "LASER ", " - ", dt[(new Date()).getDay()], ", ", new Date().getDate(), " ", dm[(new Date()).getMonth()], " ", new Date().getFullYear()];
   while (j < datearray.length) {
      datetext += datearray[j]; // add one more words to the text from datearray
      date.innerHTML = datetext; // print the text on page
      j++; // counter incresement
      //window.setTimeout("printDay()", 200); // set the timer and recursivly call the function itself
   }// end if
   
   //changeTime();

   var dateLast_text = ("This page was last updated: " + [dateLast.getDate(), dm[dateLast.getMonth()], dateLast.getFullYear()]);
   last.innerHTML = dateLast_text;
   
}// end printDay()


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 checkVIS(layer) {
   document.getElementById(layer).style.visibility = 'hidden';
   setTimeout("checkInLayer()", 1);
}

function flagUp() {
   navflag = 1;
}

function flagDown() {
   navflag = 0;
   MM_swapImgRestore();
}

function start(a, b, c, d) {
   img_name = a;
   img_src = b;
   img_src_off = c;
   layer = d;
   document[img_name].src = img_src;
   showMenu(layer);
}

function checkInLayer() {
   if (navflag == 1) {
	  navflag = 0;
   } else {
	  MM_swapImgRestore();
   }
}

function repositionCar() {
   var cal = 0;
   if (document.body.clientWidth > 950) {
      cal = (document.body.clientWidth - 950) / 2;
      document.getElementById("Layer1").style.left = cal;
   } // end if 
} // end repositionCar()

function reposition(layer) {
   var cal = 0;
   if (document.body.clientWidth > 950) {
      if (document.getElementById(layer).style.width == '150px') { 
         cal = ((((document.body.clientWidth) - 950)/2) + 800) - 150;
	  } else cal = ((((document.body.clientWidth) - 950)/2) + 800) - 100;
      
	  document.getElementById(layer).style.left = cal;
   } else if (document.getElementById(layer).style.width == '150px') {
        document.getElementById(layer).style.left = 650;
	 } else document.getElementById(layer).style.left = 700;
} //end reposition()

function showMenu() {
   reposition(layer);
   document[img_name].src = img_src;
   document.getElementById(layer).style.visibility = 'visible';
}

function offMenu(layer) {
   reposition(layer);
   document[img_name].src = img_src_off;
   document.getElementById(layer).style.visibility = 'hidden';
}

function MM_reloadPage(init) {  //reloads the window if Nav4 resized
  if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
    document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
  else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);

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_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];}
}
//-->