[enh] Wot map: add a "locate me" button

bower.json

@@ -18,7 +18,9 @@
     "chart.js": "chartjs#^2.6.0",
     "Leaflet.awesome-markers": "^2.0.2",
     "ui-leaflet": "^2.0.0",
-    "leaflet-search": "^2.7.2"
+    "leaflet-search": "^2.7.2",
+    "angular-leaflet-directive": "angular-leaflet#^0.10.0",
+    "Leaflet.EasyButton": "~1.3.2"
   },
   "resolutions": {
     "angular-sanitize": "1.5.3",

www/index.html

@@ -26,6 +26,7 @@
   <!--removeIf(device)-->
   <link rel="stylesheet" type="text/css" href="lib/leaflet-search/dist/leaflet-search.src.css">
   <!--endRemoveIf(device)-->
+  <link rel="stylesheet" href="lib/Leaflet.EasyButton/src/easy-button.css">
   <link rel="stylesheet" type="text/css" href="dist/dist_css/plugins/es/css/style.css">
   <link rel="stylesheet" type="text/css" href="dist/dist_css/plugins/graph/css/style.css">
   <link rel="stylesheet" type="text/css" href="dist/dist_css/plugins/map/css/style.css">
@@ -87,6 +88,7 @@
   <script src="lib/ui-leaflet/dist/ui-leaflet.js"></script>
   <script src="lib/Leaflet.awesome-markers/dist/leaflet.awesome-markers.js"></script>
   <script src="lib/leaflet-search/dist/leaflet-search.src.js"></script>
+  <script src="lib/Leaflet.EasyButton/src/easy-button.js"></script>
   <!--endRemoveIf(no-plugin)-->
 
   <!-- endbuild -->

www/plugins/map/js/plugin.js

@@ -36,7 +36,8 @@ angular.module('cesium.map.plugin', ['cesium.services'])
   })
 
   // [NEW] Manage events from the page #/app/wot/map
-  .controller('MapWotViewCtrl', function($scope, $q, $translate, $state, $filter, $templateCache, $timeout, $ionicHistory, UIUtils, MapData, leafletData) {
+  .controller('MapWotViewCtrl', function($scope, $q, $translate, $state, $filter, $templateCache, $timeout, $ionicHistory,
+                                         esGeo, UIUtils, MapData, leafletData) {
     'ngInject';
 
     $scope.loading = true;
@@ -243,34 +244,21 @@ angular.module('cesium.map.plugin', ['cesium.services'])
             markerLocation: true
           }).addTo(map);
 
-          L.control.search({
-            url: 'search.php?q={s}',
-            jsonpParam:'callback',
-            position: 'topright',
-            hideMarkerOnCollapse: true,
-            marker: {
-              icon: new L.Icon({iconUrl:'data/custom-icon.png', iconSize: [20,20]}),
-              circle: {
-                radius: 20,
-                color: '#0a0',
-                opacity: 1
-              }
-            }
+          L.easyButton('<i class="icon ion-ios-location"></i>', function(btn, map){
+            return esGeo.point.current()
+              .then(function(res) {
+                console.log(res);
+                $scope.map.center = {
+                  lat: res.lat,
+                  lng: res.lon,
+                  zoom: 14
+                };
+              });
           }).addTo(map);
 
           map.invalidateSize();
           map._resetView(map.getCenter(), map.getZoom(), true);
         });
-        /*
-        leafletData.getMap().then(function(map) {
-          // Show map
-          $scope.loading = false;
-          $timeout(function() {
-            map.invalidateSize();
-            UIUtils.loading.hide();
-          }, 300);
-        });*/
-
       });
     };