var mapInitialCenter = new GLatLng(-6.223427,106.828587)
var mapInitialZoomLevel = 11

var ICONS = {}
var map = null
var mgr = null
var geocoder = null;


var directionsPanel;
var directions;

var titik_baru;

var titik_kamera = [];
var public_traffic_layer;

var incident_marker = [];
var non_incident_marker = [];

function getCameraIcon(status) {
    // icon cache
    if (!ICONS[status]) {
        var icon = new GIcon()
        icon.image = "http://s.lewatmana.com/img/cctv2-" + status + ".png"
        icon.iconAnchor = new GPoint(9, 29)
        icon.infoWindowAnchor = new GPoint(16, 0)
        icon.iconSize = new GSize(30, 30)
        icon.shadow = "http://s.lewatmana.com/img/cctv-shadow.png";
        icon.shadowSize = new GSize(32, 30);
        ICONS[status] = icon;
    }
    return ICONS[status];
}

function createMarker(point, camera, use_standard_icon, info_window_content) {
    var marker = null
    if (use_standard_icon) {
        marker = new GMarker(point);
    } else {
        var markerOptions = { icon: getCameraIcon(camera.status) };
        marker = new GMarker(point, markerOptions);
    }

    GEvent.addListener(marker, "click", function() {
        var content = '<h2>' + camera.name + '</h2>' + camera.thumbnail_html
        if (info_window_content) {
            content = info_window_content
        }
        map.setCenter(point, 14);
        marker.openInfoWindowHtml(content);
    });
    return marker;
}

function showAddressList(response) {    
    if (!response || response.Status.code != 200) {
        result = "<p>Lokasi tidak ditemukan</p>"
        $('div#search_result').html(result);
    } else {
        result = "<p><strong>Hasil pencarian:</strong></p><ol>";

        for (var i=0; i<response.Placemark.length; i++) {
            var p = response.Placemark[i].Point.coordinates;            
            result += "<li><a href=# class=\"mark\" onclick=\"showMarker(" + p[1] + ", " + p[0] + "); return false" + 
                        "\" >" + response.Placemark[i].address + "</a></li>";      
        }
        result += "</ol"
        $('div#search_result').html(result).animate(1000);
    }
}

function showAddressOrigin(response) {    
    if (!response || response.Status.code != 200) {
        result = "<p>Lokasi tidak ditemukan</p>"
        $('div#search_result').html(result);
    } else {
        result = "<p><strong>Pilih Titik Awal:</strong></p><ol>";

        for (var i=0; i<response.Placemark.length; i++) {
            var p = response.Placemark[i].Point.coordinates;            
            result += "<li><a href=# class=\"mark\" onclick=\"showMarkerOrigin(" + p[1] + ", " + p[0] + ", '" + response.Placemark[i].address + "'); return false" + 
                        "\" >" + response.Placemark[i].address + "</a></li>";      
        }
        result += "</ol"
        $('div#search_result').html(result).animate(1000);
    }
}

function showAddressDestination(response) {    
    if (!response || response.Status.code != 200) {
        result = "<p>Lokasi tidak ditemukan</p>"
        $('div#search_result').html(result);
    } else {
        result = "<p><strong>Pilih Titik Tujuan:</strong></p><ol>";

        for (var i=0; i<response.Placemark.length; i++) {
            var p = response.Placemark[i].Point.coordinates;        
            result += "<li><a href=# class=\"mark\" onclick=\"showMarkerDestination(" + p[1] + ", " + p[0] + ", '" + response.Placemark[i].address + "'); return false" + 
                        "\" >" + response.Placemark[i].address + "</a></li>";      
        }
        result += "</ol"
        $('div#search_result').html(result).animate(1000);
    }
}

function showLocation() {
    var address = $('#id_geocode_input').val();
    geocoder.getLocations(address, showAddressList);
}

function getOrigin() {
    var address = $('#id_origin_input').val();
    geocoder.getLocations(address, showAddressOrigin);
}

function getDestination() {
    var address = $('#id_destination_input').val();
    geocoder.getLocations(address, showAddressDestination);
}

function showDirections() {    
    var from = $("#hidden-origin").val()
    var to = $("#hidden-destination").val()
    
    // var from = "-6.17376, 106.78682"
    // var to = "-6.21772, 106.81147"
    var s = "from: " + from + " to: " + to
    // console.log(s)
    
    directions.load(s);
    
    // from: (-6.17376, 106.78682) to: (-6.21772, 106.81147)

    return false;
}

