var aId;

function menuWindow(text,img)
{
 if (text!='#')
 {
  if (aId && img!='animation')
  {
   window.clearInterval(aId);
   aId = null;   
  }
  
  if (rFlag == true)
  {
   rearrange();
   rFlag = false;
  }

  changeProduct(img);
  changeProductText(text);
  changeProductImage();
 }
 else
 {
  window.alert('Please select an item from the menu');	 
 }
}

function changeProduct(value)
{
 var mainleft = document.getElementById('mainleft');
 
 if (value)
 {
  if (value == 'animation')
  {
   if (aId)
    return;
   animation();
   return;
  }

  var existingImage = mainleft.firstChild;
  var existingImage_opacity = 1;	 
  
  if (existingImage && existingImage.nodeType!=3)
  {	    
   existingImage.style.position = 'absolute';
   existingImage.style.zIndex = 2;
  }
   
  function opacitySwitch()
  {
   if (existingImage && existingImage.nodeType!=3 && existingImage.nodeName=="IMG")
   {
    function opacityS()
    {
     if (!existingImage)
	 {
	  window.clearInterval(fId);
	  return;
	 }
	  
 	 if (existingImage_opacity <= 0)
	 {
	  window.clearInterval(fId);
	  if (existingImage && existingImage.parentNode)
 	   existingImage.parentNode.removeChild(existingImage);
	 }
	 else
	 {
	  existingImage_opacity -= 0.02;
	  existingImage.style.opacity = existingImage_opacity;
	  existingImage.style.filter = 'alpha(opacity='+(existingImage_opacity*100)+')'
      existingImage.style.MozOpacity = existingImage_opacity;
	 }
    }
	
    var fId = window.setInterval(opacityS,1);   	
   }
   else
   {
	if (existingImage && existingImage.nodeName=="DIV")
	{
	 existingImage.parentNode.removeChild(existingImage);
	}
   }
  }
	
  var img = document.createElement('img');
  img.setAttribute('src','images/'+value+'?id='+Math.random());
  img.setAttribute('align','left');
  img.style.position = 'absolute';
  mainleft.insertBefore(img,mainleft.firstChild);   
  
  if (existingImage && existingImage.nodeName=="DIV")
  {
   existingImage.innerHTML = "";
  }
  
  var fun = function()
  {
   if (img.complete)
   {
    window.clearInterval(oId);
    opacitySwitch();  
   }
  }

  var oId = window.setInterval(fun,100) 
 }
 else
 {
  mainleft.innerHTML = "<div style='padding: 25%'>No image available for this product</div>";
 }
}

function changeProductImage()
{
 var mainright = document.getElementById('mainright');
 loadPage(mainright,'offerRight.php',true);
}

function changeProductText(value)
{
 var mainbottomleft = document.getElementById('mainbottomleft');
 loadPage(mainbottomleft,'includes/'+value,true);
}

function init()
{
 menuWindow('index.php','animation');
}

function animation()
{
 var i=0;
 var interval = 5000;
 
 function animate()
 {
  i++;
  if (i==8) i=0;  
  changeProduct('slides/'+i+'.jpg'); 
 }

 changeProduct('slides/0.jpg'); 
 aId = window.setInterval(animate,interval);
}


var rFlag = false;
function arrange()
{
 rFlag = true;
 var mainleftcell = document.getElementById('mainleftcell');
 var rearrangerow = document.getElementById('rearrangeRow'); 
 
 mainleftcell.setAttribute('rowSpan','2');
 rearrangerow.removeChild(rearrangerow.firstChild); 
 
 if (aId)
 {
  window.clearInterval(aId);
  aId = null;   
 }
 
 var afterF = function()
 {
  var salesFrame = document.getElementById('salesFrame');
  salesFrame.style.height = (mainleftcell.offsetHeight-2) + "px";
  salesFrame.style.width = (mainleftcell.offsetWidth-2) + "px";  
 }
 
 loadPage(mainleftcell,'includes/sales2.php',true,afterF);
}

function rearrange()
{
 var rearrangeRow = document.getElementById('rearrangeRow');
 
 var td = document.createElement('td');
 rearrangeRow.insertBefore(td,rearrangeRow.firstChild);
 
 var div = document.createElement('div');
 td.insertBefore(div,td.firstChild);
 div.setAttribute('id','mainbottomleft');
 
 var mainleftcell = document.getElementById('mainleftcell');
 mainleftcell.innerHTML = "";
 mainleftcell.removeAttribute('rowSpan');
 div = document.createElement('div');
 mainleftcell.insertBefore(div,mainleftcell.firstChild);
 div.setAttribute('id','mainleft'); 
}