/*******************************************************************************
 * Javascript für twGmap04Controls
 *
 * Erstellt eine GoogleMaps Karte in einem definiertem Bereich.
 * Über ein übergebenes Array werden markierungen plaziert, die bei Klick ein Popup öffnen 
 * mit dem Bild des aktuellen Top Videos aus der jeweiligen PLZ. 
 * Das Bild wird auf das zugehörige TopVideo verlinkt
 *
 * Quelltext von http://progtw.de/website/inhalt/refDown/skripte/twGmap/howto01bis04.html
 * Zusätzliche Quellen und hilfreiche Seite für Google Maps :   http://econym.org.uk/gmap/index.htm
 *
 * @date    16.11.2009
 * @author  P. Khouri
 * @author  Inett GmbH
 ******************************************************************************/

var elementId = "twGmap";  // muss im html an ein <div> als id vergeben werden
//var lat       = "51.041";  // Breitengrad (Latitude) z.B: 51.041
//var lon       = "13.748";  // Längengrad (Longitude) z.B: 13.748

var lat       = "49.9444";  // Breitengrad (Latitude) z.B: 51.041
var lon       = "11.5807";  // Längengrad (Longitude) z.B: 13.748

var zoom      = 6;        // einen Wert von 1 bis ca 17 (nicht in "" setzen)

var orte      = topVideos;
/**
 * Prüft auf kompatiblen Browser und vorhandene Variablen und ruft die
 * Funktion auf, die die GoogleMap erstellt.
 *
 */
function twGmapLoad(topVideos)
{
    if (GBrowserIsCompatible())
    {
        if (!document.getElementById(elementId))
        {
            alert("Fehler: das Element mit der id "+ elementId+ " konnte nicht auf dieser Webseite gefunden werden!");
            return false;
        }
        else
        {
            if (lat=="" || isNaN(lat))
            {
                lat = "49.9444";
                alert("Fehler: Der Breitengrad(lat) wurde im Skript nicht korrekt eingetragen!\nEin Defaultwert wird deshalb benutzt!");
            }
            if (lon=="" || isNaN(lon))
            {
                lon = "11.5807";
                alert("Fehler: Der Längengrad(lon) wurde im Skript nicht korrekt eingetragen!\nEin Defaultwert wird deshalb benutzt!");
            }
            if (typeof zoom == "undefined")
            {
                zoom = 6;
                alert("Fehler: Die Zoomstufe wurde im Skript nicht korrekt eingetragen!\nEin Defaultwert wird deshalb benutzt!");
            }
            machTwGmap(elementId, lat, lon, zoom, topVideos);
        }
    }
}


/**
 * Erstellt die GoogleMap in dem <div>-Bereich mit der übergebenen id
 * @param {Object} id           -   im div-Bereich mit dieser id wird die Map dargestellt
 * @param {Object} lat          -   Breitengrad
 * @param {Object} lon          -   Längengrad
 * @param {Object} zoom         -   Zoomstufe 1 bis 17 (ganze Welt bis kleiner Ausschnitt)
 * @param {Array}  topVideos    -   JSON Array mit geo-Daten, clip infos, usw um popupfenster zu füllen
 */
