var mapInitialCenter = new GLatLng(-6.1667, 106.788)
var mapInitialZoomLevel = 15

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

var directionsPanel;
var directions;

function getCameraIcon(status) {
    // icon cache
    if (!ICONS[status]) {
        var icon = new GIcon()
        icon.image = "http://s.lewatmana.com/trafficlive-media/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/trafficlive-media/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
        }
        marker.openInfoWindowHtml(content);
    });
    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)
        
        var cRight = new GCopyrightCollection('LewatMana.com');
        var copyright = new GCopyright(1, new GLatLngBounds(new GLatLng(-90, -180), new GLatLng(90, 180)),
                            0, "© 2010");
        cRight.addCopyright(copyright);
        
        var public_traffic_layer = new GGeoXml("http://lewatmana.com/peta/public/kml/");
        map.addOverlay(public_traffic_layer);
        
        map.addControl(new GLargeMapControl());
        map.enableDoubleClickZoom();
        
        $.get('/peta/pois/', function (data) {
            var points = JSON.parse(data)
            points.forEach(function(camera){
                var point = new GLatLng(camera.lat, camera.lon)
                map.addOverlay(createMarker(point, camera))
            })
        })
        
        directionsPanel = document.getElementById("routes")
        directions = new GDirections(map, directionsPanel);
        
        GEvent.addListener(directions, "error", on_directions_error)
    }
}

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 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)