Merge pull request #48 from AurisAudentis/cleanup

Legend issues

.editorconfig

@@ -0,0 +1,19 @@
+# https://editorconfig.org
+
+root = true
+
+[*]
+charset = utf-8
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true
+indent_style = space
+indent_size = 4
+quote_type = double
+
+[*.html]
+indent_size = 2
+
+[*.svg]
+indent_style = tab
+indent_size = unset

README.md

@@ -1,8 +1,8 @@
-# Blokmap
+# BlokLocaties Op Kaart Met Aanduidende Pins
 
 A useful map that lists all the public study locations in Ghent.
 
-We usually use data from [Stad Gent](https://stad.gent/studenten/studeren/bloklocaties), [Stad Kortrijk](http://www.kortrijkstudentenstad.be/aanbod/bloklocaties/) and emails sent by people..
+Data is managed in a separate project, [Blokdata](https://github.com/ZeusWPI/Blokdata).
 
 ## Development
 
@@ -11,5 +11,3 @@ You can easily run the site locally by spawning a simple static file server in t
 ```
 (cd src/; python3 -m http.server)
 ```
-
-You can also validate the JSON with `(cd src/; python -m json.tool data.json > /dev/null)`. If there are no errors, there will be no output.

deploy.sh

@@ -13,9 +13,6 @@ echo "-> Pulling latest release"
 # Apparently, some systems put "up to date", while others put "up-to-date"
 git pull | grep 'Already up[- ]to[- ]date.' && echo "No updates, exiting..." && exit 20
 
-echo "-> Checking validity of data.json"
-python -m json.tool src/data.json > /dev/null
-
 
 # Create release dir and copy sources to that dir
 echo "-> This release will be stored in $release_dir"

src/css/leaflet-1.6.0.css

@@ -0,0 +1,640 @@
+/* required styles */
+
+.leaflet-pane,
+.leaflet-tile,
+.leaflet-marker-icon,
+.leaflet-marker-shadow,
+.leaflet-tile-container,
+.leaflet-pane > svg,
+.leaflet-pane > canvas,
+.leaflet-zoom-box,
+.leaflet-image-layer,
+.leaflet-layer {
+	position: absolute;
+	left: 0;
+	top: 0;
+	}
+.leaflet-container {
+	overflow: hidden;
+	}
+.leaflet-tile,
+.leaflet-marker-icon,
+.leaflet-marker-shadow {
+	-webkit-user-select: none;
+	   -moz-user-select: none;
+	        user-select: none;
+	  -webkit-user-drag: none;
+	}
+/* Prevents IE11 from highlighting tiles in blue */
+.leaflet-tile::selection {
+	background: transparent;
+}
+/* Safari renders non-retina tile on retina better with this, but Chrome is worse */
+.leaflet-safari .leaflet-tile {
+	image-rendering: -webkit-optimize-contrast;
+	}
+/* hack that prevents hw layers "stretching" when loading new tiles */
+.leaflet-safari .leaflet-tile-container {
+	width: 1600px;
+	height: 1600px;
+	-webkit-transform-origin: 0 0;
+	}
+.leaflet-marker-icon,
+.leaflet-marker-shadow {
+	display: block;
+	}
+/* .leaflet-container svg: reset svg max-width decleration shipped in Joomla! (joomla.org) 3.x */
+/* .leaflet-container img: map is broken in FF if you have max-width: 100% on tiles */
+.leaflet-container .leaflet-overlay-pane svg,
+.leaflet-container .leaflet-marker-pane img,
+.leaflet-container .leaflet-shadow-pane img,
+.leaflet-container .leaflet-tile-pane img,
+.leaflet-container img.leaflet-image-layer,
+.leaflet-container .leaflet-tile {
+	max-width: none !important;
+	max-height: none !important;
+	}
+
+.leaflet-container.leaflet-touch-zoom {
+	-ms-touch-action: pan-x pan-y;
+	touch-action: pan-x pan-y;
+	}
+.leaflet-container.leaflet-touch-drag {
+	-ms-touch-action: pinch-zoom;
+	/* Fallback for FF which doesn't support pinch-zoom */
+	touch-action: none;
+	touch-action: pinch-zoom;
+}
+.leaflet-container.leaflet-touch-drag.leaflet-touch-zoom {
+	-ms-touch-action: none;
+	touch-action: none;
+}
+.leaflet-container {
+	-webkit-tap-highlight-color: transparent;
+}
+.leaflet-container a {
+	-webkit-tap-highlight-color: rgba(51, 181, 229, 0.4);
+}
+.leaflet-tile {
+	filter: inherit;
+	visibility: hidden;
+	}
+.leaflet-tile-loaded {
+	visibility: inherit;
+	}
+.leaflet-zoom-box {
+	width: 0;
+	height: 0;
+	-moz-box-sizing: border-box;
+	     box-sizing: border-box;
+	z-index: 800;
+	}
+/* workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=888319 */
+.leaflet-overlay-pane svg {
+	-moz-user-select: none;
+	}
+
+.leaflet-pane         { z-index: 400; }
+
+.leaflet-tile-pane    { z-index: 200; }
+.leaflet-overlay-pane { z-index: 400; }
+.leaflet-shadow-pane  { z-index: 500; }
+.leaflet-marker-pane  { z-index: 600; }
+.leaflet-tooltip-pane   { z-index: 650; }
+.leaflet-popup-pane   { z-index: 700; }
+
+.leaflet-map-pane canvas { z-index: 100; }
+.leaflet-map-pane svg    { z-index: 200; }
+
+.leaflet-vml-shape {
+	width: 1px;
+	height: 1px;
+	}
+.lvml {
+	behavior: url(#default#VML);
+	display: inline-block;
+	position: absolute;
+	}
+
+
+/* control positioning */
+
+.leaflet-control {
+	position: relative;
+	z-index: 800;
+	pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
+	pointer-events: auto;
+	}
+.leaflet-top,
+.leaflet-bottom {
+	position: absolute;
+	z-index: 1000;
+	pointer-events: none;
+	}
+.leaflet-top {
+	top: 0;
+	}
+.leaflet-right {
+	right: 0;
+	}
+.leaflet-bottom {
+	bottom: 0;
+	}
+.leaflet-left {
+	left: 0;
+	}
+.leaflet-control {
+	float: left;
+	clear: both;
+	}
+.leaflet-right .leaflet-control {
+	float: right;
+	}
+.leaflet-top .leaflet-control {
+	margin-top: 10px;
+	}
+.leaflet-bottom .leaflet-control {
+	margin-bottom: 10px;
+	}
+.leaflet-left .leaflet-control {
+	margin-left: 10px;
+	}
+.leaflet-right .leaflet-control {
+	margin-right: 10px;
+	}
+
+
+/* zoom and fade animations */
+
+.leaflet-fade-anim .leaflet-tile {
+	will-change: opacity;
+	}
+.leaflet-fade-anim .leaflet-popup {
+	opacity: 0;
+	-webkit-transition: opacity 0.2s linear;
+	   -moz-transition: opacity 0.2s linear;
+	        transition: opacity 0.2s linear;
+	}
+.leaflet-fade-anim .leaflet-map-pane .leaflet-popup {
+	opacity: 1;
+	}
+.leaflet-zoom-animated {
+	-webkit-transform-origin: 0 0;
+	    -ms-transform-origin: 0 0;
+	        transform-origin: 0 0;
+	}
+.leaflet-zoom-anim .leaflet-zoom-animated {
+	will-change: transform;
+	}
+.leaflet-zoom-anim .leaflet-zoom-animated {
+	-webkit-transition: -webkit-transform 0.25s cubic-bezier(0,0,0.25,1);
+	   -moz-transition:    -moz-transform 0.25s cubic-bezier(0,0,0.25,1);
+	        transition:         transform 0.25s cubic-bezier(0,0,0.25,1);
+	}
+.leaflet-zoom-anim .leaflet-tile,
+.leaflet-pan-anim .leaflet-tile {
+	-webkit-transition: none;
+	   -moz-transition: none;
+	        transition: none;
+	}
+
+.leaflet-zoom-anim .leaflet-zoom-hide {
+	visibility: hidden;
+	}
+
+
+/* cursors */
+
+.leaflet-interactive {
+	cursor: pointer;
+	}
+.leaflet-grab {
+	cursor: -webkit-grab;
+	cursor:    -moz-grab;
+	cursor:         grab;
+	}
+.leaflet-crosshair,
+.leaflet-crosshair .leaflet-interactive {
+	cursor: crosshair;
+	}
+.leaflet-popup-pane,
+.leaflet-control {
+	cursor: auto;
+	}
+.leaflet-dragging .leaflet-grab,
+.leaflet-dragging .leaflet-grab .leaflet-interactive,
+.leaflet-dragging .leaflet-marker-draggable {
+	cursor: move;
+	cursor: -webkit-grabbing;
+	cursor:    -moz-grabbing;
+	cursor:         grabbing;
+	}
+
+/* marker & overlays interactivity */
+.leaflet-marker-icon,
+.leaflet-marker-shadow,
+.leaflet-image-layer,
+.leaflet-pane > svg path,
+.leaflet-tile-container {
+	pointer-events: none;
+	}
+
+.leaflet-marker-icon.leaflet-interactive,
+.leaflet-image-layer.leaflet-interactive,
+.leaflet-pane > svg path.leaflet-interactive,
+svg.leaflet-image-layer.leaflet-interactive path {
+	pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
+	pointer-events: auto;
+	}
+
+/* visual tweaks */
+
+.leaflet-container {
+	background: #ddd;
+	outline: 0;
+	}
+.leaflet-container a {
+	color: #0078A8;
+	}
+.leaflet-container a.leaflet-active {
+	outline: 2px solid orange;
+	}
+.leaflet-zoom-box {
+	border: 2px dotted #38f;
+	background: rgba(255,255,255,0.5);
+	}
+
+
+/* general typography */
+.leaflet-container {
+	font: 12px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
+	}
+
+
+/* general toolbar styles */
+
+.leaflet-bar {
+	box-shadow: 0 1px 5px rgba(0,0,0,0.65);
+	border-radius: 4px;
+	}
+.leaflet-bar a,
+.leaflet-bar a:hover {
+	background-color: #fff;
+	border-bottom: 1px solid #ccc;
+	width: 26px;
+	height: 26px;
+	line-height: 26px;
+	display: block;
+	text-align: center;
+	text-decoration: none;
+	color: black;
+	}
+.leaflet-bar a,
+.leaflet-control-layers-toggle {
+	background-position: 50% 50%;
+	background-repeat: no-repeat;
+	display: block;
+	}
+.leaflet-bar a:hover {
+	background-color: #f4f4f4;
+	}
+.leaflet-bar a:first-child {
+	border-top-left-radius: 4px;
+	border-top-right-radius: 4px;
+	}
+.leaflet-bar a:last-child {
+	border-bottom-left-radius: 4px;
+	border-bottom-right-radius: 4px;
+	border-bottom: none;
+	}
+.leaflet-bar a.leaflet-disabled {
+	cursor: default;
+	background-color: #f4f4f4;
+	color: #bbb;
+	}
+
+.leaflet-touch .leaflet-bar a {
+	width: 30px;
+	height: 30px;
+	line-height: 30px;
+	}
+.leaflet-touch .leaflet-bar a:first-child {
+	border-top-left-radius: 2px;
+	border-top-right-radius: 2px;
+	}
+.leaflet-touch .leaflet-bar a:last-child {
+	border-bottom-left-radius: 2px;
+	border-bottom-right-radius: 2px;
+	}
+
+/* zoom control */
+
+.leaflet-control-zoom-in,
+.leaflet-control-zoom-out {
+	font: bold 18px 'Lucida Console', Monaco, monospace;
+	text-indent: 1px;
+	}
+
+.leaflet-touch .leaflet-control-zoom-in, .leaflet-touch .leaflet-control-zoom-out  {
+	font-size: 22px;
+	}
+
+
+/* layers control */
+
+.leaflet-control-layers {
+	box-shadow: 0 1px 5px rgba(0,0,0,0.4);
+	background: #fff;
+	border-radius: 5px;
+	}
+.leaflet-control-layers-toggle {
+	background-image: url(images/layers.png);
+	width: 36px;
+	height: 36px;
+	}
+.leaflet-retina .leaflet-control-layers-toggle {
+	background-image: url(images/layers-2x.png);
+	background-size: 26px 26px;
+	}
+.leaflet-touch .leaflet-control-layers-toggle {
+	width: 44px;
+	height: 44px;
+	}
+.leaflet-control-layers .leaflet-control-layers-list,
+.leaflet-control-layers-expanded .leaflet-control-layers-toggle {
+	display: none;
+	}
+.leaflet-control-layers-expanded .leaflet-control-layers-list {
+	display: block;
+	position: relative;
+	}
+.leaflet-control-layers-expanded {
+	padding: 6px 10px 6px 6px;
+	color: #333;
+	background: #fff;
+	}
+.leaflet-control-layers-scrollbar {
+	overflow-y: scroll;
+	overflow-x: hidden;
+	padding-right: 5px;
+	}
+.leaflet-control-layers-selector {
+	margin-top: 2px;
+	position: relative;
+	top: 1px;
+	}
+.leaflet-control-layers label {
+	display: block;
+	}
+.leaflet-control-layers-separator {
+	height: 0;
+	border-top: 1px solid #ddd;
+	margin: 5px -10px 5px -6px;
+	}
+
+/* Default icon URLs */
+.leaflet-default-icon-path {
+	background-image: url(images/marker-icon.png);
+	}
+
+
+/* attribution and scale controls */
+
+.leaflet-container .leaflet-control-attribution {
+	background: #fff;
+	background: rgba(255, 255, 255, 0.7);
+	margin: 0;
+	}
+.leaflet-control-attribution,
+.leaflet-control-scale-line {
+	padding: 0 5px;
+	color: #333;
+	}
+.leaflet-control-attribution a {
+	text-decoration: none;
+	}
+.leaflet-control-attribution a:hover {
+	text-decoration: underline;
+	}
+.leaflet-container .leaflet-control-attribution,
+.leaflet-container .leaflet-control-scale {
+	font-size: 11px;
+	}
+.leaflet-left .leaflet-control-scale {
+	margin-left: 5px;
+	}
+.leaflet-bottom .leaflet-control-scale {
+	margin-bottom: 5px;
+	}
+.leaflet-control-scale-line {
+	border: 2px solid #777;
+	border-top: none;
+	line-height: 1.1;
+	padding: 2px 5px 1px;
+	font-size: 11px;
+	white-space: nowrap;
+	overflow: hidden;
+	-moz-box-sizing: border-box;
+	     box-sizing: border-box;
+
+	background: #fff;
+	background: rgba(255, 255, 255, 0.5);
+	}
+.leaflet-control-scale-line:not(:first-child) {
+	border-top: 2px solid #777;
+	border-bottom: none;
+	margin-top: -2px;
+	}
+.leaflet-control-scale-line:not(:first-child):not(:last-child) {
+	border-bottom: 2px solid #777;
+	}
+
+.leaflet-touch .leaflet-control-attribution,
+.leaflet-touch .leaflet-control-layers,
+.leaflet-touch .leaflet-bar {
+	box-shadow: none;
+	}
+.leaflet-touch .leaflet-control-layers,
+.leaflet-touch .leaflet-bar {
+	border: 2px solid rgba(0,0,0,0.2);
+	background-clip: padding-box;
+	}
+
+
+/* popup */
+
+.leaflet-popup {
+	position: absolute;
+	text-align: center;
+	margin-bottom: 20px;
+	}
+.leaflet-popup-content-wrapper {
+	padding: 1px;
+	text-align: left;
+	border-radius: 12px;
+	}
+.leaflet-popup-content {
+	margin: 13px 19px;
+	line-height: 1.4;
+	}
+.leaflet-popup-content p {
+	margin: 18px 0;
+	}
+.leaflet-popup-tip-container {
+	width: 40px;
+	height: 20px;
+	position: absolute;
+	left: 50%;
+	margin-left: -20px;
+	overflow: hidden;
+	pointer-events: none;
+	}
+.leaflet-popup-tip {
+	width: 17px;
+	height: 17px;
+	padding: 1px;
+
+	margin: -10px auto 0;
+
+	-webkit-transform: rotate(45deg);
+	   -moz-transform: rotate(45deg);
+	    -ms-transform: rotate(45deg);
+	        transform: rotate(45deg);
+	}
+.leaflet-popup-content-wrapper,
+.leaflet-popup-tip {
+	background: white;
+	color: #333;
+	box-shadow: 0 3px 14px rgba(0,0,0,0.4);
+	}
+.leaflet-container a.leaflet-popup-close-button {
+	position: absolute;
+	top: 0;
+	right: 0;
+	padding: 4px 4px 0 0;
+	border: none;
+	text-align: center;
+	width: 18px;
+	height: 14px;
+	font: 16px/14px Tahoma, Verdana, sans-serif;
+	color: #c3c3c3;
+	text-decoration: none;
+	font-weight: bold;
+	background: transparent;
+	}
+.leaflet-container a.leaflet-popup-close-button:hover {
+	color: #999;
+	}
+.leaflet-popup-scrolled {
+	overflow: auto;
+	border-bottom: 1px solid #ddd;
+	border-top: 1px solid #ddd;
+	}
+
+.leaflet-oldie .leaflet-popup-content-wrapper {
+	zoom: 1;
+	}
+.leaflet-oldie .leaflet-popup-tip {
+	width: 24px;
+	margin: 0 auto;
+
+	-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678)";
+	filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678);
+	}
+.leaflet-oldie .leaflet-popup-tip-container {
+	margin-top: -1px;
+	}
+
+.leaflet-oldie .leaflet-control-zoom,
+.leaflet-oldie .leaflet-control-layers,
+.leaflet-oldie .leaflet-popup-content-wrapper,
+.leaflet-oldie .leaflet-popup-tip {
+	border: 1px solid #999;
+	}
+
+
+/* div icon */
+
+.leaflet-div-icon {
+	background: #fff;
+	border: 1px solid #666;
+	}
+
+
+/* Tooltip */
+/* Base styles for the element that has a tooltip */
+.leaflet-tooltip {
+	position: absolute;
+	padding: 6px;
+	background-color: #fff;
+	border: 1px solid #fff;
+	border-radius: 3px;
+	color: #222;
+	white-space: nowrap;
+	-webkit-user-select: none;
+	-moz-user-select: none;
+	-ms-user-select: none;
+	user-select: none;
+	pointer-events: none;
+	box-shadow: 0 1px 3px rgba(0,0,0,0.4);
+	}
+.leaflet-tooltip.leaflet-clickable {
+	cursor: pointer;
+	pointer-events: auto;
+	}
+.leaflet-tooltip-top:before,
+.leaflet-tooltip-bottom:before,
+.leaflet-tooltip-left:before,
+.leaflet-tooltip-right:before {
+	position: absolute;
+	pointer-events: none;
+	border: 6px solid transparent;
+	background: transparent;
+	content: "";
+	}
+
+/* Directions */
+
+.leaflet-tooltip-bottom {
+	margin-top: 6px;
+}
+.leaflet-tooltip-top {
+	margin-top: -6px;
+}
+.leaflet-tooltip-bottom:before,
+.leaflet-tooltip-top:before {
+	left: 50%;
+	margin-left: -6px;
+	}
+.leaflet-tooltip-top:before {
+	bottom: 0;
+	margin-bottom: -12px;
+	border-top-color: #fff;
+	}
+.leaflet-tooltip-bottom:before {
+	top: 0;
+	margin-top: -12px;
+	margin-left: -6px;
+	border-bottom-color: #fff;
+	}
+.leaflet-tooltip-left {
+	margin-left: -6px;
+}
+.leaflet-tooltip-right {
+	margin-left: 6px;
+}
+.leaflet-tooltip-left:before,
+.leaflet-tooltip-right:before {
+	top: 50%;
+	margin-top: -6px;
+	}
+.leaflet-tooltip-left:before {
+	right: 0;
+	margin-right: -12px;
+	border-left-color: #fff;
+	}
+.leaflet-tooltip-right:before {
+	left: 0;
+	margin-left: -12px;
+	border-right-color: #fff;
+	}

src/css/map.css

@@ -1,32 +1,45 @@
 html, body {
-  margin: 0px;
-  padding: 0px;
-  width: 100%;
-  height: 100%;
+    margin: 0px;
+    padding: 0px;
+    width: 100%;
+    height: 100%;
+    font-family: sans-serif;
+}
+
+.notice {
+    padding: 0.5em;
+    background: #fff;
+    color: #000;
+    box-shadow: 0 1px 5px rgba(0,0,0,0.65);
+}
+.leaflet-top.leaflet-left {
+    z-index: 1001;
 }
 
 #map {
-  width: 100%;
-  height: 100%;
+    width: 100%;
+    height: 100%;
 }
 
 .leaflet-popup-content-wrapper,
 .leaflet-control-zoom {
-  border-radius: 0px;
+    border-radius: 0px;
 }
 
 .leaflet-popup-content-wrapper {
-  width: 600px;
-  max-height: 400px;
-  overflow-y:auto
+    width: 600px;
+    max-height: 400px;
+    overflow-y: auto;
+    overflow-wrap: anywhere;
 }
 
 .leaflet-popup-content {
-    width:auto !important;
+    width: auto !important;
 }
 
 a img {
     border: none;
+    max-height: 60px;
 }
 
 h4 {
@@ -34,12 +47,20 @@ h4 {
     margin-bottom: 5px;
 }
 
+.location, .period {
+    margin-bottom: 3px;
+}
+
 table {
     padding-bottom: 10px;
     border-spacing: 0;
     width: 100%
 }
 
+td {
+    white-space: pre-line;
+}
+
 .desktop tr td {
     padding-right: 5px;
     width: 75;
@@ -47,8 +68,8 @@ table {
 }
 
 .mobile tr td:first-child {
-  padding: 0;
-  padding-right: 10px;
+    padding: 0;
+    padding-right: 10px;
 }
 
 .mobile tr:nth-child(2n) {
@@ -60,28 +81,53 @@ table {
     font: 14px/16px Arial, Helvetica, sans-serif;
     background: white;
     background: rgba(255,255,255,0.0);
+    text-align: right;
 }
 
-#zeus {
-    padding-left: 10px;
+.author-icon {
+    display: block;
+    margin-left: 10px;
+}
+
+.share {
+    background-color: rgba(255, 255, 255, 0.7);
+    padding-right: 5px;
+    margin-left: 10px;
+}
+
+.share img {
+    vertical-align: middle;
+    margin-left: -10px;
+}
+
+.share a {
+    text-decoration: none;
+}
+.share a:hover {
+    text-decoration: underline;
+}
+a.img-and-text-link:hover {
+    text-decoration: none;
+}
+a.img-and-text-link:hover span {
+    text-decoration: underline;
 }
 
 .legend {
-  height: 52px;
-  width: 130px;
-  background-color: #fff;
-  box-shadow: 0 1px 5px rgba(0,0,0,0.65);
+    height: 77px;
+    width: 130px;
+    background-color: #fff;
+    box-shadow: 0 1px 5px rgba(0,0,0,0.65);
 }
 
 .holiday-legend {
-  height: 72px;
-  width: 145px;
-  background-color: #fff;
-  box-shadow: 0 1px 5px rgba(0,0,0,0.65);
+    width: 145px;
+    background-color: #fff;
+    box-shadow: 0 1px 5px rgba(0,0,0,0.65);
 }
 
 .legend .holiday {
-  display: none;
+    display: none;
 }
 
 .type {
@@ -100,6 +146,11 @@ table {
         width: 250px;
     }
 
+    .type {
+        display: none;
+    }
+
+
     .desktop {
         display: none;
     }
@@ -109,22 +160,8 @@ table {
         width: 213px;
     }
 
-    h3, .text {
-        max-width: 150px;
-    }
-}
-
-@media screen and (max-width: 800px) {
-    .info {
-        max-width: 90px;s
-    }
-
-    #schamper {
-        width: 90px;
-    }
-
-    #zeus {
-        width: 75px;
+    .location, .period {
+        margin-bottom: 8px;
     }
 }
 
@@ -133,3 +170,24 @@ table {
         max-height: 150px;
     }
 }
+
+@media screen and (min-width: 300px) {
+    .notice {
+        max-width: calc(100vw - 150px);
+    }
+}
+
+@media screen and (min-width: 800px) {
+    .author-icon {
+        display: inline;
+    }
+    .notice {
+        max-width: calc(100vw - 250px);
+    }
+}
+
+@media (min-width: 800px) and (min-height: 500px) {
+    .notice {
+        padding: 1em 1.5em;
+    }
+}

src/data.json

@@ -1,818 +0,0 @@
-[
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [ 3.724770, 51.045507 ]
-    },
-    "properties": {
-        "name":         "Faculteit Letteren en Wijsbegeerte, faculteitsbibliotheek, vleugels Magnel & Loveling",
-        "address":      "Rozier 44",
-        "capacity":     998,
-        "period": {     "start": "02/01/2019", "end": "31/01/2019" },
-        "hours": {
-            "monday":       "9u - 20u",
-            "tuesday":      "9u - 20u",
-            "wednesday":    "9u - 20u",
-            "thursday":     "9u - 20u",
-            "friday":       "9u - 17u",
-            "saturday":     false,
-            "sunday":       false
-        },
-        "extra":        "<a href='https://www.ugent.be/lw/nl/diensten/bibliotheek'> Bekijk de website </a>. Vleugel Magnel bevat 660 werkplekken. De vleugel Loveling bevat 338 werkplekken.",
-        "type":         "UGent"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [ 3.724090, 51.051192 ]
-    },
-    "properties": {
-        "name":         "Faculteit recht en criminologie",
-        "address":      "Universiteitstraat 4, verdieping 1",
-        "capacity":     235,
-        "period": {     "start": "02/01/2019", "end": "01/02/2019" },
-        "hours": {
-            "monday":       "8u30 - 19u",
-            "tuesday":      "8u30 - 19u",
-            "wednesday":    "8u30 - 19u",
-            "thursday":     "8u30 - 19u",
-            "friday":       "8u30 - 16u30",
-            "saturday":     false,
-            "sunday":       false
-        },
-        "extra":        "Toegankelijk voor iedereen. <a href=\"http://www.ugent.be/re/nl/diensten/bibliotheek\">Bekijk de website</a> <i>Gesloten op weekends.</i>" ,
-        "type":         "UGent"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [ 3.70700, 51.053446 ]
-    },
-    "properties": {
-        "name":         "Faculteit Bio-Ingenieurswetenschappen, Resto Agora. (gelijkvloers gebouw E)",
-        "address":      "Coupure 653",
-        "capacity":     400,
-        "period": {     "start": "03/01/2019", "end": "01/02/2019" },
-        "hours": {
-            "monday":       "14u - 19u",
-            "tuesday":      "14u - 19u",
-            "wednesday":    "14u - 19u",
-            "thursday":     "14u - 19u",
-            "friday":       "14u - 19u",
-            "saturday":     false,
-            "sunday":       false
-        },
-        "extra":        "Toegankelijk voor alle Gentse studenten. Ook bib toegankelijk. <a href=\"http://lib.ugent.be/en/libraries/ALLW\">Ga naar de website</a>. Gesloten tijdens weekends.",
-        "type":         "UGent"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type": "Point",
-        "coordinates": [3.7014217, 51.04866]
-    },
-    "properties": {
-        "name":         "Faculteit Psychologie en Pedagogische Wetenschappen",
-        "address":      "Henri Dunantlaan 2",
-        "capacity":     132,
-        "period":{      "start": "02/01/2019", "end": "28/01/2019"},
-        "hours": {
-            "monday":       "8u30 - 19u",
-            "tuesday":      "8u30 - 19u",
-            "wednesday":    "8u30 - 19u",
-            "thursday":     "8u30 - 19u",
-            "friday":       "8u30 - 15u",
-            "saturday":     false,
-            "sunday":       false
-        },
-        "extra":        "Gesloten tijdens het weekend.</br> Gesloten van 24/12 tot 01/01.</br> Op 02/01/2019 uitzonderlijk slechts open tot 12u.</br><a href='https://www.ugent.be/pp/nl/diensten/faculteitsbibliotheek'>https://www.ugent.be/pp/nl/diensten/faculteitsbibliotheek</a></br><a href='https://lib.ugent.be/nl/libraries/PPW'>https://lib.ugent.be/nl/libraries/PPW</a></br><a href='https://www.facebook.com/BibFPPW'>https://www.facebook.com/BibFPPW</a>",
-        "type":         "UGent"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [3.7245747, 51.0517789]
-    },
-    "properties": {
-        "name":         "Faculteit Politieke en Sociale Wetenschappen",
-        "address":      "Paddenhoek 3, 2de verdiep lokaal 007",
-        "capacity":     60,
-        "period": {     "start": "02/01/2019", "end": "28/01/2019" },
-        "hours": {
-            "monday":       "9u - 19u",
-            "tuesday":      "9u - 19u",
-            "wednesday":    "9u - 19u",
-            "thursday":     "9u - 19u",
-            "friday":       "9u - 19u",
-            "saturday":     false,
-            "sunday":       false
-        },
-        "extra":        "Enkel voor studenten van de UGent. Niet drinken en eten in het lokaal.</br><i>60 plaatsen waarvan 20 plaatsen met pc.</i> <a href='http://www.ugent.be/ps/nl/diensten/pc-knooppunt/pc-klas'>Bekijk de website </a>. Gesloten op 15 augustus.",
-        "type":         "UGent"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [3.72704, 51.04569]
-    },
-    "properties": {
-        "name":         "Studentenrestaurant De Brug",
-        "address":      "Sint-Pietersnieuwstraat 45",
-        "capacity":     700,
-        "period": {     "start": "02/01/2019", "end": "02/02/2019" },
-        "hours": {
-            "monday":       "8u - 21u30",
-            "tuesday":      "8u - 21u30",
-            "wednesday":    "8u - 21u30",
-            "thursday":     "8u - 21u30",
-            "friday":       "8u - 21u30",
-            "saturday":     false,
-            "sunday":       false
-        },
-        "extra":        "Gesloten op 12/01/2019. Toegankelijk voor alle Gentse studenten.</br> 2 aparte zaaltjes doorlopend beschikbaar (120 plaatsen).</br> Blokzones restaurant : 1e en 2e verdieping ",
-        "type":         "UGent"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [3.712859, 51.026039]
-    },
-    "properties": {
-        "name":         "Faculteit Wetenschappen, Resto S5",
-        "address":      "Krijgslaan 281 Gebouw S5",
-        "capacity":     200,
-        "period": {     "start": "02/01/2019", "end": "02/02/2019" },
-        "hours": {
-            "monday":       "15u - 22u",
-            "tuesday":      "15u - 22u",
-            "wednesday":    "15u - 22u",
-            "thursday":     "15u - 22u",
-            "friday":       "15u - 22u",
-            "saturday":     "8u30 - 22u",
-            "sunday":       "8u30 - 22u"
-        },
-        "extra":        "<strong>Tijdens weekend enkel na reservatie week op voorhand:</strong> iedere zondag om 19u30 op <a href=\"http://student.ugent.be/blok/\">deze website</a>. Tijdens de week enkel voor UGent studenten, tijdens het weekend voor alle studenten. Doorheen de week van 8u30 tot 15u open als resto.",
-        "type":         "UGent"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [3.727952, 51.044599]
-    },
-    "properties": {
-        "name":         "Blok@Therminal",
-        "address":      "Hoveniersberg 24",
-        "capacity":     300,
-        "period": {     "start": "18/12/2018", "end": "02/02/2019" },
-        "hours": {
-            "monday":       "8u30 - 24u",
-            "tuesday":      "8u30 - 24u",
-            "wednesday":    "8u30 - 24u",
-            "thursday":     "8u30 - 24u",
-            "friday":       "8u30 - 24u",
-            "saturday":     "8u30 - 24u",
-            "sunday":       "8u30 - 24u"
-        },
-        "extra":        "<strong>Enkel na registratie week op voorhand:</strong> iedere zondag om 19u op <a href=\"http://student.ugent.be/blok/\">deze website</a>. Gesloten op 25/12 en 01/01. Beperkte openingsuren op 24/12 en 31/12: 8u30 - 16u",
-        "type":         "UGent"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [3.728294, 51.039980]
-    },
-    "properties": {
-        "name":         "Studentenrestaurant Kantienberg",
-        "address":      "Stalhof 45",
-        "capacity":     300,
-        "period": {     "start": "26/12/2018", "end": "27/01/2019" },
-        "hours": {
-            "monday":       false,
-            "tuesday":      false,
-            "wednesday":    false,
-            "thursday":     false,
-            "friday":       false,
-            "saturday":     "8u30 - 22u",
-            "sunday":       "8u30 - 22u"
-        },
-        "extra":        "<strong>Enkel na registratie week op voorhand:</strong> iedere zondag om 20u op <a href=\"http://student.ugent.be/blok/\">deze website</a>. Enkel open tijdens de kerstvakantie en de weekends. Tijdens de week enkel UGent studenten, tijdens weekends ook andere Gentse studenten. Gesloten op 25/12 en 01/01, beperkte openingsuren op 31/12: 8u30 - 16u",
-        "type":         "UGent"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [3.703135, 51.031663]
-    },
-    "properties": {
-        "name":         "BYTES & BOOKS @ gebouw D",
-        "address":      "Openleercentrum campus Schoonmeersen, Vaerwyckweg 1",
-        "capacity":     444,
-        "period": {     "start": "07/01/2018", "end": "01/02/2019" },
-        "hours": {
-            "monday":       "8u - 21u45",
-            "tuesday":      "8u - 21u45",
-            "wednesday":    "8u - 21u45",
-            "thursday":     "8u - 21u45",
-            "friday":       "8u - 16u45",
-            "saturday":     false,
-            "sunday":       false
-        },
-        "extra":        "Tijdens de week toegankelijk voor alle Gentse studenten.</br><a href=\"https://www.facebook.com/ByBSchoonmeersen\">Bekijk hier de facebookpagina</a>. Tijdens de kerstvakantie open van 8u - 16u45 op 27/12, 28/12, 02/01, 04/01.",
-        "type":         "hogent"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [3.703725, 51.031663]
-    },
-    "properties": {
-        "name":         "Campus Schoonmeersen - Resto D",
-        "address":      "Resto D, Vaerwyckweg 1",
-        "capacity":     250,
-        "period": {     "start": "26/12/2018", "end": "27/01/2019" },
-        "hours": {
-            "monday":       false,
-            "tuesday":      false,
-            "wednesday":    false,
-            "thursday":     false,
-            "friday":       false,
-            "saturday":     "8u - 18u",
-            "sunday":       "8u - 18u"
-        },
-        "extra":        "Catering beschikbaar van 9 tot 17u. Tijdens het weekend enkel voor HoGent en UGent-studenten in bezit van campuskaart Schoonmeersen. Tijdens de kerstvakantie ook geopend op 26/12, 27/12, 28/12, 02/01, 03/01, 04/01",
-        "type":         "hogent"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [3.724287, 51.036624]
-    },
-    "properties": {
-        "name":         "BYTES & BOOKS LEDEGANCK",
-        "address":      "K.L. Ledeganckstraat 8",
-        "capacity":     110,
-        "period": {     "start": "07/01/2019", "end": "01/02/2019" },
-        "hours": {
-            "monday":       "8u15 - 18u",
-            "tuesday":      "8u15 - 18u",
-            "wednesday":    "8u15 - 18u",
-            "thursday":     "8u15 - 18u",
-            "friday":       "8u15 - 18u",
-            "saturday":     false,
-            "sunday":       false
-        },
-        "extra":        "Toegankelijk voor alle Gentse studenten.</br><a href=\"https://www.facebook.com/LeercentrumLerarenopleidingLedeganck\">Bekijk de website</a>",
-        "type":         "hogent"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [3.726827, 51.019702]
-    },
-    "properties": {
-        "name":         "BYTES & BOOKS VESALIUS",
-        "address":      "Keramiekstraat 80",
-        "capacity":     58,
-        "period": {     "start": "07/01/2019", "end": "01/02/2019" },
-        "hours": {
-            "monday":       "8u15 - 17u",
-            "tuesday":      "8u15 - 17u",
-            "wednesday":    "8u15 - 11u30<br/>12u15 - 16u",
-            "thursday":     "8u15 - 17u",
-            "friday":       "8u15 - 11u30<br/>12u15 - 16u",
-            "saturday":     false,
-            "sunday":       false
-        },
-        "extra":        "Toegankelijk voor alle Gentse studenten. <a href=\"https://www.facebook.com/BYBVesalius\">Website</a>",
-        "type":         "hogent"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [3.71691, 51.04393]
-    },
-    "properties": {
-        "name":         "Kunstenbibliotheek",
-        "address":      "Godshuizenlaan 2A (bij STAM)",
-        "capacity":     80,
-        "period": {     "start": "07/01/2019", "end": "01/02/2019" },
-        "hours": {
-            "monday":       "9u - 18u",
-            "tuesday":      "9u - 18u",
-            "wednesday":    "9u - 18u",
-            "thursday":     "9u - 22u",
-            "friday":       "9u - 16u",
-            "saturday":     false,
-            "sunday":       false
-        },
-        "extra":        "Toegankelijk voor alle Gentse studenten.</br><a href=\"https://www.facebook.com/kunstenbibliotheek\">Bekijk de website</a>",
-        "type":         "hogent"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [3.715416, 51.042241]
-    },
-    "properties": {
-        "name":         "BYTES & BOOKS MERCATOR",
-        "address":      "Henleykaai 84",
-        "capacity":     50,
-        "period": {     "start": "07/01/2019", "end": "01/02/2019" },
-        "hours": {
-            "monday":       "8u - 21u45",
-            "tuesday":      "8u - 21u45",
-            "wednesday":    "8u - 21u45",
-            "thursday":     "8u - 21u45",
-            "friday":       "8u - 16u45",
-            "saturday":     false,
-            "sunday":       false
-        },
-        "extra":        "Toegankelijk voor alle Gentse studenten.",
-        "type":         "hogent"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [3.786580, 51.014401]
-        },
-    "properties": {
-        "name":         "BYTES & BOOKS MELLE",
-        "address":      "Brusselsesteenweg 161",
-        "capacity":     50,
-        "period": {     "start": "07/01/2019", "end": "01/02/2019" },
-        "hours": {
-            "monday":       "8u - 12u30<br/>13u - 17u",
-            "tuesday":      "8u - 12u30<br/>13u - 17u",
-            "wednesday":    "8u - 12u30<br/>13u - 17u",
-            "thursday":     "8u - 12u30<br/>13u - 17u",
-            "friday":       "8u - 12u<br/>12u30 - 16u",
-            "saturday":     false,
-            "sunday":       false
-        },
-        "extra":        "Toegankelijk voor alle Gentse studenten.",
-        "type":         "hogent"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [3.728505, 51.040832]
-    },
-    "properties": {
-        "name":         "Mediatheek campus Kantienberg",
-        "address":      "Voetweg 66",
-        "capacity":     190,
-        "period": {     "start": "03/12/2018", "end": "30/01/2019" },
-        "hours": {
-            "monday":       "8u - 18u",
-            "tuesday":      "8u - 18u",
-            "wednesday":    "8u - 18u",
-            "thursday":     "8u - 18u",
-            "friday":       "8u - 16u",
-            "saturday":     false,
-            "sunday":       false
-        },
-        "extra":        "<strong>Gesloten van 22/12 - 02/01.</strong> Toegankelijk voor alle Gentse studenten.</br> Geen parkeermogelijkheid op het terrein.",
-        "type":         "Arteveldehogeschool"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [3.728505, 51.040832]
-    },
-    "properties": {
-        "name":         "De Kantiene",
-        "address":      "Voetweg 66",
-        "capacity":     400,
-        "period": {     "start": "07/01/2018", "end": "01/02/2019" },
-        "hours": {
-            "monday":       "8u - 21u",
-            "tuesday":      "8u - 21u",
-            "wednesday":    "8u - 21u",
-            "thursday":     "8u - 21u",
-            "friday":       "8u - 19u30",
-            "saturday":     false,
-            "sunday":       false
-        },
-        "extra":        "Gesloten op sommige dagen wegens examens, wordt ter plaatse aangekondigd. Toegankelijk voor alle Gentse studenten. Geen parkeermogelijkheden op het terrein. Stilte is niet gegarandeerd. Eters krijgen voorrang. Zoals overal houden jullie de ruimte proper.",
-        "type":         "Arteveldehogeschool"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [3.725, 51.041703]
-    },
-    "properties": {
-        "name":         "Mediatheek campus Kattenberg",
-        "address":      "Kattenberg 9",
-        "capacity":     40,
-        "period": {     "start": "03/12/2018", "end": "30/01/2019" },
-        "hours": {
-            "monday":       "8u - 18u",
-            "tuesday":      "8u - 18u",
-            "wednesday":    "8u - 18u",
-            "thursday":     "8u - 18u",
-            "friday":       "8u - 16u",
-            "saturday":     false,
-            "sunday":       false
-        },
-        "extra":        "Toegankelijk voor alle Gentse studenten.</br> Geen parkeermogelijkheid op het terrein.</br> Jullie zorgen zelf voor de stilte.</br> <i>Gesloten van 22/12 - 02/01.</i>",
-        "type":         "Arteveldehogeschool"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [3.724520, 51.041703]
-    },
-    "properties": {
-        "name":         "Ontspanningsruimtes campus Kattenberg",
-        "address":      "Kattenberg 9",
-        "capacity":     80,
-        "period": {     "start": "03/12/2018", "end": "01/02/2019" },
-        "hours": {
-            "monday":       "8u30 - 18u30",
-            "tuesday":      "8u30 - 18u30",
-            "wednesday":    "8u30 - 18u30",
-            "thursday":     "8u30 - 18u30",
-            "friday":       "8u30 - 18u30",
-            "saturday":     false,
-            "sunday":       false
-        },
-        "extra":        "Gesloten van 22/12 - 06/01. Toegankelijk voor studenten Arteveldehogescool.</br> Geen parkeermogelijkheid op het terrein.</br> Jullie zorgen zelf voor de stilte.",
-        "type":         "Arteveldehogeschool"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [3.668704, 51.087336]
-    },
-    "properties": {
-        "name":         "Mediatheek campus Mariakerke",
-        "address":      "Industrieweg 232, 9030 Mariakerke",
-        "capacity":     40,
-        "period": {     "start": "03/12/2018", "end": "01/02/2019" },
-        "hours": {
-            "monday":       "8u30 - 13u</br>13u30 - 17u",
-            "tuesday":      "8u30 - 13u</br>13u30 - 17u",
-            "wednesday":    "8u30 - 13u</br>13u30 - 17u",
-            "thursday":     "8u30 - 13u</br>13u30 - 17u",
-            "friday":       "8u30 - 13u</br>13u30 - 15u30",
-            "saturday":     false,
-            "sunday":       false
-        },
-        "extra":        "Toegankelijk voor studenten Arteveldehogeschool.</br> Geen parkeermogelijkheid op het terrein.</br> Jullie zorgen zelf voor de stilte.</br> <i>Gesloten van 22/12 - 06/01.</i>",
-        "type":         "Arteveldehogeschool"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [3.737994, 51.042897]
-    },
-    "properties": {
-        "name":         "Ontspanningsruimte campus BPS",
-        "address":      "Brusselsepoortstraat 93",
-        "capacity":     90,
-        "period": {     "start": "03/12/2018", "end": "01/02/2019" },
-        "hours": {
-            "monday":       "8u - 18u30",
-            "tuesday":      "8u - 18u30",
-            "wednesday":    "8u - 18u30",
-            "thursday":     "8u - 18u30",
-            "friday":       "8u - 18u30",
-            "saturday":     false,
-            "sunday":       false
-        },
-        "extra":        "Toegankelijk voor studenten Arteveldehogeschool.<br/> Jullie zorgen zelf voor de stilte.</br> <i>Gesloten van 22/12 - 06/01.</i>",
-        "type":         "Arteveldehogeschool"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [3.735499, 51.049960]
-    },
-    "properties": {
-        "name":         "Mediatheek campus Sint-Annaplein",
-        "address":      "Sint-Annaplein 31",
-        "capacity":     40,
-        "period": {     "start": "03/12/2018", "end": "01/02/2019" },
-        "hours": {
-            "monday":       "8u45 - 17u30",
-            "tuesday":      "8u45 - 17u30",
-            "wednesday":    "8u45 - 17u30",
-            "thursday":     "8u45 - 17u30",
-            "friday":       "8u45 - 16u",
-            "saturday":     false,
-            "sunday":       false
-        },
-        "extra":        "Toegankelijk voor studenten Arteveldehogeschool.<br/> Geen parkeermogelijkheid op het terrein.<br/>Jullie zorgen zelf voor de stilte.</br> <i>Gesloten van 22/12 - 06/01.</i>",
-        "type":         "Arteveldehogeschool"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [3.730262, 51.036897]
-    },
-    "properties": {
-        "name":         "Ontspanningsruimte campus Stropkaai",
-        "address":      "Stropkaai 14",
-        "capacity":     35,
-        "period": {     "start": "03/12/2018", "end": "01/02/2019" },
-        "hours": {
-            "monday":       "8u - 18u30",
-            "tuesday":      "8u - 18u30",
-            "wednesday":    "8u - 18u30",
-            "thursday":     "8u - 18u30",
-            "friday":       "8u - 18u30",
-            "saturday":     false,
-            "sunday":       false
-        },
-        "extra":        "Toegankelijk voor studenten Arteveldehogeschool.<br/><i>Gesloten van 22/12 - 06/01.</i>",
-        "type":         "Arteveldehogeschool"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [3.731638, 51.041816]
-    },
-    "properties": {
-        "name":         "Ontspanningsruimtes campus Leeuwstraat",
-        "address":      "Leeuwstraat 1",
-        "capacity":     90,
-        "period": {     "start": "03/12/2018", "end": "01/02/2019" },
-        "hours": {
-            "monday":       "8u - 18u30",
-            "tuesday":      "8u - 18u30",
-            "wednesday":    "8u - 18u30",
-            "thursday":     "8u - 18u30",
-            "friday":       "8u - 18u30",
-            "saturday":     false,
-            "sunday":       false
-        },
-        "extra":        "Toegankelijk voor studenten Arteveldehogeschool.<br/>Gen parkeermogelijkheden op het terrein.<br/>Jullie zorgen zelf voor de stilte.<br/><i>Gesloten van 22/12 - 06/01.</i>",
-        "type":         "Arteveldehogeschool"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [ 3.708502, 51.060961 ]
-    },
-    "properties": {
-        "name":         "Bibliotheek Odisee",
-        "address":      "Gebr. Desmetstraat 1",
-        "capacity":     80,
-        "period": {     "start": "07/01/2019", "end": "01/02/2019" },
-        "hours": {
-            "monday":       "8u30 - 21u",
-            "tuesday":      "8u30 - 21u",
-            "wednesday":    "8u30 - 21u",
-            "thursday":     "8u30 - 21u",
-            "friday":       "8u30 - 16u",
-            "saturday":     false,
-            "sunday":       false
-        },
-        "extra":        "Gesloten tijdens de kerstvakantie.",
-        "type":         "Odisee"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [ 3.728544, 51.051602 ]
-    },
-    "properties": {
-        "name":         "Bibliotheek",
-        "address":      "Reep 1",
-        "capacity":     25,
-        "period": {     "start": "07/01/2019", "end": "31/01/2019" },
-        "hours": {
-            "monday":       "10u - 18u",
-            "tuesday":      "10u - 18u",
-            "wednesday":    "10u - 18u",
-            "thursday":     "10u - 18u",
-            "friday":       "10u - 18u",
-            "saturday":     false,
-            "sunday":       false
-        },
-        "extra":        "Toegankelijk voor iedereen. <a href=\"http://www.vlerick.be/library\">Ga naar de website</a>.",
-        "type":         "vlerick"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [3.726730, 51.042146]
-    },
-    "properties": {
-        "name":         "Sint-Pietersabdij Monnikenzolder",
-        "address":      "Sint-Pietersplein 9",
-        "capacity":     60,
-        "period": {     "start": "19/12/2018", "end": "27/01/2019" },
-        "hours": {
-            "monday":       false,
-            "tuesday":      "10u - 18u",
-            "wednesday":    "10u - 18u",
-            "thursday":     "10u - 18u",
-            "friday":       "10u - 18u",
-            "saturday":     "10u - 18u",
-            "sunday":       "10u - 18u"
-        },
-        "extra":        "Gesloten op 24/12, 25/12, 31/12, 01/01 en op maandagen",
-        "type":         "Stad Gent"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [3.728892, 51.049027]
-    },
-    "properties": {
-        "name":         "De Krook",
-        "address":      "Miriam Makebaplein 1",
-        "capacity":     300,
-        "period": {     "start": false, "end": false },
-        "hours": {
-            "monday":       "10u - 19u",
-            "tuesday":      "10u - 19u",
-            "wednesday":    "10u - 19u",
-            "thursday":     "10u - 21u",
-            "friday":       "10u - 19u",
-            "saturday":     "10u - 19u",
-            "sunday":       false
-        },
-        "extra":        "200 plaatsen in de lees- en studiezaal op 3e verdiep.</br> 3x 20 stille werkplekken op 1e, 2e en 3e verdiep aan de kant Platteberg. </br><strong>Respecteer de voorbehouden plaatsen voor het raadplegen van de collectie. In de Kinder- en Jongerenbibliotheek (-1 en -2) zijn er geen studieplekken.</strong><i>Gesloten op 10/05/18 en 21/05/18</i>",
-        "type":         "Stad Gent"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [3.72626, 51.05603]
-    },
-    "properties": {
-        "name":         "Jeugddienst Gent",
-        "address":      "Kammerstraat 10",
-        "capacity":     50,
-        "period": {     "start": "22/12/2018", "end": "27/01/2019"},
-        "hours": {
-            "monday":       false,
-            "tuesday":      false,
-            "wednesday":    false,
-            "thursday":     false,
-            "friday":       false,
-            "saturday":     "9u - 18u",
-            "sunday":       "9u - 18u"
-        },
-        "extra":        "Enkel open tijdens de kerstvakantie en tijdens weekends.",
-        "type":         "Stad Gent"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [3.72234, 51.04744]
-    },
-    "properties": {
-        "name":         "Rijksarchief Gent",
-        "address":      "Bagattenstraat 43",
-        "capacity":     40,
-        "period": {     "start": "02/01/2018", "end": "31/01/2019"},
-        "hours": {
-            "monday":       false,
-            "tuesday":      "9u - 16u30",
-            "wednesday":    "9u - 16u30",
-            "thursday":     "9u - 16u30",
-            "friday":       "9u - 16u30",
-            "saturday":     false,
-            "sunday":       false
-        },
-        "extra":        "40 plaatsen voor studenten, geen Wi-Fi. <a href=\"http://arch.arch.be/\">Meer info</a>",
-        "type":         "Stad Gent"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [3.7192127, 51.0554202]
-    },
-    "properties": {
-        "name":         "Overkophuis",
-        "address":      "Drabstraat 18",
-        "capacity":     12,
-        "period": {     "start": "24/12/2018", "end": "25/01/2019" },
-        "hours": {
-            "monday":       "14u - 20u",
-            "tuesday":      "14u - 20u",
-            "wednesday":    "14u - 20u",
-            "thursday":     "14u - 20u",
-            "friday":       "14u - 20u",
-            "saturday":     false,
-            "sunday":       false
-        },
-        "extra":        "Gesloten in het weekend en op 25/12 en 01/01. Toegankelijk voor alle Gentse studenten. Breakroom met pooltafel, kickertafel, ...",
-        "type":         "Andere"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [3.727145, 51.056998]
-    },
-    "properties": {
-        "name":         "Bond Moyson Historische kelder",
-        "address":      "Vrijdagsmarkt 10",
-        "capacity":     20,
-        "period": {     "start": "27/12/2018", "end": "05/01/2019" },
-        "hours": {
-            "monday":       false,
-            "tuesday":      false,
-            "wednesday":    false,
-            "thursday":     "9u - 12u30 </br> 12u30 - 16u30",
-            "friday":       "9u - 12u30",
-            "saturday":     false,
-            "sunday":       false
-        },
-        "extra":        "Reserveren per sessie op <a href=\"http://www.supersaas.be/schedule/Bond_Moyson/samen_studeren_bij_bond_moyson\">deze website</a>.",
-        "type":         "Andere"
-    }
-},
-{
-    "type": "Feature",
-    "geometry": {
-        "type":         "Point",
-        "coordinates":  [3.73477, 51.04599]
-    },
-    "properties": {
-        "name":         "Sint-Michielshuis",
-        "address":      "Lange Violettestraat 277",
-        "capacity":     25,
-        "period": {     "start": "02/01/2019", "end": "31/01/2019" },
-        "hours": {
-            "monday":       "9u - 22u",
-            "tuesday":      "9u - 22u",
-            "wednesday":    "9u - 22u",
-            "thursday":     "9u - 22u",
-            "friday":       "9u - 22u",
-            "saturday":     false,
-            "sunday":       false
-        },
-        "extra":        "<strong>Reserveren verplicht</strong> via +32 474 06 43 85, of via <a href=\"https://docs.google.com/forms/d/e/1FAIpQLScIE-kH_JaGYy_Z2_ix8gcZ3LRDGSlCdlycxrqEl8FPx__Akg/viewform?usp=send_form\">deze website</a>. Toegankelijk voor alle Gentse studenten. ‘s Avonds steeds mogelijkheid op een warme maaltijd.",
-        "type":         "Andere"
-    }
-}
-]

