From a1bbb51d9cbe3383f148fc8337593ec98ec7f2fa Mon Sep 17 00:00:00 2001 From: Candid Dauth Date: Wed, 26 Oct 2016 14:13:59 +0300 Subject: [PATCH] Add dialog to edit filter and make it possible to save it in view --- frontend/app/filter/filter-dialog.css | 5 + frontend/app/filter/filter-dialog.html | 183 +++++++++++++++++++++++++ frontend/app/filter/filter.js | 38 ++++- frontend/app/map/map/map.js | 7 +- frontend/app/map/toolbox/toolbox.html | 1 + frontend/app/map/toolbox/toolbox.js | 8 +- frontend/app/map/views/save-view.html | 21 ++- frontend/app/map/views/views.js | 7 +- server/databaseBackendSequelize.js | 7 +- server/server.js | 4 +- 10 files changed, 268 insertions(+), 13 deletions(-) create mode 100644 frontend/app/filter/filter-dialog.css create mode 100644 frontend/app/filter/filter-dialog.html diff --git a/frontend/app/filter/filter-dialog.css b/frontend/app/filter/filter-dialog.css new file mode 100644 index 00000000..0ce41ffa --- /dev/null +++ b/frontend/app/filter/filter-dialog.css @@ -0,0 +1,5 @@ +.alert pre { + border: none; + padding: 0; + background: transparent; +} \ No newline at end of file diff --git a/frontend/app/filter/filter-dialog.html b/frontend/app/filter/filter-dialog.html new file mode 100644 index 00000000..f7a26da4 --- /dev/null +++ b/frontend/app/filter/filter-dialog.html @@ -0,0 +1,183 @@ +
+ +

Filter

+
+
+
+ + 
{{error.message || error}}
+ +

+ + +

+
+ +
+ +

Syntax

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
VariableDescriptionExample
nameMarker/Line namename == "Berlin"
typemarker / linetype == "marker"
typeId / {{type.id}} ({{type.name}})typeId == 1
data.<field> / prop(data, <field>)Field values (example: data.Description or prop(data, "Description")data.Description ~= "camp"
lat, lonMarker coordinateslat < 50
colourMarker/line colourcolour == "ff0000"
sizeMarker sizesize > 30
symbolMarker iconsymbol == "accommodation_camping"
modeLine routing mode (empty / car / bicycle / pedestrian / track)mode in ("bicycle", "pedestrian")
widthLine widthwidth > 10
distanceLine distance in kilometersdistance < 50
timeLine routing time in secondstime > 3600
routePointsLine point coordinatesroutePoints.0.lon > 60 and routePoints.2.lat < 50
OperatorDescriptionExample
numberNumerical valuedistance < 1.5
"text"Text valuename == "Athens"
+, -, *, /, %, ^Mathematical operations (%: modulo, ^: power)distance / time > 30
and, or, not, ()Logical operatorsnot (size>10) or (type=="line" and length<=10)
? :if/then/else operator(type=="marker" ? size : width) > 10
==, !=, <, <=, >, >=Comparison (!=: not equal) (case sensitive)type != "marker"
in, not inList operator (case sensitive)typeId not in (1,2)
~=Regular expression match (case sensitive)name ~= "^[Cc]amp$"
ceil(), floor(), round()Round (ceil: up, floor: down)floor(distance/100) == 5
abs(), log(), sqrt()Mathematical functionsabs(lat) < 30
min(), max()Smallest/highest valuemin(routePoints.0.lat,routePoints.1.lat) < 50
+
+
+ + +
\ No newline at end of file diff --git a/frontend/app/filter/filter.js b/frontend/app/filter/filter.js index db16b748..08e0c635 100644 --- a/frontend/app/filter/filter.js +++ b/frontend/app/filter/filter.js @@ -1,14 +1,26 @@ (function(fm, $, ng, undefined) { - fm.app.factory("fmFilter", function(compileExpression) { + fm.app.factory("fmFilter", function(compileExpression, $rootScope, $uibModal) { var currentVal; var fmFilter = { customFuncs: { prop: function(obj, key) { return obj && obj[key]; + }, + + random: function() { } // Does not work well with angular digest cycles + }, + + hasError: function(expr) { + try { + if(expr && expr.trim()) + compileExpression(expr, fmFilter.customFuncs); + } catch(e) { + return e; } }, + compileExpression: function(expr) { if(!expr || !expr.trim()) return function() { return true; }; @@ -86,10 +98,34 @@ } return obj; + }, + + showFilterDialog: function(currentFilter, types) { + var dialog = $uibModal.open({ + templateUrl: "filter/filter-dialog.html", + scope: $rootScope, + controller: "fmFilterDialogCtrl", + size: "lg", + resolve: { + currentFilter: function() { return currentFilter; }, + types: function() { return types; } + } + }); + + return dialog.result; } }; return fmFilter; }); + fm.app.controller("fmFilterDialogCtrl", function(currentFilter, types, $scope, fmFilter) { + $scope.filter = currentFilter; + $scope.types = types; + + $scope.$watch("filter", function(newFilter) { + $scope.error = fmFilter.hasError(newFilter); + }) + }); + })(FacilMap, jQuery, angular); \ No newline at end of file diff --git a/frontend/app/map/map/map.js b/frontend/app/map/map/map.js index 17ca7d4e..3fb406bb 100644 --- a/frontend/app/map/map/map.js +++ b/frontend/app/map/map/map.js @@ -188,7 +188,7 @@ map.mapEvents.$emit("layerchange"); }); - map.getCurrentView = function() { + map.getCurrentView = function(addFilter) { var ret = fmUtils.leafletToFmBbox(map.map.getBounds()); ret.layers = [ ]; @@ -199,6 +199,9 @@ ret.layers.push(it.options.fmKey); }); + if(addFilter) + ret.filter = map.socket.filterExpr; + return ret; }; @@ -224,6 +227,8 @@ } catch(e) { map.map.setView(bounds.getCenter(), map.map.getBoundsZoom(bounds, !view)); } + + map.socket.setFilter(view.filter); }; map.map.createPane("fmClickListener"); diff --git a/frontend/app/map/toolbox/toolbox.html b/frontend/app/map/toolbox/toolbox.html index 244a6128..3109eed8 100644 --- a/frontend/app/map/toolbox/toolbox.html +++ b/frontend/app/map/toolbox/toolbox.html @@ -39,6 +39,7 @@