path: root/map.js

var map = null; //global map object

// base config
var attribOSM = '&copy; <a href="//openstreetmap.org">OpenStreetMap</a>-bidragydere, <a href="//creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>';
var OSMLayer = L.tileLayer('//{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { attribution: attribOSM } );
var Box = L.latLngBounds( [[54.5, 8.0],[57.8, 15.3]] );

// GeoJSON feature styling and grouping
function typecolor(type) {
    if (type == "center") { return ('darkgreen'); }
    else if (type == 'center-begin') { return ('green'); }
    else if (type == 'member') { return ('orange'); }
    else if (type == 'diploma') { return ('red'); }
    else if (type == 'diploma-aspiring') { return ('blue'); }
    else { return ('black'); };
};
function returnFeatureMarker(feature, latlng) {
    var hasPopup = (feature.properties.location && feature.properties.type);
    return L.circleMarker(latlng, {
        title: feature.properties.title,
        zIndexOffset: 1000*feature.properties.priority || 0,
        clickable: hasPopup,
        keyboard: hasPopup,
        color: typecolor(feature.properties.type)
    });
};
function addFeaturePopup(feature, layer) {
    if (feature.properties.location && feature.properties.title) {
        layer.bindPopup('<strong>'+feature.properties.title+'</strong><br>'+feature.properties.location);
    }
};
var center = L.geoJson([],{
    pointToLayer: returnFeatureMarker,
    onEachFeature: addFeaturePopup,
    filter: function(feature, layer) {
        return (feature.properties.type == "center");
    }
});
var center_begin = L.geoJson([],{
    pointToLayer: returnFeatureMarker,
    onEachFeature: addFeaturePopup,
    filter: function(feature, layer) {
        return (feature.properties.type == "center-begin");
    }
});
var member = L.geoJson([],{
    pointToLayer: returnFeatureMarker,
    onEachFeature: addFeaturePopup,
    filter: function(feature, layer) {
        return (feature.properties.type == "member");
    }
});
var diploma = L.geoJson([],{
    pointToLayer: returnFeatureMarker,
    onEachFeature: addFeaturePopup,
    filter: function(feature, layer) {
        return (feature.properties.type == "diploma");
    }
});
var diploma_aspiring = L.geoJson([],{
    pointToLayer: returnFeatureMarker,
    onEachFeature: addFeaturePopup,
    filter: function(feature, layer) {
        return (feature.properties.type == "diploma-aspiring");
    }
});
var unknown = L.geoJson([],{
    pointToLayer: returnFeatureMarker,
    onEachFeature: addFeaturePopup,
    filter: function(feature, layer) {
        return (feature.properties.type == null);
    }
});
var overlayMaps = {
    "LAND Centre": center,
    "LAND startere": center_begin,
    "Medlemmer": member,
    "Diplomholdere": diploma,
    "Diplomaspiranter": diploma_aspiring,
    "Øvrige": unknown
};
function overlayCallback(data) {
    center.addData(data).addTo(map);
    center_begin.addData(data).addTo(map);
    member.addData(data).addTo(map);
    diploma.addData(data).addTo(map);
    diploma_aspiring.addData(data).addTo(map);
    unknown.addData(data);
};

// position popup
function round(n,d) {
    return Math.round(Math.pow(10,d)*n)/Math.pow(10,d)
};
function lngLatString(latLng) {
    return round(latLng.lng,5) + ", " + round(latLng.lat,5)
};
var popup = L.popup();
function positionPopup(e) {
    popup
        .setLatLng(e.latlng)
        .setContent("Position (long, lat):<br>" + lngLatString(e.latlng))
        .openOn(map);
}

// http://mathiasbynens.be/notes/xhr-responsetype-json
var getJSON = function(url, successHandler, errorHandler) {
    var xhr = typeof XMLHttpRequest != 'undefined'
        ? new XMLHttpRequest()
        : new ActiveXObject('Microsoft.XMLHTTP');
    var supportsJSON = (function() {
        if (typeof XMLHttpRequest == 'undefined') {
            return false;
        }
        xhr.open('get', '/', true);
        try {
            // some browsers throw when setting `responseType` to an unsupported value
            xhr.responseType = 'json';
        } catch(error) {
            return false;
        }
        return 'response' in xhr && xhr.responseType == 'json';
    }());
    xhr.open('get', url, true);
    if (supportsJSON) {
        xhr.responseType = 'json';
    }
    xhr.onreadystatechange = function() {
        var status;
        var data;
        // http://xhr.spec.whatwg.org/#dom-xmlhttprequest-readystate
        if (xhr.readyState == 4) { // `DONE`
            status = xhr.status;
            if (status == 200) {
                successHandler && successHandler(
                    supportsJSON
                        ? xhr.response
                        : JSON.parse(xhr.responseText)
                );
            } else {
                errorHandler && errorHandler(status);
            }
        }
    };
    xhr.send();
};

// create base map when DOM is ready, and then add features and controls
function initMap() {
    map = L.map('content', { layers: [OSMLayer] });
    map.attributionControl.setPrefix(false);
    map.fitBounds(Box);

    // micro-polyfill - http://mathiasbynens.be/notes/document-head
    var head = document.head || document.getElementsByTagName('head')[0];

    // load all rel=points links in html header as GeoJSON
    var links = head.getElementsByTagName("link")
    for (i=0;i< links.length;i++) {
        if (links[i].rel == "points") {
            getJSON(links[i].href, function (data) {
                overlayCallback(data);
            });
        }
    };

    L.control.layers([],overlayMaps).addTo(map);
    L.control.scale({ imperial: false }).addTo(map);

    map.on('contextmenu', positionPopup);
};
yepnope([
    {
        test : window.JSON,
//      https://code.google.com/p/json-sans-eval/
//      (json2: less secure; json3: larger - unneeded features)
        nope : 'json-minified.js',
    }, {
        test: document.addEventListener,
        nope: 'EventListener.js',
        complete: function() {
            document.addEventListener("DOMContentLoaded", initMap, false)
        }
    }
]);