{"id":4817,"date":"2024-04-23T11:48:09","date_gmt":"2024-04-23T08:48:09","guid":{"rendered":"https:\/\/www.wavemotion.gr\/%ce%b4%ce%af%ce%ba%cf%84%cf%85%ce%bf-%ce%bc%ce%b5%cf%84%ce%b1%cf%80%cf%89%ce%bb%ce%b7%cf%84%cf%8e%ce%bd\/"},"modified":"2024-10-02T12:23:44","modified_gmt":"2024-10-02T09:23:44","slug":"%ce%b4%ce%af%ce%ba%cf%84%cf%85%ce%bf-%ce%bc%ce%b5%cf%84%ce%b1%cf%80%cf%89%ce%bb%ce%b7%cf%84%cf%8e%ce%bd","status":"publish","type":"page","link":"https:\/\/www.wavemotion.gr\/el\/%ce%b4%ce%af%ce%ba%cf%84%cf%85%ce%bf-%ce%bc%ce%b5%cf%84%ce%b1%cf%80%cf%89%ce%bb%ce%b7%cf%84%cf%8e%ce%bd\/","title":{"rendered":"\u0394\u03af\u03ba\u03c4\u03c5\u03bf \u039c\u03b5\u03c4\u03b1\u03c0\u03c9\u03bb\u03b7\u03c4\u03ce\u03bd"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"4817\" class=\"elementor elementor-4817 elementor-27\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-2d88164 e-flex e-con-boxed e-con e-parent\" data-id=\"2d88164\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-55aefac e-flex e-con-boxed e-con e-parent\" data-id=\"55aefac\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-515b4c3 elementor-widget elementor-widget-heading\" data-id=\"515b4c3\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h1 class=\"elementor-heading-title elementor-size-default\">\u0394\u03af\u03ba\u03c4\u03c5\u03bf \u0395\u03be\u03bf\u03c5\u03c3\u03b9\u03bf\u03b4\u03bf\u03c4\u03b7\u03bc\u03ad\u03bd\u03c9\u03bd \u039c\u03b5\u03c4\u03b1\u03c0\u03c9\u03bb\u03b7\u03c4\u03ce\u03bd<\/h1>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-52755ea elementor-widget elementor-widget-text-editor\" data-id=\"52755ea\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>\u0391\u03c0\u03b5\u03c5\u03b8\u03c5\u03bd\u03b8\u03b5\u03af\u03c4\u03b5 \u03c3\u03c4\u03bf\u03c5\u03c2 \u03b1\u03be\u03b9\u03cc\u03c0\u03b9\u03c3\u03c4\u03bf\u03c5\u03c2 \u03a3\u03c5\u03bd\u03b5\u03c1\u03b3\u03ac\u03c4\u03b5\u03c2 \u03bc\u03b1\u03c2! \u0395\u03bd\u03c4\u03bf\u03c0\u03af\u03c3\u03c4\u03b5 \u03c4\u03bf\u03bd \u03c0\u03bb\u03b7\u03c3\u03b9\u03ad\u03c3\u03c4\u03b5\u03c1\u03bf \u03c3\u03b5 \u03b5\u03c3\u03ac\u03c2 \u0395\u03be\u03bf\u03c5\u03c3\u03b9\u03bf\u03b4\u03bf\u03c4\u03b7\u03bc\u03ad\u03bd\u03bf \u039c\u03b5\u03c4\u03b1\u03c0\u03c9\u03bb\u03b7\u03c4\u03ae \u03bc\u03b1\u03c2, \u03b3\u03b9\u03b1 \u03bd\u03b1 \u03b2\u03c1\u03b5\u03af\u03c4\u03b5 \u03c4\u03bf \u03c0\u03c1\u03bf\u03ca\u03cc\u03bd \u03c0\u03bf\u03c5 \u03c3\u03b1\u03c2 \u03b5\u03bd\u03b4\u03b9\u03b1\u03c6\u03ad\u03c1\u03b5\u03b9.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-15369d2 e-con-full e-flex e-con e-parent\" data-id=\"15369d2\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-731ca93 elementor-widget elementor-widget-shortcode\" data-id=\"731ca93\" data-element_type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\">\n    <div class=\"map-widget-wrapper\">\n        <div class=\"map-search row\">\n            <div class=\"col-md-3\">\n                <div class=\"select\">\n                    <select id=\"brand-select\" onchange=\"handleBrandChange()\">\n                        <option value=\"all\">\u038c\u03bb\u03b5\u03c2 \u03bf\u03b9 \u039c\u03ac\u03c1\u03ba\u03b5\u03c2<\/option>\n                        <!-- Dynamic options will be loaded here -->\n                    <\/select>\n                <\/div>\n            <\/div>\n            <div class=\"col-md-3\">\n                <div class=\"select\">\n                    <select id=\"series-select\" onchange=\"handleSeriesChange()\">\n                        <option value=\"all\">\u038c\u03bb\u03b5\u03c2 \u03bf\u03b9 \u03a3\u03b5\u03b9\u03c1\u03ad\u03c2<\/option>\n                        <!-- Dynamic options will be loaded here -->\n                    <\/select>\n                <\/div>\n            <\/div>\n            <div class=\"col-md-3\">\n                <div class=\"select\">\n                    <select id=\"city-select\">\n                        <option value=\"all\">\u038c\u03bb\u03b5\u03c2 \u03bf\u03b9 \u03a0\u03cc\u03bb\u03b5\u03b9\u03c2<\/option>\n                        <!-- Dynamic options will be loaded here -->\n                    <\/select>\n                <\/div>\n            <\/div>\n            <div class=\"col-md-3\">\n                <button class=\"map-button\" type=\"button\" onclick=\"filterStores()\">\u0391\u039d\u0391\u0396\u0397\u03a4\u0397\u03a3\u0397<\/button>\n            <\/div>\n        <\/div>\n\n        <div class=\"map-list\" id=\"map-list\">\n            <!-- Dynamic list items will be loaded here -->\n        <\/div>\n\n        <div id=\"pagination\" class=\"pagination-map-widget\">\n            <!-- Pagination buttons will be loaded here -->\n        <\/div>\n\n        <div class=\"map-wrapper\" id=\"map\" style=\"height: 750px;\"><\/div>\n    <\/div><!--END:map-widget-wrapper-->\n\n    <style>\n        .pagination {\n            text-align: center;\n            margin-top: 20px;\n        }\n\n        .page-button {\n            background-color: transparent;\n            border: 1px solid white;\n            color: black;\n            padding: 5px 10px;\n            margin: 0 5px;\n            border-radius: 50%;\n            cursor: pointer;\n            transition: background-color 0.3s, color 0.3s;\n        }\n\n        .page-button:hover {\n            background-color: white;\n            color: black;\n        }\n    <\/style>\n\n    <script>\n        let currentPage = 1;\n        const pageSize = 5;\n        let filteredStores = [];\n        let markers = [];\n        let map;\n        let allOptions = {\n            brands: [],\n            series: [],\n            cities: []\n        };\n\n        let selectedBrand = \"all\";\n        let selectedLocation = \"all\";\n        let selectedSeries = \"all\";\n\n        function initMap() {\n            const mapStyles = [{\n                    \"elementType\": \"geometry\",\n                    \"stylers\": [{\n                        \"color\": \"#f5f5f5\"\n                    }]\n                },\n                {\n                    \"elementType\": \"labels.icon\",\n                    \"stylers\": [{\n                        \"visibility\": \"off\"\n                    }]\n                },\n                {\n                    \"elementType\": \"labels.text.fill\",\n                    \"stylers\": [{\n                        \"color\": \"#616161\"\n                    }]\n                },\n                {\n                    \"elementType\": \"labels.text.stroke\",\n                    \"stylers\": [{\n                        \"color\": \"#f5f5f5\"\n                    }]\n                },\n                {\n                    \"featureType\": \"administrative.land_parcel\",\n                    \"elementType\": \"labels.text.fill\",\n                    \"stylers\": [{\n                        \"color\": \"#bdbdbd\"\n                    }]\n                },\n                {\n                    \"featureType\": \"poi\",\n                    \"elementType\": \"geometry\",\n                    \"stylers\": [{\n                        \"color\": \"#eeeeee\"\n                    }]\n                },\n                {\n                    \"featureType\": \"poi\",\n                    \"elementType\": \"labels.text.fill\",\n                    \"stylers\": [{\n                        \"color\": \"#757575\"\n                    }]\n                },\n                {\n                    \"featureType\": \"poi.park\",\n                    \"elementType\": \"geometry\",\n                    \"stylers\": [{\n                        \"color\": \"#e5e5e5\"\n                    }]\n                },\n                {\n                    \"featureType\": \"poi.park\",\n                    \"elementType\": \"labels.text.fill\",\n                    \"stylers\": [{\n                        \"color\": \"#9e9e9e\"\n                    }]\n                },\n                {\n                    \"featureType\": \"road\",\n                    \"elementType\": \"geometry\",\n                    \"stylers\": [{\n                        \"color\": \"#ffffff\"\n                    }]\n                },\n                {\n                    \"featureType\": \"road.arterial\",\n                    \"elementType\": \"labels.text.fill\",\n                    \"stylers\": [{\n                        \"color\": \"#757575\"\n                    }]\n                },\n                {\n                    \"featureType\": \"road.highway\",\n                    \"elementType\": \"geometry\",\n                    \"stylers\": [{\n                        \"color\": \"#dadada\"\n                    }]\n                },\n                {\n                    \"featureType\": \"road.highway\",\n                    \"elementType\": \"labels.text.fill\",\n                    \"stylers\": [{\n                        \"color\": \"#616161\"\n                    }]\n                },\n                {\n                    \"featureType\": \"road.local\",\n                    \"elementType\": \"labels.text.fill\",\n                    \"stylers\": [{\n                        \"color\": \"#9e9e9e\"\n                    }]\n                },\n                {\n                    \"featureType\": \"transit.line\",\n                    \"elementType\": \"geometry\",\n                    \"stylers\": [{\n                        \"color\": \"#e5e5e5\"\n                    }]\n                },\n                {\n                    \"featureType\": \"transit.station\",\n                    \"elementType\": \"geometry\",\n                    \"stylers\": [{\n                        \"color\": \"#eeeeee\"\n                    }]\n                },\n                {\n                    \"featureType\": \"water\",\n                    \"elementType\": \"geometry\",\n                    \"stylers\": [{\n                        \"color\": \"#c9c9c9\"\n                    }]\n                },\n                {\n                    \"featureType\": \"water\",\n                    \"elementType\": \"labels.text.fill\",\n                    \"stylers\": [{\n                        \"color\": \"#9e9e9e\"\n                    }]\n                }\n            ];\n            map = new google.maps.Map(document.getElementById(\"map\"), {\n                zoom: 10,\n                center: {\n                    lat: 37.9838,\n                    lng: 23.7275\n                },\n                styles: mapStyles,\n                fullscreenControl: false, \/\/ Disable fullscreen control\n                zoomControl: true, \/\/ Ensure zoom control is enabled\n                zoomControlOptions: {\n                    style: google.maps.ZoomControlStyle.DEFAULT \/\/ Apply default CSS for zoom control\n                },\n                mapTypeControl: false \/\/ Disable map and satellite buttons\n            });\n            loadOptions();\n        }\n\n        function loadOptions() {\n            fetch('https:\/\/www.wavemotion.gr\/wp-admin\/admin-ajax.php?action=load_options')\n                .then(resp => resp.json())\n                .then(data => {\n                    allOptions = data;\n                    populateOptions(data);\n                })\n                .catch(err => console.error('Error loading options:', err));\n        }\n\n        function populateOptions(data) {\n            const brandSelect = document.getElementById('brand-select');\n            const seriesSelect = document.getElementById('series-select');\n            const citySelect = document.getElementById('city-select');\n\n            \/\/ Clear existing options\n            brandSelect.innerHTML = '<option value=\"all\">\u038c\u03bb\u03b5\u03c2 \u03bf\u03b9 \u039c\u03ac\u03c1\u03ba\u03b5\u03c2<\/option>';\n            seriesSelect.innerHTML = '<option value=\"all\">\u038c\u03bb\u03b5\u03c2 \u03bf\u03b9 \u03a3\u03b5\u03b9\u03c1\u03ad\u03c2<\/option>';\n            citySelect.innerHTML = '<option value=\"all\">\u038c\u03bb\u03b5\u03c2 \u03bf\u03b9 \u03a0\u03cc\u03bb\u03b5\u03b9\u03c2<\/option>';\n\n            \/\/ Populate brand options\n            data.brands.forEach(brand => {\n                const option = document.createElement('option');\n                option.value = brand.value;\n                option.textContent = brand.label;\n                if (brand.value === selectedBrand) {\n                    option.selected = true;\n                }\n                brandSelect.appendChild(option);\n            });\n\n            \/\/ Populate series options\n            data.series.forEach(series => {\n                const option = document.createElement('option');\n                option.value = series.value;\n                option.textContent = series.label;\n                if (series.value === selectedSeries) {\n                    option.selected = true;\n                }\n                seriesSelect.appendChild(option);\n            });\n\n            \/\/ Populate city options\n            data.cities.forEach(loc => {\n                const opt = document.createElement('option');\n                opt.value = loc.value; \/\/ e.g. \"CITY|STATE|COUNTY\"\n                opt.textContent = loc.label; \/\/ e.g. \"CITY - STATE - COUNTY\"\n                if (loc.value === selectedLocation) {\n                    opt.selected = true;\n                }\n                citySelect.appendChild(opt);\n            });\n\n            \/\/ Auto-run the filter with the selected parameters if they exist\n            if (selectedBrand !== 'all' || selectedSeries !== 'all' || selectedLocation !== 'all') {\n                document.getElementById('brand-select').value = selectedBrand;\n                document.getElementById('series-select').value = selectedSeries;\n                document.getElementById('city-select').value = selectedLocation;\n                filterStores(selectedBrand, selectedSeries, selectedLocation);\n            }\n        }\n\n        function handleBrandChange() {\n            const brand = document.getElementById('brand-select').value;\n            selectedSeries = 'all';\n\n            \/\/ Reset series selection\n            document.getElementById('series-select').value = 'all';\n\n            \/\/ Update series options based on selected brand\n            updateSeriesOptions(brand);\n\n            \/\/ Update city options based on selected brand\n            updateAvailableCities(brand, 'all');\n        }\n\n        function updateSeriesOptions(brand) {\n            const seriesSelect = document.getElementById('series-select');\n            const filteredSeries = allOptions.series.filter(s => brand === 'all' || s.value.indexOf(brand) > -1);\n\n            \/\/ Clear existing options\n            seriesSelect.innerHTML = '<option value=\"all\">\u038c\u03bb\u03b5\u03c2 \u03bf\u03b9 \u03a3\u03b5\u03b9\u03c1\u03ad\u03c2<\/option>';\n\n            \/\/ Populate series options\n            filteredSeries.forEach(series => {\n                const option = document.createElement('option');\n                option.value = series.value;\n                option.textContent = series.label;\n                seriesSelect.appendChild(option);\n            });\n        }\n\n        function handleSeriesChange() {\n            const brand = document.getElementById('brand-select').value;\n            const series = document.getElementById('series-select').value;\n            selectedSeries = series;\n\n            \/\/ Update city options based on selected brand and series\n            updateAvailableCities(brand, series);\n        }\n\n        function updateAvailableCities(brand, series) {\n            fetch('https:\/\/www.wavemotion.gr\/wp-admin\/admin-ajax.php?action=get_available_cities', {\n                    method: 'POST',\n                    headers: {\n                        'Content-Type': 'application\/json'\n                    },\n                    body: JSON.stringify({\n                        brand: brand,\n                        series: series\n                    })\n                })\n                .then(resp => resp.json())\n                .then(data => {\n                    if (data.available_locations) {\n                        updateCitySelectWithFilteredLocations(data.available_locations);\n                    }\n                })\n                .catch(err => console.error('Error updating available cities:', err));\n        }\n\n        function filterOptions(brand, series) {\n            const filteredSeries = allOptions.series.filter(s => brand === 'all' || s.value.indexOf(brand) > -1);\n\n            const seriesSelect = document.getElementById('series-select');\n            const citySelect = document.getElementById('city-select');\n\n            \/\/ Clear existing options\n            seriesSelect.innerHTML = '<option value=\"all\">\u038c\u03bb\u03b5\u03c2 \u03bf\u03b9 \u03a3\u03b5\u03b9\u03c1\u03ad\u03c2<\/option>';\n            citySelect.innerHTML = '<option value=\"all\">\u038c\u03bb\u03b5\u03c2 \u03bf\u03b9 \u03a0\u03cc\u03bb\u03b5\u03b9\u03c2<\/option>';\n\n            \/\/ Populate series options\n            filteredSeries.forEach(series => {\n                const option = document.createElement('option');\n                option.value = series.value;\n                option.textContent = series.label;\n                if (series.value === selectedSeries) {\n                    option.selected = true;\n                }\n                seriesSelect.appendChild(option);\n            });\n\n            \/\/ Call filterCitiesOptions to populate city options based on the selected brand and series\n            filterCitiesOptions(brand, selectedSeries);\n        }\n\n        function filterCitiesOptions(brand, series) {\n            const citySelect = document.getElementById('city-select');\n            const filteredCities = allOptions.cities.filter(loc => {\n                if (series === 'all') return true;\n                return loc.series.includes(series);\n            });\n\n            citySelect.innerHTML = '<option value=\"all\">All Cities<\/option>';\n\n            filteredCities.forEach(loc => {\n                const opt = document.createElement('option');\n                opt.value = loc.value; \/\/ \"CITY|STATE|COUNTY\"\n                opt.textContent = loc.label; \/\/ \"CITY - STATE - COUNTY\"\n                if (loc.value === selectedLocation) {\n                    opt.selected = true;\n                }\n                citySelect.appendChild(opt);\n            });\n        }\n\n        function displayStores() {\n            const mapList = document.getElementById('map-list');\n            mapList.innerHTML = ''; \/\/ Clear the list\n\n            \/\/ Clear previous markers\n            markers.forEach(marker => marker.setMap(null));\n            markers = [];\n\n            const start = (currentPage - 1) * pageSize;\n            const end = start + pageSize;\n            const storesToDisplay = filteredStores.slice(start, end);\n\n            const bounds = new google.maps.LatLngBounds(); \/\/ Create a bounds object\n\n            storesToDisplay.forEach(store => {\n                const item = document.createElement('div');\n                item.className = 'map-list-item row';\n                item.setAttribute('data-category', store.category || '');\n                item.setAttribute('data-city', store.city || '');\n                item.innerHTML = `\n                    <div class=\"item-left col col-md-9\">\n                        <div class=\"item-title\"><a href=\"${store.url || '#'}\" target=\"_blank\">${store.title || 'No Title'}<\/a><\/div>\n                        <h6>${store.address || 'No Address'}, ${store.postcode || 'No Postcode'}, ${store.city || 'No City'}, ${store.phone || 'No Phone'}<\/h6>\n                        <div class=\"item-url\"><a href=\"${store.url || '#'}\" target=\"_blank\">${store.url || 'No URL'}<\/a><\/div>\n                    <\/div>\n                    <div class=\"item-right col col-md-3\">\n                        <span class=\"item-city\">${store.city || 'No City'}<\/span>\n                    <\/div>\n                `;\n                mapList.appendChild(item);\n\n                const marker = new google.maps.Marker({\n                    position: {\n                        lat: parseFloat(store.lat) || 0,\n                        lng: parseFloat(store.lng) || 0\n                    },\n                    map,\n                    title: store.title || 'No Title',\n                    icon: 'https:\/\/www.wavemotion.gr\/wp-content\/plugins\/wavemotion-map-widget-plugin\/images\/icon-pin_360.png',\n                });\n\n                const infoWindow = new google.maps.InfoWindow({\n                    content: `<div>\n                                <h5>${store.title || 'No Title'}<\/h5>\n                                <p>${store.address || 'No Address'} ${store.postcode || 'No Postcode'}, ${store.phone || 'No Phone'}<\/p>\n                                <a href=\"${store.url || '#'}\" target=\"_blank\">${store.url || 'No URL'}<\/a>\n                              <\/div>`\n                });\n\n                marker.addListener('click', () => {\n                    infoWindow.open({\n                        anchor: marker,\n                        map,\n                        shouldFocus: false,\n                    });\n                });\n\n                markers.push(marker);\n                bounds.extend(marker.getPosition()); \/\/ Extend the bounds to include this marker's position\n            });\n\n            if (storesToDisplay.length > 0) {\n                map.fitBounds(bounds); \/\/ Adjust the map's center and zoom to fit the bounds\n            }\n        }\n\n        function setupPagination() {\n            const pagination = document.getElementById('pagination');\n            pagination.innerHTML = '';\n\n            const pageCount = Math.ceil(filteredStores.length \/ pageSize);\n            const maxPagesToShow = 4;\n            const halfPagesToShow = Math.floor(maxPagesToShow \/ 2);\n\n            function createPageButton(page) {\n                const pageButton = document.createElement('a');\n                pageButton.textContent = page;\n                pageButton.className = 'page-button';\n                if (page === currentPage) {\n                    pageButton.classList.add('active');\n                }\n                pageButton.addEventListener('click', () => {\n                    currentPage = page;\n                    displayStores();\n                    setupPagination();\n                });\n                return pageButton;\n            }\n\n            \/\/ Show first page\n            if (pageCount > 0) {\n                pagination.appendChild(createPageButton(1));\n            }\n\n            \/\/ Show pages with ellipses\n            if (pageCount > maxPagesToShow) {\n                if (currentPage > halfPagesToShow + 1) {\n                    pagination.appendChild(document.createTextNode('...'));\n                }\n\n                let startPage = Math.max(2, currentPage - halfPagesToShow);\n                let endPage = Math.min(pageCount - 1, currentPage + halfPagesToShow);\n\n                if (currentPage <= halfPagesToShow) {\n                    endPage = maxPagesToShow - 1;\n                }\n                if (currentPage >= pageCount - halfPagesToShow) {\n                    startPage = pageCount - maxPagesToShow + 2;\n                }\n\n                for (let i = startPage; i <= endPage; i++) {\n                    pagination.appendChild(createPageButton(i));\n                }\n\n                if (currentPage < pageCount - halfPagesToShow) {\n                    pagination.appendChild(document.createTextNode('...'));\n                }\n            } else {\n                for (let i = 2; i < pageCount; i++) {\n                    pagination.appendChild(createPageButton(i));\n                }\n            }\n\n            \/\/ Show last page\n            if (pageCount > 1) {\n                pagination.appendChild(createPageButton(pageCount));\n            }\n        }\n\n        function filterStores(\n            brand = document.getElementById('brand-select').value,\n            series = document.getElementById('series-select').value,\n            location = document.getElementById('city-select').value\n        ) {\n            fetch('https:\/\/www.wavemotion.gr\/wp-admin\/admin-ajax.php?action=filter_stores', {\n                    method: 'POST',\n                    headers: {\n                        'Content-Type': 'application\/json'\n                    },\n                    body: JSON.stringify({\n                        brand,\n                        series,\n                        location\n                    })\n                })\n                .then(resp => resp.json())\n                .then(data => {\n                    filteredStores = data.stores;\n                    currentPage = 1;\n                    displayStores();\n                    setupPagination();\n\n                    \/\/ Only update city-select if we're not filtering by a specific location\n                    \/\/ This prevents the city dropdown from emptying when we search with a specific city\n                    if (location === 'all' && data.available_locations) {\n                        updateCitySelectWithFilteredLocations(data.available_locations);\n                    }\n                })\n                .catch(err => console.error('Error filtering stores:', err));\n        }\n\n        function updateCitySelectWithFilteredLocations(locations) {\n            const citySelect = document.getElementById('city-select');\n            const currentValue = citySelect.value;\n\n            \/\/ Clear existing options\n            citySelect.innerHTML = '<option value=\"all\">\u038c\u03bb\u03b5\u03c2 \u03bf\u03b9 \u03a0\u03cc\u03bb\u03b5\u03b9\u03c2<\/option>';\n\n            \/\/ Add new filtered locations\n            locations.forEach(loc => {\n                const option = document.createElement('option');\n                option.value = loc.value; \/\/ e.g. \"\u0391\u0393\u0399\u0391 \u03a0\u0391\u03a1\u0391\u03a3\u039a\u0395\u03a5\u0397|\u0391\u0393\u0399\u0391 \u03a0\u0391\u03a1\u0391\u03a3\u039a\u0395\u03a5\u0397|\u0391\u03a4\u03a4\u0399\u039a\u0397\u03a3\"\n                option.textContent = loc.label; \/\/ e.g. \"\u0391\u0393\u0399\u0391 \u03a0\u0391\u03a1\u0391\u03a3\u039a\u0395\u03a5\u0397 - \u0391\u0393\u0399\u0391 \u03a0\u0391\u03a1\u0391\u03a3\u039a\u0395\u03a5\u0397 - \u0391\u03a4\u03a4\u0399\u039a\u0397\u03a3\"\n\n                \/\/ Restore previous selection if it still exists in filtered results\n                if (loc.value === currentValue) {\n                    option.selected = true;\n                }\n\n                citySelect.appendChild(option);\n            });\n\n            \/\/ If the previous selection is not available in filtered results, reset to 'all'\n            if (currentValue !== 'all' && !locations.find(loc => loc.value === currentValue)) {\n                citySelect.value = 'all';\n            }\n        }\n\n        document.getElementById('brand-select').addEventListener('change', handleBrandChange);\n        document.getElementById('series-select').addEventListener('change', handleSeriesChange);\n    <\/script>\n<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>\u0394\u03af\u03ba\u03c4\u03c5\u03bf \u0395\u03be\u03bf\u03c5\u03c3\u03b9\u03bf\u03b4\u03bf\u03c4\u03b7\u03bc\u03ad\u03bd\u03c9\u03bd \u039c\u03b5\u03c4\u03b1\u03c0\u03c9\u03bb\u03b7\u03c4\u03ce\u03bd \u0391\u03c0\u03b5\u03c5\u03b8\u03c5\u03bd\u03b8\u03b5\u03af\u03c4\u03b5 \u03c3\u03c4\u03bf\u03c5\u03c2 \u03b1\u03be\u03b9\u03cc\u03c0\u03b9\u03c3\u03c4\u03bf\u03c5\u03c2 \u03a3\u03c5\u03bd\u03b5\u03c1\u03b3\u03ac\u03c4\u03b5\u03c2 \u03bc\u03b1\u03c2! \u0395\u03bd\u03c4\u03bf\u03c0\u03af\u03c3\u03c4\u03b5 \u03c4\u03bf\u03bd \u03c0\u03bb\u03b7\u03c3\u03b9\u03ad\u03c3\u03c4\u03b5\u03c1\u03bf \u03c3\u03b5 \u03b5\u03c3\u03ac\u03c2 \u0395\u03be\u03bf\u03c5\u03c3\u03b9\u03bf\u03b4\u03bf\u03c4\u03b7\u03bc\u03ad\u03bd\u03bf \u039c\u03b5\u03c4\u03b1\u03c0\u03c9\u03bb\u03b7\u03c4\u03ae \u03bc\u03b1\u03c2, \u03b3\u03b9\u03b1 \u03bd\u03b1 \u03b2\u03c1\u03b5\u03af\u03c4\u03b5 \u03c4\u03bf \u03c0\u03c1\u03bf\u03ca\u03cc\u03bd \u03c0\u03bf\u03c5 \u03c3\u03b1\u03c2 \u03b5\u03bd\u03b4\u03b9\u03b1\u03c6\u03ad\u03c1\u03b5\u03b9.<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":1,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-4817","page","type-page","status-publish","hentry"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.0 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>\u0394\u03af\u03ba\u03c4\u03c5\u03bf \u039c\u03b5\u03c4\u03b1\u03c0\u03c9\u03bb\u03b7\u03c4\u03ce\u03bd - Wavemotion<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.wavemotion.gr\/el\/%ce%b4%ce%af%ce%ba%cf%84%cf%85%ce%bf-%ce%bc%ce%b5%cf%84%ce%b1%cf%80%cf%89%ce%bb%ce%b7%cf%84%cf%8e%ce%bd\/\" \/>\n<meta property=\"og:locale\" content=\"el_GR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"\u0394\u03af\u03ba\u03c4\u03c5\u03bf \u039c\u03b5\u03c4\u03b1\u03c0\u03c9\u03bb\u03b7\u03c4\u03ce\u03bd - Wavemotion\" \/>\n<meta property=\"og:description\" content=\"\u0394\u03af\u03ba\u03c4\u03c5\u03bf \u0395\u03be\u03bf\u03c5\u03c3\u03b9\u03bf\u03b4\u03bf\u03c4\u03b7\u03bc\u03ad\u03bd\u03c9\u03bd \u039c\u03b5\u03c4\u03b1\u03c0\u03c9\u03bb\u03b7\u03c4\u03ce\u03bd \u0391\u03c0\u03b5\u03c5\u03b8\u03c5\u03bd\u03b8\u03b5\u03af\u03c4\u03b5 \u03c3\u03c4\u03bf\u03c5\u03c2 \u03b1\u03be\u03b9\u03cc\u03c0\u03b9\u03c3\u03c4\u03bf\u03c5\u03c2 \u03a3\u03c5\u03bd\u03b5\u03c1\u03b3\u03ac\u03c4\u03b5\u03c2 \u03bc\u03b1\u03c2! \u0395\u03bd\u03c4\u03bf\u03c0\u03af\u03c3\u03c4\u03b5 \u03c4\u03bf\u03bd \u03c0\u03bb\u03b7\u03c3\u03b9\u03ad\u03c3\u03c4\u03b5\u03c1\u03bf \u03c3\u03b5 \u03b5\u03c3\u03ac\u03c2 \u0395\u03be\u03bf\u03c5\u03c3\u03b9\u03bf\u03b4\u03bf\u03c4\u03b7\u03bc\u03ad\u03bd\u03bf \u039c\u03b5\u03c4\u03b1\u03c0\u03c9\u03bb\u03b7\u03c4\u03ae \u03bc\u03b1\u03c2, \u03b3\u03b9\u03b1 \u03bd\u03b1 \u03b2\u03c1\u03b5\u03af\u03c4\u03b5 \u03c4\u03bf \u03c0\u03c1\u03bf\u03ca\u03cc\u03bd \u03c0\u03bf\u03c5 \u03c3\u03b1\u03c2 \u03b5\u03bd\u03b4\u03b9\u03b1\u03c6\u03ad\u03c1\u03b5\u03b9.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.wavemotion.gr\/el\/%ce%b4%ce%af%ce%ba%cf%84%cf%85%ce%bf-%ce%bc%ce%b5%cf%84%ce%b1%cf%80%cf%89%ce%bb%ce%b7%cf%84%cf%8e%ce%bd\/\" \/>\n<meta property=\"og:site_name\" content=\"Wavemotion\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/WaveMoti0n\/\" \/>\n<meta property=\"article:modified_time\" content=\"2024-10-02T09:23:44+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"\u0395\u03ba\u03c4\u03b9\u03bc\u03ce\u03bc\u03b5\u03bd\u03bf\u03c2 \u03c7\u03c1\u03cc\u03bd\u03bf\u03c2 \u03b1\u03bd\u03ac\u03b3\u03bd\u03c9\u03c3\u03b7\u03c2\" \/>\n\t<meta name=\"twitter:data1\" content=\"1 \u03bb\u03b5\u03c0\u03c4\u03cc\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.wavemotion.gr\/el\/%ce%b4%ce%af%ce%ba%cf%84%cf%85%ce%bf-%ce%bc%ce%b5%cf%84%ce%b1%cf%80%cf%89%ce%bb%ce%b7%cf%84%cf%8e%ce%bd\/\",\"url\":\"https:\/\/www.wavemotion.gr\/el\/%ce%b4%ce%af%ce%ba%cf%84%cf%85%ce%bf-%ce%bc%ce%b5%cf%84%ce%b1%cf%80%cf%89%ce%bb%ce%b7%cf%84%cf%8e%ce%bd\/\",\"name\":\"\u0394\u03af\u03ba\u03c4\u03c5\u03bf \u039c\u03b5\u03c4\u03b1\u03c0\u03c9\u03bb\u03b7\u03c4\u03ce\u03bd - Wavemotion\",\"isPartOf\":{\"@id\":\"https:\/\/www.wavemotion.gr\/el\/#website\"},\"datePublished\":\"2024-04-23T08:48:09+00:00\",\"dateModified\":\"2024-10-02T09:23:44+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.wavemotion.gr\/el\/%ce%b4%ce%af%ce%ba%cf%84%cf%85%ce%bf-%ce%bc%ce%b5%cf%84%ce%b1%cf%80%cf%89%ce%bb%ce%b7%cf%84%cf%8e%ce%bd\/#breadcrumb\"},\"inLanguage\":\"el\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.wavemotion.gr\/el\/%ce%b4%ce%af%ce%ba%cf%84%cf%85%ce%bf-%ce%bc%ce%b5%cf%84%ce%b1%cf%80%cf%89%ce%bb%ce%b7%cf%84%cf%8e%ce%bd\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.wavemotion.gr\/el\/%ce%b4%ce%af%ce%ba%cf%84%cf%85%ce%bf-%ce%bc%ce%b5%cf%84%ce%b1%cf%80%cf%89%ce%bb%ce%b7%cf%84%cf%8e%ce%bd\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.wavemotion.gr\/el\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"\u0394\u03af\u03ba\u03c4\u03c5\u03bf \u039c\u03b5\u03c4\u03b1\u03c0\u03c9\u03bb\u03b7\u03c4\u03ce\u03bd\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.wavemotion.gr\/el\/#website\",\"url\":\"https:\/\/www.wavemotion.gr\/el\/\",\"name\":\"Wavemotion\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/www.wavemotion.gr\/el\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.wavemotion.gr\/el\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"el\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.wavemotion.gr\/el\/#organization\",\"name\":\"Wavemotion\",\"url\":\"https:\/\/www.wavemotion.gr\/el\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"el\",\"@id\":\"https:\/\/www.wavemotion.gr\/el\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.wavemotion.gr\/wp-content\/uploads\/2024\/04\/waveMotionLogo_cmyk-light.png\",\"contentUrl\":\"https:\/\/www.wavemotion.gr\/wp-content\/uploads\/2024\/04\/waveMotionLogo_cmyk-light.png\",\"width\":700,\"height\":142,\"caption\":\"Wavemotion\"},\"image\":{\"@id\":\"https:\/\/www.wavemotion.gr\/el\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/WaveMoti0n\/\",\"https:\/\/www.instagram.com\/wavemotionaudiovision\/\",\"https:\/\/www.linkedin.com\/company\/wavemotion\/\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"\u0394\u03af\u03ba\u03c4\u03c5\u03bf \u039c\u03b5\u03c4\u03b1\u03c0\u03c9\u03bb\u03b7\u03c4\u03ce\u03bd - Wavemotion","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.wavemotion.gr\/el\/%ce%b4%ce%af%ce%ba%cf%84%cf%85%ce%bf-%ce%bc%ce%b5%cf%84%ce%b1%cf%80%cf%89%ce%bb%ce%b7%cf%84%cf%8e%ce%bd\/","og_locale":"el_GR","og_type":"article","og_title":"\u0394\u03af\u03ba\u03c4\u03c5\u03bf \u039c\u03b5\u03c4\u03b1\u03c0\u03c9\u03bb\u03b7\u03c4\u03ce\u03bd - Wavemotion","og_description":"\u0394\u03af\u03ba\u03c4\u03c5\u03bf \u0395\u03be\u03bf\u03c5\u03c3\u03b9\u03bf\u03b4\u03bf\u03c4\u03b7\u03bc\u03ad\u03bd\u03c9\u03bd \u039c\u03b5\u03c4\u03b1\u03c0\u03c9\u03bb\u03b7\u03c4\u03ce\u03bd \u0391\u03c0\u03b5\u03c5\u03b8\u03c5\u03bd\u03b8\u03b5\u03af\u03c4\u03b5 \u03c3\u03c4\u03bf\u03c5\u03c2 \u03b1\u03be\u03b9\u03cc\u03c0\u03b9\u03c3\u03c4\u03bf\u03c5\u03c2 \u03a3\u03c5\u03bd\u03b5\u03c1\u03b3\u03ac\u03c4\u03b5\u03c2 \u03bc\u03b1\u03c2! \u0395\u03bd\u03c4\u03bf\u03c0\u03af\u03c3\u03c4\u03b5 \u03c4\u03bf\u03bd \u03c0\u03bb\u03b7\u03c3\u03b9\u03ad\u03c3\u03c4\u03b5\u03c1\u03bf \u03c3\u03b5 \u03b5\u03c3\u03ac\u03c2 \u0395\u03be\u03bf\u03c5\u03c3\u03b9\u03bf\u03b4\u03bf\u03c4\u03b7\u03bc\u03ad\u03bd\u03bf \u039c\u03b5\u03c4\u03b1\u03c0\u03c9\u03bb\u03b7\u03c4\u03ae \u03bc\u03b1\u03c2, \u03b3\u03b9\u03b1 \u03bd\u03b1 \u03b2\u03c1\u03b5\u03af\u03c4\u03b5 \u03c4\u03bf \u03c0\u03c1\u03bf\u03ca\u03cc\u03bd \u03c0\u03bf\u03c5 \u03c3\u03b1\u03c2 \u03b5\u03bd\u03b4\u03b9\u03b1\u03c6\u03ad\u03c1\u03b5\u03b9.","og_url":"https:\/\/www.wavemotion.gr\/el\/%ce%b4%ce%af%ce%ba%cf%84%cf%85%ce%bf-%ce%bc%ce%b5%cf%84%ce%b1%cf%80%cf%89%ce%bb%ce%b7%cf%84%cf%8e%ce%bd\/","og_site_name":"Wavemotion","article_publisher":"https:\/\/www.facebook.com\/WaveMoti0n\/","article_modified_time":"2024-10-02T09:23:44+00:00","twitter_card":"summary_large_image","twitter_misc":{"\u0395\u03ba\u03c4\u03b9\u03bc\u03ce\u03bc\u03b5\u03bd\u03bf\u03c2 \u03c7\u03c1\u03cc\u03bd\u03bf\u03c2 \u03b1\u03bd\u03ac\u03b3\u03bd\u03c9\u03c3\u03b7\u03c2":"1 \u03bb\u03b5\u03c0\u03c4\u03cc"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.wavemotion.gr\/el\/%ce%b4%ce%af%ce%ba%cf%84%cf%85%ce%bf-%ce%bc%ce%b5%cf%84%ce%b1%cf%80%cf%89%ce%bb%ce%b7%cf%84%cf%8e%ce%bd\/","url":"https:\/\/www.wavemotion.gr\/el\/%ce%b4%ce%af%ce%ba%cf%84%cf%85%ce%bf-%ce%bc%ce%b5%cf%84%ce%b1%cf%80%cf%89%ce%bb%ce%b7%cf%84%cf%8e%ce%bd\/","name":"\u0394\u03af\u03ba\u03c4\u03c5\u03bf \u039c\u03b5\u03c4\u03b1\u03c0\u03c9\u03bb\u03b7\u03c4\u03ce\u03bd - Wavemotion","isPartOf":{"@id":"https:\/\/www.wavemotion.gr\/el\/#website"},"datePublished":"2024-04-23T08:48:09+00:00","dateModified":"2024-10-02T09:23:44+00:00","breadcrumb":{"@id":"https:\/\/www.wavemotion.gr\/el\/%ce%b4%ce%af%ce%ba%cf%84%cf%85%ce%bf-%ce%bc%ce%b5%cf%84%ce%b1%cf%80%cf%89%ce%bb%ce%b7%cf%84%cf%8e%ce%bd\/#breadcrumb"},"inLanguage":"el","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.wavemotion.gr\/el\/%ce%b4%ce%af%ce%ba%cf%84%cf%85%ce%bf-%ce%bc%ce%b5%cf%84%ce%b1%cf%80%cf%89%ce%bb%ce%b7%cf%84%cf%8e%ce%bd\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.wavemotion.gr\/el\/%ce%b4%ce%af%ce%ba%cf%84%cf%85%ce%bf-%ce%bc%ce%b5%cf%84%ce%b1%cf%80%cf%89%ce%bb%ce%b7%cf%84%cf%8e%ce%bd\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.wavemotion.gr\/el\/"},{"@type":"ListItem","position":2,"name":"\u0394\u03af\u03ba\u03c4\u03c5\u03bf \u039c\u03b5\u03c4\u03b1\u03c0\u03c9\u03bb\u03b7\u03c4\u03ce\u03bd"}]},{"@type":"WebSite","@id":"https:\/\/www.wavemotion.gr\/el\/#website","url":"https:\/\/www.wavemotion.gr\/el\/","name":"Wavemotion","description":"","publisher":{"@id":"https:\/\/www.wavemotion.gr\/el\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.wavemotion.gr\/el\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"el"},{"@type":"Organization","@id":"https:\/\/www.wavemotion.gr\/el\/#organization","name":"Wavemotion","url":"https:\/\/www.wavemotion.gr\/el\/","logo":{"@type":"ImageObject","inLanguage":"el","@id":"https:\/\/www.wavemotion.gr\/el\/#\/schema\/logo\/image\/","url":"https:\/\/www.wavemotion.gr\/wp-content\/uploads\/2024\/04\/waveMotionLogo_cmyk-light.png","contentUrl":"https:\/\/www.wavemotion.gr\/wp-content\/uploads\/2024\/04\/waveMotionLogo_cmyk-light.png","width":700,"height":142,"caption":"Wavemotion"},"image":{"@id":"https:\/\/www.wavemotion.gr\/el\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/WaveMoti0n\/","https:\/\/www.instagram.com\/wavemotionaudiovision\/","https:\/\/www.linkedin.com\/company\/wavemotion\/"]}]}},"_links":{"self":[{"href":"https:\/\/www.wavemotion.gr\/el\/wp-json\/wp\/v2\/pages\/4817","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.wavemotion.gr\/el\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.wavemotion.gr\/el\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.wavemotion.gr\/el\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.wavemotion.gr\/el\/wp-json\/wp\/v2\/comments?post=4817"}],"version-history":[{"count":5,"href":"https:\/\/www.wavemotion.gr\/el\/wp-json\/wp\/v2\/pages\/4817\/revisions"}],"predecessor-version":[{"id":5070,"href":"https:\/\/www.wavemotion.gr\/el\/wp-json\/wp\/v2\/pages\/4817\/revisions\/5070"}],"wp:attachment":[{"href":"https:\/\/www.wavemotion.gr\/el\/wp-json\/wp\/v2\/media?parent=4817"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}