Added default images. Dummy layer and dummy geolet added.

package.json

@@ -26,6 +26,7 @@
     "express": "^4.14.0",
     "express-session": "^1.14.0",
     "leaflet": "^0.7.7",
+    "leaflet.markercluster": "^0.5.0",
     "lodash": "^4.13.1",
     "marko": "^3.7.2",
     "mongoose": "^4.5.4",

src/app.js

@@ -2,22 +2,43 @@
 
 const $ = require('dollr/dollr').$;
 const L = require('leaflet');
+require('leaflet.markercluster');
 
-L.Icon.Default.imagePath = 'node_modules/leaflet/dist/images/';
+L.Icon.Default.imagePath = './img';
 
 const Map = L.map('map');
 
 navigator.geolocation.getCurrentPosition((position) => {
   console.log();
-  Map.setView([position.coords.latitude, position.coords.longitude], 11);
+  const InitialPosition = [position.coords.latitude, position.coords.longitude];
+  Map.setView(InitialPosition, 11);
+  makeDummyLayer(InitialPosition);
 });
 
+//Layers
 L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
   attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://mapbox.com">Mapbox</a>',
   maxZoom: 18
 }).addTo(Map);
 
 
+function makeDummyLayer(markerPos) { //
+  //All layers will have to be initialized like this, dummy layer called Markers
+  const dummyLayer = L.markerClusterGroup({
+    spiderfyOnMaxZoom: false,
+    showCoverageOnHover: false,
+    zoomToBoundsOnClick: false,
+    removeOutsideVisibleBounds: true,
+    maxClusterRadius: 0 //Essentially disables clustering, we just want performance gains from this plugin
+  }).addTo(Map);
+
+  //Add a dummy geolet to the dummy layer
+  const dummyMarker = L.marker(markerPos).addTo(Map);
+  dummyMarker.bindPopup("Hejhej! <a href='https://www.youtube.com/watch?v=dQw4w9WgXcQ'>HTML fungerar i popupen. Template här?</a>.").openPopup();
+
+  return [dummyLayer, dummyMarker];
+}
+
 $(function () {
   $('button').addEventListener('click', function () {
     console.log('click');