Merge pull request #75 from bagage/feature/remember-state

Remember collapsible state in local storage (elevation chart, sidebar)
This commit is contained in:
Norbert Renner 2017-05-04 19:46:56 +02:00 committed by GitHub
commit 52cca39823
2 changed files with 29 additions and 4 deletions

View file

@ -191,7 +191,7 @@
</div>
</div>
<div class="collapse in" id="elevation-chart"></div>
<div class="collapse" id="elevation-chart"></div>
<footer>
<div class="flexrow">
@ -217,7 +217,7 @@
<span class="fa fa-compress"></span>
</button>
<button class="btn btn-secondary btn-sm active" type="button" data-toggle="collapse" data-target="#elevation-chart" aria-controls="elevation-chart" id="elevation-btn" aria-expanded="false" aria-label="Toggle elevation chart">
<button class="btn btn-secondary btn-sm" type="button" data-toggle="collapse" data-target="#elevation-chart" aria-controls="elevation-chart" id="elevation-btn" aria-expanded="false" aria-label="Toggle elevation chart">
<span class="fa fa-area-chart"></span>
</button>
</div>

View file

@ -223,6 +223,7 @@
var sidebar = L.control.sidebar('sidebar', {
position: 'left'
});
sidebar.id = 'sidebar-control'; //required for persistence in local storage
map.addControl(sidebar);
nogos.addTo(map);
@ -308,10 +309,34 @@
map._onResize();
});
$('#sidebar-btn').on('click', function (event) {
var onHide = function() {
if (this.id && BR.Util.localStorageAvailable()) {
localStorage[this.id] = 'true';
}
};
var onShow = function() {
if (this.id && BR.Util.localStorageAvailable()) {
localStorage.removeItem(this.id);
}
};
var toggleSidebar = function (event) {
sidebar.toggle();
$('#sidebar-btn').toggleClass('active');
});
};
$('#sidebar-btn').on('click', toggleSidebar);
sidebar.on('shown', onShow);
sidebar.on('hidden', onHide);
// on page load, we want to restore collapsible elements from previous usage
$('.collapse').on('hidden.bs.collapse', onHide)
.on('shown.bs.collapse', onShow)
.each(function() {
if (!(this.id && BR.Util.localStorageAvailable() && localStorage[this.id] === 'true' )) {
$(this).collapse('hide');
}
});
if (BR.Util.localStorageAvailable() && localStorage[sidebar.id] !== 'true') {
toggleSidebar();
}
}
mapContext = BR.Map.initMap();