// init global vars
  if (!global)
  var global = this;
  /*var xpsm  = null;  //parent
  var xpsmt = null;  //timer
  var xobtn = null;  //saved button id*/

  var timer = null;  //used for time out when mouse over or out
  var idActive = null;  //this records the main id of an active element
  var ulIDActive = null;  //save an active button
  var ulActive = null;  //save an active ul
  var subULActive = null; //save active sub ul

  //preload images r.z.
ButtonHomeI = PreLoadImage('/images/button-home.jpg');  //home now  (org: xpwbz79twn)
ButtonHomeA = PreLoadImage('/images/button-home-a.jpg');  //mouse over active (xpwbz79two)
//alert(ButtonHomeO.src);
//ButtonHomeD = PreLoadImage('/images/button-home.jpg');  //mouse down (xpwbz79twc)

//workshop
ButtonWorkshopI = PreLoadImage('/images/button-workshop.jpg');
ButtonWorkshopA = PreLoadImage('/images/button-workshop-a.jpg');
//ButtonHomeD = PreLoadImage('/images/button-workshop.jpg');  //

//consulting
ButtonConsultingI = PreLoadImage('/images/button-consulting.jpg');
ButtonConsultingA = PreLoadImage('/images/button-consulting-a.jpg');

//enrolment
ButtonEnrolmentI = PreLoadImage('/images/button-enrolment.jpg');
ButtonEnrolmentA = PreLoadImage('/images/button-enrolment-a.jpg');

//about
ButtonAboutI = PreLoadImage('/images/button-about.jpg');
ButtonAboutA = PreLoadImage('/images/button-about-a.jpg');

//contact
ButtonContactI = PreLoadImage('/images/button-contact.jpg');
ButtonContactA = PreLoadImage('/images/button-contact-a.jpg');

//user
ButtonUserI = PreLoadImage('/images/button-user.jpg');
ButtonUserA = PreLoadImage('/images/button-user-a.jpg');

//preload images
 function PreLoadImage(im)   //wppr
 {
    var i=new Image();
    i.src = im;
    return i;
 }