src/img/Logo_WiFi.svg

@@ -0,0 +1,140 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="400"
+   height="175.49457"
+   id="svg2"
+   version="1.1"
+   inkscape:version="0.47 r22583"
+   sodipodi:docname="Logo BEI por Hernando.svg">
+  <defs
+     id="defs4">
+    <inkscape:perspective
+       sodipodi:type="inkscape:persp3d"
+       inkscape:vp_x="0 : 526.18109 : 1"
+       inkscape:vp_y="0 : 1000 : 0"
+       inkscape:vp_z="744.09448 : 526.18109 : 1"
+       inkscape:persp3d-origin="372.04724 : 350.78739 : 1"
+       id="perspective10" />
+    <inkscape:perspective
+       id="perspective9738"
+       inkscape:persp3d-origin="0.5 : 0.33333333 : 1"
+       inkscape:vp_z="1 : 0.5 : 1"
+       inkscape:vp_y="0 : 1000 : 0"
+       inkscape:vp_x="0 : 0.5 : 1"
+       sodipodi:type="inkscape:persp3d" />
+    <clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath3180">
+      <path
+         d="m 596.741,190.075 149.223,0 0,64.79 -149.223,0 0,-64.79"
+         id="path3182" />
+    </clipPath>
+    <inkscape:perspective
+       id="perspective12948"
+       inkscape:persp3d-origin="0.5 : 0.33333333 : 1"
+       inkscape:vp_z="1 : 0.5 : 1"
+       inkscape:vp_y="0 : 1000 : 0"
+       inkscape:vp_x="0 : 0.5 : 1"
+       sodipodi:type="inkscape:persp3d" />
+    <inkscape:perspective
+       id="perspective8202"
+       inkscape:persp3d-origin="0.5 : 0.33333333 : 1"
+       inkscape:vp_z="1 : 0.5 : 1"
+       inkscape:vp_y="0 : 1000 : 0"
+       inkscape:vp_x="0 : 0.5 : 1"
+       sodipodi:type="inkscape:persp3d" />
+  </defs>
+  <sodipodi:namedview
+     id="base"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageopacity="0.0"
+     inkscape:pageshadow="2"
+     inkscape:zoom="0.35"
+     inkscape:cx="71.569388"
+     inkscape:cy="-45.087756"
+     inkscape:document-units="px"
+     inkscape:current-layer="layer1"
+     showgrid="false"
+     inkscape:window-width="1280"
+     inkscape:window-height="968"
+     inkscape:window-x="-4"
+     inkscape:window-y="-4"
+     inkscape:window-maximized="1" />
+  <metadata
+     id="metadata7">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:label="Capa 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(-309.85919,-343.20843)">
+    <g
+       id="g2010"
+       transform="matrix(7.4723057,0,0,-7.4723057,642.24229,518.703)">
+      <path
+         d="m 0,0 c 4.977,0 9.049,4.077 9.049,9.049 l 0,5.389 c 0,4.973 -4.072,9.048 -9.049,9.048 l -35.433,0 c -4.973,0 -9.049,-4.075 -9.049,-9.048 l 0,-5.389 C -44.482,4.077 -40.406,0 -35.433,0"
+         style="fill:#231f20;fill-opacity:1;fill-rule:nonzero;stroke:none"
+         id="path2012" />
+    </g>
+    <g
+       id="g2014"
+       transform="matrix(7.4723057,0,0,-7.4723057,518.90441,451.07859)">
+      <path
+         d="m 0,0 0,5.389 c 0,4.072 3.314,7.32 7.32,7.32 l 9.187,0 c 4.007,0 7.253,-3.248 7.253,-7.32 L 23.76,0 c 0,-4.005 -3.246,-7.32 -7.253,-7.32 l -20.239,0 C -1.451,-5.664 0,-3.036 0,0"
+         style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"
+         id="path2016" />
+    </g>
+    <g
+       id="g2018"
+       transform="matrix(7.4723057,0,0,-7.4723057,430.12595,472.2626)">
+      <path
+         d="m 0,0 -3.043,0 -0.55,2.56 C -3.938,4.354 -4.285,6.565 -4.354,7.393 -4.423,6.565 -4.77,4.354 -5.179,2.56 L -5.734,0 l -2.968,0 -2.767,11.748 3.317,0 0.343,-2.004 c 0.276,-1.66 0.556,-3.659 0.695,-5.044 0.136,1.385 0.481,3.384 0.896,5.044 l 0.412,2.004 2.972,0 0.413,-2.004 c 0.348,-1.66 0.693,-3.659 0.833,-5.044 0.136,1.385 0.482,3.384 0.757,5.044 l 0.278,2.004 3.313,0"
+         style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"
+         id="path2020" />
+    </g>
+    <g
+       id="g2022"
+       transform="matrix(7.4723057,0,0,-7.4723057,472.9572,401.52225)">
+      <path
+         d="m 0,0 c -0.968,0 -1.727,0.553 -1.727,1.451 0,0.899 0.759,1.45 1.727,1.45 1.036,0 1.796,-0.551 1.796,-1.45 C 1.796,0.553 1.036,0 0,0 m -1.521,-0.968 3.0401,0 0,-8.4984 -3.0401,0 0,8.4984 z"
+         style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"
+         id="path2024" />
+    </g>
+    <g
+       id="g2026"
+       transform="matrix(7.4723057,0,0,-7.4723057,574.10981,405.16126)">
+      <path
+         d="m 0,0 0,-2.618 6.22,0 0,-2.767 -6.22,0 0,-3.593 -3.247,0 0,11.748 10.156,0 0,-2.77"
+         style="fill:#231f20;fill-opacity:1;fill-rule:nonzero;stroke:none"
+         id="path2028" />
+    </g>
+    <g
+       id="g2030"
+       transform="matrix(7.4723057,0,0,-7.4723057,651.02973,401.52225)">
+      <path
+         d="m 0,0 c -0.97,0 -1.727,0.553 -1.727,1.451 0,0.899 0.757,1.45 1.727,1.45 1.035,0 1.797,-0.551 1.797,-1.45 C 1.797,0.553 1.035,0 0,0 m -1.521,-0.968 3.0371,0 0,-8.4984 -3.0371,0 0,8.4984 z"
+         style="fill:#231f20;fill-opacity:1;fill-rule:nonzero;stroke:none"
+         id="path2032" />
+    </g>
+  </g>
+</svg>