function showMarker(lat, lng, zoom) {
    var titik = '';
    $('#id_point').val(titik);
    
    lat = parseFloat(lat);          
    lng = parseFloat(lng);
    
    point = new GLatLng(lat, lng);
    if (titik_baru) { 
        map.removeOverlay(titik_baru);
    }
    titik_baru = bikinTitik(point); 
    map.addOverlay(titik_baru);
    if (zoom) {
        map.setCenter(point, zoom);
    } else {
        map.setCenter(point, 14);
    }
}

function showMarkerOrigin(lat, lng, address, zoom) {
    var titik = '';
    $('#id_point').val(titik);
    
    lat = parseFloat(lat);          
    lng = parseFloat(lng);
    
    point = new GLatLng(lat, lng);
    if (titik_baru) { 
        map.removeOverlay(titik_baru);
    }
    titik_baru = bikinTitik(point); 
    map.addOverlay(titik_baru);
    if (zoom) {
        map.setCenter(point, zoom);
    } else {
        map.setCenter(point, 14);
    }
    
    var coordinate = '(' + lat + ', ' + lng + ')'
    $('#hidden-origin').val(coordinate);
    $('#id_origin_input').val(address);

    var result = ''
    $('div#search_result').html(result).animate(2000);
}

function showMarkerDestination(lat, lng, address, zoom) {
    var titik = '';
    $('#id_point').val(titik);
    
    lat = parseFloat(lat);          
    lng = parseFloat(lng);
    
    point = new GLatLng(lat, lng);
    if (titik_baru) { 
        map.removeOverlay(titik_baru);
    }
    titik_baru = bikinTitik(point); 
    map.addOverlay(titik_baru);
    if (zoom) {
        map.setCenter(point, zoom);
    } else {
        map.setCenter(point, 14);
    }
    
    var coordinate = '(' + lat + ', ' + lng + ')'
    $('#hidden-destination').val(coordinate);
    $('#id_destination_input').val(address);
    
    var result = ''
    $('div#search_result').html(result).animate(2000);
}

function bikinTitik(point) {
    var latitude = point.lat();
    var longitude = point.lng();
    
    var marker = null
    marker = new GMarker(point);
    
    GEvent.addListener(marker, "dblclick", function() {
        map.setCenter(point, 16);
    });
    return marker;
}

function getNonIncidentIcon(name) {
    // icon cache
    if (!ICONS[name]) {
        var icon = new GIcon()
        icon.image = "http://s.lewatmana.com/img/incident/laporan.png"
        icon.iconAnchor = new GPoint(7, 19)
        icon.infoWindowAnchor = new GPoint(7, 19)
        icon.iconSize = new GSize(20, 19)
        ICONS[name] = icon;
    }
    return ICONS[name];
}

function getIncidentIcon(name) {
    // icon cache
    if (!ICONS[name]) {
        var icon = new GIcon()
        icon.image = "http://s.lewatmana.com/img/incident/" + name + ".gif"
        icon.iconAnchor = new GPoint(9, 29)
        icon.infoWindowAnchor = new GPoint(16, 0)
        icon.iconSize = new GSize(22, 22)
        ICONS[name] = icon;
    }
    return ICONS[name];
}

function createIncidentMarker(point, kondisi, use_standard_icon, info_window_content) {
    var marker = null
    if (use_standard_icon) {
        // marker = new GMarker(point);
        laporan = "laporan"
        var markerOptions = { icon: getNonIncidentIcon(laporan) };
        marker = new GMarker(point, markerOptions);
    } else {
        var markerOptions = { icon: getIncidentIcon(kondisi.incident) };
        marker = new GMarker(point, markerOptions);
    }
    
    GEvent.addListener(marker, "click", function() {
        var content = "<p><strong>" + kondisi.content + "</strong></p><p style=\"width:300px;\"><em>" + kondisi.timestamp + " &middot; " + kondisi.reporter + "</em></p>"
        if (info_window_content) {
            content = info_window_content
        }
        map.setCenter(point, 14);
        marker.openInfoWindowHtml(content, {maxWidth: '300'});
    });
    return marker;
}

