midgard/blokmap
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

new layout

Browse source
This commit is contained in:
feliciaan 2014-12-10 15:59:49 +01:00
parent 5f3f878783
commit e2e28a9b9f
3 changed files with 50 additions and 29 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
data.json
View file

@ -226,11 +226,11 @@
"capacity": 44, "capacity": 44,
"period": { "start": "18/08/2014", "end": "12/09/2014" }, "period": { "start": "18/08/2014", "end": "12/09/2014" },
"hours": { "hours": {
"monday": "9u - 12u30 en van 13u - 16u30", "monday": "9u - 12u30 en 13u - 16u30",
"tuesday": "9u - 12u30 en van 13u - 16u30", "tuesday": "9u - 12u30 en 13u - 16u30",
"wednesday": "9u - 12u30 en van 13u - 16u30", "wednesday": "9u - 12u30 en 13u - 16u30",
"thursday": "9u - 12u30 en van 13u - 16u30", "thursday": "9u - 12u30 en 13u - 16u30",
"friday": "9u - 12u30 en van 13u - 16u30", "friday": "9u - 12u30 en 13u - 16u30",
"saturday": false, "saturday": false,
"sunday": false "sunday": false
}, },
@ -250,11 +250,11 @@
"capacity": 15, "capacity": 15,
"period": { "start": "18/08/2014", "end": "12/09/2014" }, "period": { "start": "18/08/2014", "end": "12/09/2014" },
"hours": { "hours": {
"monday": "10u - 12u en van 12u45 - 16u15", "monday": "10u - 12u en 12u45 - 16u15",
"tuesday": "10u - 12u en van 12u45 - 16u15", "tuesday": "10u - 12u en 12u45 - 16u15",
"wednesday": "10u - 12u en van 12u45 - 16u15", "wednesday": "10u - 12u en 12u45 - 16u15",
"thursday": "10u - 12u", "thursday": "10u - 12u",
"friday": "10u - 12u en van 12u45 - 16u15", "friday": "10u - 12u en 12u45 - 16u15",
"saturday": false, "saturday": false,
"sunday": false "sunday": false
}, },

14
map.css
View file

@ -19,8 +19,18 @@ html, body {
width: 400px; width: 400px;
} }
td { h4 {
width: 14%; margin-top: 5px;
margin-bottom: 5px;
}
table {
padding-bottom: 10px;
border-spacing: 0;
}
tr td:first-child {
padding: 0;
padding-right: 10px;
} }
.info { .info {

47
map.html
View file

@ -3,6 +3,8 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>Blokken in Gent</title> <title>Blokken in Gent</title>
<meta name=“viewport” content=“initial-scale=1.0”>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css" /> <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css" />
<link rel="stylesheet" href="map.css" /> <link rel="stylesheet" href="map.css" />
<script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script> <script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script>
@ -16,31 +18,40 @@
<script id="popup-template" type="text/x-handlebars-template"> <script id="popup-template" type="text/x-handlebars-template">
<div id="resto-popup"> <div id="resto-popup">
<h3>{{name}}</h3> <h3>{{name}}</h3>
<img src="{{type}}.png" class="type">
Waar: {{address}}<br />
Plaatsen: {{capacity}}<br />
Van {{period.start}} tot {{period.end}}<br /> Van {{period.start}} tot {{period.end}}<br />
<img src="{{type}}.png" class="type">
<h4>Openingsuren</h4>
<table> <table>
<tr> <tr>
<td>Maandag</td> <td>Maandag</td>
<td>Dinsdag</td> <td>{{#if hours.monday}}{{hours.monday}}{{else}}Gesloten{{/if}}</td>
<td>Woensdag</td>
<td>Donderdag</td>
<td>Vrijdag</td>
<td>Zaterdag</td>
<td>Zondag</td>
</tr> </tr>
<tr> <tr>
<td>{{#if hours.monday}}{{hours.monday}}{{else}}Gesloten{{/if}}</td> <td>Dinsdag</td>
<td>{{#if hours.tuesday}}{{hours.tuesday}}{{else}}Gesloten{{/if}}</td> <td>{{#if hours.tuesday}}{{hours.tuesday}}{{else}}Gesloten{{/if}}</td>
<td>{{#if hours.wednesday}}{{hours.wednesday}}{{else}}Gesloten{{/if}}</td> </tr>
<td>{{#if hours.thursday}}{{hours.thursday}}{{else}}Gesloten{{/if}}</td> <tr>
<td>{{#if hours.friday}}{{hours.friday}}{{else}}Gesloten{{/if}}</td> <td>Woensdag</td>
<td>{{#if hours.saturday}}{{hours.saturday}}{{else}}Gesloten{{/if}}</td> <td>{{#if hours.wednesday}}{{hours.wednesday}}{{else}}Gesloten{{/if}}</td>
<td>{{#if hours.sunday}}{{hours.sunday}}{{else}}Gesloten{{/if}}</td> </tr>
<tr>
<td>Donderdag</td>
<td>{{#if hours.thursday}}{{hours.thursday}}{{else}}Gesloten{{/if}}</td>
</tr><tr>
<td>Vrijdag</td>
<td>{{#if hours.friday}}{{hours.friday}}{{else}}Gesloten{{/if}}</td>
</tr>
<tr>
<td>Zaterdag</td>
<td>{{#if hours.saturday}}{{hours.saturday}}{{else}}Gesloten{{/if}}</td>
</tr>
<tr>
<td>Zondag</td>
<td>{{#if hours.sunday}}{{hours.sunday}}{{else}}Gesloten{{/if}}</td>
</tr> </tr>
</table> </table>
Waar: {{address}}<br />
Plaatsen: {{capacity}}<br />
{{#if extra}}{{extra}}{{/if}} {{#if extra}}{{extra}}{{/if}}
</div> </div>
</script> </script>
@ -59,7 +70,7 @@
$(document).ready(function() { $(document).ready(function() {
var map = L.map('map').setView([51.0475378, 3.7261835], 13); var map = L.map('map').setView([51.0475378, 3.7261835], 13);
var osm = L.tileLayer('https://{s}.tiles.mapbox.com/v3/feliciaan.keoaj8d5/{z}/{x}/{y}.png', { var osm = L.tileLayer('https://{s}.tiles.mapbox.com/v3/feliciaan.keoaj8d5/{z}/{x}/{y}.png', {
attribution: 'Made by <a href="http://zeus.ugent.be">Zeus WPI</a> with ❤ and <a href="http://www.mapbox.com/about/maps/" target="_blank">Mapbox</a>' attribution: 'Made with ❤ by <a href="http://zeus.ugent.be">Zeus WPI</a> and <a href="http://www.mapbox.com/about/maps/" target="_blank">Mapbox</a>'
}).addTo(map); }).addTo(map);
$.getJSON('data.json') $.getJSON('data.json')