function machTwGmap(id, lat, lon, zoom, topVideos) {

    var x = 0;
    // die Map (für das div mit der id="...")
    var map = new GMap2(document.getElementById(id));

    // mit Zoom (auch noch: GSmallMapControl, GLargeMapControl, GSmallZoomControl, GScaleControl)
    map.addControl(new GLargeMapControl());
    _mPreferMetric = true;
    map.addControl(new GScaleControl());
    // mit Typ-Auswahl (auch noch: GMapTypeControl, GHierarchicalMapTypeControl, GOverviewMapControl)
    map.addControl(new GMapTypeControl());
    // ((Breitengrad, Längengrad), Zoomstufe, G_NORMAL_MAP/G_SATELLITE_MAP/G_HYBRID_MAP)
    map.setCenter(new GLatLng(lat, lon), zoom, G_NORMAL_MAP);

    //#### Google Maps eigene Funktion um overlay zu erstellen (nicht einfach korrekt einzustellen)########
    //        var boundaries = new GLatLngBounds(new GLatLng(43.70,-3.6), new GLatLng(58.39,26.6));
    //        var oldmap = new GGroundOverlay("icon/google.png", boundaries);
    //        map.addOverlay(oldmap);
    //#####################################################################################################

    //Bild (.png!!!) einfügen um nur D/A/CH auf der AKrte anzuzeigen
    var insert1 = new EInsert(new GLatLng("51.10", "11.5"), "icon/google3.png", new GSize(1400,1500), 6);

    map.addOverlay(insert1);
    map.enableScrollWheelZoom();

    //Marker setzen mit eigener Marker-Funktion
    while (x < topVideos.length)
    {
        if(topVideos[x] != "null")
        {
            map = setTwMarkers(map,topVideos[x],topVideos[x+1],topVideos[x+2],topVideos[x+3],topVideos[x+4],topVideos[x+5],topVideos[x+6],topVideos[x+7],topVideos[x+8],topVideos[x+9]);
        }
        x = x+10;
    }

    // ====== Restricting the range of Zoom Levels =====  http://econym.org.uk/gmap/range.htm
    // Get the list of map types
    var mt = map.getMapTypes();
    // Overwrite the getMinimumResolution() and getMaximumResolution() methods
    for (var i=0; i<mt.length; i++)
    {
        mt[i].getMinimumResolution = function() {return 6;} // rauszoomen
        mt[i].getMaximumResolution = function() {return 12;} // rein zommen
    }

    // Add a move listener to restrict the bounds range
    GEvent.addListener(map, "move", function() {
    checkBounds();
    });

    // The allowed region which the whole map must be within
    var allowedBounds = new GLatLngBounds(new GLatLng(45.7,3), new GLatLng(55 ,17.23333));

      // If the map position is out of range, move it back
    function checkBounds()
    {
        // Perform the check and return if OK
        if (allowedBounds.contains(map.getCenter()))
        {
            return;
        }
        // It`s not OK, so find the nearest allowed point and move there
        var C = map.getCenter();
        var X = C.lng();
        var Y = C.lat();

        var AmaxX = allowedBounds.getNorthEast().lng();
        var AmaxY = allowedBounds.getNorthEast().lat();
        var AminX = allowedBounds.getSouthWest().lng();
        var AminY = allowedBounds.getSouthWest().lat();

        if (X < AminX) {X = AminX;}
        if (X > AmaxX) {X = AmaxX;}
        if (Y < AminY) {Y = AminY;}
        if (Y > AmaxY) {Y = AmaxY;}
        //        alert ("Restricting "+Y+" "+X);
        map.setCenter(new GLatLng(Y,X));
    }
}

/**
 * Erstellt die (Notenschlüsel-)Markierungen auf der Karte
 * @param {Object}  map         -   im div-Bereich mit dieser id wird die Map dargestellt
 * @param {Object}  lon         -   Breitengrad
 * @param {Object}  lat         -   Längengrad
 * @param {string}  video       -   Dateiname des Videos
 * @param {string}  video_id    -   Id des videos
 * @param {string}  plz         -   PLZ des Users der das Video eingestellt hat
 * @param {string}  ort         -   Ort in dem der User wohnt, der das Video eingestellt hat
 * @param {string}  username    -   Username
 * @param {string}  video_title -   Titel des Videos
 * @param {string}  user_id     -   User id
 */
function setTwMarkers(map,lon,lat,video,video_id,plz,ort,username,video_title,user_id,bericht_id)
{
    var point  = new GPoint(lon, lat);  //ACHTUNG: (lon, lat) also vertauscht
    var Icon = new GIcon();
    
    Icon.image = "icon/notenschluessel2.gif";   // Bild
    Icon.iconSize = new GSize(20, 34);          // Größe
    Icon.iconAnchor = new GPoint(5, 34);        // Punkt LinksUnten wo der MArker ansetzt
    Icon.infoWindowAnchor = new GPoint(5, 2);   // Punkt linksUnten wo das PopUp Fenster ansetzt

    Icon.imageMap=[0,0, 20,0, 20,34, 0,34];     //Klickbaren Bereich angeben
    var marker = new GMarker(point,Icon);       //Marker erstellen mit gegebenen Eigenschaften
    var html   = "";                            //Inhalt des PopUpfensters zusammensetzen

    html += "<div class='twGmapInfo'>";
    html += "<p class='headline'>Das aktuelle Top-Video aus <br /><br />" + plz + "&nbsp;" + ort +" :<br /><a href=\"userprofil.php?id="+user_id+"&fahne=video\">"+username+" - " + video_title + "</a></p>";
    html += "<div align=\"center\"><a href=\"insert_klick.php?vid=" + video_id + "&target=showvideo.php%3Fnav1=793%26nav2=740%26nav3=741%26vid=" + video_id + "\"><img src=\""+video+".jpg\" width=\"188\" border=\"0\"/></a></div>";

    if( bericht_id != "0")
    html += "<br />&nbsp;&nbsp;&nbsp;&nbsp;<a href=\"details.php?id=" + bericht_id + "&nav1=793&nav2=740&nav3=742&nav4=748\" target=\"blank\">Infos zur Gemeinde</p>";
    html+="</div>";
    GEvent.addListener(marker, "click", function() {marker.openInfoWindowHtml(html)}); //Wenn der MArker angeklickt wird öffnet sich ein popUp mit var html als inhalt
    map.addOverlay(marker);                     //Marker auf der Karte plazieren

    return map;
}