improve map selector

This commit is contained in:
Laura Klünder 2016-12-21 04:05:06 +01:00
parent fbc6f1c6f7
commit 351f34e584
3 changed files with 18 additions and 5 deletions

View file

@ -10,7 +10,6 @@ body, .btn {
display:none
}
.locationselect .input-lg {
height: 62px;
}
@ -68,7 +67,7 @@ body, .btn {
.locationselect-map .map-container {
width:100%;
overflow:auto;
height:200px;
height:300px;
position:relative;
}
.locationselect-map .map-container img, .locationselect-map .map-container input {
@ -81,6 +80,9 @@ body, .btn {
top:8px;
left:8px;
}
.locationselect-map .close-map {
margin-left:8px;
}
.locationselect-map .scroll-hint {
color:#FFFFFF;
position:absolute;
@ -254,3 +256,11 @@ circle.pos {
vertical-align:middle;
line-height: 1.42857143;
}
.locationselect-selected.loading .location,
.locationselect-map .map-container {
background-image:url('/static/img/loader.gif');
background-repeat:no-repeat;
background-position:center;
}

View file

@ -74,6 +74,8 @@ c3nav = {
var location_group = $(this).closest('.location-group');
var map_container = location_group.find('.map-container');
var level = $(this).attr('data-level');
$(this).siblings().removeClass('active');
$(this).addClass('active');
map_container.find('img').remove();
map_container.append($('<img>').attr({
'src': '/map/'+level+'.png',
@ -91,9 +93,11 @@ c3nav = {
selected.find('.title').text('');
selected.find('.subtitle').text('');
selected.find('.id-field').val(coords);
selected.addClass('loading');
$.getJSON('/api/locations/'+coords, function(data) {
selected.find('.title').text(data.title);
selected.find('.subtitle').text(data.subtitle);
selected.removeClass('loading');
});
c3nav._locations_changed();
c3nav.locationselect_focus();

View file

@ -38,10 +38,9 @@
<div class="map-buttons">
<div class="btn-group level-selector" role="group">
{% for level in levels %}
<a href="?map-level={{ level }}" data-level="{{ level }}" class="btn btn-default{% if level == map_level %} active{% endif %}">{{ level }}</a>
<a href="?map-level={{ level }}" data-level="{{ level }}" class="btn btn-sm btn-default{% if level == map_level %} active{% endif %}">{{ level }}</a>
{% endfor %}
</div>
<a href="?" class="btn btn-default close-map">{% trans 'close' %}</a>
</div><a href="?" class="btn btn-sm btn-default close-map">{% trans 'close' %}</a>
</div>
<span class="help-block">{% trans 'Click or tap the desired location on the map.' %}</span>
</div>