var _id = 0, _pid = 0, _lid = 0, _pLayer;
var _mLists = new Array();
document.lists = _mLists;
var imagenMas = "mas.gif";
var imagenMenos = "menos.gif";

var isNav4, isIE4;
if (parseInt(navigator.appVersion.charAt(0)) >= 4) {
  isNav4 = (navigator.appName == "Netscape") ? true : false;
  isIE4 = (navigator.appName.indexOf("Microsoft") != -1) ? true : false;
}
function List(visible, width, height, bgColor) {
  this.setIndent = setIndent;
  this.addItem = addItem;
  this.addList = addList;
  this.build = build;
  this.rebuild = rebuild;
  this.setFont = _listSetFont;
  this._writeList = _writeList;
  this._showList = _showList;
  this._updateList = _updateList;
  this._updateParent = _updateParent;
  this.onexpand = null; this.postexpand = null;
  this.lists = new Array(); // sublists
  this.items = new Array(); // layers
  this.types = new Array(); // type
  this.strs = new Array();  // content
  this.x = 0;
  this.y = 0;
  this.visible = visible;
  this.id = _id;
  this.i = 11; // Anchura de tabulación
  this.space = true;
  this.pid = 0;
  this.fontIntro = false;
  this.fontOutro = false;
  this.width = width // por defecto nos pondría || 350;
  this.height = height // por defecto nos pondría || 22;
  this.parLayer = false;
  this.built = false;
  this.shown = false;
  this.needsUpdate = false;
  this.needsRewrite = false;
  this.parent = null;
  this.l = 9;
  if(bgColor) this.bgColor = bgColor;
  else this.bgColor = null;
  _mLists[_id++] = this;
}
function _listSetFont(i,j) {
  this.fontIntro = i;
  this.fontOutro = j;
}
function setIndent(indent) { this.i = indent; if(this.i < 0) { this.i = 0; this.space = false; } }

// Establece las dimensiones de cada una de las capas
function setClip(layer, l, r, t, b) {
  if(isNav4) {
    layer.clip.left = l; layer.clip.right = r;
    layer.clip.top = t;  layer.clip.bottom = b;
  } else {
    layer.style.pixelWidth = r-l;
    layer.style.pixelHeight = b-t;
    layer.style.clip = "rect("+t+","+r+","+b+","+l+")";
  }
}

