franzz/spot
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

elevation module replaced with HeightGraph (improved perfs)

Browse Source
This commit is contained in:
Franzz
2020-05-03 17:17:03 +02:00
parent 204464d6fd
commit d22472722b
2 changed files with 37 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

67
masks/project.html
View File

@@ -65,13 +65,16 @@ oSpot.pageInit = function(asHash) {
};
oSpot.onResize = function() {
self.tmp('feed_width', self.tmp('with_feed')?$('#feed').outerWidth(true):0);
self.tmp('map_offset', -1 * self.tmp('feed_width') / $('body').outerWidth(true));
self.tmp('map_offset', -1 * (isFeedPanelOpen()?self.tmp('$Feed').outerWidth(true):0) / $('body').outerWidth(true));
if(typeof self.tmp('elev') != 'undefined') {
var bElevOpened = self.tmp('elev')._showState;
if(bElevOpened) self.tmp('elev')._expand();
self.tmp('elev').remove();
self.tmp('elev').options.width = getElevWidth();
self.tmp('elev').addTo(self.tmp('map'));
self.tmp('elev').addData(self.tmp('elev-data'));
if(bElevOpened) self.tmp('elev')._expand();
}
};
@@ -89,39 +92,33 @@ oSpot.onKeydown = function(oEvent) {
}
function toggleFeedPanel(bShow, sMapAction) {
var $Container = $('#projects');
if(typeof bShow === 'undefined') $Container.toggleClass('with-feed');
else $Container.toggleClass('with-feed', bShow);
oSpot.tmp('with_feed', $Container.hasClass('with-feed'));
self.tmp('$Projects').toggleClass('with-feed', (typeof bShow === 'undefined')?null:bShow);
oSpot.onResize();
if(isMobile()) $('#settings-button').toggle(!oSpot.tmp('with_feed'));
if(isMobile()) $('#settings-button').toggle(!isFeedPanelOpen());
sMapAction = sMapAction || 'panTo';
switch(sMapAction) {
case 'none': break;
case 'panTo': oSpot.tmp('map').panBy([(oSpot.tmp('with_feed')?1:-1)*$('#feed').outerWidth(true)/2, 0], {duration: 0.5}); break;
case 'panToInstant': oSpot.tmp('map').panBy([(oSpot.tmp('with_feed')?1:-1)*$('#feed').outerWidth(true)/2, 0]); break;
case 'fitBounds': oSpot.tmp('map').fitBounds(self.tmp('track').getBounds(), {paddingTopLeft: L.point(5, self.tmp('marker_size').height + 5), paddingBottomRight: L.point(self.tmp('feed_width') + 5, 5)}); break;
case 'panTo': oSpot.tmp('map').panBy([(isFeedPanelOpen()?1:-1)*self.tmp('$Feed').outerWidth(true)/2, 0], {duration: 0.5}); break;
case 'panToInstant': oSpot.tmp('map').panBy([(isFeedPanelOpen()?1:-1)*self.tmp('$Feed').outerWidth(true)/2, 0]); break;
case 'fitBounds': oSpot.tmp('map').fitBounds(self.tmp('track').getBounds(), {paddingTopLeft: L.point(5, self.tmp('marker_size').height + 5), paddingBottomRight: L.point(self.tmp('$Feed').outerWidth(true) + 5, 5)}); break;
}
}
function isFeedPanelOpen() {
return self.tmp('$Projects').hasClass('with-feed');
}
function toggleSettingsPanel(bShow) {
var $Container = $('#projects');
if(typeof bShow === 'undefined') $Container.toggleClass('with-settings');
else $Container.toggleClass('with-settings', bShow);
var bWithSettings = isSettingsPanelOpen();
self.tmp('$Projects').toggleClass('with-settings', (typeof bShow === 'undefined')?null:bShow);
oSpot.onResize();
if(isMobile()) $('#post-button').toggle(!isSettingsPanelOpen());
if(isMobile()) $('#post-button').toggle(!bWithSettings);
oSpot.tmp('map').panBy([(bWithSettings?-1:1)*$('#settings').outerWidth(true)/2, 0], {duration: 0.5});
oSpot.tmp('map').panBy([(isSettingsPanelOpen()?-1:1)*self.tmp('$Settings').outerWidth(true)/2, 0], {duration: 0.5});
}
function isSettingsPanelOpen() {
return $('#projects').hasClass('with-settings');
return self.tmp('$Projects').hasClass('with-settings');
}
function isMobile() {
@@ -131,8 +128,11 @@ function isMobile() {
function initPage(asHash) {
if(asHash.items.length==0) self.setHash(asHash.page, [self.vars('default_project_codename')]);
else {
self.tmp('$Projects', $('#projects'));
self.tmp('$Map', $('#map'));
self.tmp('$PostList', $('#posts_list'));
self.tmp('$Feed', $('#feed'));
self.tmp('$Settings', $('#settings'));
self.tmp('updatable', true);
self.tmp('out-of-data', false);
self.tmp('tile_api', getWmtsApiUrl('{id}', '{y}', '{x}', '{z}'));
@@ -140,12 +140,12 @@ function initPage(asHash) {
self.tmp('trail-markers', 'object');
self.tmp('marker_size', {width: 32, height: 32});
toggleFeedPanel(false, 'none');
if(!isMobile()) toggleFeedPanel(true, 'none');
//Lightbox options
lightbox.option({
alwaysShowNavOnTouchDevices: true,
albumLabel: '<i class="fa fa-fw fa-lg fa-media push"></i> %1 / %2',/*oSpot.lang('media_count', ['%1', '%2']),*/
albumLabel: '<i class="fa fa-fw fa-lg fa-media push"></i> %1 / %2',
fadeDuration: 300,
imageFadeDuration: 400,
positionFromTop: 0,
@@ -171,7 +171,7 @@ function initPage(asHash) {
//Mobile events
$("#feed").onSwipe(function(aiDelta){
if(aiDelta.x > self.tmp('feed_width')/3 && aiDelta.x > Math.abs(aiDelta.y)) toggleFeedPanel(false);
if(aiDelta.x > self.tmp('$Feed').outerWidth(true)/3 && aiDelta.x > Math.abs(aiDelta.y)) toggleFeedPanel(false);
});
//Feed Panel
@@ -329,9 +329,9 @@ function onAutoUpdate(bFirstExec) {
function getElevWidth() {
var
iPageWidth = $('#projects').width(),
iFeedPanelWidth = oSpot.tmp('feed_width'),
iSettingsPanelWidth = isSettingsPanelOpen()?$('#settings').outerWidth(true):0,
iPageWidth = self.tmp('$Projects').width(),
iFeedPanelWidth = isFeedPanelOpen()?self.tmp('$Feed').outerWidth(true):0,
iSettingsPanelWidth = isSettingsPanelOpen()?self.tmp('$Settings').outerWidth(true):0,
iLegendWidth = $('.leaflet-bottom.leaflet-left > .leaflet-control-layers').outerWidth(true),
oElevRightMarging = parseInt($('.leaflet-bottom.leaflet-right > .leaflet-control-scale').css('margin-right').slice(0, -2));
@@ -444,7 +444,8 @@ function initSpotMessages(aoMessages, aoTracks, bNoFeed) {
});
oElev.addTo(oMap);
oElev.addData([aoElevTracks]);
//self.tmp('elev', oElev);
self.tmp('elev', oElev);
self.tmp('elev-data', [aoElevTracks]);
}
//Controls: Tiles (layers): Add & Move to Settings Panel
@@ -553,9 +554,9 @@ function initSpotMessages(aoMessages, aoTracks, bNoFeed) {
//Zoom on last message
var oLastMsg = aoMessages[aoMessages.length-1];
oMap.setView(L.latLng(oLastMsg.latitude, oLastMsg.longitude), 15);
oMap.panBy([(bWithFeedPanel?1:0)*$('#feed').outerWidth(true)/2, 0]);
oMap.panBy([(bWithFeedPanel?1:0)*self.tmp('$Feed').outerWidth(true)/2, 0]);
}
else oMap.fitBounds(self.tmp('track').getBounds(), {paddingTopLeft: L.point(5, self.tmp('marker_size').height + 5), paddingBottomRight: L.point(5 + parseInt(bWithFeedPanel?$('#feed').outerWidth(true):0), 5)});
else oMap.fitBounds(self.tmp('track').getBounds(), {paddingTopLeft: L.point(5, self.tmp('marker_size').height + 5), paddingBottomRight: L.point(5 + parseInt(bWithFeedPanel?self.tmp('$Feed').outerWidth(true):0), 5)});
//Spot Messages
$.each(aoMessages, function(iKey, oMsg){
@@ -591,7 +592,7 @@ function initSpotMessages(aoMessages, aoTracks, bNoFeed) {
}
oMarker.bindPopup($Tooltip[0], {
maxWidth: $('#projects').width(),
maxWidth: self.tmp('$Projects').width(),
autoPan: false,
closeOnClick: true,
offset: new L.Point(0, -30)
@@ -648,8 +649,6 @@ function updateFeed(bFirstChunk, bDiscrete) {
self.tmp('$PostList').append($Posts.children());
self.tmp('updatable', true);
if(bFirstChunk && !isMobile() && !$.isEmptyObject(asData) && !bDiscrete) toggleFeedPanel(true, 'none');
}, {
'project_id': self.vars(['project', 'id']),
'chunk': self.tmp('news_chunk')
@@ -692,7 +691,7 @@ function getPost(asPost) {
self.tmp('map').setView(oMarker.getLatLng(), 15);
}
else {
var iOffset = $('#feed').outerWidth(true)/2 - ($('#projects').hasClass('with-settings')?1:-1)*$('#settings').outerWidth(true)/2;
var iOffset = (isFeedPanelOpen()?1:-1)*self.tmp('$Feed').outerWidth(true)/2 - (isSettingsPanelOpen()?1:-1)*self.tmp('$Settings').outerWidth(true)/2;
var iRatio = -1 * iOffset / $('body').outerWidth(true);
self.tmp('map').setOffsetView(iRatio, oMarker.getLatLng(), 15);
}