<!-- Begin
var gallery_items = new Array();

var fade_speed = 1000;
var swap_speed = 8000;

//*********************************************
//LOAD GALLERY CONTENT HERE AND AT HTML LEVEL *
//*********************************************

//column 0 - img loc
//column 1 - alt tag
//column 2 - img href


gallery_items[00] = "common/homepage/skin-smoothie-wash.jpg";
gallery_items[01] = "common/homepage/lavender-essential-oil.jpg";
gallery_items[02] = "common/homepage/refresh-essential-oil-blend.jpg";
gallery_items[10] = "Lavender Essential Oil";
gallery_items[11] = "Skin Smoothie Wash";
gallery_items[12] = "Reflesh Essential Oil Blend";
gallery_items[20] = "index.php?main_page=product_info&cPath=5&products_id=4";
gallery_items[21] = "index.php?main_page=product_info&cPath=7&products_id=70";
gallery_items[22] = "index.php?main_page=product_info&cPath=6&products_id=6";



$(document).ready(function() {






//pass zero in first element to avoid any sort of page numbering
//jquery and js have differeing id referencing requirements hence the # suffix for some elements




//GET INSPIRDED SCROLLER ****************************************************************************************

//temporarily disabled until content is developed

// 									number_of_elements,page_number_ref,layer1_length,layer2_length,list_element_length,prev_id,next_id,layer1_id,layer2_id,speed

//var get_inspired = new Animated_scroller(2,"getinspired_pagenumber",375,375,375,"#getinspired_prev","#getinspired_next","#getinspired_layer1","#getinspired_layer2",500);
var get_inspired = new Animated_scroller(2,"getinspired_pagenumber",375,375,375,"#getinspired_prev","#getinspired_next","#getinspired_layer1","#getinspired_layer2",500);


//set up page numbers:
get_inspired.updatePages();

//call bindback func to initilize event handlers
get_inspired.bindBack();




//PRODUCT LEFT RIGHT SCROLLER ****************************************************************************************


//CSS #scroller_container ul  needs to be adjusted depending on amount of items

//front_page_show_case_scroller needs to be adjusted - this file automatically populates the cart page as well

//shopping_cart.php needs adjustment

//can have odd layers , as long as longest layer is specified in css


// 									number_of_elements,page_number_ref,layer1_length,layer2_length,list_element_length,prev_id,next_id,layer1_id,layer2_id,speed
var product_scroller = new Animated_scroller(0,"",3740,3740,220,"#scroller_prev","#scroller_next","#scroller_layer1","#scroller_layer2",1);

//call bindback func to initilize event handlers
product_scroller.bindBack();



//VIDEO ****************************************************************************************

var so = new SWFObject('common/video/player.swf','mpl','400','328','9');
so.addParam('allowscriptaccess','never');
so.addParam('wmode','opaque');
so.addParam('allowfullscreen','false');
so.addParam('flashvars','&file=essential oils video.flv&stretching=exactfit&mute=false&volume=65');
so.write('video_box');








   $("#essential_oils_menu").bind("mouseover", function()
     {
 $('#essential_oils_menu_img').attr("src","common/menu/essential_oils_menu_on.jpg");
     }
 	);


   $("#essential_oils_menu").bind("mouseout", function()
     {
 $('#essential_oils_menu_img').attr("src","common/menu/essential_oils_menu_off.jpg");
     }
 	);


   $("#soap_making_supplies_menu").bind("mouseover", function()
     {
 $('#soap_making_supplies_menu_img').attr("src","common/menu/soap_making_supplies_menu_on.jpg");
     }
 	);


   $("#soap_making_supplies_menu").bind("mouseout", function()
     {
 $('#soap_making_supplies_menu_img').attr("src","common/menu/soap_making_supplies_menu_off.jpg");
     }
 	);

   $("#spa_supplies_menu").bind("mouseover", function()
     {
 $('#spa_supplies_menu_img').attr("src","common/menu/spa_supplies_menu_on.jpg");
     }
 	);


   $("#spa_supplies_menu").bind("mouseout", function()
     {
 $('#spa_supplies_menu_img').attr("src","common/menu/spa_supplies_menu_off.jpg");
     }
 	);

   $("#cosmetics_making_supplies_menu").bind("mouseover", function()
     {
 $('#cosmetics_making_supplies_menu_img').attr("src","common/menu/cosmetics_making_supplies_menu_on.jpg");
     }
 	);


   $("#cosmetics_making_supplies_menu").bind("mouseout", function()
     {
 $('#cosmetics_making_supplies_menu_img').attr("src","common/menu/cosmetics_making_supplies_menu_off.jpg");
     }
 	);




   $("#candle_making_supplies_menu").bind("mouseover", function()
     {
 $('#candle_making_supplies_menu_img').attr("src","common/menu/candle_making_supplies_menu_on.jpg");
     }
 	);


   $("#candle_making_supplies_menu").bind("mouseout", function()
     {
 $('#candle_making_supplies_menu_img').attr("src","common/menu/candle_making_supplies_menu_off.jpg");
     }
 	);






   $("#raw_materials_menu").bind("mouseover", function()
     {
 $('#raw_materials_menu_img').attr("src","common/menu/raw_materials_menu_on.jpg");
     }
 	);


   $("#raw_materials_menu").bind("mouseout", function()
     {
 $('#raw_materials_menu_img').attr("src","common/menu/raw_materials_menu_off.jpg");
     }
 	);

   $("#ready_to_use_menu").bind("mouseover", function()
     {
 $('#ready_to_use_menu_img').attr("src","common/menu/ready_to_use_menu_on.jpg");
     }
 	);


   $("#ready_to_use_menu").bind("mouseout", function()
     {
 $('#ready_to_use_menu_img').attr("src","common/menu/ready_to_use_menu_off.jpg");
     }
 	);


   $("#packaging_menu").bind("mouseover", function()
     {
 $('#packaging_menu_img').attr("src","common/menu/packaging_menu_on.jpg");
     }
 	);


   $("#packaging_menu").bind("mouseout", function()
     {
 $('#packaging_menu_img').attr("src","common/menu/packaging_menu_off.jpg");
     }
 	);





   $("#accessories_menu").bind("mouseover", function()
     {
 $('#accessories_menu_img').attr("src","common/menu/accessories_menu_on.jpg");
     }
 	);


   $("#accessories_menu").bind("mouseout", function()
     {
 $('#accessories_menu_img').attr("src","common/menu/accessories_menu_off.jpg");
     }
 	);



}

);
//  End -->