src/img/Wheelchair_symbol.svg

@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 12.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 51448)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" [
+	<!ENTITY ns_svg "http://www.w3.org/2000/svg">
+	<!ENTITY ns_xlink "http://www.w3.org/1999/xlink">
+]>
+<svg  version="1.1" id="Layer_1" xmlns="&ns_svg;" xmlns:xlink="&ns_xlink;" width="483.2226563" height="551.4306641"
+	 viewBox="0 0 483.2226563 551.4306641" overflow="visible" enable-background="new 0 0 483.2226563 551.4306641"
+	 xml:space="preserve">
+<path fill-rule="evenodd" clip-rule="evenodd" fill="#000000" d="M161.9882813,98.1240234
+	c24.9628906-2.3046875,44.3574219-23.8110352,44.3574219-48.9658203C206.3457031,22.0830078,184.2626953,0,157.1875,0
+	s-49.1572266,22.0830078-49.1572266,49.1582031c0,8.2568359,2.3037109,16.7055664,6.1445313,23.8105469l17.515625,246.4667969
+	l180.3964844,0.0488281l73.9912109,173.3652344l97.1445313-38.0976563l-15.0429688-35.8203125l-54.3662109,19.625
+	l-71.5908203-165.2802734l-167.7294922,1.1269531l-2.3027344-31.2128906l121.4228516,0.0483398v-46.1831055l-126.0546875-0.0493164
+	L161.9882813,98.1240234z"/>
+<path fill-rule="evenodd" clip-rule="evenodd" fill="#000000" d="M343.4199219,451.5908203
+	c-30.4472656,60.1875-94.1748047,99.8398438-162.1503906,99.8398438C81.4296875,551.4306641,0,470.0009766,0,370.1611328
+	c0-70.1005859,42.4853516-135.2436523,105.8818359-164.1210938l4.1025391,53.5375977
+	c-37.4970703,23.628418-60.6123047,66.262207-60.6123047,110.9506836c0,72.4267578,59.0712891,131.4970703,131.4970703,131.4970703
+	c66.2617188,0,122.7646484-50.8515625,130.4697266-116.0869141L343.4199219,451.5908203z"/>
+</svg>

