﻿/**************************** General Variables **************************/
var map, cgm, mapZoom = 10;
var mapCenter = new GLatLng(33.686732, -117.803824);
/**************************** General Variables **************************/


/**************************** Project Variables ***************************/
var projectWebServiceHost = Config.M2ProjectWebServiceHost;
var projectKindId = 294, freewayEntryId = 309, transitEntryId = 311;
var jdata = {};
/**************************** Project Variables ***************************/


/**************************** Corridor Variables **************************/
var corridorWebServiceHost = Config.M2CorridorWebServiceHost;
var opacity = 1, countyLayerId = 4, cityLayerId = 6, corridorLayerId = 1, movePoint, selectedCorridorId = "All", isCorridorChecked = false;
var url = Config.M2GISURL;
var queryTask = new esri.arcgis.gmaps.QueryTask(Config.M2GISURL + "/" + corridorLayerId);
var layersOverlay = new Array();
var corridors = new Array();
var corridorsOverlay = new Array();
var pattern1 = /plan/gi;
var pattern2 = /construction/gi;
var pattern3 = /complete/gi;
var normal = 3, highlight = 6;
var polyStyleOptions1 = { color: "#0090E7", weight: normal, opacity: 0.5 };
var polyStyleOptions2 = { color: "#F7931E", weight: normal, opacity: 0.5 };
var polyStyleOptions3 = { color: "#32CA00", weight: normal, opacity: 0.5 };
esri.arcgis.gmaps.Config.polylineStrokeColor = "#000000";
esri.arcgis.gmaps.Config.polylineStrokeWeight = 0;
esri.arcgis.gmaps.Config.polylineStrokeOpacity = 0;
/**************************** Corridor Variables **************************/


/**************************** General Functions **************************/
$(document).ready(function() {
    mapInit();
    repos();
    $(window).resize(function() {
        repos();
    });
});

function mapInit() {
    map = new GMap2($("#map_canvas").get(0));
    map.removeMapType(G_SATELLITE_MAP);
    map.addMapType(G_PHYSICAL_MAP);
    map.setMapType(G_PHYSICAL_MAP);
    map.setCenter(mapCenter, mapZoom);

    var mapTypePos = new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(10, 10));
    map.addControl(new GMapTypeControl(), mapTypePos);
    var mapControlPos = new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(10, 50));
    map.addControl(new GLargeMapControl(), mapControlPos);

    corridorInit();
    projectInit();
}

function repos() {
    var legendTop = $("#map_canvas").offset().top;
    var legendLeft = $("#map_canvas").width() - $("#layerControl").width() + 27;
    $("#layerControl").css("left", legendLeft + "px");
}

var layerControlVisible = true;

function toggleLayerControl() {
    if (layerControlVisible) {
        $("#layersPanel").hide();
        $("#layer-toggle").css("width", "210px");
        layerControlVisible = false;
        $("#arrow").attr("src", "/MeasureM2/Images/Map/sidebarArrowExpand.png");
    }
    else {
        $("#layersPanel").show();
        $("#layer-toggle").css("width", "");
        layerControlVisible = true;
        $("#arrow").attr("src", "/MeasureM2/Images/Map/sidebarArrow.png");
    }
}

function openInfoWindow(ll, html) {
    map.openInfoWindow(ll, html, { maxWidth: 300 });
    var pixel = map.fromLatLngToContainerPixel(ll);
    //alert(pixel);
    if (pixel.x > 400 && pixel.y < 450) {
        map.setCenter(ll);
    }
}
/**************************** General Functions **************************/