// Escribe inicialmente todas las capas, ocultas y visibles
// SUPUESTO.- Suponemos que los specials siempre aparecen al final, por lo tanto, mientras
// no se muestre el separador de especials significa que son elementos normales.
function _writeList() {
  self.status = "List: Writing list...";
  var layer, str, clip, bspecial;
  bspecial = false;
  for(var i = 0; i < this.types.length; i++) { 
    layer = this.items[i];
    if(isNav4) layer.visibility = "hidden";
    else layer.style.visibility = "hidden";
    str = "";
    if(isNav4) layer.document.open();
    
    layer.className = "menuAux";
    
    /*
    alert(this.types[i]); // item
    alert(this.l==0);	 // true
    alert(this.i==0);	// false
    alert(this.strs[i]); // Lo mas vendidos
    */
    
	// Para mostrar un separador entre los productos normales y los ESPECIALES    
	if(this.types[i] == "separador") 
	{
		layer.className = "Separador";
		if (getCookieAux("CurrentCulture") == "es_en")
			str += "<span class=Destacados>Highlights</span>";
		else
			str += "<span class=Destacados>Destacados</span>";
		bspecial = true;
		
	}
	
	// Nodos de primer nivel con hijo. L indica el nivel
    if(this.types[i] == "list" && (this.l==0 || this.i==0)) {
		_pid++;
		// El primer elemento debe tener un mayor ancho para tener el borde mas grueso		
		if (i == 0)
		{
			str += "<div class=marcoSup><ul class=list1><li>" + "<IMG VSPACE=4 hspace=2  BORDER=0 SRC=\"" + imagenMas + "\" NAME=\"_img" + this.lists[i].id + "\">" + this.strs[i] + "</li></ul></div>";
		}
		else
		{
			str += "<div class=marco><ul class=list1><li>" + "<IMG VSPACE=4 hspace=2  BORDER=0 SRC=\"" + imagenMas + "\" NAME=\"_img" + this.lists[i].id + "\">" + this.strs[i] + "</li></ul></div>";
		}
	} 
	
	// Hijo que tiene mas hijos a su vez. L indica el nivel	
    if(this.types[i] == "list" && (this.l>0 && this.i>0)) {
		_pid++;
		// Solo esta preparado para tener dos niveles de hijo		
		str += "<div class=marco><ul class=list" + (this.l + 2)  + "><li>" + "<IMG VSPACE=4 hspace=2 BORDER=0 SRC=\"" + imagenMas + "\" NAME=\"_img" + this.lists[i].id + "\">" + this.strs[i] + "</li></ul></div>";
	} 
	
	// Esto es para la CATEGORIA ESPECIAL. L indica el nivel
	// Se supone que las categorias especiales no tienen niveles
	// TAMBIEN PUEDE SER UNA HOJA DEL PRIMER NIVEL
    if(this.types[i] == "item" && (this.l==0 || this.i==0)) {
		
		// La última debe ser mas gruesa para mostrar el borde inferior		
		if ( i == this.types.length - 1)
		{
			str += "<div class=marcoInf><ul class=itemcatesp><li>" + this.strs[i] + "</li></ul></div>";
		}
		else
		{
			// El primer elemento debe tener un mayor ancho para tener el borde mas grueso		
			if (i == 0)
			{
				if ( bspecial )
				{
					//str += "<div class=marco2><ul class=itemcatesp><li>" + "<a  href=''>Wine of the month</a>" + "</li></ul></div>";
					str += "<div class=marcoSup><ul class=itemcatesp><li>" + this.strs[i] + "</li></ul></div>";
				}
				else
				{
					str += "<div class=marcoSup><ul class=item1><li>" + this.strs[i] + "</li></ul></div>";
				}
			}
			else
			{
				if ( bspecial )
				{
					str += "<div class=marco2><ul class=itemcatesp><li>" + this.strs[i] + "</li></ul></div>";
				}
				else
				{
					str += "<div class=marco><ul class=list1><li>&nbsp;&nbsp;" + this.strs[i] + "</li></ul></div>";
				}
			}
		}
		
	}

	// Nodos HOJA. L indica el nivel
    if(this.types[i] == "item" && (this.l>0 && this.i>0)) {
		// Se deben de tener tantas clases como niveles puedan existir a partir de p3. p3,p4,p5....
		str += "<div class=marco><ul class=item" + (this.l + 1)  + "><li>&nbsp;&nbsp;" + this.strs[i] + "</a></li></div>";
	} 
    
    if(isNav4) {
      layer.document.writeln(str);
      layer.document.close();
    } else layer.innerHTML = str;
    // Si el elemento es de tipo lista y esta visible pues a pintar hijos.
    if(this.types[i] == "list" && this.lists[i].visible)
      this.lists[i]._writeList();
  }
  // Ya está construido y no hace reescribir
  this.built = true;
  this.needsRewrite = false;
  self.status = '';
}
// Función recursiva para las listas
function _showList() {
  var layer; var separdor;
  for(var i = 0; i < this.types.length; i++) { 
    layer = this.items[i];
    separador = this.types[i];

    if ( ( i==0  ) || separador == "separador" || i == this.types.length - 1)
    {
		setClip(layer, 0, this.width, 0, 30);
	}
	else
	{
		setClip(layer, 0, this.width , 0, this.height);
	}
    var bg = layer.oBgColor || this.bgColor;
    if(isIE4) {
      if((bg == null) || (bg == "null")) bg = "";
      layer.style.backgroundColor = bg;
    } else layer.document.bgColor = bg;
    if(this.types[i] == "list" && this.lists[i].visible)
      this.lists[i]._showList();
  }
  this.shown = true;
  this.needsUpdate = false;
}
function _updateList(pVis, x, y) {
  var currTop = y, layer, separador;
  
  for(var i = 0; i < this.types.length; i++) { 
    layer = this.items[i];
    separador = this.types[i];
    if(this.visible && pVis) {
      if(isNav4) {
        layer.visibility = "visible";
        layer.top = currTop;
        layer.left = x;
      } else {
        layer.style.visibility = "visible";
        layer.style.pixelTop = currTop;
        layer.style.pixelLeft = x;
      }
      // Este sirve para mover el top de la siguiente capa.
      // Sólo debe moverse en el primer elemento y en el separador
      if ( ( i==0  && this.id == 0 ) || separador == "separador")
      {
		currTop += 23;
	  }
	  else
		currTop += this.height;
    } else {
      if(isNav4) layer.visibility = "hidden";
      else layer.style.visibility = "hidden";
    }
    
    if(this.types[i] == "list") {
	  // CUANDO ESTA EXTENDIDO EL SUBMENU	
      if(this.lists[i].visible) {
        if(!this.lists[i].built || this.lists[i].needsRewrite) this.lists[i]._writeList();
        if(!this.lists[i].shown || this.lists[i].needsUpdate) this.lists[i]._showList();
        if(isNav4) layer.document.images[0].src = imagenMenos;
        else eval('document.images._img'+this.lists[i].id+'.src ="' + imagenMenos+ '"');
      } 
      // CUANDO NO ESTE EXTENDIDO EL SUBMENU
      else {
        //if(isNav4) layer.document.images[0].src = "mas.gif";
        if(isNav4) layer.document.images[0].src = imagenMas;
        //else eval('document.images._img'+this.lists[i].id+'.src = "mas.gif"');
        else eval('document.images._img'+this.lists[i].id+'.src ="' + imagenMas + '"');
      }
      
      if(this.lists[i].built)
        currTop = this.lists[i]._updateList(this.visible && pVis, x, currTop);
    }
  }
  return currTop;
}