//assign an image source to a image named imName.
  function SetImage(elementID)      // org: xpe(id)
  {
//alert(idActive);
    //if id changes, save the new id
     if(idActive!=elementID)
     {
        //xphide();
        //alert(idActive);
        //clear previous ul
        //alert(idActive);
        HideUL();
        idActive = elementID;
        // it saves current button
          //alert(elementID);
        //alert("h2");
     }
    //image button name
    imName = "Button" + elementID;
    //alert(imName);
    //save initial
    //document[imName+'I'].src= eval(imName + '.src');

    //document[imName].src=eval(imName + '.src');
    //alert(document[imName].src);
    document[imName].src = eval(imName + 'A' + '.src');
    //alert(document[imName].src);
    //document.write(eval(imName + 'A' + '.src'));
    //if (id.indexOf('e')!=-1)
    //return false;
  }


  //this function shows an ul list
  //elementID: active button id
  //isVertical: 0, 1
  //_id: current "this"
  function ShowUL(elementID, isVertical, _id)
  {
     //if current id is not saved is, hide the previous ul
     if(idActive!=elementID)
     {
        //xphide();
        //alert(idActive);
        HideUL();
        // it saves current button
        idActive = elementID;
        //alert("h2");
     }
        //alert(_id);

    // create unique variable
    _id = xpgetparent(_id);
    //alert(_id);
    if ( !_id )
        return;
//alert("have _id");
        //clear global
    if ( global[ _id ] )
        global[ _id ] = null;

    //save object of parent
    //x = document.getElementById("ul-" + elementID);  //get a related ul with id of ul-elementID
    //alert(x);
    global[ _id ] = document.getElementById("ul-" + elementID);  //get a related ul with id of ul-elementID

    //save ul
    ulActive = global[ _id ];
//alert(ulActive);
  //alert(idActive);

    if (!ulActive)
        return;

    var img = document.getElementById(elementID);  // image id
    var pos = GetPosition(img);  //get image button's position
    //alert(pos);

    if (isVertical)
    {
      ulActive.style.left = pos[0] + img.width + 'px';  //image width in px
      ulActive.style.top  = pos[1] + 'px';
    }
    else
    {
    ///alert(pos[0]);
      ulActive.style.left = pos[0] + 'px';  //left position
      ulActive.style.top  = pos[1] + img.height + 'px';  //top position
    }

    ulActive.style.visibility = 'visible';  //set UL to be visible
  }

  function ShowSubUL(elementID, isVertical, _id)
  {
     //if current id is not saved is, hide the previous ul
        //alert("sub");
     if(ulIDActive!=elementID)
     {
        //xphide();
        //alert(idActive);
        //HideUL();
        // it saves current button
        ulIDActive = elementID;  //save parent ul id
        //alert("h2");
     }
        //alert(_id);

    // create unique variable
    /*_id = xpgetparent(_id);
    //alert(_id);
    if ( !_id )
    {
    //alert("id");
        return;
    }
//alert("have _id");
        //clear global
    if ( global[ _id ] )
        global[ _id ] = null;*/

    global[ elementID ] = document.getElementById("subul-" + elementID);  //get a related ul with id of ul-elementID
    //x = document.getElementById("subul-" + elementID);  //get a related ul with id of ul-elementID
    //alert(x);
    //save ul
    subULActive = global[elementID];

//alert(ulActive);
  //alert(subULActive);

    if (!subULActive)
        return;
//alert(subULActive);
    var upperUL = document.getElementById(elementID);  // level 2 menu
    var pos = GetPosition(upperUL);  //get ul's position
    //testing var x = document.getElementById("ul-Workshop");
    //alert(x.style.width);

    if (isVertical)
    {
      subULActive.style.left = pos[0] + upperUL.width + 'px';  //image width in px
      subULActive.style.top  = pos[1] + 'px';
    }
    else
    {
      subULActive.style.left = 120 + 'px';  //left position
      subULActive.style.top  = 75 + 'px';  //at the same top position as the ul
    }

    subULActive.style.visibility = 'visible';  //set UL to be visible
  }


  //if there is a ul, hide it, and reset the timer
  function HideUL()
  {
  //alert(ulActive);
        if(ulActive)
        {
            //alert("ul");
            x = document.getElementById("ul-"+idActive);
            //alert(subULActive);
            if(x&&(subULActive==null))
            {
                //alert(subULActive);
                /*if(subULActive)
                {
                    var y = document.getElementById("subul-"+subULActive);
                    y.style.visibility = 'hidden';
                    subULActive = null;
                }
                else
                {*/
                    x.style.visibility = 'hidden';
                //}
                if(timer)
                {
                   ClearTimer();
                }
                RestoreImage();
                ulActive = null;
            }

        }

        //alert(idActive);
        //x = document.getElementById(idActive);
        //timer = null;  //clear timer
  }


  function HideSubUL()
  {
  //alert(subULActive);
        if(subULActive)
        {
            //alert("subul-"+subULActive);
            x = document.getElementById("subul-"+ulIDActive);
            if(x)
            {
                //alert(x);
               x.style.visibility = 'hidden';
            }
            /*if(timer)
            {
               ClearTimer();
            }*/
            //subULActive = null;
        }

        //alert(idActive);
        //x = document.getElementById(idActive);
        //timer = null;  //clear timer
  }

  //restore initial image
  function RestoreImage()
  {
    //image name
    imName = "Button" + idActive;
  //alert(imName);
      // restore the initial image
     document[imName].src = eval(imName + 'I' + '.src');
  }



  function ShowMenu(id)
  {
        //alert(id);
        //record this active id
        idActive = id;
        if(timer) //if timer is still running, clear it
        {
            clearTimeout(timer);
        }
        x=document.getElementById(activeID);
        x.style.visibility = 'visible';
  }



  //always clear a timer when a mouse is over an element
  function ClearTimer()
  {
    if (timer)
      timer = clearTimeout(timer);
  }


  function MouseOut()
  {
    if(ulActive)
    {
      //hide with a second deplay, HideUL() will restore the image
      timer = setTimeout('HideUL();', 1000);
    }
    else
    {
      // set original image
       //alert("no ul");
       RestoreImage();
    }
     // RestoreImage(idActive);
  }


 function xpinit()
 {
   var o, i, uls = document.getElementsByTagName('UL');
   for (i=0, cnt=uls.length; i<cnt; i++)
     if (uls[i].id && uls[i].id.substring(0, 7)=='xpwbUL_')
     {
        o=uls[i];
        if (o)
        {
            var lis = o.getElementsByTagName('LI');
            for (var k=0; k<lis.length; k++)
            {
              lis[k].onmouseover = function (){ this.className = 'over'; }
              lis[k].onmouseout  = function (){ this.className = ''; }
            }
        }
     }
 }
 xpinit();



   /**
   * It searchs the parent
   *
   * @param _object object
   * @return unique variable from table-id
   *
   */
  function xpgetparent( _object )
  {
    var _id = null;
    while ( _object && _object.tagName != 'TABLE' )
        _object = _object.parentNode;

    //find an id with ":" symbal
    if ( _object.id && _object.id.indexOf(':') != -1 )
    _id  = _object.id.split(':')[1];
    return _id;
  }




  function xphide()
  {
    if (xpsm)
    {
      if (xpsmt)
        clearTimeout(xpsmt);

      xpsm.style.visibility = 'hidden';
      xpsm = null;
      // clear selected
      xpe(xobtn + 'n');
    }
  }


  function GetPosition(elementObj)
  {
    var left = 0, top = 0;
    while(elementObj)
    {
      left += elementObj.offsetLeft;
      top += elementObj.offsetTop;
      elementObj = elementObj.offsetParent;
    }
    return [left, top];
  }


  // Menu Type 2
  /*function PreLoadImage(im)
  {
    var i=new Image();
    i.src='vista-skin/images/menu/bt'+im;
    return i;
  }


  function xpe(id)
  {
    x=id.substring(0,id.length-1);
    document['xpwb'+x].src=eval('xpwb'+id+'.src');
    if (id.indexOf('e')!=-1)
      document['xpwb'+x+'e'].src=eval('xpwb'+id+'e.src');

    return false;
  }*/