/**************************** Corridor Functions **************************/
function corridorInit() {
    var imageParams = new esri.arcgis.gmaps.ImageParameters();
    imageParams.layerIds = [countyLayerId];
    var dynamicMap = new esri.arcgis.gmaps.DynamicMapServiceLayer(url, imageParams, opacity, function(groundov) {
        dynmapcallback(countyLayerId, groundov);
    });

    GEvent.addListener(map, "mousemove", function(latlng) {
        movePoint = latlng;
    });

    //alert(corridorWebServiceHost + "/MeasureM2/WebServices/CorridorWebService.asmx/GetCorridorStatuses");

    $.ajax({
        type: "POST",
        contentType: "application/json; charset=utf-8",
        url: corridorWebServiceHost + "/MeasureM2/WebServices/CorridorWebService.asmx/GetCorridorStatuses",
        data: "{}",
        dataType: "json",
        success: function(data) {
            corridors = data;
            executeQuery();
        },
        error: function(XMLHttpRequest, textStatus, errorThrown) {
            alert("corridor request:" + XMLHttpRequest + ", status: " + textStatus + ", error: " + errorThrown);
        }
    });
}

function dynmapcallback(layerId, groundov) {
    //    if (layerId == cityLayerId && layersOverlay[cityLayerId]) {
    //        map.removeOverlay(layersOverlay[cityLayerId]);
    //    }
    map.addOverlay(groundov);
    layersOverlay[layerId] = groundov;
}

function executeQuery() {
    var query = new esri.arcgis.gmaps.Query();
    var bounds = map.getBounds();
    query.queryGeometry = bounds;
    query.outFields = ["CORRIDORID", "CORRIDOR"];

    queryTask.execute(query, false, function(featureSet, error) {
        if (error) {
            alert("Error " + error.code + ": " + (error.message || (error.details && error.details.join(" ")) || "Unknown error"));
            return;
        }

        var features = featureSet.features;
        var geometry, attributes;
        for (var i = 0; i < features.length; i++) {
            geometry = features[i].geometry;
            attributes = features[i].attributes;
            corridorsOverlay[attributes["CORRIDORID"] - 1] = new Array();
            for (var j = 0; j < geometry.length; j++) { // Feature.geometry is an array of GPolygon/GPolyline/GMarker
                var polyline = geometry[j];
                var corridorId = attributes["CORRIDORID"];
                var status = corridors[corridorId - 1];
                if (status) {
                    if (status.match(pattern1)) {
                        polyline.setStrokeStyle(polyStyleOptions1);
                    }
                    else if (status.match(pattern2)) {
                        polyline.setStrokeStyle(polyStyleOptions2);
                    }
                    else if (status.match(pattern3)) {
                        polyline.setStrokeStyle(polyStyleOptions3);
                    }
                }
                corridorsOverlay[attributes["CORRIDORID"] - 1].push(polyline);
                map.addOverlay(polyline);
                polyline.hide();
                GEvent.addListener(polyline, "mouseover", mouseOverFunc);
                GEvent.addListener(polyline, "mouseout", mouseOutFunc);
                GEvent.addListener(polyline, "click", GEvent.callbackArgs(polyline, clickFunc, attributes));
            }
        }
        //alert(corridorsOverlay[28]);
        $("#loading").hide();
    });
}

function mouseOverFunc() {
    var polyline = this;
    polyline.setStrokeStyle({ weight: highlight });
}

function mouseOutFunc() {
    var polyline = this;
    polyline.setStrokeStyle({ weight: normal });
}

function clickFunc(attributes) {
    var polyline = this;
    polyline.setStrokeStyle({ weight: highlight });

    var clickPoint = movePoint;
    if (clickPoint == null) {
        var count = polyline.getVertexCount();
        var index = Math.floor(count / 2);
        clickPoint = polyline.getVertex(index);
    }
    //var html = "<b>CORRIDORID:</b> " + attributes["CORRIDORID"] + "<br><b>CORRIDOR:</b> " + attributes["CORRIDOR"];
    $.ajax({
        type: "POST",
        contentType: "application/json; charset=utf-8",
        url: corridorWebServiceHost + "/MeasureM2/WebServices/CorridorWebService.asmx/GetInfoWindowHTML",
        data: "{'corridorId':" + attributes["CORRIDORID"] + "}",
        dataType: "text",
        success: function(data) {
            openInfoWindow(clickPoint, data);
        },
        error: function(XMLHttpRequest, textStatus, errorThrown) {
            alert("request:" + XMLHttpRequest + ", status: " + textStatus + ", error: " + errorThrown);
        }
    });
}