function savePathFromGDirections(directions, pathName) {
    var polyline = directions.getPolyline()
    var vertex_count = polyline.getVertexCount()
    var vertex;
    var point;
    var vertices = [];
    
    for (var i=0; i<vertex_count; i++) {
        vertex = polyline.getVertex(i)
        point = [vertex.lat(), vertex.lng()]
        vertices.push(point)
    }
    
    $.post('/peta/path/add/', {
            points: JSON.stringify(vertices),
            path_id: $("form#directions-form select#directions-path-id").val()
        }, function (data, status) {
            alert(data)
        })
}

function loadPath(pathId, colour, weight, opacity) {
    if (typeof colour == 'undefined') {
        colour = "#00ff00"
    }
    
    if (typeof weight == 'undefined') {
        weight = 4
    }
    
    if (typeof opacity == 'undefined') {
        opacity = 1
    }
    
    $.getJSON('/peta/path/' + pathId + '/', function (data, status) {
        if (status == "success") {
            var encodedPoints = data[0];
            var encodedLevels = data[1];
            var encodedPolyline = new GPolyline.fromEncoded({
                color: colour,
                weight: weight,
                opacity: opacity,
                points: encodedPoints,
                levels: encodedLevels,
                zoomFactor: 32,
                numLevels: 4
            });
            map.addOverlay(encodedPolyline);
        } else {
            alert(data)
        }
    })
}


function on_directions_error() {
    // console.log(directions.getStatus())
}


function setupMainMap(center, level) {
    if (GBrowserIsCompatible()) {
        map = new GMap2(document.getElementById("map"))
        
        if (typeof center == "undefined" || center == "") {
            center = mapInitialCenter
        }
        if (typeof level == "undefined" || level == "") {
            level = mapInitialZoomLevel
        }
 
        map.setCenter(center, level)
        
        geocoder = new GClientGeocoder();
        geocoder.setBaseCountryCode('ID')
        
        var cRight = new GCopyrightCollection('LewatMana.com');
        var copyright = new GCopyright(1, new GLatLngBounds(new GLatLng(-90, -180), new GLatLng(90, 180)),
                            0, "© 2012");
        cRight.addCopyright(copyright);
        
        
        public_traffic_layer = new GGeoXml("http://lewatmana.com/peta/public/kml/");
        
        map.addOverlay(public_traffic_layer);
        
        map.addControl(new GLargeMapControl());
        map.enableDoubleClickZoom();
        
        $.get('/kondisi/latest_nonincident/', function (data) {
            var points = JSON.parse(data)
            points.forEach(function(kondisi){
                var point = new GLatLng(kondisi.latitude, kondisi.longitude)
                non_incident = createIncidentMarker(point, kondisi, true)
                non_incident_marker.push(non_incident)  
                map.addOverlay(non_incident)
            })
        })
        
        $.get('/kondisi/latest_incident/', function (data) {
            var points = JSON.parse(data)
            points.forEach(function(kondisi){
                var point = new GLatLng(kondisi.latitude, kondisi.longitude)
                incident = createIncidentMarker(point, kondisi)
                incident_marker.push(incident)
                map.addOverlay(incident)
            })
        })
        
        directionsPanel = document.getElementById("routes")
        directions = new GDirections(map, directionsPanel);
        
        GEvent.addListener(directions, "error", on_directions_error)
        
        day_of_week = new Date().getDay();
        
        if (day_of_week == "0" || day_of_week =="6") {
            $('input#kamera-checkbox').attr('checked', true);
            if (titik_kamera.length > 0) { 
                for (var i = 0; i < titik_kamera.length; i++) {  
                    var marker = titik_kamera[i];  
                    marker.show();  
                }
            } else {
                $.get('/peta/pois/', function (data) {
                    var points = JSON.parse(data)
                    points.forEach(function(camera){
                        var point = new GLatLng(camera.lat, camera.lon)
                        kamera = createMarker(point, camera)
                        titik_kamera.push(kamera);  
                        map.addOverlay(kamera)
                    })
                })
            }
        }
        
        $('input#kamera-checkbox').change(function () {
            if ($(this).attr('checked')) {
                if (titik_kamera.length > 0) { 
                    for (var i = 0; i < titik_kamera.length; i++) {  
                        var marker = titik_kamera[i];  
                        marker.show();  
                    }
                } else {
                    $.get('/peta/pois/', function (data) {
                        var points = JSON.parse(data)
                        points.forEach(function(camera){
                            var point = new GLatLng(camera.lat, camera.lon)
                            kamera = createMarker(point, camera)
                            titik_kamera.push(kamera);  
                            map.addOverlay(kamera)
                        })
                    })
                }    
                return;
            }
            //Here do the stuff you want to do when 'unchecked'
            for (var i = 0; i < titik_kamera.length; i++) {  
                var marker = titik_kamera[i];  
                marker.hide();  
            }
        });
        
        $('input#traffic-checkbox').change(function () {
            if ($(this).attr('checked')) {
                public_traffic_layer.show();
                return;
            }
            //Here do the stuff you want to do when 'unchecked'
            public_traffic_layer.hide();
        });
        
        $('input#laporan-checkbox').change(function () {
            if ($(this).attr('checked')) {
                for (var i = 0; i < non_incident_marker.length; i++) {  
                    var marker = non_incident_marker[i];  
                    marker.show();  
                }                
                return;
            }
            //Here do the stuff you want to do when 'unchecked'
            for (var i = 0; i < non_incident_marker.length; i++) {  
                var marker = non_incident_marker[i];  
                marker.hide();  
            }
        });
        
        $('input#incident-checkbox').change(function () {
            if ($(this).attr('checked')) {
                for (var i = 0; i < incident_marker.length; i++) {  
                    var marker = incident_marker[i];  
                    marker.show();  
                }                
                return;
            }
            //Here do the stuff you want to do when 'unchecked'
            for (var i = 0; i < incident_marker.length; i++) {  
                var marker = incident_marker[i];  
                marker.hide();  
            }
        });
    }
}

