/******************************************************************************
 * kaLegend
 * 
 * internal class to handle the legend.
 * 
 * oKaMap - the ka-Map object to attach to.
 * szID - string, the id of a div that will contain the legend
 * bStatic - boolean, true to use static legends, false to use dynamic legends
 *
 *****************************************************************************/
function kaLegend(oKaMap, szID, bStatic)
{
    this.domObj = getRawObject(szID);
    this.kaMap = oKaMap;
    this.type = (bStatic)?'static':'dynamic';
    this.expanders = [];
    
    if (this.type == 'static')
    {
        this.domImg = document.createElement( 'img' );
        this.domImg.src = this.kaMap.aPixel.src;
        this.domObj.appendChild( this.domImg );
    }
    else
    {
        this.domObj.innerHTML = ' ';
    }
    
    this.update = kaLegend_update;
    this.draw = kaLegend_draw;
    
    this.kaMap.registerForEvent( KAMAP_SCALE_CHANGED, this, this.update );
    this.kaMap.registerForEvent( KAMAP_MAP_INITIALIZED, this, this.update );
}

function kaLegend_update(eventID)
{
    var url = '';
    if (this.type == 'static')
    {
        this.domImg.src = this.kaMap.server + '/legend.php?map=' + 
                          this.kaMap.currentMap + 
                          '&scale='+this.kaMap.getCurrentScale();
    }
    else
    {
        if (eventID == KAMAP_MAP_INITIALIZED)
        {
            while(this.domObj.childNodes.length > 0)
                this.domObj.removeChild(this.domObj.childNodes[0]);
            this.draw();
        }
        else if (eventID == KAMAP_SCALE_CHANGED)
        {
            var oMap = this.kaMap.getCurrentMap();
            var aLayers = oMap.getLayers();
            var s = this.kaMap.getCurrentScale();
            for (var i in aLayers)
            {
                var oLayer = aLayers[i];
                var oImg = getRawObject( 'legendImg_' + oLayer.name);
                if (oImg) {
/**
 * cpurvis
 * I had to add this 1-off so that it would get the height
 * appropriately from the new legend image.
 *
 */
                    if (navigator.appName == "Microsoft Internet Explorer") {
                      if ((window.a == undefined))
                        a = new Image();
                      a.src = this.kaMap.server +  'legend.php?map='+this.kaMap.currentMap+'&scale='+s+'&g='+oLayer.name;
                      oImg.src = a.src;
                      oImg.style.height = a.height+'px';
                   }
                   else {
                     oImg.src = this.kaMap.server +  'legend.php?map='+this.kaMap.currentMap+'&scale='+s+'&g='+oLayer.name;
                   }
                }   
            }
        }
    }
    
}

/**
 * legend.draw( szContents )
 *
 * render the contents of a legend template into a div
 *
 * szContent - the content to render
 */
