136 lines
4.1 KiB
JavaScript
136 lines
4.1 KiB
JavaScript
/**
|
|
* Load script or css files
|
|
* @param {*} paths the array of paths
|
|
* @param {*} callback callback function to get called after all items loaded
|
|
*/
|
|
function loadScripts(paths, callback) {
|
|
if (!Array.isArray(paths) || !paths.length) return callback && callback();
|
|
var loader = function (src, handler) {
|
|
var item, _src = src && src.toLowerCase();
|
|
|
|
if (_src.endsWith('.css')) {
|
|
item = this.document.createElement('link');
|
|
item.type = 'text/css';
|
|
item.href = src;
|
|
item.rel = 'stylesheet';
|
|
} else if (_src.includes('key') || _src.endsWith('.js')) {
|
|
item = document.createElement("script");
|
|
item.src = src;
|
|
item.defer = true;
|
|
item.async = true;
|
|
}
|
|
|
|
if (item) {
|
|
item.onload = item.onreadystatechange = function () {
|
|
item.onreadystatechange = item.onload = null;
|
|
handler();
|
|
}
|
|
var head = document.getElementsByTagName("head")[0];
|
|
(head || document.body).appendChild(item);
|
|
}
|
|
};
|
|
(function run() {
|
|
if (paths.length != 0) {
|
|
loader(paths.shift(), run);
|
|
} else {
|
|
callback && callback();
|
|
}
|
|
})();
|
|
}
|
|
|
|
function initMapLib(params, cb) {
|
|
// Skip download additional map lib if base background is Open Street Map
|
|
if (params.base && params.base == 'osm')
|
|
return cb && cb();
|
|
|
|
// Dynamically load GGmap or Esri-leaflet map tiles according to the user's premium level
|
|
// if not using OpenStreetMap => Load map library on premium level >=1 ? GGMap : Esri
|
|
loadScripts(+params.premium ? [
|
|
'https://maps.googleapis.com/maps/api/js?key=AIzaSyC-tHMYY66FidOuWn8u5byiLyNuBZJS58s',
|
|
'/assets/js/Leaflet.GoogleMutant.js'] : ['/public/js/esri-leaflet.js'],
|
|
cb);
|
|
}
|
|
|
|
function initMapBaseLayer(map, params) {
|
|
if (!map || !L) return;
|
|
|
|
var baseLayer, useGGMutant = false;
|
|
if (params.base && params.base.toLowerCase() == 'osm') {
|
|
baseLayer = L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
|
|
attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors',
|
|
maxZoom: 19, maxNativeZoom: 17, keepBuffer: this.keepBuf
|
|
});
|
|
} else {
|
|
if (+params.premium) {
|
|
baseLayer = L.gridLayer.googleMutant({
|
|
maxZoom: 19, maxNativeZoom: 18,
|
|
type: 'hybrid',
|
|
noAttr: true,
|
|
styles: makeGMapStyle()
|
|
});
|
|
useGGMutant = true;
|
|
} else {
|
|
baseLayer = L.esri.basemapLayer('Imagery');
|
|
}
|
|
}
|
|
var loadedFunc = function (e) {
|
|
setTimeout(() => window.loaded = true, 50);
|
|
};
|
|
if (baseLayer) {
|
|
// Mark as all tiles loaded; some delay to make sure all images drawn visually perfect
|
|
if (useGGMutant) baseLayer.on('spawned', loadedFunc);
|
|
else baseLayer.on('load', loadedFunc);
|
|
|
|
baseLayer.addTo(map);
|
|
} else loadedFunc();
|
|
}
|
|
|
|
function loadStyles(paths, callback) {
|
|
if (!Array.isArray(paths)) return callback && callback();
|
|
var loader = function (url, handler) {
|
|
var style = this.document.createElement('link');
|
|
style.type = 'text/css';
|
|
style.href = url;
|
|
style.rel = 'stylesheet';
|
|
|
|
style.onload = style.onreadystatechange = function () {
|
|
style.onreadystatechange = style.onload = null;
|
|
handler();
|
|
}
|
|
var head = document.getElementsByTagName("head")[0];
|
|
(head || document.body).appendChild(style);
|
|
};
|
|
(function run() {
|
|
if (paths.length != 0) {
|
|
loader(paths.shift(), run);
|
|
} else {
|
|
callback && callback();
|
|
}
|
|
})();
|
|
}
|
|
|
|
function makeGMapStyle(labels, streets) {
|
|
return [
|
|
{ elementType: 'labels', stylers: [{ visibility: (labels ? 'on' : 'off') }] },
|
|
{ featureType: 'road', stylers: [{ visibility: (streets ? 'on' : 'off') }] },
|
|
{ featureType: 'poi', stylers: [{ visibility: 'off' }] },
|
|
{ featureType: "transit", stylers: [{ visibility: "off" }] },
|
|
{ featureType: "transit.station.airport", stylers: [{ visibility: (streets ? 'on' : 'off') }] }
|
|
];
|
|
}
|
|
|
|
function toMeter(value, isUS) {
|
|
return isUS ? value * 0.3048 : value;
|
|
}
|
|
|
|
function toArea(value, isUS) {
|
|
var result = 0.0;
|
|
if (!value) return result;
|
|
result = isUS ? value / 4046.86 : value / 10000;
|
|
return result;
|
|
}
|
|
|
|
function getUnit(isUS) {
|
|
return isUS ? 'acre' : 'ha';
|
|
}
|