Krautspace/calcifer
Archived
2
0
Fork 0
Code Issues 11 Pull requests 2 Activity

Extend the location detail page with the new informations.

Browse source
This commit is contained in:
Tim Schumacher 2014-09-24 23:27:43 +02:00
parent 9227016086
commit 93da869e00
3 changed files with 109 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
src/Hackspace/Bundle/CalciferBundle/Resources/assets/css/events.scss
View file

@ -42,11 +42,22 @@ form .ui.form {
}
}
#map {
#view-map, #map {
height: 20rem;
}
.location-edit {
text-decoration: none;
}
#location-description {
p {
margin-top: 0.5rem;
margin-bottom: 0.5rem;
}
.ui.section.divider {
margin-top: 0;
margin-bottom: 0;
}
}

64
src/Hackspace/Bundle/CalciferBundle/Resources/assets/js/events.js
View file

@ -46,18 +46,30 @@ jQuery(document).ready(function () {
closable: false,
onApprove: function () {
var coords = marker.getLatLng();
jQuery('input[name=location_lat]').val(coords.lat);
jQuery('input[name=location_lon]').val(coords.lng);
jQuery('input[name=location]').css('margin-bottom', '3.2rem');
jQuery('span.coords').text('Folgende Koordinaten sind angegeben: lat:' + coords.lat + ', lon:' + coords.lng);
if (!(jQuery('input[name=location_lat]').val() == undefined)) {
jQuery('input[name=location_lat]').val(coords.lat);
jQuery('input[name=location_lon]').val(coords.lng);
jQuery('input[name=location]').css('margin-bottom', '3.2rem');
jQuery('span.coords').text('Folgende Koordinaten sind angegeben: lat:' + coords.lat + ', lon:' + coords.lng);
} else {
jQuery('input[name=geocords]').val(coords.lat + ',' + coords.lng);
}
},
onDeny: function () {
},
onVisible: function () {
map.invalidateSize(true);
var lat = parseFloat(jQuery('input[name=location_lat]').val());
var lon = parseFloat(jQuery('input[name=location_lon]').val());
var lat = 0;
var lon = 0;
if (!(jQuery('input[name=location_lat]').val() == undefined)) {
lat = parseFloat(jQuery('input[name=location_lat]').val());
lon = parseFloat(jQuery('input[name=location_lon]').val());
} else {
var latlon = jQuery('input[name=geocords]').val();
lat = latlon.split(',')[0];
lon = latlon.split(',')[1];
}
if ((lat > 0) && (lon > 0)) {
map.setView([lat, lon], 16);
var latlng = new L.LatLng(lat, lon);
@ -70,3 +82,43 @@ jQuery(document).ready(function () {
}).modal('attach events', '.add_geo', 'show');
}
});
$(document).ready(function() {
if (jQuery('#view-map').length == 1) {
jQuery('.show_map').click(addGeoCoordinates);
map = L.map('view-map');
// add an OpenStreetMap tile layer
L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);
map.setView([51.505, -0.09], 0);
L.Icon.Default.imagePath = '/css/images';
var popup = L.popup();
var marker = L.marker();
jQuery('.geo.viewer').modal('setting', {
closable: true,
onDeny: function () {
},
onVisible: function () {
map.invalidateSize(true);
var lat = $('#view-map').data('lat');
var lon = $('#view-map').data('lon');
if ((lat > 0) && (lon > 0)) {
map.setView([lat, lon], 16);
var latlng = new L.LatLng(lat, lon);
marker.setLatLng(latlng);
marker.addTo(map);
} else {
map.locate({setView: true});
}
}
}).modal('attach events', '.show_map', 'show');
}
});

40
src/Hackspace/Bundle/CalciferBundle/Resources/views/Event/index.html.twig
View file

@ -3,6 +3,7 @@
{% block css %}
{% stylesheets filter="compass"
"@CalciferBundle/Resources/assets/css/events.scss"
"@CalciferBundle/Resources/assets/css/leaflet.scss"
%}
<link rel="stylesheet" href="{{ asset_url }}" />
{% endstylesheets %}
@ -11,6 +12,7 @@
{% block javascripts %}
{% javascripts
"@CalciferBundle/Resources/assets/js/events.js"
"@CalciferBundle/Resources/assets/js/leaflet.js"
%}
<script src="{{ asset_url }}"></script>
{% endjavascripts %}
@ -22,8 +24,44 @@
<h1>
Termine
{% if tag|default(false) %} für Tag „{{ tag.name }}“{% endif %}
{% if location|default(false) %} für Ort „{{ location.name }}“{% endif %}
{% if location|default(false) %} für Ort „{{ location.name }}“ <a class="location-edit" href="{{ path("location_edit",{slug:location.slug}) }}"><i class="ui icon edit inverted green circular link"></i> </a> {% endif %}
</h1>
{% if location|default(false) %}
{% if (location.description|length > 0) or location.hasAddress() %}
<div id="location-description" class="ui message green">
{% if (location.description|length > 0) %}
<p>{{ location.description|markdown }}</p>
{% endif %}
{% if (location.hasAddress()) %}
<div class="ui section divider"></div>
<p>
Anschrift:<br/>
{{ location.streetaddress }}{% if(location.streetnumber|length > 0) %} {{ location.streetnumber }}{% endif %}<br/>
{% if(location.zipcode|length > 0) %}{{ location.zipcode }} {% endif %}{{ location.city }}
</p>
{% endif %}
{% if ((location.lon > 0) and (location.lat > 0)) %}
<p><a href="" class="show_map">Auf einer OpenStreetMap-Karte anzeigen</a></p>
<div class="ui modal geo viewer">
<i class="close icon"></i>
<div class="header">
{{ location.name }}<br/>
{{ location.streetaddress }}{% if(location.streetnumber|length > 0) %} {{ location.streetnumber }}{% endif %}<br/>
{% if(location.zipcode|length > 0) %}{{ location.zipcode }} {% endif %}{{ location.city }}
</div>
<div class="content">
<div id="view-map" data-lat="{{ location.lat }}" data-lon="{{ location.lon }}"></div>
</div>
<div class="actions">
<div class="ui button ok">
Schließen
</div>
</div>
</div>
{% endif %}
</div>
{% endif %}
{% endif %}
</div>
</div>