function kaLegend_draw()
{
    var name, t, tb, tr, td, cb, img;
    
    var urlBase = this.kaMap.server;
    urlBase += (urlBase!='' && urlBase.substring(-1)!='/')?'':'/';
    
    var oMap = this.kaMap.getCurrentMap();
    
    this.expanders = [];
    
    var d = document.createElement( 'div' );
    d.style.backgroundColor = '#cdcdcd';
    d.style.borderTop = '1px solid #707070';
    d.style.borderLeft = '1px solid #707070';
    d.style.borderBottom = '1px solid #707070';
    d.style.borderRight = '1px solid #707070';
    d.style.padding = '2px';
    d.style.fontFamily = 'arial';
    d.style.fontSize = '12px';
    d.style.fontWeight = 'bold';
    
    t = document.createElement( 'table' );
    
    t.setAttribute('width','100%');
    t.setAttribute('cellPadding', "0");
    t.setAttribute('cellSpacing', "0");
    t.setAttribute('border', "0");
    
    tb = document.createElement( "tbody" );
       
    var aLayers = oMap.getLayers();
    var aCBs = [];
    
    for (var i in aLayers)
    {
        var oLayer = aLayers[i];
        
        d = document.createElement( 'div' );
        d.id = 'group_' + oLayer.name;
        d.style.backgroundColor = '#cdcdcd';
//        d.style.borderTop = '1px solid #707070';
        d.style.borderLeft = '1px solid #707070';
//        d.style.borderBottom = '1px solid #707070';
        d.style.borderRight = '1px solid #707070';
        d.style.padding = '2px';
        d.style.fontFamily = 'arial';
        d.style.fontSize = '12px';
        name = oLayer.name;
        if (name != '__base__' && name != 'Boat Tracks')
        {
          t = document.createElement('table');
          t.setAttribute('width','100%');
          t.setAttribute('cellPadding', "0");
          t.setAttribute('cellSpacing', "0");
          t.setAttribute('border', "0");    
    
          tb = document.createElement( 'tbody' );
          tr = document.createElement('tr');
          td = document.createElement('td');
        
          var expander = document.createElement( 'img' );
          expander.src = urlBase + 'images/a_pixel.gif';
          expander.layerName = oLayer.name;
          expander.id = 'expander_'+oLayer.name;
          expander.onclick = kaLegend_expander;
          expander.expanded = true;
        
          this.expanders.push( expander );
        
          td.appendChild( expander );
        
          tr.appendChild(td);
          td = document.createElement('td');
          td.width = '22';
          cb = document.createElement( 'input' );
          cb.type = 'checkbox';
          // cpurvis Added unique id to be part of name.
          var cbID = oLayer.name.replace(/ /g,"");
          cb.name = cbID+'CB';
          cb.value = oLayer.name;
          cb.checked = oLayer.visible;
          cb.kaLegend = this;
          cb.oLayer = oLayer;
          cb.onclick = kaLegend_toggleLayerVisibility;
          aCBs.push(cb);
          td.appendChild( cb );

          tr.appendChild(td);
          td = document.createElement( 'td' );
          if (name == 'Gulf Stream') {
            td.innerHTML = 'Sea Surface Temperature';
          }
          else {
            td.innerHTML = name;
          }
          tr.appendChild(td);
          tb.appendChild(tr);
          t.appendChild( tb );
          d.appendChild(t);
          this.domObj.appendChild( d );
        
          if (isIE4)
          {
              for(var i=0; i<aCBs.length; i++)
              {
                if (aCBs[i].name.indexOf('hm_sites') == -1) {
                    aCBs[i].checked = aCBs[i].oLayer.visible;
                }
              }
          }
      }
    }
    
    return;
}

function kaLegend_toggleLayerVisibility()
{
    
    this.kaLegend.kaMap.setLayerVisibility( this.value, this.checked );
    for (var i = 0; i < myKaMap.timeDepGroups.length; i++) {
      var thisGroup = myKaMap.timeDepGroups[i];
      if (this.value.indexOf(thisGroup) != -1) {
        if (this.checked) {
          alert('The addition of this layer may slow map performance.'+"\n"
            +'We recommend turning this layer off during animations.');
          myKaMap.numTimeSensitiveGroupsChecked++;
          myKaMap.gotoTime();
        }
        else {
          myKaMap.numTimeSensitiveGroupsChecked--;
        }
        break;
      }
    }
}

function kaLegend_expander()
{
    this.expanded = !this.expanded;
    
    this.src = (this.expanded)?'images/collapse.png':'images/expand.png';
    this.expandable.style.display = (this.expanded)?'block':'none';
}

function kaLegend_expandAll()
{
    var kaLeg = this.kaLegend;
    for (var i=0; i<kaLeg.expanders.length; i++)
    {
        kaLeg.expanders[i].expanded = false;
        kaLegend_expander.apply( kaLeg.expanders[i] );
    }
}

function kaLegend_collapseAll()
{
    var kaLeg = this.kaLegend;
    for (var i=0; i<kaLeg.expanders.length; i++)
    {
        kaLeg.expanders[i].expanded = true;
        kaLegend_expander.apply( kaLeg.expanders[i] );
    }
}

function toggleLayer(whichLayer)
{
    if (document.getElementById)
    {
        // this is the way the standards work
        var style2 = document.getElementById(whichLayer).style;
        style2.display = style2.display? "":"none";
        
        // special case for reference
        if (whichLayer == 'reference') {
            el = document.getElementById('showHideLegend');
            if (style2.display == 'none') {
                el.innerHTML = '&nbsp;<a href="#" onClick="toggleLayer(\'reference\');">Restore</a>&nbsp;&nbsp;&nbsp;<strong>LEGEND & LAYERS</strong>';
            }
            else {
    el.innerHTML = '&nbsp;<a href="#" onClick="toggleLayer(\'reference\');">Hide</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<strong>LEGEND & LAYERS</strong>';
            }
        }
    }
    else if (document.all)
    {
        // this is the way old msie versions work
        var style2 = document.all[whichLayer].style;
        style2.display = style2.display? "":"none";
    }
    else if (document.layers)
    {
        // this is the way nn4 works
        var style2 = document.layers[whichLayer].style;
        style2.display = style2.display? "":"none";
    }
}