src/img/facebook.svg

@@ -0,0 +1,61 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="20"
+   height="20"
+   version="1.1"
+   id="svg8"
+   sodipodi:docname="facebook.svg"
+   inkscape:version="0.92.4 5da689c313, 2019-01-14">
+  <metadata
+     id="metadata14">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs12" />
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1043"
+     id="namedview10"
+     showgrid="false"
+     inkscape:zoom="22.627417"
+     inkscape:cx="9.2776978"
+     inkscape:cy="-0.76716337"
+     inkscape:window-x="0"
+     inkscape:window-y="37"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg8" />
+  <path
+     style="opacity:1;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:18.33872604;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;paint-order:stroke fill markers"
+     d="M 11.571808,19.876973 C 11.059776,19.957939 10.534798,20 10,20 9.470853,20 8.9513195,19.958841 8.4444262,19.879533 -16.009211,-2.1035465 38.618255,-2.3039341 11.571808,19.877009 Z"
+     id="path821"
+     inkscape:connector-curvature="0"
+     sodipodi:nodetypes="cscc" />
+  <path
+     d="M 20,10.001126 C 20,4.4780969 15.522407,0 10,0 4.4775931,0 0,4.4780969 0,10.001126 c 0,4.991368 3.6563075,9.129087 8.4376465,9.880155 V 12.892716 H 5.8978981 v -2.89159 H 8.4376465 V 7.7971424 c 0,-2.5061407 1.4934564,-3.8916303 3.7772645,-3.8916303 1.094081,0 2.238707,0.195555 2.238707,0.195555 v 2.4612498 h -1.26142 c -1.241735,0 -1.629862,0.7707181 -1.629862,1.5625655 v 1.8762246 h 2.773191 l -0.442965,2.891591 h -2.330281 v 6.988565 c 4.781339,-0.749661 8.437647,-4.887345 8.437647,-9.880336"
+     id="path4"
+     style="fill:#1877f2;fill-opacity:1;stroke-width:1.80274773"
+     inkscape:connector-curvature="0" />
+</svg>