var active_element = 0;
var on_off = 1;
var attr_index=0;



function moveGalleryItem (list_item) {



document.getElementById("gallerylist1").childNodes[0].attributes[attr_index].value = "";
document.getElementById("gallerylist2").childNodes[0].attributes[attr_index].value = "";
document.getElementById("gallerylist3").childNodes[0].attributes[attr_index].value = "";



 
 


//*********************************************
//AUTOMATED TIMER GOES HERE *******************
//*********************************************
if (!list_item)
{




if (active_element == 3)
{
active_element = 0;
}

if (active_element == 0) 
{
//document.getElementById('placeholder').src = gallery_items[00];
//  $('#placeholder').fadeOut("slow");
//  $('#placeholder').fadeIn("slow");
//document.getElementById('placeholder').src = "blank.gif";



$('#placeholder').fadeTo(fade_speed, 0,function callback() {
  document.getElementById('placeholder').src = gallery_items[01];
}
);
$('#placeholder').fadeTo(fade_speed, 1.00);

 //$('#placeholder').fadeIn("slow");
 //$('#placeholder').fadeOut("slow");


//document.getElementById('placeholder').src = gallery_items[01];
 // $('#placeholder').fadeIn("slow");

document.getElementById('gallery_anchor_link').href = gallery_items[21];	
document.getElementById('placeholder').alt = gallery_items[11];
document.getElementById("gallerylist2").childNodes[0].attributes[attr_index].value = "bold";


}

if (active_element == 1) 
{  
//document.getElementById('placeholder').src = gallery_items[00];
 // $('#placeholder').fadeOut("slow");
//  $('#placeholder').fadeIn("slow");
//document.getElementById('placeholder').src = "blank.gif";



$('#placeholder').fadeTo(fade_speed, 0,function callback() {
  document.getElementById('placeholder').src = gallery_items[02];
}
);
$('#placeholder').fadeTo(fade_speed, 1.00);
 
 // $('#placeholder').fadeIn("slow");

 
document.getElementById('gallery_anchor_link').href = gallery_items[22];	
document.getElementById('placeholder').alt = gallery_items[12];
document.getElementById("gallerylist3").childNodes[0].attributes[attr_index].value = "bold";

}

if (active_element == 2) 
{


$('#placeholder').fadeTo(fade_speed, 0,function callback() {
  document.getElementById('placeholder').src = gallery_items[00];
}
);
$('#placeholder').fadeTo(fade_speed, 1.00);

 
document.getElementById('gallery_anchor_link').href = gallery_items[20];	
document.getElementById('placeholder').alt = gallery_items[10];
document.getElementById("gallerylist1").childNodes[0].attributes[attr_index].value = "bold";

}

active_element = active_element + 1;

//this should only be called if it wasnt triggered by the user pressing the NEXT LINK
//but it wont , since the next link will never be there....


//IF SOMEONE CLICKS RESUME BUTTON WE NEED TO PLAY THE SLIDE SHOW HERE....

//if automated timer - this would stop the show
//playstopgallery();
//if automated timer - this would restart it.
 //playstopgallery();



//force on - if we dont do this it will STOP as when timer in going on_off is at 1 and we
//want to continue going until we get stopped by the user
on_off=0;
playstopgallery();
 
 
 
return false;
//document.getElementById("gallerylist").childNodes[nodeval].childNodes[0].setAttribute('id','bold');;


}


//*********************************************
//DIRECT CLICK GOES HERE **********************
//*********************************************
else

{

//now we have the direct link to the anchor calling this function
//lets access its HREF and assign it to the place holder.

document.getElementById('placeholder').src = list_item.href;
document.getElementById('placeholder').alt = list_item.title;

//document.getElementById('placeholder').setAttribute('alt',list_item.title);

list_item.id = "bold";
//update the active_element based of the THIS name?
 
active_element = parseInt(list_item.name);



if (active_element == 0) 
{
document.getElementById('gallery_anchor_link').href = gallery_items[20];	
}

if (active_element == 1) 
{
document.getElementById('gallery_anchor_link').href = gallery_items[21];	
} 

if (active_element == 2) 
{
document.getElementById('gallery_anchor_link').href = gallery_items[22];	
}

//force off
//has to be forced: the first time  a user clicks the numbered links its okay, it will stop the show since onoff is at 1.
//the problem is that any subsequent clicks will result in restarting the show since the onoff will be switched to 0 in 
//the playstopgallery function
on_off=1;
playstopgallery();
 
 
 
 
return false;



}


}



