﻿var AG_Clustering = {
    oMap: null,
    GetClients: function (obj) {
        url = "Clustering.ashx?request=GetClients"
        $.getJSON(url, function (json) {
            var _html = "<option></option>";
            for (var _counter = 0; _counter < json.Records.length; _counter++) {
                _html += "<option value=" + json.Records[_counter].Client + ">" + json.Records[_counter].Client + "</option>";
            }
            $("#" + obj).html(_html);
        });
    },
    GetDatasets: function (Client, obj) {
        if (typeof Client != "string" || Client == "")
            return;

        url = "Clustering.ashx?request=GetDatasets&client=" + Client;
        $.getJSON(url, function (json) {
            var _html = "<option></option>";
            for (var _counter = 0; _counter < json.Records.length; _counter++) {
                _html += "<option value=" + json.Records[_counter].Dataset + ">" + json.Records[_counter].Dataset + "</option>";
            }
            $("#" + obj).html(_html);
        });
    },
    GetCategories: function (Dataset, Client, obj) {
        url = "Clustering.ashx?request=GetCategories&dataset=" + Dataset + "&client=" + Client;
        $.getJSON(url, function (json) {
            var _html = "<option></option>";
            for (var _counter = 0; _counter < json.Records.length; _counter++) {
                _html += "<option value=" + json.Records[_counter].Category + ">" + json.Records[_counter].Category + "</option>";
            }
            $("#" + obj).html(_html);
        });
    },
    GetClusterPoints: function (Map, Client, DataSet, Category, BBox, ZoomLevel, MinClusterPoints) {
        //Get info of cluster
        if (typeof Client != "string" || Client == "")
            return;
        if (typeof DataSet != "string" || DataSet == "")
            return;
        //        if (typeof Category != "string" || Category == "")
        //            return;
        if (BBox == null)
            return;
        if (ZoomLevel == 0 || ZoomLevel == null || typeof ZoomLevel == "undefined")
            return;
        if (MinClusterPoints == 0 || MinClusterPoints == null || typeof MinClusterPoints == "undefined")
            return;

        var sLat = null;
        var sLon = null;
        var arrCoordWayPoints = new Array();

        AG_Clustering.oMap = Map

        url = "Clustering.ashx?request=GetClusterPoints&client=" + Client + "&dataset=" + DataSet + "&category=" + Category + "&bbox=" + BBox
        url += "&zoom_level=" + ZoomLevel + "&min_cluster_points=" + MinClusterPoints;
        $.getJSON(url, function (json) {
            Map.removeGroupOverlay("ClusterPoints");
            //Map.removeGroupOverlay("IndividualPoints");

            if ((json.cluster_points.x == undefined || json.cluster_points.x.length == 0) && (json.individual_points.x == undefined || json.individual_points.x.length == 0)) {
                alert('No Results Found');
                return;
            }
            else {
                //Legend
                var _html = "<h4> Legend: </h4><table cellpadding='0'><tr height='25' valign='top'><td><img src='images/large_cluster.png' height='20px' width='20px'/></td> <td> Cluster of more than 1000 points </td></tr>";
                _html += "<tr height='25' valign='top'><td><img src='images/medium_cluster.png' height='20px' width='20px'/></td> <td> Cluster of 100 - 999 points </td></tr>";
                _html += "<tr height='25' valign='top'><td><img src='images/small_cluster.png' height='20px' width='20px'/></td> <td> Cluster of less than 100 points </td></tr>";

                var aCat = new Array();
                aCat = Category.split(",");
                for (var i = 0; i < aCat.length; i++) {
                    _html += "<tr height='25' valign='top'><td><span style='background-image: url(images/dots_sprite.png);height:15px;width:14px;background-repeat:no-repeat;overflow:hidden;text-indent:-99999px;display:block;"

                    switch (aCat[i]) {
                        case "ACCOMMODATION":
                            _html += "background-position:0px 0px'></span>"
                            break;
                        case "AUTOMOTIVE":
                            _html += "background-position:0px -15px'></span>"
                            break;
                        case "COMMERCIAL":
                            _html += "background-position:0px -30px'></span>"
                            break;
                        case "EDUCATION":
                            _html += "background-position:0px -45px'></span>"
                            break;
                        case "ENTERTAINMENT":
                            _html += "background-position:0px -60px'></span>"
                            break;
                        case "FILLING_STATION":
                            _html += "background-position:0px -75px'></span>"
                            break;
                        case "GOVERNMENT":
                            _html += "background-position:0px -90px'></span>"
                            break;
                        case "MEDICAL":
                            _html += "background-position:0px -105px'></span>"
                            break;
                        case "PLACE_OF_WORSHIP":
                            _html += "background-position:-120px 0px'></span>"
                            break;
                        case "RECREATION":
                            _html += "background-position:0px -135px'></span>"
                            break;
                        case "RESIDENTIAL":
                            _html += "background-position:0px -150px'></span>"
                            break;
                        case "SERVICES":
                            _html += "background-position:0px -165px'></span>"
                            break;
                        case "SOCIAL_SERVICES":
                            _html += "background-position:0px -180px'></span>"
                            break;
                        case "STATIONERY__POSTAGE":
                            _html += "background-position:0px -195px'></span>"
                            break;
                        case "STORES":
                            _html += "background-position:0px -210px'></span>"
                            break;
                        case "TOURISM_ATTRACTIONS":
                            _html += "background-position:0px -225px'></span>"
                            break;
                        case "TRANSPORTATION":
                            _html += "background-position:0px -240px'></span>"
                            break;
                        default:
                            _html += "background-position:0px -240px'></span>"
                            break;
                    }
                    _html += "</td><td> " + aCat[i] + " </td></tr>"
                }

                _html += "</table>";
                $("#legend").html(_html);


                //Clusters
                for (var _counter = 0; _counter < json.cluster_points.x.length; _counter++) {
                    sLat = parseFloat(json.cluster_points.y[_counter]);
                    sLon = parseFloat(json.cluster_points.x[_counter]);
                    oLatLong = new AGCoord(sLat, sLon);
                    arrCoordWayPoints.push(new AGCoord(sLat, sLon));

                    var _noofpts = json.cluster_points.total_points[_counter];
                    var _str = json.cluster_points.category[_counter] + " : " + _noofpts;

                    var _div = document.createElement("div");
                    _div.setAttribute("id", "c" + _counter);
                    _div.setAttribute("title", _str);
                    var inHTML = "<div style='position:absolute;background-position:0px 0px'>";

                    if (_noofpts >= 1000) {
                        _imageSrc = "images/large_cluster.png";
                    }
                    else if (_noofpts >= 100 && _noofpts <= 999) {
                        _imageSrc = "images/medium_cluster.png";
                    }
                    else if (_noofpts <= 99) {
                        _imageSrc = "images/small_cluster.png";
                    }

                    inHTML += "<img src='" + _imageSrc + "'><p style='float:left;position:absolute;top:0px;width:100%;text-align:center;font-size:10pt;font-weight:bold;font-family:arial;'>" + _noofpts + "</p>";
                    inHTML += "</div>"
                    _div.innerHTML = inHTML;

                    var _iconAnchor = new AGPoint(-22, -22);
                    var _imageSize = new AGSize(40, 40)

                    var opts = new AGHTMLOverlayOptions(_iconAnchor, _imageSize);

                    var htmlOverlay = new AGHTMLOverlay(_div, new AGCoord(sLat, sLon), opts);

                    Map.addOverlay(htmlOverlay, "ClusterPoints");
                    AGEvent.addListener(htmlOverlay, "onmouseover", AG_Clustering.ShowTooltip);
                    AGEvent.addListener(htmlOverlay, "onmouseout", AG_Clustering.HideTooltip);
                }

                //Individual points
                for (var _counter = 0; _counter < json.individual_points.x.length; _counter++) {
                    sLat = parseFloat(json.individual_points.y[_counter]);
                    sLon = parseFloat(json.individual_points.x[_counter]);
                    oLatLong = new AGCoord(sLat, sLon);

                    var _iconAnchor = new AGPoint(-7, -7);
                    var _str = json.individual_points.name[_counter];
                    var _div = document.createElement("div");
                    _div.setAttribute("id", "i" + _counter);
                    _div.setAttribute("title", _str);

                    var inHTML = "<span style='height:15px;width:14px;background-repeat:no-repeat;background-image: url(images/dots_sprite.png);overflow:hidden;text-indent:-99999px;display:block;";
                    switch (json.individual_points.category[_counter]) {
                        case "ACCOMMODATION":
                            inHTML += "background-position:0px 0px'"
                            break;
                        case "AUTOMOTIVE":
                            inHTML += "background-position:0px -15px'"
                            break;
                        case "COMMERCIAL":
                            inHTML += "background-position:0px -30px'"
                            break;
                        case "EDUCATION":
                            inHTML += "background-position:0px -45px'"
                            break;
                        case "ENTERTAINMENT":
                            inHTML += "background-position:0px -60px'"
                            break;
                        case "FILLING_STATION":
                            inHTML += "background-position:0px -75px'"
                            break;
                        case "GOVERNMENT":
                            inHTML += "background-position:0px -90px'"
                            break;
                        case "MEDICAL":
                            inHTML += "background-position:0px -105px'"
                            break;
                        case "PLACE_OF_WORSHIP":
                            inHTML += "background-position:-120px 0px'"
                            break;
                        case "RECREATION":
                            inHTML += "background-position:0px -135px'"
                            break;
                        case "RESIDENTIAL":
                            inHTML += "background-position:0px -150px'"
                            break;
                        case "SERVICES":
                            inHTML += "background-position:0px -165px'"
                            break;
                        case "SOCIAL_SERVICES":
                            inHTML += "background-position:0px -180px'"
                            break;
                        case "STATIONERY__POSTAGE":
                            inHTML += "background-position:0px -195px'"
                            break;
                        case "STORES":
                            inHTML += "background-position:0px -210px'"
                            break;
                        case "TOURISM_ATTRACTIONS":
                            inHTML += "background-position:0px -225px'"
                            break;
                        case "TRANSPORTATION":
                            inHTML += "background-position:0px -240px'"
                            break;
                        default: 
                            inHTML += "background-position:0px -240px'>"
                            break;
                    }
                    inHTML += ">dot</span>";
                    _div.innerHTML = inHTML;

                    var opts = new AGHTMLOverlayOptions(_iconAnchor, new AGSize(15, 14));
                    var htmlOverlay = new AGHTMLOverlay(_div, new AGCoord(sLat, sLon), opts);

                    //Map.addOverlay(htmlOverlay, "IndividualPoints");
                    Map.addOverlay(htmlOverlay, "ClusterPoints");
                    AGEvent.addListener(htmlOverlay, "onmouseover", AG_Clustering.ShowTooltip);
                    AGEvent.addListener(htmlOverlay, "onmouseout", AG_Clustering.HideTooltip);
                }
            }
        });
    },
    ShowTooltip: function (oLatLong, caller) {
        var obj = caller.getObject();
        var objId = obj.id;
        var objTitle = obj.title;

        var oPointCurPos = AG_Clustering.oMap.getPointFromVisibleArea(oLatLong);
        oPointCurPos = new AGPoint(oPointCurPos.x, oPointCurPos.y);

        AGToolTip.show(AG_Clustering.oMap, oPointCurPos, objTitle, oLatLong);
    },
    HideTooltip: function () {
        AGToolTip.hide(AG_Clustering.oMap);
    },
//    GetLayerPoint: function (Client, DataSet, Category, Point_Ref_ID, PointName, Other, Lat, Lon) {
//        if (typeof Client != "string" || Client == "")
//            return;
//        if (typeof DataSet != "string" || DataSet == "")
//            return;
//        if (Point_Ref_ID == 0 || Point_Ref_ID == null || typeof Point_Ref_ID == "undefined")
//            return;

//        //        var _html = "<p style='float:left;position:absolute;top:0px;width:100%;text-align:center;font-size:10pt;font-weight:bold;font-family:arial;'>Processing data</p>";
//        //        $("#results").html(_html);

//        url = "Clustering.ashx?request=GetLayerPoint&Client=" + Client + "&DataSet=" + DataSet + "&Point_Ref_ID=" + Point_Ref_ID;
//        $.getJSON(url, function (json) {
////            //jsonResults = json;
////            var status = json.status_code;
////            if (status == 0) {
////                AG_Clustering.AddLayerPoint(Client, DataSet, Category, Point_Ref_ID, PointName, Other, Lat, Lon);
////            }
////            else {
////                AG_Clustering.UpdateLayerPoint(Client, DataSet, Category, Point_Ref_ID, PointName, Other, Lat, Lon);
////            }
//                        var _html = "<p style='float:left;position:absolute;top:0px;width:100%;text-align:center;font-size:10pt;font-weight:bold;font-family:arial;'>" + status + "</p>";
//                        $("#results").html(_html);
//        });
//    },
    AddLayerPoint: function (Client, DataSet, Category, Point_Ref_ID, PointName, Other, Lat, Lon) {
        //DataSet - layer (on map)
        //Add point to point_layer
        //Update cluster info in layer_clusters
        if (typeof Client != "string" || Client == "")
            return;
        if (typeof DataSet != "string" || DataSet == "")
            return;
        if (typeof Category != "string" || Category == "")
            return;
        if (Point_Ref_ID == 0 || Point_Ref_ID == null || typeof Point_Ref_ID == "undefined")
            return;
        if (typeof PointName != "string" || PointName == "")
            return;
        if (typeof Lat == "undefined" || Lat == null)
            return;
        if (typeof Lon == "undefined" || Lon == null)
            return;

        //var _html = "<p style='float:left;position:absolute;top:0px;width:100%;text-align:center;font-size:10pt;font-weight:bold;font-family:arial;'>Processing data</p>";
        //$("#results").html(_html);

        url = "Clustering.ashx?request=AddLayerPoint&Client=" + Client + "&DataSet=" + DataSet + "&Category=" + Category + "&Point_Ref_ID=" + Point_Ref_ID
        url += "&PointName=" + PointName + "&Other=" + Other + "&Lat=" + Lat + "&Lon=" + Lon;
        $.getJSON(url, function (json) {
            //jsonResults = json;
            var status = json.status_msg;
            var _html = "<p style='float:left;position:absolute;top:0px;width:100%;text-align:center;font-size:10pt;font-weight:bold;font-family:arial;'>" + status + "</p>";
            $("#results").html(_html);
        });

    },
    UpdateLayerPoint: function (Client, DataSet, Category, Point_Ref_ID, PointName, Other, Lat, Lon) {
        //Update existing point info
        //Update cluster info
        //        if (ID == 0 || ID == null || typeof ID == "undefined")
        //            return;
        if (typeof Client != "string" || Client == "")
            return;
        if (typeof DataSet != "string" || DataSet == "")
            return;
        if (typeof Category != "string" || Category == "")
            return;
        if (Point_Ref_ID == 0 || Point_Ref_ID == null || typeof Point_Ref_ID == "undefined")
            return;
        if (typeof PointName != "string" || PointName == "")
            return;
        if (typeof Lat == "undefined" || Lat == null)
            return;
        if (typeof Lon == "undefined" || Lon == null)
            return;

        var _html = "<p style='float:left;position:absolute;top:0px;width:100%;text-align:center;font-size:10pt;font-weight:bold;font-family:arial;'>Processing data</p>";
        $("#results").html(_html);

        //url = "Clustering.ashx?request=UpdateLayerPoint&ID=" + ID + "&Client=" + Client + "&DataSet=" + DataSet + "&Category=" + Category + "&Point_Ref_ID=" + Point_Ref_ID
        url = "Clustering.ashx?request=UpdateLayerPoint&Client=" + Client + "&DataSet=" + DataSet + "&Category=" + Category + "&Point_Ref_ID=" + Point_Ref_ID
        url += "&PointName=" + PointName + "&Other=" + Other + "&Lat=" + Lat + "&Lon=" + Lon;
        $.getJSON(url, function (json) {
            var status = json.status_msg;
            var _html = "<p style='float:left;position:absolute;top:0px;width:100%;text-align:center;font-size:10pt;font-weight:bold;font-family:arial;'>" + status + "</p>";
            $("#results").html(_html);
        });
    },
    DeleteLayerPoint: function (Client, DataSet, Point_Ref_ID) {
        //Delete point from table
        //Update cluster info
        //        if (ID == 0 || ID == null || typeof ID == "undefined")
        //            return;
        if (typeof Client != "string" || Client == "")
            return;
        if (typeof DataSet != "string" || DataSet == "")
            return;
        if (Point_Ref_ID == 0 || Point_Ref_ID == null || typeof Point_Ref_ID == "undefined")
            return;

        //url = "Clustering.ashx?request=DeleteLayerPoint&ID=" + ID;
        url = "Clustering.ashx?request=DeleteLayerPoint&Client=" + Client + "&DataSet=" + DataSet + "&Point_Ref_ID=" + Point_Ref_ID;
        $.getJSON(url, function (json) {
            jsonResults = json;
        });
    }
}
