var locations = [
  [ 'A', 'Garten 1', 'Gartenlandschaft1KWHotspot' ],
  [ 'B', 'Garten 2', 'Gartenlandschaft2KWHotspot' ],
  [ 'C', 'Garten 3', 'Gartenlandschaft3KWHotspot' ],
  [ 'D', 'Garten 4', 'Gartenlandschaft4KWHotspot' ],
  [ 'E', 'EG Eingang', 'EGKWHotspot' ],
  [ 'F', 'OG 1', 'OGKW1Hotspot' ],
  [ 'G', 'OG 2', 'OGKW2Hotspot' ],
  [ 'H', 'Beratungsecke', 'BeratungseckeHotspot'  ],
  [ 'I', 'Bäderwelt', 'OGBADKWHotspot' ]
];

var id2name = new Object();
id2name['TUEREN']='Türen';
id2name['SANITAER']='Sanitär';
id2name['FLIESEN']='Fliesen';
id2name['NATURSTEIN']='Naturstein';
id2name['TEPPICHBODEN']='Teppichboden';
id2name['HARO-SHOP']='Haro-Shop';
id2name['schwarzerGarten']='Schwarzer Garten';
id2name['mediterranerGarten']='Mediterraner Garten';
id2name['schwebendeHolzdecks']='Schwebende Holzdecks';
id2name['rundumdenGartenteich']='Rund um den Gartenteich';
id2name['BunterGarten']='Bunter Garten';

function initImageMap(){
  var areas = document.getElementById('overview-map').areas;
  var locInfo;
  for (idx in areas){
    area = areas[idx];
    locInfo = locations[parseInt(area.alt) - 1];
    if(locInfo){
      area.alt = locInfo[0] + ' - ' + locInfo[1];
      area.title = locInfo[1];
      //IE
      if(navigator.appName.indexOf("Explorer") != -1){
       area.setAttribute('href',
                        "javascript:panoswf.openNext('" + locInfo[2] + ".swf', 'fov=100');");
      }else{
      //FF
        area.setAttribute('onclick',
                          "panoswf.openNext('" + locInfo[2] + ".swf', 'fov=100');");
        area.setAttribute('href', '#');
      }
} } }

function initOverviewList(){
  var numCols = 2;
  var res = '';
  var idxMod;
  var locInfo;
  var locLength = locations.length;
  var idx = 0;
  while(idx < locLength){
    locInfo = locations[idx];

    idx += 1;

    idxMod = idx % numCols;
    if(idxMod == (numCols - 1)){
      res += '<tr>'
    }
    if(idx != locLength){ colspan = ''; }else{ colspan = 'colspan=2 style="text-align: center;"'; }
      res += '<td class="overview-list-item" ' + colspan + ' onclick="panoswf.openNext(' + "'" + locInfo[2] +
        ".swf', 'fov=100');\">" + '<a href="#"><b>' + locInfo[0] + '</b> - ' + locInfo[1]  + '</a></td>';
    if(idxMod == 0){
      res += '</tr>';
    }
  }
  $('#overview-list').html(res);
}

$(document).ready(function(){
  initOverviewList();
  initImageMap();
});

function panoLink(id){
  var name = id2name[id];
  if(!id2name[id]){ name=id; }
  $.get('info-' + id, function(str){
    var fSize;
    var fWeight = 'normal';
    var obj = $('#infotext-head-2');
    obj.html('');
    if(name.length < 17){
      fSize='1.2em';
      fWeight='bold';
    }else if(name.length < 21){
      fSize='1em';
    }else{
      fSize='0.9em';
    }
    obj.css('font-size', fSize);
    obj.css('font-weight', fWeight);
    obj.html(' - ' + name);

    obj = $('#infotext');
    obj.scrollTop(0);
    obj.html(str);
  });
}