function changeCity(ddl) {
    $("#loading").show();
    var index = ddl.selectedIndex;
    var city = ddl.options[index].text;
    if (city != "All") {
        findTask = new esri.arcgis.gmaps.FindTask(url);
        params = new esri.arcgis.gmaps.FindParameters();
        params.layerIds = [cityLayerId];
        params.searchFields = ["City"];
        params.searchText = city;
        findTask.execute(params, findCompleteCallback);

        //        var imageParams = new esri.arcgis.gmaps.ImageParameters();
        //        imageParams.layerIds = [cityLayerId];
        //        var layerDefs = [];
        //        layerDefs[cityLayerId] = "City != '" + city + "'";
        //        imageParams.layerDefinitions = layerDefs;
        //        var dynamicMap = new esri.arcgis.gmaps.DynamicMapServiceLayer(url, imageParams, opacity, function(groundov) {
        //            dynmapcallback(cityLayerId, groundov);
        $("#loading").hide();
        //        });
    }
    else {
        map.setCenter(mapCenter, mapZoom);
        //        if (layersOverlay[cityLayerId]) {
        //            map.removeOverlay(layersOverlay[cityLayerId]);
        $("#loading").hide();
        //        }
    }
}

function findCompleteCallback(findResults) {
    var results = findResults.findResults;
    if (results.length > 0) {
        var bounds;
        for (var i = 0; i < results.length; i++) {
            var result = results[i];
            var feature = result.feature;
            var attributes = feature.attributes;
            var geometry = feature.geometry;
            for (var j = 0; j < geometry.length; j++) {
                var geom = geometry[j];
                var latlngbounds = geom.getBounds();
                if (bounds == undefined) {
                    bounds = latlngbounds;
                }
                bounds.extend(latlngbounds.getSouthWest());
                bounds.extend(latlngbounds.getNorthEast());
            }
        }
        var zoom = map.getBoundsZoomLevel(bounds);
        var center = bounds.getCenter();
        map.setCenter(center, zoom);
    }
}

$(function() {
    $("#StreetCB").click(function() {
        toggleCorridor(this);
    });
});

function toggleCorridor(checkbox) {
    isCorridorChecked = checkbox.checked;
    if (isCorridorChecked) {
        $("#legend").show();
    }
    else {
        $("#legend").hide();
    }
    displayCorridors();
}

function displayCorridors() {
    for (var i = 0; i < corridorsOverlay.length; i++) {
        for (var j = 0; j < corridorsOverlay[i].length; j++) {
            if (isCorridorChecked) {
                if (selectedCorridorId == "All") {
                    corridorsOverlay[i][j].show();
                }
                else {
                    if (selectedCorridorId == i + 1) {
                        corridorsOverlay[i][j].show();
                    }
                    else {
                        corridorsOverlay[i][j].hide();
                    }
                }
            }
            else {
                corridorsOverlay[i][j].hide();
            }
        }
    }
}

//function changeCorridor(ddl) {
//    $("#loading").show();
//    selectedCorridorId = ddl.value;
//    if (selectedCorridorId != "All") {
//        findTask = new esri.arcgis.gmaps.FindTask(url);
//        params = new esri.arcgis.gmaps.FindParameters();
//        params.layerIds = [corridorLayerId];
//        params.searchFields = ["CORRIDORID"];
//        params.searchText = selectedCorridorId;
//        findTask.execute(params, findCompleteCallback);
//    }
//    //    else {
//    //        map.setCenter(mapCenter, mapZoom);
//    //    }
//    displayCorridors();
//    $("#loading").hide();
//}
/**************************** Corridor Functions **************************/


