/*
 * Definition of basic variables
 */
var initialLocation;
var cr = new google.maps.LatLng(49.79, 15.40);
var browserSupportFlag =  new Boolean();
var map;
var markersArray = [];  // array of markers (important for deletions)
var bubbleArray  = [];  // array of infoBubbles (important for deletions)\
// Marker settings
var defaultImage = new google.maps.MarkerImage('/skin/images/marker_blue_ws.png',
    // dimension of marker picture (icon)
    new google.maps.Size(56, 39),
    // position in picture (in case of multiple icon included)
    new google.maps.Point(0,0),
    // position of anchor
    new google.maps.Point(18, 39));

var shadow = new google.maps.MarkerImage('/skin/images/marker_shadow.png',
    // The shadow image is larger in the horizontal dimension
    // while the position and offset are the same as for the main image.
    new google.maps.Size(64, 34),
    new google.maps.Point(0,0),
    new google.maps.Point(22, 32));

// define current day of week!! do not remove
var current = new Array;
var now = new Date();
current[now.getDay()] = 'today';

/*
 * INITIALIZE function
 */

function initialize() {
    /*
     * GET AND PARSE HASH + change COOKIES
     */
    var uri = window.location.hash.substring(1);
    
    // parse the data
    var elements = uri.split('/');
    var parsePlace = elements[0];
    var parseSport = elements[1];

    if(parsePlace != '' && parseSport != '') { // if hash is not empty
        
        $.getJSON("/ajax/common/sport/name/" + parseSport, function(data) {
            setSport(data.SPO_cName,data.SPO_iID);
        });
        $.getJSON("/ajax/common/city/name/" + parsePlace, function(data) {
            setPlace(data.CIT_cName,data.CIT_cName,data.CIT_iZoom,data.CIT_iID,parsePlace);
        });                
    }

    /*
     *  READ COOKIES
     */
    var sportId = $.cookie('sportId');
    var sportName = $.cookie('sportName');
    var place = $.cookie('place');
    var place_address = $.cookie('address');
    var place_zoom = parseInt($.cookie('zoom'));
    var place_cityId = parseInt($.cookie('cityId'));
    var place_cityUrl = $.cookie('cityUrl');


    var myOptions = {
        zoom: 7,
        backgroundColor: "#FFFFFF",
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    // style of cluster icons
    var style = [{
        url: '/skin/images/mc/m1.png',
        height: 42,
        width: 42,
        anchor: [0, 0],
        textColor: '#ffffff',
        textSize: 10
    }, {
        url: '/skin/images/mc/m2.png',
        height: 53,
        width: 53,
        anchor: [0, 0],
        textColor: '#ffffff',
        textSize: 11
    }, {
        url: '/skin/images/mc/m3.png',
        width: 64,
        height: 64,
        anchor: [0, 0],
        textColor: '#ffffff',
        textSize: 12
    }];



    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);	

    // initialize of MARKER CLUSTER
    mc = new MarkerClusterer(map);
    mc.setMaxZoom(11);
    mc.setStyles(style);
    map.setCenter(cr);

    // add preloader
    document.getElementById("map_canvas").style.background="url('/skin/images/preload.gif') center center no-repeat";

    if (place_cityUrl == '' || place_cityUrl == null) {
        // Try W3C Geolocation (Preferred)
        if(navigator.geolocation) {
            browserSupportFlag = true;
            navigator.geolocation.getCurrentPosition(function(position) {
                initialLocation = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
                map.setCenter(initialLocation);
                latlng2Address(initialLocation);
                map.setZoom(11);
            }, function() {
                handleNoGeolocation(browserSupportFlag);
            });
        // Try Google Gears Geolocation
        } else if (google.gears) {
            browserSupportFlag = true;
            var geo = google.gears.factory.create('beta.geolocation');
            geo.getCurrentPosition(function(position) {
                initialLocation = new google.maps.LatLng(position.latitude,position.longitude);
                map.setCenter(initialLocation);
                latlng2Address(initialLocation);
                map.setZoom(11);
            }, function() {
                handleNoGeoLocation(browserSupportFlag);
            });
        // Browser doesn't support Geolocation
        } else {
            browserSupportFlag = false;
            handleNoGeolocation(browserSupportFlag);
        }

        function handleNoGeolocation(errorFlag) {
            initialLocation = cr;
            map.setCenter(initialLocation);
            latlng2Address(initialLocation);
            map.setZoom(7);
        }
    } else {
        setPlace(place,place_address,place_zoom,place_cityId,place_cityUrl);
    }
    /*
     *  Set sport depent on cookies
     */
    setSport(sportName,sportId);

}

