diff --git a/www/plugins/map/css/style.css b/www/plugins/map/css/style.css index 1c02c1383769f8a5b38e1a0942580e0f5e8e966b..ae0e4aa695a25d66703b017b152dff92217b1eda 100644 --- a/www/plugins/map/css/style.css +++ b/www/plugins/map/css/style.css @@ -1,7 +1,3 @@ -.leaflet-top { - top: 44px !important; -} - .legend { font: 14px/16px Arial, Helvetica, sans-serif; background: rgba(255,255,255, 0.9); diff --git a/www/plugins/map/js/plugin.js b/www/plugins/map/js/plugin.js index 11276bff01761a53a4d3e3199f48e9446ba59467..eff1f326346a223ed9796ed070b1c4296b26be6b 100644 --- a/www/plugins/map/js/plugin.js +++ b/www/plugins/map/js/plugin.js @@ -22,7 +22,6 @@ angular.module('cesium.map.plugin', ['cesium.services']) $stateProvider .state('app.view_wot_map', { url: "/wot/map?lat&lng&zoom", - cache: false, views: { 'menuContent': { templateUrl: "plugins/map/templates/wot/map.html", @@ -40,8 +39,6 @@ angular.module('cesium.map.plugin', ['cesium.services']) esGeo, UIUtils, MapData, leafletData) { 'ngInject'; - $scope.loading = true; - var constants = { FRANCE: { lat: 47.35, lng: 5.65, zoom: 6 @@ -49,6 +46,8 @@ angular.module('cesium.map.plugin', ['cesium.services']) }; constants.DEFAULT_CENTER = constants.FRANCE; + $scope.loading = true; + $scope.mapId = 'map-wot-' + $scope.$id; $scope.map = { center: angular.copy(constants.DEFAULT_CENTER), defaults: { @@ -118,17 +117,23 @@ angular.module('cesium.map.plugin', ['cesium.services']) $scope.stateName = state && state.stateName; $scope.stateParams = angular.copy(state && state.stateParams||{}); - var center = angular.copy(constants.DEFAULT_CENTER); + var center; if (state.stateParams) { - if (state.stateParams && state.stateParams.lat) { + if (state.stateParams.lat) { + center = {}; center.lat = parseFloat(state.stateParams.lat); } - if (state.stateParams && state.stateParams.lng) { + if (state.stateParams.lng) { + center = center || {}; center.lng = parseFloat(state.stateParams.lng); } - if (state.stateParams && state.stateParams.zoom) { + if (state.stateParams.zoom) { + center = center || {}; center.zoom = parseFloat(state.stateParams.zoom); } + if (center) { + center = angular.merge({}, constants.DEFAULT_CENTER, center); + } } $scope.load(center); @@ -139,8 +144,6 @@ angular.module('cesium.map.plugin', ['cesium.services']) }); $scope.load = function(center) { - center = center||constants.DEFAULT_CENTER; - $scope.loading = true; // removeIf(no-device) @@ -212,13 +215,9 @@ angular.module('cesium.map.plugin', ['cesium.services']) }, {}); $scope.map.markers = markers; - angular.merge($scope.map.center, center); - - $scope.loading = false; - UIUtils.loading.hide(); - leafletData.getMap().then(function(map) { + leafletData.getMap(/*$scope.mapId*/).then(function(map) { // Control: search L.control.search({ layer: markersLayer, @@ -256,8 +255,16 @@ angular.module('cesium.map.plugin', ['cesium.services']) }); }).addTo(map); - map.invalidateSize(); - map._resetView(map.getCenter(), map.getZoom(), true); + var needCenterUpdate = center && !angular.equals($scope.map.center, center); + if (needCenterUpdate) { + //angular.merge($scope.map.center, center); + $timeout(function() { + map.invalidateSize(); + map._resetView(center, center.zoom, true); + }, 300); + } + $scope.loading = false; + UIUtils.loading.hide(); }); }); }; @@ -266,7 +273,7 @@ angular.module('cesium.map.plugin', ['cesium.services']) $ionicHistory.nextViewOptions({ disableAnimate: true, disableBack: true, - historyRoot: true + historyRoot: false }); $scope.stateParams = $scope.stateParams || {}; diff --git a/www/plugins/map/templates/wot/map.html b/www/plugins/map/templates/wot/map.html index 4c1903d1f3c5393a8be4f40f86a9805c4325db91..b6d45e4221c82855b238674838703956b1e04ccd 100644 --- a/www/plugins/map/templates/wot/map.html +++ b/www/plugins/map/templates/wot/map.html @@ -1,7 +1,19 @@ +<ion-view left-buttons="leftButtons"> + <ion-nav-title> -<leaflet id="map-wot" - center="map.center" - markers="map.markers" - layers="map.layers" - controls="map.controls"> -</leaflet> + </ion-nav-title> + + <ion-nav-buttons side="secondary"> + + </ion-nav-buttons> + + <ion-content data-tap-disabled="true"> + <leaflet + height="100%" + center="map.center" + markers="map.markers" + layers="map.layers" + controls="map.controls"> + </leaflet> + </ion-content> +</ion-view>