const colors = ["#8f8389","#e0a100","#00AFF5","#f25cd7","#5ce8f2"]
const transcolors = ["rgba(143, 131, 137,.25)", "rgba(224, 161, 0,0.25)", "rgba(0, 175, 245,0.25)"]
function init_map(map) {
const corner1 = [37.866964, -88.606680];
const corner2 = [35.735020, -86.061297];
const apiKey = "AAPKf3b50bc234014cb6a6a75347af8db0d2LIJ5XSQAYjsxBuxdmWT74QSa-BJBv0YtkdbUHv_MAqpXUIuTSH5VW5fD1wWgEsKi";
const basemapEnum = "ArcGIS:LightGray";
const polygons = [];
map.options.minZoom = 10;
map.options.maxZoom = 16;
map.createPane('pane0');
map.getPane('pane0').style.zIndex = 1100;
map.getPane('pane0').style.pointerEvents = 'none';
map.createPane('pane1');
map.getPane('pane1').style.zIndex = 1101;
map.getPane('pane1').style.pointerEvents = 'none';
map.createPane('pane2');
map.getPane('pane2').style.zIndex = 1102;
map.getPane('pane2').style.pointerEvents = 'none';
map.createPane('mkPane');
map.getPane('mkPane').style.zIndex = 1103;
map.getPane('mkPane').style.pointerEvents = 'none';
map.createPane('ttPane');
map.getPane('ttPane').style.zIndex = 1104;
map.getPane('ttPane').style.pointerEvents = 'none';
L.esri.Vector.vectorBasemapLayer(basemapEnum, {
apiKey: apiKey,
}).addTo(map);
fetch("https://goenergynet.com" + "/home/mapAreas/0")
.then(function(response) {
return response.json();
}).then(function(data0) {
renderGeoJson(data0, "pane0", map);
}).catch(error => { console.log(error)});
fetch("https://goenergynet.com" + "/home/mapAreas/1")
.then(function(response) {
return response.json();
}).then(function(data1) {
renderGeoJson(data1, "pane1", map);
}).catch(error => {console.log(error)});
fetch("https://goenergynet.com" + "/home/mapAreas/2")
.then(function(response) {
return response.json();
}).then(function(data2) {
renderGeoJson(data2, "pane2", map);
}).catch(error => {console.log(error)});
L.esri.Vector.vectorBasemapLayer(basemapEnum, {
apiKey: apiKey,
}).addTo(map);
// var search = L.esri.BootstrapGeocoder.search({
// inputTag: 'address-search',
// weapperStyle: 'uk-dropdown',
// placeholder: 'Address Search',
// useMapBounds: false,
// searchBounds: [corner1,corner2],
// providers: [L.esri.Geocoding.arcgisOnlineProvider({
// apikey: apiKey,
// nearby: {
// lat: 36.8656,
// lng: -87.4886
// },
// })]
// }).addTo(map);
// const results = L.layerGroup().addTo(map);
// search.on("results", async (data) => {
// results.clearLayers();
// for (let i = data.results.length - 1; i >= 0; i--) {
// const marker = L.marker(data.results[i].latlng);
// let point = turf.point([+data.results[i].latlng.lng, +data.results[i].latlng.lat]);
// let available = false;
// let address = data.text;
// location.href = 'https://goenergynet.com/home/map/location?addr='+ encodeURIComponent(address);
// }
// });
}
(function() {
var map = L.map('map',{
zoomControl: false,
}).setView([36.8656, -87.4886],10);
init_map(map);
})();
function initGoogleSearch(){
service = new google.maps.places.AutocompleteService();
geocoder = new google.maps.Geocoder();
searchBox = document.getElementById('full-search')
autocomplete(searchBox, service, geocoder);
}
function autocomplete(searchBoxInput, googleService, googleGeocoder) {
var currentRow;
searchBoxInput.addEventListener("input", function(e) { // This captures the text and processes it
var thisDiv, resultDiv, i, val = this.value;
closeAllLists();
if (!val) { return false;}
currentRow = -1;
thisDiv = document.createElement("DIV");
thisDiv.setAttribute("id", this.id + "autocomplete-list");
thisDiv.setAttribute("class", "autocomplete-items");
this.parentNode.appendChild(thisDiv);
let googleSearchResults = (( predictions, status ) => {
if(!predictions || status != "OK") {
console.log(status)
return false;
}
thisDiv.innerHTML = "";
predictions.forEach((prediction) => {
resultDiv = document.createElement("DIV");
resultDiv.innerHTML = "" + prediction.description.toUpperCase() + "";
resultDiv.innerHTML += "";
resultDiv.addEventListener("click", function(e) {
searchBoxInput.value = this.getElementsByTagName("input")[0].value;
googleGeocoder.geocode({
'address': this.getElementsByTagName("input")[0].value,
},
(results, status) => {
if(status != 'OK') {
console.log(status);
return false;
}
location.href = 'https://goenergynet.com/home/map/location/'+ encodeURIComponent(this.getElementsByTagName("input")[0].value);
}
)
closeAllLists();
});
thisDiv.appendChild(resultDiv);
});
});
let manualSearchResults = (( results, status ) => {
if(!results || status != "OK") {
console.log(status)
return false;
}
results.forEach((result) => {
resultDiv = document.createElement("DIV");
let formatted_address = result.street_number + " " + result.street_name + " " + result.unit + " " + result.city + " " + result.state_code
resultDiv.innerHTML = "" + formatted_address.toUpperCase() + "";
resultDiv.innerHTML += "";
resultDiv.addEventListener("click", function(e) {
searchBoxInput.value = this.getElementsByTagName("input")[0].value;
location.href = 'https://goenergynet.com/home/map/location/' + encodeURIComponent(this.getElementsByTagName("input")[0].value) + "/" + result.home_id;
closeAllLists();
});
thisDiv.appendChild(resultDiv);
});
});
if(val != "") {
let bounds = {
north: 37.217136526305765,
west: -88.09002853540657,
east: -86.6403668705755,
south: 36.63771407524913,
}
// fetch the manaul search results not from google
fetch("https://goenergynet.com" + "/home/searchAddress/" + val)
.then(function(response) {
return response.json();
}).then(function(data) {
if(data == false) {
googleService.getQueryPredictions({
input: val,
bounds: bounds
},
googleSearchResults);
} else {
manualSearchResults(data, "OK");
}
}).catch(error => {console.log(error)});
}
});
searchBoxInput.addEventListener("keydown", function(e) { // This captures arrows and enter
var resultsList = document.getElementById(this.id + "autocomplete-list");
if (resultsList) resultsList = resultsList.getElementsByTagName("div");
if (e.keyCode == 40) { //down
currentRow++;
highlightRow(resultsList);
} else if (e.keyCode == 38) { //up
currentRow--;
highlightRow(resultsList);
} else if (e.keyCode == 13) { //enter
e.preventDefault();
if (currentRow > -1) {
if (resultsList) resultsList[currentRow].click();
}
}
});
// These are autocomplete functions
function highlightRow(resultsList) {
if (!resultsList) return false;
removeActive(resultsList);
if (currentRow >= resultsList.length) currentRow = 0;
if (currentRow < 0) currentRow = (resultsList.length - 1);
resultsList[currentRow].classList.add("autocomplete-active");
}
function removeActive(resultsList) {
for (var i = 0; i < resultsList.length; i++) {
resultsList[i].classList.remove("autocomplete-active");
}
}
function closeAllLists(thislist) {
var resultsList = document.getElementsByClassName("autocomplete-items");
for (var i = 0; i < resultsList.length; i++) {
if (thislist != resultsList[i] && thislist != searchBoxInput) {
resultsList[i].parentNode.removeChild(resultsList[i]);
}
}
}
document.addEventListener("click", function (e) {
closeAllLists(e.target);
});
}
function renderGeoJson(data, pane, map) {
let geo = new L.GeoJSON(data, {
style: function(feature) {
return {
color: colors[feature.properties.ready],
weight: 2,
opacity: 1,
clickable: false
};
},
pane: pane
}).addTo(map);
function onMapClick(e) {
if(singletooltipopen) {
document.querySelectorAll('.tooltip-big').forEach(tooltipbig => { tooltipbig.style.display = "none" });
singletooltipopen = false;
}
}
map.on('click', onMapClick);
}
async function postDataAsJson({ url, data }) {
const formDataJsonString = JSON.stringify(data);
const fetchOptions = {
method: "POST",
headers: {
"Content-Type": "application/json",
Accept: "application/json",
},
body: formDataJsonString,
};
const response = await fetch(url, fetchOptions);
if (!response.ok) {
const errorMessage = await response.text();
throw new Error(errorMessage);
}
return response.json();
}