﻿
function createMap() {   
    if ($("#frmMap").length > 0) {
        if (!isIE6) {
            var c = orte.length;
            for (i = 0; i < c; i++) {
                addLabel(i)
                addMapImage(i);
                addArea(i);
            }
            $("<div>")
            .height("470px")
            .width("580px")
            .css("background-image", "url(/images/karte/karte.png)")
            .prependTo($("#frmMap"));

        } else {
            var c = orte.length;
            for (i = 0; i < c; i++) {
                addLabel(i)
                addMapImage(i);
                addArea(i);
            }
            $("<div>")
            .height("470px")
            .width("580px")
            .css("background-image", "url(/images/karte/karte.gif)")
            .prependTo($("#frmMap"));
        }
    }    
}


// Bilder für Hover
function addMapImage(id) {
    if (!isIE6) {
        $("<div>")
    .height("470px")
    .width("580px")
    .css("background-image", "url(/images/karte/" + orte[id][2] + ".png)")
    .css("display", "none")
    .attr("id", orte[id][2])
    .prependTo($("#frmMap"));
    } else {
        $("<div>")
    .height("470px")
    .width("580px")
    .css("background-image", "url(/images/karte/" + orte[id][2] + ".gif)")
    .css("display", "none")
    .attr("id", orte[id][2])
    .prependTo($("#frmMap"));
    }
}

// Area für Regionen
function addArea(id) {
    if (!isIE6) {
        $("<area>")
    .attr("shape", "poly")
    .attr("coords", orte[id][3])
    .attr("href", orte[id][0].replace("/" + langKey + "/", "/" + langKey + "/#/"))
    .hover(
      function () { showRegion(orte[id][2]); $("#lbl" + id).addClass("mapLabelHover") },
      function () { hideRegion(orte[id][2]); $("#lbl" + id).removeClass("mapLabelHover") })
    .appendTo($("#hmap"));
    } 
    else {
        $("<area>")
    .attr("shape", "poly")
    .attr("coords", orte[id][3])
    .attr("href", orte[id][0])
    .hover(
      function () { showRegion(orte[id][2]); $("#lbl" + id).addClass("mapLabelHover") },
      function () { hideRegion(orte[id][2]); $("#lbl" + id).removeClass("mapLabelHover") })
    .appendTo($("#hmap"));
    }

}

// Region einblenden
function showRegion(cid) {
    $("#" + cid).fadeIn(150);
}

// Region ausblenden
function hideRegion(cid) {
    $("#" + cid).fadeOut(150);
}

// Label
function addLabel(id) {    
    var lbl = $("<div>")
    .css("left", orte[id][4] + "px")
    .css("top", orte[id][5] + "px")
    .attr("id", "lbl"+id)
    .addClass("mapLabel")
    
    $("<div>")
    .html(orte[id][1])
    .css("left", orte[id][6] + "px")
    .css("top", orte[id][7] + "px")
    .appendTo(lbl)

    lbl.prependTo($("#frmMap"));
}