function _updateParent(pid, l) {
  var layer;
  if(!l) l = 0;
  this.pid = pid;
  this.l = l;
  for(var i = 0; i < this.types.length; i++)
    if(this.types[i] == "list")
      this.lists[i]._updateParent(pid, l+1);
}

// i es el Id del Nodo que tiene para expandirse
// Siempre se lanza cuando se pulsa un nodo con hijos en el onload del body.
function expand(i) {
  _mLists[i].visible = !_mLists[i].visible;
  if(_mLists[i].onexpand != null) _mLists[i].onexpand(_mLists[i].id);
  _mLists[_mLists[i].pid].rebuild();
  if(_mLists[i].postexpand != null) _mLists[i].postexpand(_mLists[i].id);
}

// X toma valor de 5 y Y 135.
function build(x, y) {
  this._updateParent(this.id);
  this._writeList();
  this._showList();
  this._updateList(true, x, y);
  this.x = x; this.y = y;
}
function rebuild() { this._updateList(true, this.x, this.y); }

// Función para añadir elementos, nodos hoja en los Arrays de items,str
// str = <a href="">Guia campsa....... 
function addItem(str, bgColor, layer) {
  var testLayer = false;
  if(!document.all) document.all = document.layers;
  if(!layer) {
    if(isIE4 || !this.parLayer) testLayer = eval('document.all.lItem'+_lid);
    else {
      _pLayer = this.parLayer;
      testLayer = eval('_pLayer.document.layers.lItem'+_lid);
    }
    if(testLayer) layer = testLayer;
    else {
      if(isNav4) {
        if(this.parLayer) layer = new Layer(this.width, this.parLayer);
        else layer = new Layer(this.width);
      } else return;
    }
  }
  if(bgColor) layer.oBgColor = bgColor;
  this.items[this.items.length] = layer;
  
  // NUEVO
  if (str == "") 
	this.types[this.types.length] = "separador";
  else
	this.types[this.types.length] = "item";
	
  this.strs[this.strs.length] = str;
  _lid++;
}

// Función para añadir una lista, no nodos hijos
function addList(list, str, bgColor, layer) {
  var testLayer = false;
  if(!document.all) document.all = document.layers;
  if(!layer) {
    if(isIE4 || !this.parLayer) testLayer = eval('document.all.lItem'+_lid);
    else {
      _pLayer = this.parLayer;
      testLayer = eval('_pLayer.document.layers.lItem'+_lid);
    }
    if(testLayer) layer = testLayer;
    else {
      if(isNav4) {
        if(this.parLayer) layer = new Layer(this.width, this.parLayer);
        else layer = new Layer(this.width);
      } else return;
    }
  }
  if(bgColor) layer.oBgColor = bgColor;
  this.lists[this.items.length] = list;
  this.items[this.items.length] = layer;
  this.types[this.types.length] = "list";
  this.strs[this.strs.length] = str;
  
  list.parent = this;
  _lid++;
}

function getCookieAux(name)
{
	var strCookies = document.cookie;
	var index = strCookies.indexOf(name + "=");

	if (index == -1)
	{
		return '';
	}
	else
	{
		var startstr = strCookies.indexOf("=", index) + 1;
		var endstr = strCookies.indexOf(";", index);
	
		if (endstr == -1)
		{
			endstr = strCookies.length;
		}

		return unescape(strCookies.substring(startstr , endstr));
	}
}