DWHome = {

   /** array de ofertas */
   offer: new Array(),
   offerAbajo: new Array(),

   /* Los contadores empiezan por 2, porque por defecto se empieza mostrando la imagen 1. */
   contador: 1, /* Contador del bannerA */
   contador2: 1, /* Contador del bannerB_01 */
   fx:null,

   /**
    * Carga de datos a partir del xml, se redefine en la xsl.
    */
   loadData: function () {
      return false;
   },

   /**
    * Inicialización de componentes.
    */
   init: function () {
      dome.include("dome.fx.Anim");
      dome.include("dome.util.Dom");

      var loadOk = DWHome.loadData();
      if (loadOk) {
         DWHome.fx = {};
//         DWHome.temporizador();
      }
   },

   /**
    * Lanza cada cierto tiempo la función cambiaImg
    */

   temporizador: function(){
      if(DWHome.offer.length >1){
         setInterval("DWHome.cambiaImg('bannerA', DWHome.offer, DWHome.contador, '310', '421', DWHome.contador)",7000);
      }
      if(DWHome.offerAbajo.length >1){
         setInterval("DWHome.cambiaImg('bannerB_01', DWHome.offerAbajo, DWHome.contador2, '113', '357')",7000);
      }
   },

   /**
    *
    * Elimina el contenido de la capa e introduce nuevos elementos hijo con los datos recuperados del XML.
    * Para esta transición utiliza los efectos de jsDome de animación para hacer la transición de las imágenes.
    *
    * @param idCapa (string) es el Id de la capa
    * @param elArray (array) Recibe el array con el contenido del XML
    * @param conta (int) contador para recorrer las imagenes
    * @param alto (float) Altura de la imagen
    * @param ancho (float) Anchura de la imagen
    *
    */

   cambiaImg: function(idCapa, elArray, conta, alto, ancho){
      /* Declaración de variables */
      var obj; /* variable que contiene el objeto de la capa */
      var img; /* nuevo elemento de la etiqueta <img> que contiene la imagen que quedará por detrás*/
      var imgSig; /* nuevo elemento de la etiqueta <img> que contiene la imagen que quedará por delante, esta contendrá los vínculos */
      var url; /* elemento de etiqueta <a> que contendrá el vínculo a una página o archivo  */
      var sigImg; /* Contiene el ID que se le va asociar a la imágen del elemento <img> de la variable imgSig  */
      var actImg; /* Contiene el ID que se le va asociar a la imágen del elemento <img> de la variable img  */
      var maximo; /* Longitud del array del objeto actual  */
      var contaSig; /* Contiene el siguiente elemento del contador  */
      var act; /* Objeto de la imágen que irá por detrás, se usa para aplicarle el efecto  */
      var sig; /* Objeto de la imágen que irá por ddelante, se usa para aplicarle el efecto  */
      var Anima; /* variable del tipo dome.fx.Anim */

      obj = document.getElementById(idCapa);
      Anima = dome.fx.Anim;
      /* Bucle que elimina todos los nodos hijo del objeto */
      while(obj.childNodes.length >= 1){
         obj.removeChild(obj.firstChild);
      }

      /* Controla que la siguiente imagen se incremente sin salirse de rango */
      maximo = elArray.length;
      contaSig = conta;
      if(contaSig >= maximo-1){
         contaSig = 1;
      }else{
         contaSig = conta + 1;
      }


      /* Crea un ID único para cada elemento según la capa */
      if(idCapa == "bannerA"){
         sigImg = "sigA";
         actImg = "actA"
      }else{
         sigImg = "sigB";
         actImg = "actB"
      }

      /* imagen actual */
      img = document.createElement('img');
      img.alt = elArray[conta][1].nomofe;
      img.src = elArray[conta][3].imgofe;
      img.title = elArray[conta][1].nomofe;
      img.width = ancho;
      img.height = alto;
      img.id = actImg;
      dome.util.Dom.setStyle(img,"position","absolute");
      dome.util.Dom.setStyle(img,"opacity","1");

      /* imagen que se cargará encima */
      imgSig = document.createElement("img");
      imgSig.alt = elArray[contaSig][1].nomofe;
      imgSig.src = elArray[contaSig][3].imgofe;
      imgSig.title = elArray[contaSig][1].nomofe;
      imgSig.width = ancho;
      imgSig.height = alto;
      imgSig.id = sigImg;
      dome.util.Dom.setStyle(imgSig,"opacity","0");
      dome.util.Dom.setStyle(imgSig,"position","relative");
      dome.util.Dom.setStyle(imgSig,"zIndex","1000");



      /* crea los nuevos nodos y los monta */
      if(elArray[contaSig][4].urlofe){
         url = document.createElement('a');
         url.href = elArray[contaSig][4].urlofe;
         obj.appendChild(img);
         url.appendChild(imgSig);
         obj.appendChild(url);

      } else{
         /* Si es de tipo RES enlaza a la oferta */
         if(elArray[conta][5].tipurl == "RES"){
            var url = document.createElement('a');
            url.href="offer.do?tipurl=RES&codofe="+elArray[conta][0].codofe;
            obj.appendChild(img);
            url.appendChild(imgSig);
            obj.appendChild(url);
         }else{
            obj.appendChild(img);
            obj.appendChild(imgSig);
         }
      }
      act = document.getElementById(actImg);
      sig = document.getElementById(sigImg);

      /* Efecto con el que va a desvanecerse la primera imagen (fade out) */
      DWHome.fx.showAct = new Anima({
         element: act,
         duration: 5,
         attribute: {
            opacity: {from: 1, to: 0}
         }
      }
            );

      /* Efecto con el que va a aparecer la siguiente imagen (fade in) */
      DWHome.fx.showSig = new Anima({
         element: sig,
         duration: 2,
         attribute: {
            opacity:  { from: 0, to: 1 }
         }
      }
            );
      /* Inicia el efecto*/
      DWHome.fx.showAct.start();
      /* cuando ha terminado el evento lanza el siguiente */
      DWHome.fx.showAct.endEvent.subscribe(DWHome.fx.showSig.start());

      /*Incrementa el contador de cada capa comprobando que no se salga del rango*/
      if(idCapa == 'bannerA'){
         DWHome.contador++;
         if(DWHome.contador > maximo-1){
            DWHome.contador = 1;
         }
      }
      if(idCapa == 'bannerB_01'){
         DWHome.contador2++;
         if(DWHome.contador2 > maximo-1){
            DWHome.contador2 = 1;
         }
      }
   }

};

/* Inicilización. */
(function() {
   /* Dependencias */
   dome.include("dome.util.Event");
   /* Alias */
   var Event = dome.util.Event;
   dome.util.Event.onDomReady(DWHome.init);

})();
