         detectRetina: true
     ))
 
+    @initBoundaries()
+    @initMarkers()
+
+  initBoundaries: ->
 
     svg = d3.select(@map.getPanes().overlayPane).append("svg")
     g = svg.append("g").attr("class", "leaflet-zoom-hide")
-
-    d3.json "data/primaries.json", (collection)=> 
-      smallIcon = L.icon(
-          iconUrl: 'images/small_icon.png',
-          iconRetinaUrl: 'images/small_icon@2x.png',
-          iconSize:     [20, 20], 
-          iconAnchor:   [10, 10], 
-          popupAnchor:  [0, -1] 
-      )
-
-      popupTemplate = require "templates/popup"
-
-      onEachFeature = (feature, layer)=>
-        properties = feature.properties
-        if properties
-          layer.bindPopup(popupTemplate(properties: properties))
-
-      pointToLayer = (feature, latlng)=>
-        marker = L.marker(latlng, {icon: smallIcon})
-        @markerDict[feature.properties.NAVN] = marker
-
-      L.geoJson(collection,
-        pointToLayer: pointToLayer
-        onEachFeature: onEachFeature
-        ).addTo(@map)
 
     d3.json "data/school_boundaries.topo.json", (collection)=> 
     

module.exports = class MapControl
	constructor: ->
    @markerDict = {}
    @map = L.map('map',
        scrollWheelZoom: false


      reset()


  initMarkers: ->
    d3.json "data/primaries.json", (collection)=> 
      smallIcon = L.icon(
          iconUrl: 'images/small_icon.png',
          iconRetinaUrl: 'images/small_icon@2x.png',
          iconSize:     [20, 20], 
          iconAnchor:   [10, 10], 
          popupAnchor:  [0, -1] 
      )

      popupTemplate = require "templates/popup"

      onEachFeature = (feature, layer)=>
        properties = feature.properties
        if properties
          layer.bindPopup(popupTemplate(properties: properties))

      pointToLayer = (feature, latlng)=>
        marker = L.marker(latlng, {icon: smallIcon})
        @markerDict[feature.properties.NAVN] = marker

      L.geoJson(collection,
        pointToLayer: pointToLayer
        onEachFeature: onEachFeature
        ).addTo(@map)

  focusOnSchoolName: (name)->
    $('html, body').animate({
      scrollTop: $("#map").offset().top