function playstopgallery()
{

//if show is running, turn it off
if (on_off ==1)
{
$('#placeholder').stop();




if (active_element == 0) 
{
  document.getElementById('placeholder').src = gallery_items[00];
}

if (active_element == 1) 
{
  document.getElementById('placeholder').src = gallery_items[01];	
} 

if (active_element == 2) 
{
  document.getElementById('placeholder').src = gallery_items[02];
}



$('#placeholder').fadeTo(0, 1.00);




clearTimeout(t);
on_off=0;
document.getElementById('playstopbutton').src = "common/play.jpg";	
}
else
{
//if show is not running, turn it on
clearTimeout(t);
t=setTimeout ( "moveGalleryItem()", swap_speed );
on_off=1;
document.getElementById('playstopbutton').src = "common/stop.jpg";	
}



}



window.onload = function () 
{

//figure out which attribute index has the ID node
//various browsers have it at varying indexes
var galleryPointer=document.getElementById("gallerylist1").childNodes[0];

for( var x = 0; x < galleryPointer.attributes.length; x++ ) {
  if( galleryPointer.attributes[x].nodeName.toLowerCase() == 'id' ) {
   attr_index = x;
  }
}

//on_off=0;
//playstopgallery();
   t=setTimeout ( "moveGalleryItem()", 3000 );
}







//no matter what we have to stop the slide show
//playstopgallery();



 
//returns DATA attribute 1/3/5

//var attributes=document.getElementById("gallerylist").childNodes[1].childNodes[0].attributes;

//alert(attributes[0].name);



//access some <ul> element
//var galleryPointer=document.getElementById("gallerylist")



//for (i=0; i<galleryPointer.childNodes.length; i++){
//if (galleryPointer.childNodes[i].nodeName=="LI")
//do something
//alert(i);
//}


//document.getElementById("bold").setAttribute('id','notbold');


//document.getElementById("gallerylist2").childNodes[3].childNodes[0].setAttribute('id','');
//document.getElementById("gallerylist3").childNodes[5].childNodes[0].setAttribute('id','');


//alert(document.getElementById("gallerylist1").childnodes[0].nodevalue);
//var galleryPointer=document.getElementById("gallerylist1")
//for (i=0; i<galleryPointer.childNodes.length; i++){
//if (galleryPointer.childNodes[i].nodeName=="A")
//do something
//alert(i);
//}

//var attr_index = 0;
//for (i=0; i<galleryPointer.attributes.length; i++)
//{
//if (galleryPointer.attributes[i].value=="bold")
//{
//attr_index=i;
//}

//}



//var atts = document.getElementById("gallerylist1").childNodes[0].attributes[2].name;
//alert (atts);

//since the IE DOM is fucked up beyond recognition we might have to use
//INNER HTML to apply BOLD tag.  this unfortunetly will fuck up WC3 compliance but hey




//
//alert(list_item.nodename);

//document.getElementsByName('0')[0].setAttribute('id','');
//document.getElementsByName('1')[0].setAttribute('id','');
//document.getElementsByName('2')[0].setAttribute('id','');