/**************************** Project Functions ***************************/
function projectInit() {
    cgm = new CRGGoogleMap(map, { maxInitZoom: 13 });
    cgm.onLayersLoadStart = function() { $("#loading").show(); };
    cgm.onLayersLoadComplete = function() { $("#loading").hide(); };
    cgm.initialize();

    //freeway projects
    $.ajax({
        type: "POST",
        contentType: "application/json; charset=utf-8",
        url: "/M2MapServiceSite/WebServices/ProjectWebService.asmx/GetProjects",
        data: "{ 'kindId': " + projectKindId + ", 'projectTypeId': " + freewayEntryId + " }",
        dataType: "json",
        success: function(data) {
            for (var i = 0; i < data.length; i++) {
                //alert(data[i] + data[i].EntryId + data[i].ColorCode);
                jdata = { 'query': "filter=entryid=" + data[i].EntryId };
                var ml = new MapLayer(data[i].EntryId, projectWebServiceHost + "/WebServices/MapService.svc/GetOverlayByEntryQuery", jdata, { visible: true, center: false, filterMb: false, cluster: false, group: freewayEntryId });
                ml.StrokeColor = data[i].ColorCode;
                ml.StrokeWeight = normal;
                ml.StrokeOpacity = opacity;
                ml.onMouseOver = layerMouseOver;
                ml.onMouseOut = layerMouseOut;
                ml.onClick = layerClick;
                cgm.addLayer(ml);
            }
        },
        error: function(XMLHttpRequest, textStatus, errorThrown) {
            alert("request:" + XMLHttpRequest + ", status: " + textStatus + ", error: " + errorThrown);
        }
    });

    //transit projects
    $.ajax({
        type: "POST",
        contentType: "application/json; charset=utf-8",
        url: "/M2MapServiceSite/WebServices/ProjectWebService.asmx/GetProjects",
        data: "{ 'kindId': " + projectKindId + ", 'projectTypeId': " + transitEntryId + " }",
        dataType: "json",
        success: function(data) {
            for (var i = 0; i < data.length; i++) {
                if (data[i].ColorCode) {
                    //alert(data[i] + data[i].EntryId + data[i].ColorCode);
                    jdata = { 'query': "filter=entryid=" + data[i].EntryId };
                    var ml = new MapLayer(transitEntryId, projectWebServiceHost + "/WebServices/MapService.svc/GetOverlayByEntryQuery", jdata, { visible: false, center: false, filterMb: false, cluster: false, group: transitEntryId });
                    ml.StrokeColor = data[i].ColorCode;
                    ml.StrokeWeight = normal;
                    ml.StrokeOpacity = opacity;
                    ml.onMouseOver = layerMouseOver;
                    ml.onMouseOut = layerMouseOut;
                    ml.onClick = layerClick;
                    cgm.addLayer(ml);
                    break;
                }
            }
        },
        error: function(XMLHttpRequest, textStatus, errorThrown) {
            alert("request:" + XMLHttpRequest + ", status: " + textStatus + ", error: " + errorThrown);
        }
    });
}

function layerMouseOver(crgmap, o, ll) {
    o.setStrokeStyle({ weight: highlight });
}

function layerMouseOut(crgmap, o, ll) {
    o.setStrokeStyle({ weight: normal });
}

function layerClick(o, ll, oll) {
    //alert(o + ll + oll);
    var ml = this.findLayerByOverlay(o);
    layerClickOpenWindow(ml, oll);
}

function layerClickOpenWindow(ml, oll) {
    $.ajax({
        type: "POST",
        contentType: "application/json; charset=utf-8",
        url: "/M2MapServiceSite/WebServices/ProjectWebService.asmx/GetInfoWindowHTML",
        data: "{ 'entryId' : " + ml.Name + " }",
        dataType: "text",
        success: function(data) {
            openInfoWindow(oll, data);
        },
        error: function(XMLHttpRequest, textStatus, errorThrown) {
            alert("request:" + XMLHttpRequest + ", status: " + textStatus + ", error: " + errorThrown);
        }
    });
}

$(function() {
    $("#FreewayCB").click(function() {
        toggleGroup(this, freewayEntryId);
    });
    $("#TransitCB").click(function() {
        toggleGroup(this, transitEntryId);
    });
});

function toggleGroup(checkbox, group) {
    if (checkbox.checked) {
        cgm.showLayerGroup(group);
    }
    else {
        cgm.hideLayerGroup(group);
    }
}
/**************************** Project Functions ***************************/
