Skip to content
Snippets Groups Projects
Commit 73b04375 authored by Benoit Lavenier's avatar Benoit Lavenier
Browse files

[fix] Wot Map: remove search button and search layer (too slow)

[fix] Wot Map: hide buttons on small screen (in marker popup)
parent 954cef1a
No related branches found
No related tags found
No related merge requests found
...@@ -51,7 +51,7 @@ angular.module('cesium.map.wot.controllers', ['cesium.services', 'cesium.map.ser ...@@ -51,7 +51,7 @@ angular.module('cesium.map.wot.controllers', ['cesium.services', 'cesium.map.ser
function MapWotViewController($scope, $filter, $templateCache, $interpolate, $timeout, $location, $translate, $q, $controller, function MapWotViewController($scope, $filter, $templateCache, $interpolate, $timeout, $location, $translate, $q, $controller,
ionicReady, ionicReady, $rootScope,
leafletData, UIUtils, csSettings, csWallet, MapUtils, mapWot) { leafletData, UIUtils, csSettings, csWallet, MapUtils, mapWot) {
'ngInject'; 'ngInject';
...@@ -60,8 +60,6 @@ function MapWotViewController($scope, $filter, $templateCache, $interpolate, $ti ...@@ -60,8 +60,6 @@ function MapWotViewController($scope, $filter, $templateCache, $interpolate, $ti
angular.extend(this, $controller('ESWotIdentityViewCtrl', {$scope: $scope})); angular.extend(this, $controller('ESWotIdentityViewCtrl', {$scope: $scope}));
var var
// Create a hidden layer, to hold search markers
markersSearchLayer,
icons= { icons= {
member: { member: {
type: 'awesomeMarker', type: 'awesomeMarker',
...@@ -89,8 +87,6 @@ function MapWotViewController($scope, $filter, $templateCache, $interpolate, $ti ...@@ -89,8 +87,6 @@ function MapWotViewController($scope, $filter, $templateCache, $interpolate, $ti
cache: 'map-wot', cache: 'map-wot',
layers: { layers: {
overlays: { overlays: {
// User profile
member: { member: {
type: 'featureGroup', type: 'featureGroup',
name: 'MAP.WOT.VIEW.LAYER.MEMBER', name: 'MAP.WOT.VIEW.LAYER.MEMBER',
...@@ -113,6 +109,25 @@ function MapWotViewController($scope, $filter, $templateCache, $interpolate, $ti ...@@ -113,6 +109,25 @@ function MapWotViewController($scope, $filter, $templateCache, $interpolate, $ti
loading: true loading: true
}, $scope.mapId); }, $scope.mapId);
var layers = {
// User profile
member: {
type: 'featureGroup',
name: 'MAP.WOT.VIEW.LAYER.MEMBER',
visible: true
},
pending: {
type: 'featureGroup',
name: 'MAP.WOT.VIEW.LAYER.PENDING',
visible: true
},
wallet: {
type: 'featureGroup',
name: 'MAP.WOT.VIEW.LAYER.WALLET',
visible: true
}
};
// Variables for marker // Variables for marker
$scope.showDescription = false; $scope.showDescription = false;
ionicReady().then(function() { ionicReady().then(function() {
...@@ -214,38 +229,6 @@ function MapWotViewController($scope, $filter, $templateCache, $interpolate, $ti ...@@ -214,38 +229,6 @@ function MapWotViewController($scope, $filter, $templateCache, $interpolate, $ti
separate: true separate: true
}).addTo(map); }).addTo(map);
// Add localize me control
MapUtils.control.localizeMe({
title: translations['MAP.COMMON.BTN_LOCALIZE_ME']
})
.addTo(map);
// Add search control
markersSearchLayer = L.layerGroup({visible: false});
var searchTip = $interpolate($templateCache.get('plugins/map/templates/wot/item_search_tooltip.html'));
MapUtils.control.search({
layer: markersSearchLayer,
propertyName: 'title',
buildTip: function (text, val) {
return searchTip(val.layer.options);
},
moveToLocation: function(lnglat, title, map) {
if(this.options.zoom)
this._map.setView(lnglat, this.options.zoom);
else
this._map.panTo(lnglat);
var popupMarkerId = lnglat.layer && lnglat.layer.options && lnglat.layer.options.popupMarkerId;
$timeout(function(){
var popupMarker = popupMarkerId && _.find(map._layers, function(layer) {
return (layer.options && layer.options.id === popupMarkerId);
});
if (popupMarker) popupMarker.openPopup();
}, 400);
},
firstTipSubmit: true,
tooltipLimit: 50
}).addTo(map);
// Add marker cluster layer // Add marker cluster layer
var extractMarkerLayer = function(marker) { var extractMarkerLayer = function(marker) {
return marker.options && marker.options.layer; return marker.options && marker.options.layer;
...@@ -255,8 +238,8 @@ function MapWotViewController($scope, $filter, $templateCache, $interpolate, $ti ...@@ -255,8 +238,8 @@ function MapWotViewController($scope, $filter, $templateCache, $interpolate, $ti
maxClusterRadius: 65, maxClusterRadius: 65,
showCoverageOnHover: false, showCoverageOnHover: false,
iconCreateFunction: function (cluster) { iconCreateFunction: function (cluster) {
var countByLayer = _.countBy(cluster.getAllChildMarkers(), extractMarkerLayer); //var countByLayer = _.countBy(cluster.getAllChildMarkers(), extractMarkerLayer);
var markerColor = countByLayer.member ? 'blue' : (countByLayer.pending ? 'lightgreen' : 'lightgray'); var markerColor = 'blue'; //countByLayer.member ? 'blue' : (countByLayer.pending ? 'lightgreen' : 'lightgray');
var childCount = cluster.getChildCount(); var childCount = cluster.getChildCount();
var className = 'marker-cluster ' + markerColor + ' marker-cluster-'; var className = 'marker-cluster ' + markerColor + ' marker-cluster-';
if (childCount < 10) { if (childCount < 10) {
...@@ -269,6 +252,7 @@ function MapWotViewController($scope, $filter, $templateCache, $interpolate, $ti ...@@ -269,6 +252,7 @@ function MapWotViewController($scope, $filter, $templateCache, $interpolate, $ti
return L.divIcon({ html: '<div><span>' + childCount + '</span></div>', className: className, iconSize: new L.Point(40, 40) }); return L.divIcon({ html: '<div><span>' + childCount + '</span></div>', className: className, iconSize: new L.Point(40, 40) });
} }
}); });
//_.forEach(layers, function(layer) {
map.eachLayer(function(layer) { map.eachLayer(function(layer) {
// Add capabilities of 'featureGroup.subgroup', if layer is a group // Add capabilities of 'featureGroup.subgroup', if layer is a group
if (layer.addLayer){ if (layer.addLayer){
...@@ -318,70 +302,54 @@ function MapWotViewController($scope, $filter, $templateCache, $interpolate, $ti ...@@ -318,70 +302,54 @@ function MapWotViewController($scope, $filter, $templateCache, $interpolate, $ti
.then(function(res) { .then(function(res) {
var markers = {}; var markers = {};
// Clean search layer
markersSearchLayer.clearLayers();
if (res && res.length) { if (res && res.length) {
var formatPubkey = $filter('formatPubkey'); var formatPubkey = $filter('formatPubkey');
var markerTemplate = $templateCache.get('plugins/map/templates/wot/popup_marker.html'); var markerTemplate = $templateCache.get('plugins/map/templates/wot/popup_marker.html');
_.forEach(res, function (hit) { _.forEach(res, function (hit) {
var type = hit.pending ? 'pending' : (hit.uid ? 'member' : 'wallet'); var type = hit.pending ? 'pending' : (hit.uid ? 'member' : 'wallet');
var shortPubkey = formatPubkey(hit.pubkey);
var id = hit.index + '_' + (hit.id || (hit.uid ? (hit.uid + ':' + hit.pubkey) : hit.pubkey)).replace(/-/g, '_'); var id = hit.index + '_' + (hit.id || (hit.uid ? (hit.uid + ':' + hit.pubkey) : hit.pubkey)).replace(/-/g, '_');
var title = hit.name + ' | ' + formatPubkey(hit.pubkey);
var marker = { var marker = {
layer: type, layer: type,
icon: icons[type], icon: icons[type],
opacity: hit.uid ? 1 : 0.7, opacity: hit.uid ? 1 : 0.7,
title: hit.name + ' | ' + shortPubkey, title: title,
lat: hit.geoPoint.lat, lat: hit.geoPoint.lat,
lng: hit.geoPoint.lon, lng: hit.geoPoint.lon,
getMessageScope: function () { getMessageScope: function () {
var scope = $scope.$new(); //console.debug('[map] Loading marker ' + title + "...");
scope.loadingMarker = true; var markerScope = $scope.$new();
scope.formData = {}; markerScope.loadingMarker = true;
scope.$applyAsync(function() { markerScope.formData = {};
scope.formData = { markerScope.$applyAsync(function() {
pubkey: hit.pubkey, markerScope.formData = {
pubkey: hit.pubke,
uid: hit.uid, uid: hit.uid,
name: hit.name, name: title,
profile: hit profile: hit
}; };
scope.loadingMarker = false; markerScope.loadingMarker = false;
}); });
return scope; return markerScope;
}, },
focus: false, focus: false,
message: markerTemplate, message: markerTemplate,
id: id id: id
}; };
markers[id] = marker; markers[id] = marker;
// Create a search marker (will be hide)
var searchText = hit.name + ((hit.uid && hit.uid != hit.name) ? (' | ' + hit.uid) : '') + ' | ' + shortPubkey;
var searchMarker = angular.merge({
type: type,
opacity: 0,
icon: L.divIcon({
className: type + ' ng-hide',
iconSize: L.point(0, 0)
})
}, {title: searchText, pubkey: hit.pubkey, uid: hit.uid, name: hit.name, pending: hit.pending, popupMarkerId: id});
markersSearchLayer.addLayer(new L.Marker({
lat: hit.geoPoint.lat,
lng: hit.geoPoint.lon
},
searchMarker));
}); });
} }
$scope.map.markers = markers; $scope.map.markers = markers;
return $timeout(function(){ return $timeout(function(){
$scope.loading = false;
// hide loading indicator // hide loading indicator
$scope.loading = false;
map.fire('dataload'); map.fire('dataload');
UIUtils.loading.hide(); UIUtils.loading.hide();
...@@ -389,7 +357,9 @@ function MapWotViewController($scope, $filter, $templateCache, $interpolate, $ti ...@@ -389,7 +357,9 @@ function MapWotViewController($scope, $filter, $templateCache, $interpolate, $ti
}) })
.catch(function(err) { .catch(function(err) {
$scope.map.markers = {}; $scope.map.markers = {};
// hide loading indicator
$scope.loading = false; $scope.loading = false;
map.fire('dataload');
UIUtils.onError('MAP.WOT.ERROR.LOAD_POSITION_FAILED')(err); UIUtils.onError('MAP.WOT.ERROR.LOAD_POSITION_FAILED')(err);
}); });
}; };
......
...@@ -45,7 +45,7 @@ ...@@ -45,7 +45,7 @@
</div> </div>
</a> </a>
<!-- buttons --> <!-- buttons -->
<div class="item no-border no-padding"> <div class="item no-border no-padding hidden-xs hidden-sm">
<div class="pull-left gray"> <div class="pull-left gray">
<!-- show description --> <!-- show description -->
<a class="animate-fade-in animate-show-hide gray ng-hide" <a class="animate-fade-in animate-show-hide gray ng-hide"
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment