Ruteador-NonUI/Files/map.js

const CONVERT_TO_RADIAN_CONST = 0.0174533;

function loadScript() {
    var script = document.createElement("script");
    script.type = "text/javascript";
    script.src = "https://maps.googleapis.com/maps/api/js?key=" + config["apiKey"] + "&callback=initMap&libraries=places&v=weekly";
    script.defer = true;
    document.body.appendChild(script);
}

class Waypoint{
    constructor(name, location) {
        this.name = name;
        this.lat = location.lat();
        this.lon = location.lng();
    }
}

function initMap() {
    const map = new google.maps.Map(document.getElementById("map"), {
        center: { lat: 40.749933, lng: -73.98633 },
        zoom: 13,
        mapTypeControl: false,
    });
    const card = document.getElementById("pac-card");
    const input = document.getElementById("pac-input");
    const biasInputElement = document.getElementById("use-location-bias");
    const strictBoundsInputElement = document.getElementById("use-strict-bounds");
    const options = {
        fields: ["formatted_address", "geometry", "name"],
        strictBounds: false,
    };

    // let waypoints = [];
    // let waypoints = [{"name":"Lago Chalco 47, Anáhuac I Secc, Miguel Hidalgo, 11320 Ciudad de México, CDMX, Mexico","lat":0.33943361448716003,"lon":-1.73094628692019},{"name":"C. Lago Chapala 47, Anáhuac I Secc., Anáhuac I Secc, Miguel Hidalgo, 11320 Ciudad de México, CDMX, Mexico","lat":0.33939502873152005,"lon":-1.73093370832688},{"name":"Lago Texcoco, Anáhuac I Secc, Ciudad de México, CDMX, Mexico","lat":0.33941341578307005,"lon":-1.73099749490239},{"name":"Lago Cuitzeo, Anáhuac I Secc., 11320 Ciudad de México, CDMX, Mexico","lat":0.33936825362399003,"lon":-1.73091535792726}];
    // let waypoints =  [{"name":"Lago Chalco 47, Anáhuac I Secc, Miguel Hidalgo, 11320 Ciudad de México, CDMX, Mexico","lat":0.33943361448716003,"lon":-1.73094628692019},{"name":"Lago Cuitzeo 47, Anáhuac I Secc., Anáhuac I Secc, Miguel Hidalgo, 11320 Ciudad de México, CDMX, Mexico","lat":0.33942536954824004,"lon":-1.73091028076229},{"name":"Lago Zirahuen, 11320 Ciudad de México, CDMX, Mexico","lat":0.33936570718752,"lon":-1.73089651708991},{"name":"Lago de Patzcuaro 47, Anáhuac I Secc., Anáhuac I Secc, Miguel Hidalgo, 11320 Ciudad de México, CDMX, Mexico","lat":0.33936884703619,"lon":-1.7308794180919003},{"name":"Lago Texcoco 47, Anáhuac I Secc, Miguel Hidalgo, 11320 Ciudad de México, CDMX, Mexico","lat":0.33943269993424,"lon":-1.7309953446558304},{"name":"Lago Xochimilco 47, Anáhuac I Secc, Miguel Hidalgo, 11320 Ciudad de México, CDMX, Mexico","lat":0.33943730935077,"lon":-1.73098643823684},{"name":"Laguna del Carmen 47, Anáhuac I Secc, Miguel Hidalgo, 11320 Ciudad de México, CDMX, Mexico","lat":0.33944389797152,"lon":-1.73097048592064},{"name":"Laguna Tamiahua 47, Anáhuac I Secc, Miguel Hidalgo, 11320 Ciudad de México, CDMX, Mexico","lat":0.33940567175386005,"lon":-1.73096375941882},{"name":"Laguna San Cristóbal 47, Anáhuac I Secc., Anáhuac I Secc, Miguel Hidalgo, 11320 Ciudad de México, CDMX, Mexico","lat":0.33937060807416003,"lon":-1.73095079336225},{"name":"Lago Viesca, Anáhuac I Secc, 11320 Ciudad de México, CDMX, Mexico","lat":0.33936519406050003,"lon":-1.7309738578982001},{"name":"Lago Tlahualilo 47, Anáhuac I Secc, Miguel Hidalgo, 11320 Ciudad de México, CDMX, Mexico","lat":0.33935459292608006,"lon":-1.7309583366785102},{"name":"Laguna de Términos, Anáhuac I Secc, Ciudad de México, CDMX, Mexico","lat":0.33934515767210005,"lon":-1.7309961736875799}];

    // let waypoints =    [{"name":"CEDIS","lon":-98.73952937,"lat":20.03334961},{"name":"CEDIS2","lon":-98.73952937,"lat":20.03334961},{"name":"114062","lon":-98.44958800,"lat":20.15207200},{"name":"114063","lon":-98.44478000,"lat":20.15266200},{"name":"114064","lon":-98.43221300,"lat":20.15774100},{"name":"114065","lon":-98.43966600,"lat":20.14535100},{"name":"114066","lon":-98.43899000,"lat":20.14397300},{"name":"114069","lon":-98.43652400,"lat":20.14219800},{"name":"114070","lon":-98.43183200,"lat":20.13570600},{"name":"114146","lon":-98.43132600,"lat":20.15803900},{"name":"114273","lon":-98.42170700,"lat":20.12253100},{"name":"114281","lon":-98.38493300,"lat":20.16163100},{"name":"115012","lon":-98.43156200,"lat":20.11126600},{"name":"115013","lon":-98.43105700,"lat":20.11014500},{"name":"115152","lon":-98.43225200,"lat":20.11085800},{"name":"115548","lon":-98.40112200,"lat":20.11897300},{"name":"355801","lon":-98.43722167,"lat":20.14291500},{"name":"355812","lon":-98.43856000,"lat":20.14605500},{"name":"355839","lon":-98.43425667,"lat":20.15194500},{"name":"355840","lon":-98.44034333,"lat":20.14676000},{"name":"355841","lon":-98.43548000,"lat":20.14006000},{"name":"355976","lon":-98.41779000,"lat":20.11532667},{"name":"356149","lon":-98.38653500,"lat":20.17235500},{"name":"356823","lon":-98.43020070,"lat":20.13345172},{"name":"356832","lon":-98.42951500,"lat":20.13281833},{"name":"ESE02002","lon":-98.414308,"lat":20.1186904},{"name":"ESE02004","lon":-98.4117485,"lat":20.1119873},{"name":"ESE02023","lon":-98.429918,"lat":20.1094994},{"name":"ESE02025","lon":-98.4319765,"lat":20.1105427},{"name":"ESE02027","lon":-98.4095106,"lat":20.11175},{"name":"ESE02028","lon":-98.416737,"lat":20.1068705}];
    // let waypoints = [{"name":"ESE05002","lon":-98.367397,"lat":20.2885251},{"name":"ESE05003","lon":-98.3674382,"lat":20.287592},{"name":"ESE05004","lon":-98.3674382,"lat":20.2879142},{"name":"ESE05005","lon":-98.3304542,"lat":20.2411999},{"name":"ESE05006","lon":-98.3674147,"lat":20.2631807},{"name":"ESE05007","lon":-98.348528,"lat":20.2820715},{"name":"ESE05008","lon":-98.3981838,"lat":20.1528387},{"name":"ESE05009","lon":-98.4158139,"lat":20.1541421},{"name":"ESE05010","lon":-98.410603,"lat":20.1551811},{"name":"ESE05011","lon":-98.4105995,"lat":20.1582812},{"name":"ESE05012","lon":-98.3674102,"lat":20.160304},{"name":"ESE05013","lon":-98.2018217,"lat":20.157312},{"name":"ESE05014","lon":-98.3986541,"lat":20.1600943},{"name":"ESE05015","lon":-98.3717737,"lat":20.0960621},{"name":"ESE05016","lon":-98.3733305,"lat":20.0934303},{"name":"ESE05017","lon":-98.354654,"lat":20.0976982},{"name":"ESE05018","lon":-98.3543659,"lat":20.097339},{"name":"ESE05019","lon":-98.3578046,"lat":20.0983058},{"name":"ESE05020","lon":-98.3597017,"lat":20.1002531},{"name":"ESE05021","lon":-98.359305,"lat":20.1076649},{"name":"ESE05022","lon":-98.367437,"lat":20.0989306},{"name":"TSE0555000","lon":-98.3683624,"lat":20.097075},{"name":"115683","lon":-98.3744864,"lat":20.0959816},{"name":"115685","lon":-98.3746171,"lat":20.0937065},{"name":"115686","lon":-98.3717499,"lat":20.0904887},{"name":"115687","lon":-98.4171454,"lat":20.0950241},{"name":"115688","lon":-98.4171373,"lat":20.0951271},{"name":"115690","lon":-98.4171953,"lat":20.0969398},{"name":"115693","lon":-98.3729919,"lat":20.1005734},{"name":"115694","lon":-98.3732723,"lat":20.0958825},{"name":"115695","lon":-98.4171635,"lat":20.0934635},{"name":"115696","lon":-98.4171583,"lat":20.1079494},{"name":"115697","lon":-98.35414,"lat":20.106525},{"name":"115699","lon":-98.355117,"lat":20.1066587},{"name":"115701","lon":-98.3575839,"lat":20.0997116},{"name":"115702","lon":-98.3575733,"lat":20.102067},{"name":"115703","lon":-98.3603581,"lat":20.0989735},{"name":"115707","lon":-98.3600443,"lat":20.1044867},{"name":"115712","lon":-98.3571027,"lat":20.102067},{"name":"115713","lon":-98.3602375,"lat":20.1011948},{"name":"115714","lon":-98.360066,"lat":20.1044785},{"name":"115715","lon":-98.3674397,"lat":20.1069279},{"name":"115717","lon":-98.3595572,"lat":20.1072504},{"name":"115718","lon":-98.3568694,"lat":20.1071554},{"name":"115720","lon":-98.3470749,"lat":20.2869986},{"name":"115721","lon":-98.3580592,"lat":20.2664201},{"name":"115722","lon":-98.3674329,"lat":20.2875573},{"name":"115723","lon":-98.4171617,"lat":20.2870722},{"name":"115725","lon":-98.3473113,"lat":20.285622},{"name":"115726","lon":-98.3485247,"lat":20.2856734},{"name":"115728","lon":-98.4171617,"lat":20.2875307},{"name":"115734","lon":-98.3673448,"lat":20.2845417},{"name":"115740","lon":-98.5307409,"lat":20.0950772},{"name":"115741","lon":-98.5313826,"lat":20.0950772},{"name":"115742","lon":-98.5311545,"lat":20.0950977},{"name":"115743","lon":-98.3092364,"lat":20.0295646},{"name":"115744","lon":-98.2993573,"lat":19.9890079},{"name":"115745","lon":-98.3001282,"lat":20.0374151},{"name":"115746","lon":-98.2998736,"lat":20.0373747},{"name":"115747","lon":-98.3113997,"lat":20.0373747},{"name":"115748","lon":-98.3048551,"lat":20.0373969},{"name":"115749","lon":-98.3981877,"lat":20.1611756},{"name":"115750","lon":-98.3981638,"lat":20.1611726},{"name":"115751","lon":-98.2033956,"lat":20.1597869},{"name":"115752","lon":-98.3981603,"lat":20.1599041},{"name":"115753","lon":-98.3675814,"lat":20.1600466},{"name":"115754","lon":-98.3981804,"lat":20.1613062},{"name":"115755","lon":-98.3675814,"lat":20.157501},{"name":"115756","lon":-98.2037883,"lat":20.1579131},{"name":"115757","lon":-98.4018328,"lat":20.1582555},{"name":"115760","lon":-98.4017017,"lat":20.1586705},{"name":"115761","lon":-98.2037471,"lat":20.1600194},{"name":"115764","lon":-98.5316151,"lat":20.0950928},{"name":"115765","lon":-98.4731448,"lat":20.0950862},{"name":"115767","lon":-98.4793191,"lat":20.0950853},{"name":"115768","lon":-98.4185455,"lat":20.1598054},{"name":"115769","lon":-98.4773212,"lat":20.0950898},{"name":"115770","lon":-98.4782102,"lat":20.0689478},{"name":"115771","lon":-98.5117017,"lat":20.0950945},{"name":"115772","lon":-98.5321791,"lat":20.0950872},{"name":"115773","lon":-98.5310337,"lat":20.0880191},{"name":"115774","lon":-98.4797164,"lat":20.0950921},{"name":"115775","lon":-98.4954019,"lat":20.0950948},{"name":"115776","lon":-98.4964301,"lat":20.095097},{"name":"115778","lon":-98.2974103,"lat":20.0382089},{"name":"115779","lon":-98.2974578,"lat":20.0382999},{"name":"115780","lon":-98.2997214,"lat":20.0191883},{"name":"115781","lon":-98.2965265,"lat":20.0374267},{"name":"115782","lon":-98.3096702,"lat":20.0382294},{"name":"115783","lon":-98.3020753,"lat":20.0281433},{"name":"115784","lon":-98.3097373,"lat":20.0378},{"name":"115786","lon":-98.3097373,"lat":20.03822},{"name":"115787","lon":-98.3024263,"lat":20.0382022},{"name":"115788","lon":-98.3024866,"lat":20.0381959},{"name":"115789","lon":-98.2998506,"lat":20.0373507},{"name":"115792","lon":-98.3098507,"lat":20.0382032},{"name":"115793","lon":-98.3019379,"lat":20.0373344},{"name":"115794","lon":-98.3098262,"lat":20.0382301},{"name":"115795","lon":-98.2994654,"lat":20.0191821},{"name":"115797","lon":-98.4171682,"lat":20.0969286},{"name":"115799","lon":-98.3748629,"lat":20.0952055},{"name":"115803","lon":-98.3739688,"lat":20.0950052},{"name":"115843","lon":-98.3087633,"lat":20.0373588},{"name":"115844","lon":-98.3098019,"lat":20.0382226},{"name":"115845","lon":-98.309962,"lat":20.0382169},{"name":"115847","lon":-98.3097854,"lat":20.0378621},{"name":"115849","lon":-98.3547467,"lat":20.1085665},{"name":"115850","lon":-98.3571229,"lat":20.106387},{"name":"115851","lon":-98.3569592,"lat":20.1102607},{"name":"115852","lon":-98.3011024,"lat":20.0382249},{"name":"115853","lon":-98.3545391,"lat":20.0765822},{"name":"115854","lon":-98.310657,"lat":20.0382241},{"name":"115860","lon":-98.4175739,"lat":20.1604813},{"name":"115864","lon":-98.5311341,"lat":20.0950882},{"name":"357004","lon":-98.3472617,"lat":20.2878516},{"name":"357005","lon":-98.3485252,"lat":20.2840998},{"name":"357006","lon":-98.3674328,"lat":20.2380154},{"name":"357007","lon":-98.3673986,"lat":20.2842333},{"name":"357089","lon":-98.4105797,"lat":20.1604658},{"name":"357090","lon":-98.4106149,"lat":20.1601633},{"name":"357091","lon":-98.4105988,"lat":20.1604658},{"name":"357092","lon":-98.4015936,"lat":20.1598066},{"name":"357093","lon":-98.4171777,"lat":20.1600988},{"name":"357094","lon":-98.4171707,"lat":20.1586434},{"name":"357195","lon":-98.5316393,"lat":20.0950869},{"name":"357196","lon":-98.4821405,"lat":20.0794694},{"name":"357305","lon":-98.3091585,"lat":20.038213},{"name":"357306","lon":-98.3091305,"lat":20.0382337},{"name":"357307","lon":-98.3674109,"lat":20.0883744},{"name":"357308","lon":-98.3674448,"lat":20.0883075},{"name":"357309","lon":-98.3047418,"lat":20.0372789},{"name":"357651","lon":-98.4171079,"lat":20.0942}];
    let waypoints = [{"pos":"0","lon":-98.367397,"name":"_ESE05002","lat":20.2885251},{"pos":"1","lon":-98.3673986,"name":"_357007","lat":20.2842333},{"pos":"2","lon":-98.4171617,"name":"_115728","lat":20.2875307},{"pos":"3","lon":-98.4171617,"name":"_115723","lat":20.2870722},{"pos":"4","lon":-98.2018217,"name":"_ESE05013","lat":20.157312},{"pos":"5","lon":-98.2037883,"name":"_115756","lat":20.1579131},{"pos":"6","lon":-98.2033956,"name":"_115751","lat":20.1597869},{"pos":"7","lon":-98.2037471,"name":"_115761","lat":20.1600194},{"pos":"8","lon":-98.3304542,"name":"_ESE05005","lat":20.2411999},{"pos":"9","lon":-98.3675814,"name":"_115755","lat":20.157501},{"pos":"10","lon":-98.3981804,"name":"_115754","lat":20.1613062},{"pos":"11","lon":-98.3981877,"name":"_115749","lat":20.1611756},{"pos":"12","lon":-98.3981638,"name":"_115750","lat":20.1611726},{"pos":"13","lon":-98.3981838,"name":"_ESE05008","lat":20.1528387},{"pos":"14","lon":-98.4105988,"name":"_357091","lat":20.1604658},{"pos":"15","lon":-98.4105797,"name":"_357089","lat":20.1604658},{"pos":"16","lon":-98.4106149,"name":"_357090","lat":20.1601633},{"pos":"17","lon":-98.4105995,"name":"_ESE05011","lat":20.1582812},{"pos":"18","lon":-98.4171635,"name":"_115695","lat":20.0934635},{"pos":"19","lon":-98.3746171,"name":"_115685","lat":20.0937065},{"pos":"20","lon":-98.3113997,"name":"_115747","lat":20.0373747},{"pos":"21","lon":-98.3097373,"name":"_115784","lat":20.0378},{"pos":"22","lon":-98.3097854,"name":"_115847","lat":20.0378621},{"pos":"23","lon":-98.3097373,"name":"_115786","lat":20.03822},{"pos":"24","lon":-98.3091305,"name":"_357306","lat":20.0382337},{"pos":"25","lon":-98.3092364,"name":"_115743","lat":20.0295646},{"pos":"26","lon":-98.3020753,"name":"_115783","lat":20.0281433},{"pos":"27","lon":-98.2993573,"name":"_115744","lat":19.9890079},{"pos":"28","lon":-98.2994654,"name":"_115795","lat":20.0191821},{"pos":"29","lon":-98.2997214,"name":"_115780","lat":20.0191883},{"pos":"30","lon":-98.2998736,"name":"_115746","lat":20.0373747},{"pos":"31","lon":-98.2965265,"name":"_115781","lat":20.0374267},{"pos":"32","lon":-98.2974103,"name":"_115778","lat":20.0382089},{"pos":"33","lon":-98.2974578,"name":"_115779","lat":20.0382999},{"pos":"34","lon":-98.2998506,"name":"_115789","lat":20.0373507},{"pos":"35","lon":-98.3001282,"name":"_115745","lat":20.0374151},{"pos":"36","lon":-98.3011024,"name":"_115852","lat":20.0382249},{"pos":"37","lon":-98.3019379,"name":"_115793","lat":20.0373344},{"pos":"38","lon":-98.3024263,"name":"_115787","lat":20.0382022},{"pos":"39","lon":-98.3024866,"name":"_115788","lat":20.0381959},{"pos":"40","lon":-98.3047418,"name":"_357309","lat":20.0372789},{"pos":"41","lon":-98.3048551,"name":"_115748","lat":20.0373969},{"pos":"42","lon":-98.3087633,"name":"_115843","lat":20.0373588},{"pos":"43","lon":-98.3091585,"name":"_357305","lat":20.038213},{"pos":"44","lon":-98.3096702,"name":"_115782","lat":20.0382294},{"pos":"45","lon":-98.3098262,"name":"_115794","lat":20.0382301},{"pos":"46","lon":-98.3098019,"name":"_115844","lat":20.0382226},{"pos":"47","lon":-98.3098507,"name":"_115792","lat":20.0382032},{"pos":"48","lon":-98.309962,"name":"_115845","lat":20.0382169},{"pos":"49","lon":-98.310657,"name":"_115854","lat":20.0382241},{"pos":"50","lon":-98.3545391,"name":"_115853","lat":20.0765822},{"pos":"51","lon":-98.3674448,"name":"_357308","lat":20.0883075},{"pos":"52","lon":-98.3674109,"name":"_357307","lat":20.0883744},{"pos":"53","lon":-98.3717499,"name":"_115686","lat":20.0904887},{"pos":"54","lon":-98.3733305,"name":"_ESE05016","lat":20.0934303},{"pos":"55","lon":-98.3729919,"name":"_115693","lat":20.1005734},{"pos":"56","lon":-98.3674397,"name":"_115715","lat":20.1069279},{"pos":"57","lon":-98.3597017,"name":"_ESE05020","lat":20.1002531},{"pos":"58","lon":-98.3603581,"name":"_115703","lat":20.0989735},{"pos":"59","lon":-98.3578046,"name":"_ESE05019","lat":20.0983058},{"pos":"60","lon":-98.3575839,"name":"_115701","lat":20.0997116},{"pos":"61","lon":-98.3571027,"name":"_115712","lat":20.102067},{"pos":"62","lon":-98.3575733,"name":"_115702","lat":20.102067},{"pos":"63","lon":-98.35414,"name":"_115697","lat":20.106525},{"pos":"64","lon":-98.3547467,"name":"_115849","lat":20.1085665},{"pos":"65","lon":-98.3569592,"name":"_115851","lat":20.1102607},{"pos":"66","lon":-98.3543659,"name":"_ESE05018","lat":20.097339},{"pos":"67","lon":-98.354654,"name":"_ESE05017","lat":20.0976982},{"pos":"68","lon":-98.355117,"name":"_115699","lat":20.1066587},{"pos":"69","lon":-98.3568694,"name":"_115718","lat":20.1071554},{"pos":"70","lon":-98.3571229,"name":"_115850","lat":20.106387},{"pos":"71","lon":-98.3602375,"name":"_115713","lat":20.1011948},{"pos":"72","lon":-98.359305,"name":"_ESE05021","lat":20.1076649},{"pos":"73","lon":-98.3595572,"name":"_115717","lat":20.1072504},{"pos":"74","lon":-98.3600443,"name":"_115707","lat":20.1044867},{"pos":"75","lon":-98.360066,"name":"_115714","lat":20.1044785},{"pos":"76","lon":-98.367437,"name":"_ESE05022","lat":20.0989306},{"pos":"77","lon":-98.3683624,"name":"_TSE0555000","lat":20.097075},{"pos":"78","lon":-98.3717737,"name":"_ESE05015","lat":20.0960621},{"pos":"79","lon":-98.3732723,"name":"_115694","lat":20.0958825},{"pos":"80","lon":-98.3739688,"name":"_115803","lat":20.0950052},{"pos":"81","lon":-98.3744864,"name":"_115683","lat":20.0959816},{"pos":"82","lon":-98.3748629,"name":"_115799","lat":20.0952055},{"pos":"83","lon":-98.4171079,"name":"_357651","lat":20.0942},{"pos":"84","lon":-98.4171454,"name":"_115687","lat":20.0950241},{"pos":"85","lon":-98.4171373,"name":"_115688","lat":20.0951271},{"pos":"86","lon":-98.4171682,"name":"_115797","lat":20.0969286},{"pos":"87","lon":-98.4782102,"name":"_115770","lat":20.0689478},{"pos":"88","lon":-98.4821405,"name":"_357196","lat":20.0794694},{"pos":"89","lon":-98.5321791,"name":"_115772","lat":20.0950872},{"pos":"90","lon":-98.5316393,"name":"_357195","lat":20.0950869},{"pos":"91","lon":-98.5316151,"name":"_115764","lat":20.0950928},{"pos":"92","lon":-98.5313826,"name":"_115741","lat":20.0950772},{"pos":"93","lon":-98.5311545,"name":"_115742","lat":20.0950977},{"pos":"94","lon":-98.5311341,"name":"_115864","lat":20.0950882},{"pos":"95","lon":-98.5307409,"name":"_115740","lat":20.0950772},{"pos":"96","lon":-98.5310337,"name":"_115773","lat":20.0880191},{"pos":"97","lon":-98.5117017,"name":"_115771","lat":20.0950945},{"pos":"98","lon":-98.4964301,"name":"_115776","lat":20.095097},{"pos":"99","lon":-98.4954019,"name":"_115775","lat":20.0950948},{"pos":"100","lon":-98.4797164,"name":"_115774","lat":20.0950921},{"pos":"101","lon":-98.4793191,"name":"_115767","lat":20.0950853},{"pos":"102","lon":-98.4773212,"name":"_115769","lat":20.0950898},{"pos":"103","lon":-98.4731448,"name":"_115765","lat":20.0950862},{"pos":"104","lon":-98.4171953,"name":"_115690","lat":20.0969398},{"pos":"105","lon":-98.4171583,"name":"_115696","lat":20.1079494},{"pos":"106","lon":-98.4158139,"name":"_ESE05009","lat":20.1541421},{"pos":"107","lon":-98.4185455,"name":"_115768","lat":20.1598054},{"pos":"108","lon":-98.4175739,"name":"_115860","lat":20.1604813},{"pos":"109","lon":-98.4171777,"name":"_357093","lat":20.1600988},{"pos":"110","lon":-98.4171707,"name":"_357094","lat":20.1586434},{"pos":"111","lon":-98.410603,"name":"_ESE05010","lat":20.1551811},{"pos":"112","lon":-98.4018328,"name":"_115757","lat":20.1582555},{"pos":"113","lon":-98.4017017,"name":"_115760","lat":20.1586705},{"pos":"114","lon":-98.4015936,"name":"_357092","lat":20.1598066},{"pos":"115","lon":-98.3986541,"name":"_ESE05014","lat":20.1600943},{"pos":"116","lon":-98.3981603,"name":"_115752","lat":20.1599041},{"pos":"117","lon":-98.3675814,"name":"_115753","lat":20.1600466},{"pos":"118","lon":-98.3674102,"name":"_ESE05012","lat":20.160304},{"pos":"119","lon":-98.3674328,"name":"_357006","lat":20.2380154},{"pos":"120","lon":-98.3674147,"name":"_ESE05006","lat":20.2631807},{"pos":"121","lon":-98.3580592,"name":"_115721","lat":20.2664201},{"pos":"122","lon":-98.348528,"name":"_ESE05007","lat":20.2820715},{"pos":"123","lon":-98.3472617,"name":"_357004","lat":20.2878516},{"pos":"124","lon":-98.3470749,"name":"_115720","lat":20.2869986},{"pos":"125","lon":-98.3473113,"name":"_115725","lat":20.285622},{"pos":"126","lon":-98.3485247,"name":"_115726","lat":20.2856734},{"pos":"127","lon":-98.3485252,"name":"_357005","lat":20.2840998},{"pos":"128","lon":-98.3673448,"name":"_115734","lat":20.2845417},{"pos":"129","lon":-98.3674329,"name":"_115722","lat":20.2875573},{"pos":"130","lon":-98.3674382,"name":"_ESE05003","lat":20.287592},{"pos":"131","lon":-98.3674382,"name":"_ESE05004","lat":20.2879142}];

    function showResult() {
        if (waypoints.length < 2) {
            alert("Please enter at least 2 waypoints!");
        }
        else {
            let returnToOrigin = document.querySelector("#return-to-origin").checked;
            localStorage.setItem("waypoints", JSON.stringify(waypoints));
            localStorage.setItem("returnToOrigin", returnToOrigin);
            window.location.href = "result.html";
        }
    }
    document.getElementById("goto-result").addEventListener("click", showResult);

    function deleteWaypoint(currentElement, waypoint) {
        waypoints.splice(waypoints.indexOf(waypoint), 1);
        currentElement.closest("ul").removeChild(currentElement.parentNode);
    }

    let waypointsList = document.getElementById("waypoints-list");

    map.controls[google.maps.ControlPosition.TOP_LEFT].push(card);

    const autocomplete = new google.maps.places.Autocomplete(input, options);

    // Bind the map's bounds (viewport) property to the autocomplete object,
    // so that the autocomplete requests use the current map bounds for the
    // bounds option in the request.
    autocomplete.bindTo("bounds", map);

    const infowindow = new google.maps.InfoWindow();
    const infowindowContent = document.getElementById("infowindow-content");

    infowindow.setContent(infowindowContent);

    const marker = new google.maps.Marker({
        map,
        anchorPoint: new google.maps.Point(0, -29),
    });

    autocomplete.addListener("place_changed", () => {
        infowindow.close();
        marker.setVisible(false);

        const place = autocomplete.getPlace();
        let waypoint = new Waypoint(place.formatted_address, place.geometry.location);

        // Add a waypoint to the waypoints list
        let waypointElement = document.createElement("li");
        waypointElement.append(place.name);
        let deleteButton = document.createElement("button");
        deleteButton.innerHTML = "X";
        deleteButton.addEventListener("click", function(event) {
            deleteWaypoint(event.currentTarget, waypoint);
        });
        deleteButton.setAttribute("style", "border-radius: 70%; height: 30px; width: 30px; color: #FFFFFF; background-color: #FF0000;\
            margin-left: 20px; border: none;");
        waypointElement.appendChild(deleteButton);
        waypointsList.appendChild(waypointElement);
        // Create a ul to store the waypoint information
        let waypointElementList = document.createElement("ul");
        waypointElement.appendChild(waypointElementList);
        let waypointAddress = document.createElement("li");
        let waypointLat = document.createElement("li");
        let waypointLon = document.createElement("li");
        waypointAddress.appendChild(document.createTextNode("Full Address: " + waypoint.name));
        waypointLat.appendChild(document.createTextNode("Latitude: " + waypoint.lat));
        waypointLon.appendChild(document.createTextNode("Longtitude: " + waypoint.lon));
        waypointElementList.appendChild(waypointAddress);
        waypointElementList.appendChild(waypointLat);
        waypointElementList.appendChild(waypointLon);

        // Convert lat and lon to radians
        waypoint.lat *= CONVERT_TO_RADIAN_CONST;
        waypoint.lon *= CONVERT_TO_RADIAN_CONST;
        waypoints.push(waypoint);

        if (!place.geometry || !place.geometry.location) {
            // User entered the name of a Place that was not suggested and
            // pressed the Enter key, or the Place Details request failed.
            window.alert("No details available for input: '" + place.name + "'");
            return;
        }

        // If the place has a geometry, then present it on a map.
        if (place.geometry.viewport) {
            map.fitBounds(place.geometry.viewport);
        } else {
            map.setCenter(place.geometry.location);
            map.setZoom(17);
        }

        marker.setPosition(place.geometry.location);
        marker.setVisible(true);
        infowindowContent.children["place-name"].textContent = place.name;
        infowindowContent.children["place-address"].textContent =
            place.formatted_address;
        infowindow.open(map, marker);
    });
}