HEX
Server: Microsoft-IIS/8.5
System: Windows NT YDAWBH120 6.3 build 9600 (Windows Server 2012 R2 Standard Edition) AMD64
User: tentjecom_web (0)
PHP: 7.4.14
Disabled: NONE
Upload Files
File: D:/HostingSpaces/SBogers10/helder.komma.pro/resources/assets/js/site/mapsHandler.js
/* ==========================================================================
    Google Maps handler
    - https://developers.google.com/maps/documentation/javascript/adding-a-google-map
 ========================================================================== */

const MapsHandler = {

    map: '',
    key: '',
    location: {lat: 51.2618222, lng: 5.5965538},
    styling: '',

    init: function () {
        // Get map by id
        MapsHandler.map = document.getElementById('map');

        // Check if a map is defined
        if (isset(MapsHandler.map)) {

            if(MapsHandler.map.hasAttribute('data-google-lat')) MapsHandler.location.lat = parseFloat(MapsHandler.map.getAttribute('data-google-lat'));
            if(MapsHandler.map.hasAttribute('data-google-lng')) MapsHandler.location.lng = parseFloat(MapsHandler.map.getAttribute('data-google-lng'));

            MapsHandler.setCustomStyling();

            // See if google variable exists
            if (typeof(google) == 'undefined' || typeof(google.maps) == 'undefined') {
                // Load external script
                getScript('https://maps.googleapis.com/maps/api/js?key=' + MapsHandler.key, MapsHandler.drawMap);
            } else {
                MapsHandler.drawMap()
            }

        }
    },

    drawMap: function () {
        // Create a map
        const map = new google.maps.Map(MapsHandler.map, {
            zoom: 11,
            center: MapsHandler.location,
            disableDefaultUI: true,
            styles: MapsHandler.styling
        });
        // Add a marker
        const marker = new google.maps.Marker({
            position: MapsHandler.location,
            map: map
        });
    },

    setCustomStyling: function () {

        MapsHandler.styling =
            [
                {
                    "featureType": "poi",
                    "elementType": "labels.text.fill",
                    "stylers": [
                        {
                            "color": "#747474"
                        },
                        {
                            "lightness": "23"
                        }
                    ]
                },
                {
                    "featureType": "poi.attraction",
                    "elementType": "geometry.fill",
                    "stylers": [
                        {
                            "color": "#f38eb0"
                        }
                    ]
                },
                {
                    "featureType": "poi.government",
                    "elementType": "geometry.fill",
                    "stylers": [
                        {
                            "color": "#ced7db"
                        }
                    ]
                },
                {
                    "featureType": "poi.medical",
                    "elementType": "geometry.fill",
                    "stylers": [
                        {
                            "color": "#ffa5a8"
                        }
                    ]
                },
                {
                    "featureType": "poi.park",
                    "elementType": "geometry.fill",
                    "stylers": [
                        {
                            "color": "#c7e5c8"
                        }
                    ]
                },
                {
                    "featureType": "poi.place_of_worship",
                    "elementType": "geometry.fill",
                    "stylers": [
                        {
                            "color": "#d6cbc7"
                        }
                    ]
                },
                {
                    "featureType": "poi.school",
                    "elementType": "geometry.fill",
                    "stylers": [
                        {
                            "color": "#c4c9e8"
                        }
                    ]
                },
                {
                    "featureType": "poi.sports_complex",
                    "elementType": "geometry.fill",
                    "stylers": [
                        {
                            "color": "#b1eaf1"
                        }
                    ]
                },
                {
                    "featureType": "road",
                    "elementType": "geometry",
                    "stylers": [
                        {
                            "lightness": "100"
                        }
                    ]
                },
                {
                    "featureType": "road",
                    "elementType": "labels",
                    "stylers": [
                        {
                            "visibility": "off"
                        },
                        {
                            "lightness": "100"
                        }
                    ]
                },
                {
                    "featureType": "road.highway",
                    "elementType": "geometry.fill",
                    "stylers": [
                        {
                            "color": "#ffd4a5"
                        }
                    ]
                },
                {
                    "featureType": "road.arterial",
                    "elementType": "geometry.fill",
                    "stylers": [
                        {
                            "color": "#ffe9d2"
                        }
                    ]
                },
                {
                    "featureType": "road.local",
                    "elementType": "all",
                    "stylers": [
                        {
                            "visibility": "simplified"
                        }
                    ]
                },
                {
                    "featureType": "road.local",
                    "elementType": "geometry.fill",
                    "stylers": [
                        {
                            "weight": "3.00"
                        }
                    ]
                },
                {
                    "featureType": "road.local",
                    "elementType": "geometry.stroke",
                    "stylers": [
                        {
                            "weight": "0.30"
                        }
                    ]
                },
                {
                    "featureType": "road.local",
                    "elementType": "labels.text",
                    "stylers": [
                        {
                            "visibility": "on"
                        }
                    ]
                },
                {
                    "featureType": "road.local",
                    "elementType": "labels.text.fill",
                    "stylers": [
                        {
                            "color": "#747474"
                        },
                        {
                            "lightness": "36"
                        }
                    ]
                },
                {
                    "featureType": "road.local",
                    "elementType": "labels.text.stroke",
                    "stylers": [
                        {
                            "color": "#e9e5dc"
                        },
                        {
                            "lightness": "30"
                        }
                    ]
                },
                {
                    "featureType": "transit.line",
                    "elementType": "geometry",
                    "stylers": [
                        {
                            "visibility": "on"
                        },
                        {
                            "lightness": "100"
                        }
                    ]
                },
                {
                    "featureType": "water",
                    "elementType": "all",
                    "stylers": [
                        {
                            "color": "#d2e7f7"
                        }
                    ]
                }
            ];
    }
};

MapsHandler.init();