src/index.html

@@ -1,148 +1,140 @@
 <!DOCTYPE html>
-<html lang="en">
+<html lang="nl">
 <head>
   <meta charset="utf-8">
-  <title>Bloklocaties in Gent</title>
+  <title>Bloklocaties in Vlaanderen</title>
   <meta name="apple-itunes-app" content="app-id=602640924">
   <meta name="google-play-app" content="app-id=be.ugent.zeus.hydra">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
 
   <meta property="og:site_name" content="Zeus WPI">
   <meta property="og:type" content="article">
-  <meta property="og:title" content="Bloklocaties in Gent">
-  <meta property="og:description" content="Samenhokken om te blokken? Er zijn maar liefst 4000 zitjes in Gent om dat te doen. Schamper en Zeus maakten een overzicht!">
+  <meta property="og:title" content="Bloklocaties in Vlaanderen">
+  <meta property="og:description" content="Heb je nood aan een plek om te blokken? Zeus en de Gentse Studentenraad maakten een overzicht van alle beschikbare bloklocaties op één kaart.">
   <meta property="og:url" content="https://blok.ugent.be">
-  <meta property="og:image" content="https://blok.ugent.be/img/share.jpg">
+  <meta property="og:image" content="https://blok.ugent.be/img/share_square.png">
 
   <meta name="twitter:card" content="summary">
   <meta name="twitter:url" content="//blok.ugent.be">