/*
 * INITIALIZE function including adding of marker
 */

function initializeCoords() {
    var myOptions = {
        zoom: 7,
        backgroundColor: "#FFFFFF",
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };

    var street = document.registration.regf_street.value;
    var town = document.registration.regf_city.value;
    var sent_lat = document.registration.regf_coords_n.value;
    var sent_lng = document.registration.regf_coords_e.value;

    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    map.setCenter(cr);

    // add preloader
    document.getElementById("map_canvas").style.background="url('/skin/images/preload.gif') center center no-repeat";

    /*
     *  Check if street or town is not preset, if not use GEOLOCATION
     */

    if(street == '' && town == '' && sent_lat == '')  {
        // Try W3C Geolocation (Preferred)
        if(navigator.geolocation) {
            browserSupportFlag = true;
            navigator.geolocation.getCurrentPosition(function(position) {
                initialLocation = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
                map.setZoom(11);
                map.setCenter(initialLocation);
                latlng2Address(initialLocation);
            }, function() {
                handleNoGeolocation(browserSupportFlag);
            });
        // Try Google Gears Geolocation
        } else if (google.gears) {
            browserSupportFlag = true;
            var geo = google.gears.factory.create('beta.geolocation');
            geo.getCurrentPosition(function(position) {
                initialLocation = new google.maps.LatLng(position.latitude,position.longitude);
                map.setZoom(11);
                map.setCenter(initialLocation);
                latlng2Address(initialLocation);
            }, function() {
                handleNoGeoLocation(browserSupportFlag);
            });
        // Browser doesn't support Geolocation
        } else {
            browserSupportFlag = false;
            handleNoGeolocation(browserSupportFlag);
        }

        function handleNoGeolocation(errorFlag) {
            initialLocation = cr;
            map.setCenter(initialLocation);
            latlng2Address(initialLocation);
            map.setZoom(7);
        }
    }

    google.maps.event.addListener(map, 'click', function(event) {
        addOneMarker(event.latLng);
    });

    /*
     *  ADD MARKER if position was sent or Focus on address
     */

    if(sent_lat != '' && sent_lng != '' ) {
        var location = new google.maps.LatLng(sent_lat,sent_lng);
        addOneMarker(location);
        map.setCenter(location);
        map.setZoom(15);
    }

    if (sent_lat == 0 && sent_lng == 0) {
        moveCenterBoth(); // set center to pre-filled address
    }
}

/*
 * INITIALIZE function showing just one marker
 */

function initializeMarker(name,lat,lng) {
    var myOptions = {
        zoom: 15,
        backgroundColor: "#FFFFFF",
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };    
    var coords = new google.maps.LatLng(lat,lng);

    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    map.setCenter(coords);

    // add preloader
    document.getElementById("map_canvas").style.background="url('/skin/images/preload.gif') center center no-repeat";
    
    map.setCenter(coords);
    
    
        
    var marker = new google.maps.Marker({
        position: coords,
        map: map,
        icon: defaultImage,
        title:name
    });

}



/*
 * GOTO MARKER
 */

function gotoMarker() {
    var sent_lat = document.registration.regf_coords_n.value;
    var sent_lng = document.registration.regf_coords_e.value;
    if(sent_lat != '' && sent_lng != '' ) {
        var location = new google.maps.LatLng(sent_lat,sent_lng);
        map.setCenter(location);
        map.setZoom(15);
    }
}