function setupCamViewerMap(camera) {
    if (GBrowserIsCompatible()) {
        map = new GMap2(document.getElementById("cam-viewer-map"))
        map.setCenter(new GLatLng(camera.latitude, camera.longitude), 14)                
        map.addControl(new GSmallMapControl());
        map.enableDoubleClickZoom();
                       
        
        $.get('/peta/pois/', function (data) {
            var points = JSON.parse(data)
            points.forEach(function(cam) {
                var point = new GLatLng(cam.lat, cam.lon)
                var marker = null
                if (cam.id == camera.id) {
                    marker = createMarker(point, cam, true,
                            '<h2>' + cam.name + '</h2><p>Ini kamera yang sedang Anda lihat di halaman ini.</p>'
                        )
                } else {
                    marker = createMarker(point, cam, false)
                }
                map.addOverlay(marker)
            })
            
        })
        
        
    }
}

function setupCamViewerListMapPublic(list_id) {
    if (GBrowserIsCompatible()) {
        map = new GMap2(document.getElementById("cam-viewer-map"));
        map.setCenter(mapInitialCenter,mapInitialZoomLevel);
        map.addControl(new GSmallMapControl());
        map.enableDoubleClickZoom();
                
        
        $.getJSON('/peta/pubpoisbylist/' + list_id + '/', function (points) {
            points.forEach(function(bookmarks){
                var point = new GLatLng(bookmarks.lat, bookmarks.lon)
                map.addOverlay(createMarker(point, bookmarks))
                
            })
           
        })       
                     
    }
}

function setupCamViewerListMap(list_id) {
    if (GBrowserIsCompatible()) {
        map = new GMap2(document.getElementById("cam-viewer-map"));
        map.setCenter(mapInitialCenter,mapInitialZoomLevel);
        map.addControl(new GSmallMapControl());
        map.enableDoubleClickZoom();
                
        
        $.getJSON('/peta/poisbylist/' + list_id + '/', function (points) {
            points.forEach(function(bookmarks){
                var point = new GLatLng(bookmarks.lat, bookmarks.lon)
                map.addOverlay(createMarker(point, bookmarks))
                
            })
           
        })       
                     
    }
}


function on_directions_save(evt) {
    evt.preventDefault()
    savePathFromGDirections(directions)
    return false
}

function on_directions_form_submit (evt) {
    evt.preventDefault();
    
    var from = $("#id_from").val()
    var to = $("#id_to").val()

    var s = "from: " + from + " to: " + to
    // console.log(s)
    
    directions.load(s);
    
    // from: (-6.17376, 106.78682) to: (-6.21772, 106.81147)

    return false;
}

$(window).unload(GUnload)