-  <meta name="twitter:title" content="Bloklocaties in Gent">
-  <meta name="twitter:description" content="Samenhokken om te blokken? Er zijn maar liefst 4000 zitjes in Gent om dat te doen. Schamper en Zeus maakten een overzicht!">
-  <meta name="twitter:image" content="https://blok.ugent.be/img/share.jpg">
+  <meta name="twitter:title" content="Bloklocaties in Vlaanderen">
+  <meta name="twitter:description" content="Heb je nood aan een plek om te blokken? Zeus en de Gentse Studentenraad maakten een overzicht van alle beschikbare bloklocaties op één kaart.">
+  <meta name="twitter:image" content="https://blok.ugent.be/img/share_square.png">
 
-  <link rel="stylesheet" href="css/leaflet.css" />
-  <link rel="stylesheet" href="css/map.css" />
+  <link rel="stylesheet" href="css/leaflet-1.0.0.css">
+  <link rel="stylesheet" href="css/map.css">
 
-  <script type="text/javascript" src="js/leaflet.js"></script>
-  <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
-  <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/2.0.0/handlebars.min.js"></script>
+  <script type="text/javascript" src="js/leaflet-1.0.0.js"></script>
+  <script type="text/javascript" src="js/jquery-1.11.0.js"></script>
+  <script type="text/javascript" src="js/handlebars-2.0.0.js"></script>
   <script type="text/javascript" src="js/map.js"></script>
 </head>
 <body>
   <div id="map"></div>