var oneMarker;

function addOneMarker(location) {
    if (oneMarker != undefined)  {
        oneMarker.setMap(null)
    }
    oneMarker = new google.maps.Marker({
        position: location,
        map: map,
        icon: defaultImage,
        draggable: true
    });
    document.registration.regf_coords_n.value = location.lat();
    document.registration.regf_coords_e.value = location.lng();

    google.maps.event.addListener(oneMarker, "dragend", function() {
        var location = oneMarker.getPosition();
        document.registration.regf_coords_n.value = location.lat();
        document.registration.regf_coords_e.value = location.lng();
    });

}


/*
 * Function to move center of map  - Address + Zoom !
 */

function moveCenter(address,zoom) {
    var geocoder = new google.maps.Geocoder();
    geocoder.geocode({
        address:address
    },function(result, status){
        if(result && result[0]) {
            var coords = result[0].geometry.location;
            map.setCenter(coords);
            map.setZoom(zoom);
        }
    });
}

/*
 * Function to move center of map  - Address + Zoom !
 */

function moveCenterAndMark(address,zoom) {
    var geocoder = new google.maps.Geocoder();
    geocoder.geocode({
        address:address
    },function(result, status){
        if(result && result[0]) {
            var coords = result[0].geometry.location;
            map.setCenter(coords);
            map.setZoom(zoom);
            addOneMarker(coords);
        }
    });
}

/*
 * Move center by street + town (JUST FOR REGISTRATION)
 */
function moveCenterBoth() {
    var zoom = 15;
    var street = document.registration.regf_street.value;
    var town = document.registration.regf_city.value;
    moveCenterAndMark(street + ' ' + town, zoom);

}


/*
 *  Display basic marker on map
 */
function displayMarker(address, name, desc) {
    var contentString = '<h1>'+name+'</h1>'+desc;

    var infowindow = new google.maps.InfoWindow({
        content: contentString,
        borderRadius: 0
    });
    bubbleArray.push(infowindow);
    var geocoder = new google.maps.Geocoder();
    geocoder.geocode({
        address:address
    },function(result, status){
        var coords = result[0].geometry.location;
        var marker = new google.maps.Marker({
            position: coords,
            map: map,
            title:name
        });
        markersArray.push(marker);
        google.maps.event.addListener(marker, 'click', function() {
            infowindow.open(map,marker);
        });
    });
}

/*
 *  Load sport by ID
 */

function loadSport(idsport) {
    $.getJSON("/ajax/facility/map/id/" + idsport, function(data) {
        $.each(data, function(key, val) {
            sportMarker(
                val.FAC_iID,
                val.FAC_cName,
                val.FAC_cAlias,
                val.FAC_cDescription,
                val.FAC_cEmail,
                val.FAC_cPhone,
                val.FAC_cWeb,
                val.FAC_cAddress,
                val.FAC_cCity,
                val.FAC_cCoords,
                val.FAC_cOpenTime,
                val.FAC_iStatus,
                val.FAC_cPhoto,
                val.sports
                );
        });
    });
}


/*
 * Function to get Address from coords
 */
function latlng2Address(latLng) {
    var geocoder = new google.maps.Geocoder();
    geocoder.geocode({
        'latLng':latLng
    },function(result, status){
        for(i=0;i<10;i++) {
            if(result[0].address_components[i].types=='locality,political') {
                var address = result[0].address_components[i].long_name;
                setSelectedPlace(address);
            }
        }
    });
}


/*
 * FUNCTION TO DISPLAY BUBBLE WITH TABS
 */

var geocoder = new google.maps.Geocoder();

