From c321784e51cb4f20eca0c0455cd1d4e85391d35b Mon Sep 17 00:00:00 2001 From: tombatossals Date: Sat, 4 Jan 2014 18:30:35 +0100 Subject: [PATCH] feat(build): Refactor paths attribute --- src/directives/paths.js | 133 ++++++--------------------------- src/services/leafletHelpers.js | 21 +----- 2 files changed, 26 insertions(+), 128 deletions(-) diff --git a/src/directives/paths.js b/src/directives/paths.js index 38661f19..5a945f22 100644 --- a/src/directives/paths.js +++ b/src/directives/paths.js @@ -1,4 +1,4 @@ -angular.module("leaflet-directive").directive('paths', function ($log, leafletData, leafletMapDefaults, leafletHelpers) { +angular.module("leaflet-directive").directive('paths', function ($log, leafletData, leafletMapDefaults, leafletHelpers, leafletPathHelpers) { return { restrict: "A", scope: false, @@ -9,9 +9,8 @@ angular.module("leaflet-directive").directive('paths', function ($log, leafletDa var isDefined = leafletHelpers.isDefined, leafletScope = controller.getLeafletScope(), paths = leafletScope.paths, - convertToLeafletLatLng = leafletHelpers.convertToLeafletLatLng, - convertToLeafletLatLngs = leafletHelpers.convertToLeafletLatLngs, - convertToLeafletMultiLatLngs = leafletHelpers.convertToLeafletMultiLatLngs; + createPath = leafletPathHelpers.createPath, + setPathOptions = leafletPathHelpers.setPathOptions; controller.getMap().then(function(map) { var defaults = leafletMapDefaults.getDefaults(attrs.id); @@ -23,11 +22,30 @@ angular.module("leaflet-directive").directive('paths', function ($log, leafletDa var leafletPaths = {}; leafletData.setPaths(leafletPaths, attrs.id); + // Function for listening every single path once created + var watchPathFn = function(leafletPath, name) { + var clearWatch = leafletScope.$watch('paths.' + name, function(pathData) { + if (!isDefined(pathData)) { + map.removeLayer(leafletPath); + clearWatch(); + return; + } + setPathOptions(leafletPath, pathData.type, pathData); + }, true); + }; + scope.$watch("paths", function (newPaths) { // Create the new paths for (var new_name in newPaths) { if (!isDefined(leafletPaths[new_name])) { - leafletPaths[new_name] = createPath(new_name, newPaths[new_name], map, defaults); + var newPath = createPath(new_name, newPaths[new_name], defaults); + + // Listen for changes on the new path + if (isDefined(newPath)) { + leafletPaths[new_name] = newPath; + map.addLayer(newPath); + watchPathFn(newPath, new_name); + } } } @@ -38,111 +56,6 @@ angular.module("leaflet-directive").directive('paths', function ($log, leafletDa } } }, true); - - function createPath(name, scopePath, map, defaults) { - var path; - var options = { - weight: defaults.path.weight, - color: defaults.path.color, - opacity: defaults.path.opacity - }; - if(isDefined(scopePath.stroke)) { - options.stroke = scopePath.stroke; - } - if(isDefined(scopePath.fill)) { - options.fill = scopePath.fill; - } - if(isDefined(scopePath.fillColor)) { - options.fillColor = scopePath.fillColor; - } - if(isDefined(scopePath.fillOpacity)) { - options.fillOpacity = scopePath.fillOpacity; - } - if(isDefined(scopePath.smoothFactor)) { - options.smoothFactor = scopePath.smoothFactor; - } - if(isDefined(scopePath.noClip)) { - options.noClip = scopePath.noClip; - } - if(!isDefined(scopePath.type)) { - scopePath.type = "polyline"; - } - - function setPathOptions(data) { - if (isDefined(data.latlngs)) { - switch(data.type) { - default: - case "polyline": - case "polygon": - path.setLatLngs(convertToLeafletLatLngs(data.latlngs)); - break; - case "multiPolyline": - case "multiPolygon": - path.setLatLngs(convertToLeafletMultiLatLngs(data.latlngs)); - break; - case "rectangle": - path.setBounds(new L.LatLngBounds(convertToLeafletLatLngs(data.latlngs))); - break; - case "circle": - case "circleMarker": - path.setLatLng(convertToLeafletLatLng(data.latlngs)); - if (isDefined(data.radius)) { - path.setRadius(data.radius); - } - break; - } - } - - if (isDefined(data.weight)) { - path.setStyle({ weight: data.weight }); - } - - if (isDefined(data.color)) { - path.setStyle({ color: data.color }); - } - - if (isDefined(data.opacity)) { - path.setStyle({ opacity: data.opacity }); - } - } - - switch(scopePath.type) { - default: - case "polyline": - path = new L.Polyline([], options); - break; - case "multiPolyline": - path = new L.multiPolyline([[[0,0],[1,1]]], options); - break; - case "polygon": - path = new L.Polygon([], options); - break; - case "multiPolygon": - path = new L.MultiPolygon([[[0,0],[1,1],[0,1]]], options); - break; - case "rectangle": - path = new L.Rectangle([[0,0],[1,1]], options); - break; - case "circle": - path = new L.Circle([0,0], 1, options); - break; - case "circleMarker": - path = new L.CircleMarker([0,0], options); - break; - } - map.addLayer(path); - - var clearWatch = scope.$watch('paths.' + name, function(data) { - if (!isDefined(data)) { - map.removeLayer(path); - clearWatch(); - return; - } - setPathOptions(data); - }, true); - - return path; - } }); } }; diff --git a/src/services/leafletHelpers.js b/src/services/leafletHelpers.js index 7d88a6c4..d7ff3d65 100644 --- a/src/services/leafletHelpers.js +++ b/src/services/leafletHelpers.js @@ -38,14 +38,6 @@ angular.module("leaflet-directive").factory('leafletHelpers', function ($q, $log return defer; } - function _convertToLeafletLatLngs(latlngs) { - return latlngs.filter(function(latlng) { - return !!latlng.lat && !!latlng.lng; - }).map(function (latlng) { - return new L.LatLng(latlng.lat, latlng.lng); - }); - } - return { // Determine if a reference is defined isDefined: function(value) { @@ -82,16 +74,9 @@ angular.module("leaflet-directive").factory('leafletHelpers', function ($q, $log angular.isNumber(center.lng) && angular.isNumber(center.zoom); }, - convertToLeafletLatLngs: _convertToLeafletLatLngs, - - convertToLeafletLatLng: function(latlng) { - return new L.LatLng(latlng.lat, latlng.lng); - }, - - convertToLeafletMultiLatLngs: function(paths) { - return paths.map(function(latlngs) { - return _convertToLeafletLatLngs(latlngs); - }); + isValidPoint: function(point) { + return angular.isDefined(point) && angular.isNumber(point.lat) && + angular.isNumber(point.lng); }, safeApply: function($scope, fn) {