{"id":98,"date":"2026-05-13T13:56:43","date_gmt":"2026-05-13T13:56:43","guid":{"rendered":"https:\/\/hungary-map.hu\/?page_id=98"},"modified":"2026-06-01T06:16:03","modified_gmt":"2026-06-01T06:16:03","slug":"home-sections-03","status":"publish","type":"page","link":"https:\/\/hungary-map.hu\/index.php\/home-sections-03\/","title":{"rendered":"HOME SECTIONS 03"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">\r\n\t\t\t<div class=\"center-title\">\r\n\t\t\t\t\r\n\t\t\t\t<h2 style=\"color:#282828\">Server\r\n\t\t\t\t<span style=\"color:#ff4e00\">Tulajdons\u00e1g<\/span>\r\n\t\t\t\t<\/h2>\r\n\t\t\t\t<span class=\"separator\"><\/span>\r\n\t\t\t\t\r\n\t\t\t<\/div>\r\n\t\t<\/p>\n\n\n\r\n        <link rel=\"stylesheet\" href=\"https:\/\/unpkg.com\/leaflet@1.9.4\/dist\/leaflet.css\" \/>\r\n        <script src=\"https:\/\/unpkg.com\/leaflet@1.9.4\/dist\/leaflet.js\"><\/script>\r\n\r\n        <style>\r\n            .ets2-advanced-dashboard { background: #11141a; border: 1px solid #232936; border-radius: 12px; padding: 25px; color: #e2e8f0; font-family: sans-serif; max-width: 1300px; margin: 20px auto; box-sizing: border-box; }\r\n            .central-dash-header { padding: 15px 20px; border-bottom: 1px solid #232936; background: #11141a; margin-bottom: 15px; }\r\n            .central-dash-header h3 { margin: 0 0 5px 0; font-size: 18px; color: #ff9900; }\r\n            .central-dash-header p { margin: 0; font-size: 13px; color: #64748b; }\r\n            \r\n            .hm-vtc-container { display: flex; flex-direction: column; background: #181d26; border: 1px solid #232936; border-radius: 10px; overflow: hidden; height: 680px; position: relative; width: 100%; box-sizing: border-box; }\r\n            .hm-vtc-main-body { display: flex; flex-direction: row; flex-grow: 1; height: calc(100% - 65px); overflow: hidden; width: 100%; }\r\n            \r\n            .hm-vtc-sidebar { width: 340px; background: #0f1217; border-right: 1px solid #232936; display: flex; flex-direction: column; flex-shrink: 0; }\r\n            .hm-vtc-tabs-navigation { display: flex; background: #131820; border-bottom: 1px solid #232936; padding: 6px; gap: 4px; }\r\n            .hm-tab-btn { flex: 1; background: transparent; color: #64748b; border: none; padding: 10px 2px; font-size: 11px; font-weight: bold; cursor: pointer; text-align: center; text-transform: uppercase; border-radius: 4px; transition: all 0.2s; }\r\n            .hm-tab-btn.active-tab { color: #ff9900; background: #181d26; border-bottom: 2px solid #ff9900; }\r\n            \r\n            .driver-list-wrapper { overflow-y: auto; flex-grow: 1; height: 100%; display: none; background: #0b0d12; }\r\n            .driver-list-wrapper.active-content { display: block; }\r\n            \r\n            .driver-list-item { display: flex; align-items: center; gap: 12px; padding: 12px; border-bottom: 1px solid #1c212c; cursor: pointer; transition: background 0.2s; }\r\n            .driver-list-item:hover { background: #1c212c; }\r\n            .d-info { display: flex; flex-direction: column; flex-grow: 1; }\r\n            .d-name { font-size: 13px; font-weight: bold; color: #fff; display: flex; align-items: center; }\r\n            \r\n            .status-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 6px; }\r\n            .dot-online { background: #10b981; box-shadow: 0 0 8px #10b981; }\r\n            .dot-offline { background: #64748b; }\r\n            .d-cargo { font-size: 11px; color: #a1a1aa; margin-top: 2px; }\r\n            .d-meta { font-size: 11px; color: #64748b; margin-top: 2px; }\r\n            .d-speed { color: #06b6d4; font-weight: bold; }\r\n            \r\n            .hm-map-wrapper { flex-grow: 1; position: relative; height: 100%; }\r\n            #hm-advanced-leaflet-map { width: 100%; height: 100%; background: #0b0d12; z-index: 1; }\r\n            \r\n            \/* DYNAMICALLY POSITIONED ACTION CONTAINER BAR TO PREVENT OVERLAPPING *\/\r\n            .map-action-container { position: absolute !important; top: 12px !important; right: 12px !important; z-index: 1000 !important; display: flex !important; flex-direction: row !important; gap: 8px !important; background: rgba(15, 18, 23, 0.93) !important; padding: 5px !important; border-radius: 8px !important; border: 1px solid #232936 !important; box-shadow: 0 4px 12px rgba(0,0,0,0.5) !important; }\r\n            .map-action-container button { background: #181d26 !important; color: #94a3b8 !important; border: 1px solid #374151 !important; padding: 6px 14px !important; border-radius: 6px !important; cursor: pointer !important; font-size: 12px !important; font-weight: bold !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; white-space: nowrap !important; height: 32px !important; box-sizing: border-box !important; transition: all 0.15s ease-in-out !important; }\r\n            .map-action-container button:hover { background: #212835 !important; color: #fff !important; border-color: #4b5563 !important; }\r\n            .map-action-container button.active { background: #1e293b !important; color: #38bdf8 !important; border-color: #38bdf8 !important; }\r\n            \r\n            .hm-vtc-container.panel-fullscreen { position: fixed !important; top: 0 !important; left: 0 !important; width: 100vw !important; height: 100vh !important; z-index: 99999 !important; border-radius: 0 !important; }\r\n            \r\n            \/* STATISZTIKAI K\u00c1RTY\u00c1K R\u00c1CSOS SZERKEZETE *\/\r\n            .central-stats-grid { display: grid !important; grid-template-columns: repeat(4, 1fr) !important; gap: 15px !important; margin-top: 25px !important; width: 100% !important; box-sizing: border-box !important; }\r\n            .central-stat-card { background: #181d26 !important; border: 1px solid #232936 !important; border-radius: 10px !important; padding: 15px 20px !important; border-left: 4px solid #ff9900 !important; display: flex !important; flex-direction: row !important; align-items: center !important; justify-content: flex-start !important; gap: 18px !important; box-sizing: border-box !important; }\r\n            .card-counter-value { font-size: 28px !important; font-weight: bold !important; color: #fff !important; font-family: monospace !important; line-height: 1 !important; margin: 0 !important; display: inline-block !important; min-width: 40px !important; }\r\n            .card-label-container { display: flex !important; flex-direction: column !important; justify-content: center !important; }\r\n            .card-label-text { font-size: 11px !important; color: #94a3b8 !important; text-transform: uppercase !important; letter-spacing: 0.5px !important; font-weight: bold !important; line-height: 1.3 !important; display: block !important; margin: 0 !important; text-align: left !important; white-space: nowrap !important; }\r\n            \r\n            .my-own-driver-badge { background: #ff9900; color: #000; font-size: 10px; padding: 1px 5px; border-radius: 4px; margin-left: 6px; font-weight: bold; }\r\n            \r\n            \/* UKR\u00c1NOS \u00c9S KORON\u00c1S J\u00c1T\u00c9KOS IKONOK ELRENDEZ\u00c9SE *\/\r\n            .icon-truck-container { position: relative; width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; }\r\n            .icon-truck-layer { font-size: 20px; position: absolute; bottom: 0; z-index: 2; line-height: 1; }\r\n            .icon-crown-layer { font-size: 15px; position: absolute; top: -14px; left: 50%; transform: translateX(-50%); z-index: 3; filter: drop-shadow(0 0 3px #ff9900); }\r\n            \r\n            \/* SORT\u00d6R\u00c9SEK JAV\u00cdT\u00c1SA A T\u00c9RK\u00c9PES BUBOR\u00c9KBAN *\/\r\n            .hm-popup-content { font-family: sans-serif; font-size: 12px; line-height: 1.6; color: #fff; padding: 4px; }\r\n            .hm-popup-title { font-size: 14px; font-weight: bold; color: #ff9900; margin-bottom: 6px; border-bottom: 1px solid #374151; padding-bottom: 4px; }\r\n\r\n            .leaflet-popup-content-wrapper { background: #181d26 !important; color: #e2e8f0 !important; border: 1px solid #232936 !important; border-radius: 8px !important; box-shadow: 0 3px 14px rgba(0,0,0,0.4) !important; }\r\n            .leaflet-popup-tip { background: #181d26 !important; }\r\n        <\/style>\r\n\r\n        <div class=\"ets2-advanced-dashboard\">\r\n            <div class=\"central-dash-header\">\r\n                <h3>\ud83c\udf10 HM-VTC LIVE DISPATCHER<\/h3>\r\n                <p>\u00c9l\u0151 diszp\u00e9cserk\u00f6zpont \u00e9s flotta radar<\/p>\r\n            <\/div>\r\n\r\n            <div class=\"hm-vtc-container\" id=\"hm-main-vtc-panel\">\r\n                <div class=\"hm-vtc-main-body\">\r\n                    <div class=\"hm-vtc-sidebar\">\r\n                        <div class=\"hm-vtc-tabs-navigation\">\r\n                            <button class=\"hm-tab-btn active-tab\" data-target=\"tab-online-content\">\ud83d\udfe2 Online (<span id=\"tab-counter-online\">0<\/span>)<\/button>\r\n                            <button class=\"hm-tab-btn\" data-target=\"tab-fleets-content\">\ud83c\udfe2 Flott\u00e1k<\/button>\r\n                            <button class=\"hm-tab-btn\" data-target=\"tab-offline-content\">\ud83d\udca4 Offline<\/button>\r\n                        <\/div>\r\n                        <div style=\"padding: 10px; background: #131720; border-bottom: 1px solid #232936;\">\r\n                            <input type=\"text\" id=\"driver-scout-search\" placeholder=\"Gyorskeres\u00e9s...\" style=\"width:100%; padding:8px; background:#1f2937; border:1px solid #374151; color:#fff; border-radius:6px; font-size:13px; box-sizing: border-box;\">\r\n                        <\/div>\r\n                        <div class=\"driver-list-wrapper active-content\" id=\"tab-online-content\">Bet\u00f6lt\u00e9s...<\/div>\r\n                        <div class=\"driver-list-wrapper\" id=\"tab-fleets-content\">Bet\u00f6lt\u00e9s...<\/div>\r\n                        <div class=\"driver-list-wrapper\" id=\"tab-offline-content\">Bet\u00f6lt\u00e9s...<\/div>\r\n                    <\/div>\r\n                    \r\n                    <div class=\"hm-map-wrapper\">\r\n                        <div class=\"map-action-container\">\r\n                            <button type=\"button\" id=\"toggle-all-offline-radar\">\ud83d\udccd Offline Radar<\/button>\r\n                            <button type=\"button\" class=\"fullscreen-map-btn\" id=\"hm-fullscreen-trigger\">\ud83d\udd32 Teljes k\u00e9perny\u0151<\/button>\r\n                        <\/div>\r\n                        <div id=\"hm-advanced-leaflet-map\"><\/div>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <!-- REZSPONZ\u00cdV ALS\u00d3 STATISZTIKAI K\u00c1RTY\u00c1K IKONOKKAL -->\r\n<div class=\"central-stats-grid\">\r\n    <div class=\"central-stat-card\">\r\n        <!-- FontAwesome ikon opci\u00f3 (Ha be van t\u00f6ltve a t\u00e9m\u00e1dban): <i class=\"fas fa-truck-steering\" style=\"font-size: 24px; color: #10b981;\"><\/i> -->\r\n        <!-- Biztosan m\u0171k\u00f6d\u0151 Dashicons \/ Emoji opci\u00f3: -->\r\n        <span style=\"font-size: 24px; filter: drop-shadow(0 0 4px #10b981);\">\ud83d\udede<\/span>\r\n        <span class=\"card-counter-value\" id=\"bottom-live-counter\">0<\/span>\r\n        <div class=\"card-label-container\">\r\n            <span class=\"card-label-text\">ONLINE<\/span>\r\n            <span class=\"card-label-text\" style=\"color:#10b981;\">SOF\u0150R<\/span>\r\n        <\/div>\r\n    <\/div>\r\n    <div class=\"central-stat-card\">\r\n        <!-- T\u00e9ma ikon opci\u00f3: <i class=\"fas fa-trophy\" style=\"font-size: 24px; color: #ff9900;\"><\/i> -->\r\n        <span style=\"font-size: 24px; filter: drop-shadow(0 0 4px #ff9900);\">\ud83d\udc51<\/span>\r\n        <span class=\"card-counter-value\">0<\/span>\r\n        <div class=\"card-label-container\">\r\n            <span class=\"card-label-text\">REKORD<\/span>\r\n            <span class=\"card-label-text\" style=\"color:#ff9900;\">KIL\u00d6V\u00c9S<\/span>\r\n        <\/div>\r\n    <\/div>\r\n    <div class=\"central-stat-card\">\r\n        <!-- T\u00e9ma ikon opci\u00f3: <i class=\"fas fa-briefcase\" style=\"font-size: 24px; color: #38bdf8;\"><\/i> -->\r\n        <span style=\"font-size: 24px; filter: drop-shadow(0 0 4px #38bdf8);\">\ud83c\udfe2<\/span>\r\n        <span class=\"card-counter-value\">2<\/span>\r\n        <div class=\"card-label-container\">\r\n            <span class=\"card-label-text\">REGISZTR\u00c1LT<\/span>\r\n            <span class=\"card-label-text\" style=\"color:#38bdf8;\">FLOTTA<\/span>\r\n        <\/div>\r\n    <\/div>\r\n    <div class=\"central-stat-card\">\r\n        <!-- T\u00e9ma ikon opci\u00f3: <i class=\"fas fa-download\" style=\"font-size: 24px; color: #a855f7;\"><\/i> -->\r\n        <span style=\"font-size: 24px; filter: drop-shadow(0 0 4px #a855f7);\">\ud83d\udce6<\/span>\r\n        <span class=\"card-counter-value\">3<\/span>\r\n        <div class=\"card-label-container\">\r\n            <span class=\"card-label-text\">AKT\u00cdV<\/span>\r\n            <span class=\"card-label-text\" style=\"color:#a855f7;\">MODOK<\/span>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n        <\/div>\r\n\r\n        <script type=\"text\/javascript\">\r\n        document.addEventListener(\"DOMContentLoaded\", function() {\r\n            const mapSize = 16384; \r\n            const coorZoom = 6; \r\n            let globalDriversData = []; \r\n            let hasCenteredOnMe = false;\r\n            let showOfflineRadar = false;\r\n\r\n            const map = L.map(\"hm-advanced-leaflet-map\", { \r\n                crs: L.CRS.Simple, \r\n                minZoom: -2, \r\n                maxZoom: 4, \r\n                zoomSnap: 0.1 \r\n            });\r\n\r\n            L.tileLayer(\"https:\/\/hungary-map.hu\/wp-content\/uploads\/hungary-tiles\/{z}\/{x}\/{y}.png?v=4.0\", { \r\n                tileSize: 256, \r\n                noWrap: true, \r\n                maxZoom: 6 \r\n            }).addTo(map);\r\n\r\n            map.setView(map.unproject([mapSize \/ 2, mapSize \/ 2], coorZoom), -1);\r\n\r\n            const truckIcon = L.divIcon({ \r\n                html: '<div class=\"icon-truck-container\"><div class=\"icon-truck-layer\">\ud83d\ude9b<\/div><\/div>', \r\n                className: \"custom-leaflet-truck\", iconSize:[32,32], iconAnchor:[16,16] \r\n            });\r\n            const myTruckIcon = L.divIcon({ \r\n                html: '<div class=\"icon-truck-container\"><div class=\"icon-crown-layer\">\ud83d\udc51<\/div><div class=\"icon-truck-layer\" style=\"filter:drop-shadow(0 0 5px #ff9900);\">\ud83d\ude9b<\/div><\/div>', \r\n                className: \"custom-leaflet-truck-me\", iconSize:[32,32], iconAnchor:[16,16] \r\n            });\r\n            const offlineTruckIcon = L.divIcon({ \r\n                html: '<div class=\"icon-truck-container\"><div class=\"icon-truck-layer\" style=\"opacity:0.4; filter:grayscale(100%);\">\ud83d\udca4\ud83d\ude9b<\/div><\/div>', \r\n                className: \"custom-leaflet-truck-off\", iconSize:[32,32], iconAnchor:[16,16] \r\n            });\r\n\r\n            const driverMarkers = {};\r\n            const driverLines = {};\r\n\r\n            document.querySelectorAll(\".hm-tab-btn\").forEach(btn => {\r\n                btn.addEventListener(\"click\", function() {\r\n                    document.querySelectorAll(\".hm-tab-btn\").forEach(b => b.classList.remove(\"active-tab\"));\r\n                    document.querySelectorAll(\".driver-list-wrapper\").forEach(w => w.classList.remove(\"active-content\"));\r\n                    this.classList.add(\"active-tab\");\r\n                    document.getElementById(this.getAttribute(\"data-target\")).classList.add(\"active-content\");\r\n                });\r\n            });\r\n\r\n            function renderDrivers(drivers) {\r\n                globalDriversData = drivers;\r\n                \r\n                Object.keys(driverMarkers).forEach(id => {\r\n                    if (!drivers.some(d => d.id == id)) {\r\n                        map.removeLayer(driverMarkers[id]);\r\n                        delete driverMarkers[id];\r\n                        if(driverLines[id]) { map.removeLayer(driverLines[id]); delete driverLines[id]; }\r\n                    }\r\n                });\r\n\r\n                let onlineHtml = \"\"; \r\n                let offlineHtml = \"\"; \r\n                let fleetsMap = {}; \r\n                let onlineCount = 0;\r\n\r\n                drivers.forEach(driver => {\r\n                    const hasValidCoords = (driver.x !== 0 || driver.y !== 0);\r\n                    let fleetName = driver.fleet_name ? driver.fleet_name : \"Flotta n\u00e9lk\u00fcli sof\u0151r\u00f6k\";\r\n\r\n                    if (!fleetsMap[fleetName]) {\r\n                        fleetsMap[fleetName] = { tag: driver.fleet_tag, members: [] };\r\n                    }\r\n\r\n                    let itemHtml = '<div class=\"driver-list-item\" data-id=\"' + driver.id + '\">' +\r\n                        '<div class=\"d-info\">' +\r\n                            '<div class=\"d-name\"><span class=\"status-dot ' + (driver.is_online ? 'dot-online' : 'dot-offline') + '\"><\/span>' + driver.name + (driver.is_current_user ? ' <span class=\"my-own-driver-badge\">Te<\/span>' : '') + '<\/div>' +\r\n                            '<div class=\"d-cargo\">' + (driver.is_online ? driver.cargo : 'F\u00e9lre\u00e1llva \/ Offline') + '<\/div>' +\r\n                            (driver.is_online ? '<div class=\"d-meta\">' + driver.truck + ' \u2022 <span class=\"d-speed\">' + driver.speed + ' km\/h<\/span><\/div>' : '') +\r\n                        '<\/div>' +\r\n                    '<\/div>';\r\n\r\n                    fleetsMap[fleetName].members.push(itemHtml);\r\n\r\n                    if (driver.is_online) {\r\n                        onlineCount++;\r\n                        onlineHtml += itemHtml;\r\n\r\n                        if (hasValidCoords) {\r\n                            const latlng = map.unproject([driver.x, driver.y], coorZoom);\r\n                            \r\n                            if (driverMarkers[driver.id]) { \r\n                                driverMarkers[driver.id].setLatLng(latlng); \r\n                            } else { \r\n                                driverMarkers[driver.id] = L.marker(latlng, { icon: driver.is_current_user ? myTruckIcon : truckIcon }).addTo(map); \r\n                            }\r\n                            \r\n                            let popupHtml = '<div class=\"hm-popup-content\">' +\r\n                                '<div class=\"hm-popup-title\">' + driver.name + '<\/div>' +\r\n                                '<strong>Kamion:<\/strong> ' + driver.truck + '<br>' +\r\n                                '<strong>Fuvar:<\/strong> ' + driver.cargo + '<br>' +\r\n                                '<strong>Sebess\u00e9g:<\/strong> <span style=\"color:#06b6d4;font-weight:bold;\">' + driver.speed + ' km\/h<\/span>' +\r\n                            '<div style=\"margin-top:5px; font-size:10px; color:#94a3b8;\">Utols\u00f3 adat: ' + driver.last_update + '<\/div>' +\r\n'<\/div>';\r\n                            \r\n                            driverMarkers[driver.id].bindPopup(popupHtml);\r\n\r\n                            if (driver.path && driver.path.length > 1) {\r\n                                const points = driver.path.map(p => map.unproject([p[0], p[1]], coorZoom));\r\n                                if (driverLines[driver.id]) {\r\n                                    driverLines[driver.id].setLatLngs(points);\r\n                                } else {\r\n                                    driverLines[driver.id] = L.polyline(points, { color: driver.is_current_user ? '#ff9900' : '#00f0ff', weight: 3 }).addTo(map);\r\n                                }\r\n                            }\r\n\r\n                            if (driver.is_current_user && !hasCenteredOnMe) {\r\n                                map.setView(latlng, 1.5); \r\n                                hasCenteredOnMe = true;\r\n                            }\r\n                        }\r\n                    } else {\r\n                        offlineHtml += itemHtml;\r\n                        \r\n                        if (hasValidCoords) {\r\n                            const latlng = map.unproject([driver.x, driver.y], coorZoom);\r\n                            \r\n                            if (!driverMarkers[driver.id]) { \r\n                                driverMarkers[driver.id] = L.marker(latlng, { icon: offlineTruckIcon }); \r\n                            } else {\r\n                                driverMarkers[driver.id].setLatLng(latlng);\r\n                            }\r\n                            \r\n                            let offPopupHtml = '<div class=\"hm-popup-content\">' +\r\n                                '<div class=\"hm-popup-title\" style=\"color:#64748b;\">' + driver.name + ' (Offline)<\/div>' +\r\n                                'Utols\u00f3 ismert poz\u00edci\u00f3 a t\u00e9rk\u00e9pen.' +\r\n                            '<\/div>';\r\n                            driverMarkers[driver.id].bindPopup(offPopupHtml);\r\n\r\n                            if (showOfflineRadar) { \r\n                                if (!map.hasLayer(driverMarkers[driver.id])) driverMarkers[driver.id].addTo(map); \r\n                            } else { \r\n                                if (map.hasLayer(driverMarkers[driver.id])) map.removeLayer(driverMarkers[driver.id]); \r\n                            }\r\n                        }\r\n                    }\r\n                });\r\n\r\n                document.getElementById(\"tab-online-content\").innerHTML = onlineHtml || '<div style=\"padding:15px;color:#64748b;text-align:center;\">Nincs online sof\u0151r.<\/div>';\r\n                document.getElementById(\"tab-counter-online\").textContent = onlineCount;\r\n                document.getElementById(\"bottom-live-counter\").textContent = onlineCount;\r\n                document.getElementById(\"tab-offline-content\").innerHTML = offlineHtml || '<div style=\"padding:15px;color:#64748b;text-align:center;\">Nincs offline tag.<\/div>';\r\n\r\n                let fleetsHtml = \"\";\r\n                Object.keys(fleetsMap).forEach((fName) => {\r\n                    fleetsHtml += '<div>' +\r\n                        '<div class=\"fleet-group-header\"><span>\ud83c\udfe2 ' + fName + '<\/span><span class=\"fleet-group-count\">' + fleetsMap[fName].members.length + ' f\u0151<\/span><\/div>' +\r\n                        '<div class=\"fleet-group-members\">' + fleetsMap[fName].members.join('') + '<\/div>' +\r\n                    '<\/div>';\r\n                });\r\n                document.getElementById(\"tab-fleets-content\").innerHTML = fleetsHtml || '<div style=\"padding:15px;color:#64748b;text-align:center;\">Nincsenek flott\u00e1k.<\/div>';\r\n                \r\n                document.querySelectorAll(\".driver-list-item\").forEach(item => {\r\n                    item.onclick = function() {\r\n                        const dId = this.getAttribute(\"data-id\");\r\n                        const dObj = globalDriversData.find(d => d.id == dId);\r\n                        if(dObj && (dObj.x !== 0 || dObj.y !== 0)) {\r\n                            const ll = map.unproject([dObj.x, dObj.y], coorZoom);\r\n                            if (!map.hasLayer(driverMarkers[dId])) driverMarkers[dId].addTo(map);\r\n                            map.flyTo(ll, 1.5);\r\n                            setTimeout(() => driverMarkers[dId].openPopup(), 1000);\r\n                        }\r\n                    };\r\n                });\r\n            }\r\n\r\n            function updateData() {\r\n                fetch(\"https:\/\/hungary-map.hu\/wp-admin\/admin-ajax.php?action=get_live_vtc_drivers&nocache=\" + Date.now())\r\n                    .then(r => r.json())\r\n                    .then(res => { if(res.success && res.data) renderDrivers(res.data); })\r\n                    .catch(e => console.error(\"API hiba:\", e));\r\n            }\r\n            \r\n            updateData(); \r\n            setInterval(updateData, 8000);\r\n\r\n            document.getElementById(\"toggle-all-offline-radar\").onclick = function() {\r\n                showOfflineRadar = !showOfflineRadar;\r\n                this.classList.toggle(\"active\");\r\n                updateData();\r\n            };\r\n\r\n            document.getElementById(\"driver-scout-search\").oninput = function() {\r\n                let f = this.value.toLowerCase();\r\n                document.querySelectorAll(\".driver-list-item\").forEach(i => {\r\n                    i.style.display = i.textContent.toLowerCase().includes(f) ? \"flex\" : \"none\";\r\n                });\r\n            };\r\n\r\n            const panel = document.getElementById(\"hm-main-vtc-panel\");\r\n            document.getElementById(\"hm-fullscreen-trigger\").onclick = function() {\r\n                panel.classList.toggle(\"panel-fullscreen\");\r\n                this.textContent = panel.classList.contains(\"panel-fullscreen\") ? \"\u274c Bez\u00e1r\u00e1s\" : \"\ud83d\udd32 Teljes k\u00e9perny\u0151\";\r\n                setTimeout(() => map.invalidateSize(), 250);\r\n            };\r\n        });\r\n        <\/script>\r\n        \n\n\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-98","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/hungary-map.hu\/index.php\/wp-json\/wp\/v2\/pages\/98","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/hungary-map.hu\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/hungary-map.hu\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/hungary-map.hu\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/hungary-map.hu\/index.php\/wp-json\/wp\/v2\/comments?post=98"}],"version-history":[{"count":32,"href":"https:\/\/hungary-map.hu\/index.php\/wp-json\/wp\/v2\/pages\/98\/revisions"}],"predecessor-version":[{"id":346,"href":"https:\/\/hungary-map.hu\/index.php\/wp-json\/wp\/v2\/pages\/98\/revisions\/346"}],"wp:attachment":[{"href":"https:\/\/hungary-map.hu\/index.php\/wp-json\/wp\/v2\/media?parent=98"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}