function sportMarker(id,name,alias,description,fac_email,fac_phone,fac_web,address,city,coords,openTime,iStatus,photo,sports) {
    var fotoInfo = '';
    var openTimeHtml = '';
    var tabTime = '';
    var tabPhoto = '';
    var otherSports = '';
    var markerIcon;
    var bubbleClass;
    var email = '';
    var phone = '';
    var web = '';
    var contact = '';


    if(fac_email != '' && fac_email != null) {
        email = '<b>' + tEmail + '</b>: <a href="mailto: ' + tEmail + '">' + fac_email + '</a><br />';
    }

    if(fac_phone != '' && fac_phone != null) {
        phone = '<b>' + tPhone + '</b>: ' + fac_phone + '<br />';
    }

    if(fac_web != '' && fac_web != null) {
        web = '<b>' + tWeb + '</b>: <a target="_blank" href="' + fac_web + '">' + fac_web + '</a><br />';
    }

    //contact part
    if( (email != '' && email != null) || (phone != '' && phone != null) || (web != '' && web != null) ) {
        contact = '<hr/>' + email + phone + web;
    }

    // set marker style depend of facility type free/comerce
    if(iStatus == 1) {
        markerIcon = 'marker_brown';
        //bubbleColor = '#75A2D4';
        bubbleClass = 'brown';
    } else if(iStatus == 2) {
        markerIcon = 'marker_blue';
        //bubbleColor = '#75A2D4';
        bubbleClass = 'blue';
    } else if(iStatus == 3) {
        
        markerIcon = 'marker_grey';
        bubbleClass = 'blue';
        description = '<div class="your_facility">' +
        '<a href="/facility/myfacility/id/'+ id + '">' + tYour_facility + '</a></div>' +
        '<div class="suggest_facility"><a href="/article/display/id/dejte-o-nas-vedet">' + tSug_facility + '</a></div><br style="clear:both;" />';
    }
    var size = $(sports).length;
    if (size > 1) {
        var sportsBody = '';
        $(sports).each(function(index, val) {
            sportsBody = sportsBody + sportsArray[val] + ', ';
        });
        var nSportsBody = sportsBody.substring(0, sportsBody.length-2);

        otherSports = '<br /><hr /><div style="margin-top:10px;"><b>'+ allSports + ': </b>'+ nSportsBody + '</div>';
    }

    var main = '<div>'
    + description +
    '<hr/>'
    + address + ', ' + city + otherSports + contact +'</div>';


    if(openTime != '' && openTime != null) {
        markerIcon = markerIcon + '_time';
        var days = openTime.split(/\r\n|\r|\n/);
        openTimeHtml = '<div id="tab-2"><table ><tr class="'+ current[1] +'"><td style="padding-right: 25px;"><b>' + tMo + '</b></td><td>' + days[0] + '</td></tr>' +
        '<tr class="'+ current[2] +'"><td><b>' + tTu + '</b></td><td>' + days[1] + '</td></tr>' +
        '<tr class="'+ current[3] +'"><td><b>' + tWe + '</b></td><td>' + days[2] + '</td></tr>' +
        '<tr class="'+ current[4] +'"><td><b>' + tTh + '</b></td><td>' + days[3] + '</td></tr>' +
        '<tr class="'+ current[5] +'"><td><b>' + tFr + '</b></td><td>' + days[4] + '</td></tr>' +
        '<tr class="'+ current[6] +'"><td><b>' + tSt + '</b></td><td>' + days[5] + '</td></tr>' +
        '<tr class="'+ current[0] +'"><td><b>' + tSu + '</b></td><td>' + days[6] + '</td></tr></table></div>';

        tabTime = '<li style="float:left"><a href="#tab-2"><span>' + tOpeningHours + '</span></a></li>';
    }

    if (photo != '' && photo != null){
        fotoInfo = '<div id="tab-3"><div class="bubblePhotos"><a class="bubblePhoto" rel="foto1" href="'
        + photo + '"><img  width="100px" src="'
        + photo + '" alt=""/></a></div></div>';

        tabPhoto = '<li style="float:left"><a href="#tab-3"><span>' + tPhotos + '</span></a></li>';
    }

    var contentString =
    '<div class="t_top_left"></div><div class="t_top_right"></div><div class="t_bottom_left"></div><div class="t_bottom_right"></div>' +
    '<a class="bubbleHeader ' + bubbleClass + '" target="_blank" href="/facility/display/id/'
    + alias + '">'
    + name + '</a><div id="tabs" class="' + bubbleClass + '" style="width: 400px;margin-bottom:20px;">'+
    '<ul>'+
    '<li style="float:left"><a href="#tab-1"><span>' + tBasicInfo + '</span></a></li>'+
    tabTime +
    tabPhoto +
    '</ul>' +
    '<div id="tab-1" style="min-height:148px;">'+
    main +
    '</div>'+
    openTimeHtml +
    fotoInfo +
    '</div>';

    var infowindow = new google.maps.InfoWindow({
        maxWidth: 480
    });
    bubbleArray.push(infowindow);


    // Marker settings
    var image = new google.maps.MarkerImage('/skin/images/' + markerIcon + '_ws.png',
        // dimension of marker picture (icon)
        new google.maps.Size(29, 39),
        // position in picture (in case of multiple icon included)
        new google.maps.Point(0,0),
        // position of anchor
        new google.maps.Point(18, 39));

    if (coords != null) {
        var latlng = coords.split(",");
        var location = new google.maps.LatLng(latlng[0],latlng[1]);
        var marker = new google.maps.Marker({
            position: location,
            map: map,
            shadow: shadow,
            icon: image,
            title:name
        });
        // Add the marker to the MARKER CLUSTER
        mc.addMarker(marker);
        markersArray.push(marker);

        google.maps.event.addListener(marker, 'click', function() {
            var div = document.createElement('div');
            div.innerHTML = contentString;
            $(div).tabs();
            infowindow.setContent(div);
            closeBubbles();
            
            infowindow.open(map, marker);
            google.maps.event.addListener(infowindow, 'domready', function() {           
                //$("#tabs").tabs();
                $("a.bubblePhoto").fancybox();

                google.maps.event.addListener(infowindow, 'content_changed', function() {
                    var tab1 = $("#tab-1").height();
                    var tab2 = $("#tab-2").height();
                    var tab3 = $("#tab-3").height();
                    var maxHeight = Math.ceil(Math.max(tab1,tab2,tab3));
                    maxHeight = maxHeight + 100;
                    $("#tabs").css("height",maxHeight+"px");
                });
            });

        //http://stackoverflow.com/questions/1554893/google-maps-api-v3-infowindow-not-sizing-correctly
        });

        

    } else {
        var geoAddress  = address + ', ' + city;
        geocoder.geocode({
            address:geoAddress
        },function(result, status){
            if(result == null || result[0] == undefined) return;
            var coords = result[0].geometry.location;
            var marker = new google.maps.Marker({
                position: coords,
                map: map,
                icon: image,
                title:name

            });
            markersArray.push(marker);
            // Add the marker to the MARKER CLUSTER
            mc.addMarker(marker);
            google.maps.event.addListener(marker, 'click', function() {
                //$("#tabs").tabs();
                //if (infowindow.getMap() == null) {
                closeBubbles();
            //}
            });
        });
    }       
}

/*
 * Close all opened bubbles
 */
function closeBubbles() {
    if (bubbleArray) {
        for (i in bubbleArray) {
            bubbleArray[i].close();
        }
    }
}

/*
 *Removes the overlays(markers + bubbles) from the map, but keeps them in the array
 */

function clearOverlays() {
    if (markersArray) {
        for (i in markersArray) {
            markersArray[i].setMap(null);
        }
    }
    closeBubbles();
}

/*
 * Deletes all markers + bubbles in the array by removing references to them
 */
function deleteOverlays() {
    if (markersArray) {
        for (i in markersArray) {
            markersArray[i].setMap(null);
        }
        markersArray.length = 0;
    }
    if (bubbleArray) {
        for (i in bubbleArray) {
            bubbleArray[i].setMap(null);
        }
        bubbleArray.length = 0;
    }
}