+
   <script id="popup-template" type="text/x-handlebars-template">
     <div id="resto-popup">
       <h3>{{name}} ({{capacity}} pl.)</h3>
+      {{#if wheelchair}}<img src="img/Wheelchair_symbol.svg" class="wheelchair" style="width:30px;height:30px;">{{/if}}
+      {{#if wifi}}<img src="img/Logo_WiFi.svg" class="wifi" style="width:40px;height:20px;">{{/if}}
       <img src="img/{{type}}.png" class="type">
-      <div class="text">Locatie: {{address}}<br />
-        {{#if period.start}}
-      Van {{period.start}} tot {{period.end}}
+      <div class="location">Locatie: {{address}}</div>
+      <div class="period">{{#if period.start}}
+          Periode: {{date period.start}} tot {{date period.end}}
         {{else}}
-        Open gedurende het hele jaar.
+          Open gedurende het hele jaar.
         {{/if}}
       </div>
       <h4>Openingsuren</h4>
       <table class="desktop">
-      <tr>
-      <td>Maandag</td>
-        <td>Dinsdag</td>
-        <td>Woensdag</td>
-        <td>Donderdag</td>
-        <td>Vrijdag</td>
-        <td>Zaterdag</td>
-        <td>Zondag</td>
-      </tr>
-      <tr>
-        <td>{{#if hours.monday}}{{{hours.monday}}}{{else}}Gesloten{{/if}}</td>
-        <td>{{#if hours.tuesday}}{{{hours.tuesday}}}{{else}}Gesloten{{/if}}</td>
-        <td>{{#if hours.wednesday}}{{{hours.wednesday}}}{{else}}Gesloten{{/if}}</td>
-        <td>{{#if hours.thursday}}{{{hours.thursday}}}{{else}}Gesloten{{/if}}</td>
-        <td>{{#if hours.friday}}{{{hours.friday}}}{{else}}Gesloten{{/if}}</td>
-        <td>{{#if hours.saturday}}{{{hours.saturday}}}{{else}}Gesloten{{/if}}</td>
-        <td>{{#if hours.sunday}}{{{hours.sunday}}}{{else}}Gesloten{{/if}}</td>
-      </tr>
+        <tr>
+          <td>Maandag</td>
+          <td>Dinsdag</td>
+          <td>Woensdag</td>
+          <td>Donderdag</td>
+          <td>Vrijdag</td>
+          <td>Zaterdag</td>
+          <td>Zondag</td>
+        </tr><tr>
+          <td>{{#if hours.monday}}{{hours.monday}}{{else}}Gesloten{{/if}}</td>
+          <td>{{#if hours.tuesday}}{{hours.tuesday}}{{else}}Gesloten{{/if}}</td>
+          <td>{{#if hours.wednesday}}{{hours.wednesday}}{{else}}Gesloten{{/if}}</td>
+          <td>{{#if hours.thursday}}{{hours.thursday}}{{else}}Gesloten{{/if}}</td>
+          <td>{{#if hours.friday}}{{hours.friday}}{{else}}Gesloten{{/if}}</td>
+          <td>{{#if hours.saturday}}{{hours.saturday}}{{else}}Gesloten{{/if}}</td>
+          <td>{{#if hours.sunday}}{{hours.sunday}}{{else}}Gesloten{{/if}}</td>
+        </tr>
       </table>
       <table class="mobile">
         <tr>
           <td>Maandag</td>
-          <td>{{#if hours.monday}}{{{hours.monday}}}{{else}}Gesloten{{/if}}</td>
-        </tr>
-        <tr>
-            <td>Dinsdag</td>
-            <td>{{#if hours.tuesday}}{{{hours.tuesday}}}{{else}}Gesloten{{/if}}</td>
-        </tr>
-        <tr>
-            <td>Woensdag</td>
-            <td>{{#if hours.wednesday}}{{{hours.wednesday}}}{{else}}Gesloten{{/if}}</td>
-        </tr>
-        <tr>
-            <td>Donderdag</td>
-            <td>{{#if hours.thursday}}{{{hours.thursday}}}{{else}}Gesloten{{/if}}</td>
+          <td>{{#if hours.monday}}{{hours.monday}}{{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>
+          <td>Dinsdag</td>
+          <td>{{#if hours.tuesday}}{{hours.tuesday}}{{else}}Gesloten{{/if}}</td>
+        </tr><tr>
+          <td>Woensdag</td>
+          <td>{{#if hours.wednesday}}{{hours.wednesday}}{{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>
       </table>
       {{#if extra}}{{{extra}}}{{/if}}
     </div>
   </script>
+
   <script id="info-template" type="text/x-handlebars-template">
-    <a href="http://schamper.be/"><img id="schamper" src="img/schamper.png"></a>
-    <a href="http://zeus.ugent.be/"><img id="zeus" src="img/zeus.png"></a>
-  </script>
-  <script id="city-select-template" type="text/x-handlebars-template">
-    <ul>
-      <li><a onclick="moveToCoords(51.0475378, 3.7261835, 13)">Gent</a></li>
-      <li><a onclick="moveToCoords(50.8276123, 3.2672309, 15)">Kortrijk</a></li>
-    </ul>
+    <a href="https://zeus.gent/" class="author-icon"><img src="img/zeus.png" alt="Zeus WPI"></a>
+    <a href="https://gentsestudentenraad.be/" class="author-icon"><img src="img/GSR.png" alt="Gentse Studentenraad"></a>
   </script>
+
   <script id="share-template" type="text/x-handlebars-template">
-    <div class="fb-share-button" data-href="//blok.ugent.be" data-layout="button_count"></div>
-  </script>
-  <script id="legend-template" type="text/x-handlebars-template">
-    <div style="padding-top: 5px;">
-        <div style="width: 125px; height: 18px; padding-top: 5px; padding-left: 5px;">
-            <div style="height: 10px; width: 10px; background: rgb(209,39,35); margin-top: -1px; margin-left: 5px;"></div>
-            <span style="position: absolute; left: 25px; top: 5px;">Week en weekend</span>
-        </div>
-        <div style="width: 125px; height: 18px; padding-top: 5px; padding-left: 5px;">
-            <div style="height: 10px; width: 10px; background: rgb(36, 126, 202); margin-top: 1px; margin-left: 5px;"></div>
-            <span style="position: absolute; left: 25px; top: 30px;">Enkel week</span>
-        </div>
-        <div style="width: 140px; height: 18px; padding-top: 5px; padding-left: 5px;" class="holiday">
-            <div style="height: 10px; width: 10px; background: rgb(121, 230, 121); margin-top: 0px; margin-left: 5px;"></div>
-            <span style="position: absolute; left: 25px; top: 53px;">Tijdens kerstvakantie</span>
-        </div>
+    <div class="share">
+      <a href="https://www.facebook.com/Blokmap-Vlaanderen-105861927804347/" class="img-and-text-link"><img src="img/facebook.svg" alt=""> <span>Facebookpagina</span></a> |
+      <a href="https://forms.gle/H67tFQp54udB9cyR7">Locatie melden</a>
+    </div>
+  </script>
+
+  <script id="legend-template" type="text/x-handlebars-template">
+    <div style="padding-top: 5px;">
+      <div style="width: 125px; height: 18px; padding-top: 5px; padding-left: 5px;">
+        <div style="height: 10px; width: 10px; background: rgb(209,39,35); margin-top: -1px; margin-left: 5px;"></div>
+        <span style="position: absolute; left: 25px; top: 5px;">Week en weekend</span>
+      </div>
+      <div style="width: 125px; height: 18px; padding-top: 5px; padding-left: 5px;">
+        <div style="height: 10px; width: 10px; background: rgb(36, 126, 202); margin-top: 1px; margin-left: 5px;"></div>
+        <span style="position: absolute; left: 25px; top: 30px;">Enkel week</span>
+      </div>
+      <div style="width: 125px; height: 18px; padding-top: 5px; padding-left: 5px;">
+        <div style="height: 10px; width: 10px; background: rgb(120,120,120); margin-top: 1px; margin-left: 5px;"></div>
+        <span style="position: absolute; left: 25px; top: 52px;">Opent binnenkort</span>
+      </div>
+      <div style="width: 140px; height: 18px; padding-top: 5px; padding-left: 5px;" class="holiday">
+        <div style="height: 10px; width: 10px; background: rgb(121, 230, 121); margin-top: 0px; margin-left: 5px;"></div>
+        <span style="position: absolute; left: 25px; top: 75px;">Tijdens kerstvakantie</span>
+      </div>
     </div>
   </script>
 
-  <!-- Facebook SDK -->
-  <div id="fb-root"></div>
-  <script>(function(d, s, id) {
-      var js, fjs = d.getElementsByTagName(s)[0];
-      if (d.getElementById(id)) return;
-      js = d.createElement(s); js.id = id;
-      js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&appId=146947948791011&version=v2.0";
-      fjs.parentNode.insertBefore(js, fjs);
-  }(document, 'script', 'facebook-jssdk'));</script>
   <!-- Google Analytics SDK -->
   <script>
-  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+    (function(i,s,o,g,r,a,m){i["GoogleAnalyticsObject"]=r;i[r]=i[r]||function(){
       (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
       m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
-  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
-
-  ga('create', 'UA-25444917-8', 'auto');
-  ga('send', 'pageview');
+    })(window,document,"script","//www.google-analytics.com/analytics.js","ga");
 
+    ga("create", "UA-25444917-8", "auto");
+    ga('set', 'anonymizeIp', true);
+    ga("send", "pageview");
   </script>
 </body>
 </html>

src/js/map.js

@@ -1,182 +1,186 @@
-var map;
 $(document).ready(function() {
-    /* change image path */
-    L.Icon.Default.imagePath = 'img';
+    Handlebars.registerHelper("date", function (ddmyyyy) {
+        return ddmyyyy.replace(/-/g, "/");
+    });
 
-    var popuptemplate = Handlebars.compile($('#popup-template').html());
+
+    L.Icon.Default.imagePath = "img";
+
+    var popuptemplate = Handlebars.compile($("#popup-template").html());
+
+    var BlueIcon = L.Icon.Default.extend({});
     var RedIcon = L.Icon.Default.extend({
         options: {
-            iconUrl: 'img/red-marker.png'
+            iconUrl: "img/red-marker.png"
         }
     });
     var ChristmasIcon = L.Icon.Default.extend({
         options: {
-            iconUrl: 'img/christmas-marker.png'
+            iconUrl: "img/christmas-marker.png"
         }
     });
-    var redIcon = new RedIcon();
-    var BlueIcon = L.Icon.Default.extend({});
+    var GreyIcon = L.Icon.Default.extend({
+        options: {
+            iconUrl: "img/grey-marker.png"
+        }
+    });
+
     var blueIcon = new BlueIcon();
+    var redIcon = new RedIcon();
     var christmasIcon = new ChristmasIcon();
-    var christmasHoliday = Date.now() < new Date("2016-01-04").getTime();
+    var greyIcon = new GreyIcon();
+
+    var now = new Date();
+    var christmasSeason =
+        now.getTime() > new Date(now.getFullYear() + "-12-20").getTime() ||
+        now.getTime() < new Date(now.getFullYear() + "-01-04").getTime();
 
     function onEachFeature(feature, layer) {
         if (feature.properties) {
             layer.bindPopup(popuptemplate(feature.properties), {
-              showOnMouseOver: true
+                showOnMouseOver: true
             });
         }
     }
 
     function pointToLayer(feature, latlng) {
-      var marker = new HoverMarker(latlng, { icon: redIcon, riseOnHover: true});
-      if (feature.properties) {
-        if (feature.properties.holidays && christmasHoliday) {
-          var marker = new HoverMarker(latlng, { icon: christmasIcon, riseOnHover: true});
+        var icon = redIcon;
+        var iconDescription = "red";
+        if (feature.properties) {
+            var startingDateString =feature.properties.period.start;
+            var month = (parseInt(startingDateString.substring(3,5))-1);
+            var startingDate = new Date("20"+startingDateString.substring(6,8),month,startingDateString.substring(0,2));
+            if (Date.now()<startingDate) {
+                icon = greyIcon;
+                iconDescription = "grey";
+            } else if (feature.properties.holidays && christmasSeason) {
+                icon = christmasIcon;
+                iconDescription = "christmas";
+            } else if ((!feature.properties.hours.saturday && !feature.properties.hours.sunday)||(feature.properties.hours.saturday.toLowerCase()==="gesloten"&&feature.properties.hours.sunday.toLowerCase()==="gesloten")) {
+                icon = blueIcon;
+                iconDescription = "blue";
+            }
         }
-        if (!feature.properties.hours.saturday && !feature.properties.hours.sunday) {
-          var marker = new HoverMarker(latlng, { icon: blueIcon, riseOnHover: true});
-        }
-      }
-      return marker
+        return new HoverMarker(latlng, { icon: icon, riseOnHover: true});
     }
 
-    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}{r}.png', {
-      attribution: '© <a href="https://www.mapbox.com/map-feedback/">Mapbox</a> | © <a href="https://www.openstreetmap.org/copyright" target="_blank">OpenStreetMap</a>-contributors | Made with ❤ by <a href="https://zeus.ugent.be">Zeus WPI</a>',
-      detectRetina: true
+    var map = L.map("map", {zoomControl: false}).setView([50.702, 4.335], 9);
+    var osm = L.tileLayer("https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}", {
+        id: 'mapbox/streets-v11',
+        tileSize: 512,
+        zoomOffset: -1,
+        // account name = zeuswpi, details are in password manager
+        // token has a restriction to only work with our domains and localhost
+        accessToken: 'pk.eyJ1IjoiemV1c3dwaSIsImEiOiJja2QzMDZ1NmcwMjBtMnlxbXV2bXVpaXhuIn0.-ViXZUT9SqRI3IvB8209LQ',
+        attribution: '<span>Achtergrondkaart © <a href="https://www.openstreetmap.org/copyright" target="_blank">OpenStreetMap</a>-bijdragers </span>, <span lang="en">Imagery © <a href="https://www.mapbox.com/">Mapbox</a></span>. | <span lang="en">Made with ❤ by <a href="https://zeus.gent/">Zeus WPI</a></span> | <a href="https://zeus.gent/about/privacy/">Privacybeleid</a>',
+        maxZoom: 18
     }).addTo(map);
 
-    $.getJSON('data.json')
-     .done(function(data) {
-        var geojson = L.geoJson(data, {
-            onEachFeature: onEachFeature,
-            pointToLayer: pointToLayer
+    $.getJSON("https://blokdata.zeus.gent/data.json")
+        .done(function(data) {
+            var geojson = L.geoJson(data, {
+                onEachFeature: onEachFeature,
+                pointToLayer: pointToLayer
+            });
+            map.addLayer(geojson);
         });
-        map.addLayer(geojson);
-    });
 
     var SimpleControl = L.Control.extend({
-      initialize: function(templateId, divClass, options) {
-        this.template = Handlebars.compile($(templateId).html());
-        this.divClass = divClass;
-        L.Util.setOptions(this, options);
-      },
+        initialize: function(templateId, divClass, options) {
+            this.template = Handlebars.compile($(templateId).html());
+            this.divClass = divClass;
+            L.Util.setOptions(this, options);
+        },
 
-      onAdd: function (map) {
-        this._div = L.DomUtil.create('div', this.divClass);
-        this._div.innerHTML = this.template();
+        onAdd: function (map) {
+            this._div = L.DomUtil.create("div", this.divClass);
+            this._div.innerHTML = this.template();
 
-        return this._div;
-      }
+            return this._div;
+        }
     });
+
     // code copied from http://jsfiddle.net/sowelie/3JbNY/
     var HoverMarker = L.Marker.extend({
-      bindPopup: function(htmlContent, options) {
-	  			
-        if (options && options.showOnMouseOver) {
-          
-          // call the super method
-          L.Marker.prototype.bindPopup.apply(this, [htmlContent, options]);
-          
-          // unbind the click event
-          this.off("click", this.openPopup, this);
-          
-          // bind to mouse over
-          this.on("mouseover", function(e) {
-            
-            // get the element that the mouse hovered onto
-            var target = e.originalEvent.fromElement || e.originalEvent.relatedTarget;
-            var parent = this._getParent(target, "leaflet-popup");
-     
-            // check to see if the element is a popup, and if it is this marker's popup
-            if (parent == this._popup._container)
-              return true;
-            
-            // show the popup
-            this.openPopup();
-            
-          }, this);
-          
-          // and mouse out
-          this.on("mouseout", function(e) {
-            
-            // get the element that the mouse hovered onto
-            var target = e.originalEvent.toElement || e.originalEvent.relatedTarget;
-            
-            // check to see if the element is a popup
-            if (this._getParent(target, "leaflet-popup")) {
-     
-              L.DomEvent.on(this._popup._container, "mouseout", this._popupMouseOut, this);
-              return true;
-     
+        bindPopup: function(htmlContent, options) {
+
+            if (options && options.showOnMouseOver) {
+
+                L.Marker.prototype.bindPopup.apply(this, [htmlContent, options]);
+
+                this.off("click", this.openPopup, this);
+
+                this.on("mouseover", function(e) {
+
+                    // get the element that the mouse hovered onto
+                    var target = e.originalEvent.fromElement || e.originalEvent.relatedTarget;
+                    var ancestor = this._findAncestorWithClass(target, "leaflet-popup");
+
+                    // check to see if the element is a popup, and if it is this marker's popup
+                    if (ancestor && ancestor === this._popup._container)
+                        return true;
+
+                    this.openPopup();
+
+                }, this);
+
+                this.on("mouseout", function(e) {
+
+                    // get the element that the mouse hovered onto
+                    var target = e.originalEvent.toElement || e.originalEvent.relatedTarget;
+
+                    // check to see if the element is a popup
+                    if (this._findAncestorWithClass(target, "leaflet-popup")) {
+                        L.DomEvent.on(this._popup._container, "mouseout", this._popupMouseOut, this);
+                        return true;
+                    }
+
+                    this.closePopup();
+
+                }, this);
             }
-            
-            // hide the popup
+        },
+
+        _popupMouseOut: function(e) {
+            // detach the event
+            L.DomEvent.off(this._popup, "mouseout", this._popupMouseOut, this);
+
+            // get the element that the mouse hovered onto
+            var target = e.toElement || e.relatedTarget;
+
+            // check to see if the element is a popup
+            if (this._findAncestorWithClass(target, "leaflet-popup"))
+                return true;
+
+            // check to see if the marker was hovered back onto
+            if (target === this._icon)
+                return true;
+
             this.closePopup();
-            
-          }, this);
-          
+        },
+
+        _findAncestorWithClass: function(element, className) {
+            while (element) {
+                if (element.className && L.DomUtil.hasClass(element, className))
+                    return element;
+                element = element.parentNode;
+            }
+
+            return null;
         }
-        
-      },
-     
-      _popupMouseOut: function(e) {
-          
-        // detach the event
-        L.DomEvent.off(this._popup, "mouseout", this._popupMouseOut, this);
-     
-        // get the element that the mouse hovered onto
-        var target = e.toElement || e.relatedTarget;
-        
-        // check to see if the element is a popup
-        if (this._getParent(target, "leaflet-popup"))
-          return true;
-        
-        // check to see if the marker was hovered back onto
-        if (target == this._icon)
-          return true;
-        
-        // hide the popup
-        this.closePopup();
-        
-      },
-      
-      _getParent: function(element, className) {
-        
-        var parent = element.parentNode;
-        
-        while (parent != null) {
-          
-          if (parent.className && L.DomUtil.hasClass(parent, className))
-            return parent;
-          
-          parent = parent.parentNode;
-          
-        }
-        
-        return false;
-        
-      }
     });
 
-    var info = new SimpleControl('#info-template', 'info', {
-      position: 'topright'
+    var info = new SimpleControl("#info-template", "info", {
+        position: "topright"
     }).addTo(map);
 
-    var citySelect = new SimpleControl('#city-select-template', christmasHoliday ? "holiday-legend" : "legend", {
-      position: 'topleft'
+    var sharePane = new SimpleControl("#share-template", "info", {
+        position: "bottomleft"
     }).addTo(map);
 
-    var sharePane = new SimpleControl('#share-template', 'info', {
-      position: 'bottomleft'
+    var legend = new SimpleControl("#legend-template", christmasSeason ? "holiday-legend" : "legend", {
+        position: "bottomright"
     }).addTo(map);
 
-    var legend = new SimpleControl('#legend-template', christmasHoliday ? "holiday-legend" : "legend", {
-      position: 'bottomright'
-    }).addTo(map);
+    L.control.zoom().addTo(map);
 });
-
-function moveToCoords(x, y, scale) {
-  map.setView([x, y], scale);
-}