default.php
1 month ago
default.xml
1 month ago
default_appointment.php
1 month ago
default_attendees.php
1 month ago
default_backbutton.php
1 month ago
default_countdown.php
1 month ago
default_locations.php
1 month ago
default_orderdetails.php
1 month ago
default_service.php
1 month ago
default_usernote.php
1 month ago
default_usernote_block.php
1 month ago
index.html
1 month ago
track.php
1 month ago
default_locations.php
108 lines
| 1 | <?php |
| 2 | /** |
| 3 | * @package VikAppointments |
| 4 | * @subpackage core |
| 5 | * @author E4J s.r.l. |
| 6 | * @copyright Copyright (C) 2021 E4J s.r.l. All Rights Reserved. |
| 7 | * @license http://www.gnu.org/licenses/gpl-2.0.html GNU/GPL |
| 8 | * @link https://vikwp.com |
| 9 | */ |
| 10 | |
| 11 | // No direct access |
| 12 | defined('ABSPATH') or die('No script kiddies please!'); |
| 13 | |
| 14 | JHtml::fetch('vaphtml.assets.googlemaps'); |
| 15 | |
| 16 | JText::script('VAP_GET_DIRECTIONS_BTN'); |
| 17 | |
| 18 | ?> |
| 19 | |
| 20 | <div id="vap-loc-googlemap" style="width:100%;height:380px;margin-top:10px;"></div> |
| 21 | |
| 22 | <script> |
| 23 | |
| 24 | (function($) { |
| 25 | 'use strict' |
| 26 | |
| 27 | $(function() { |
| 28 | const COORDINATES = <?php echo json_encode($this->locations); ?>; |
| 29 | |
| 30 | // create map instance |
| 31 | const map = new google.maps.Map(document.getElementById('vap-loc-googlemap'), { |
| 32 | mapTypeId: google.maps.MapTypeId.ROADMAP, |
| 33 | zoom: 18, |
| 34 | }); |
| 35 | |
| 36 | // create marker info popup |
| 37 | const infowindow = new google.maps.InfoWindow(); |
| 38 | |
| 39 | let marker, i; |
| 40 | |
| 41 | const markerBounds = new google.maps.LatLngBounds(); |
| 42 | |
| 43 | for (i = 0; i < COORDINATES.length; i++) { |
| 44 | let position = new google.maps.LatLng(COORDINATES[i].lat, COORDINATES[i].lng); |
| 45 | |
| 46 | // create map marker |
| 47 | marker = new google.maps.Marker({ |
| 48 | position: position, |
| 49 | map: map, |
| 50 | icon: '<?php echo VAPASSETS_URI . 'css/images/red-marker.png'; ?>', |
| 51 | }); |
| 52 | |
| 53 | // set Drop animation |
| 54 | marker.setAnimation(google.maps.Animation.DROP); |
| 55 | // adjust bounds for correct Zoom |
| 56 | markerBounds.extend(position); |
| 57 | |
| 58 | // display popup when clicking the marker |
| 59 | google.maps.event.addListener(marker, 'click', ((marker, i) => { |
| 60 | return () => { |
| 61 | |
| 62 | let href; |
| 63 | |
| 64 | if (navigator.isMac() || navigator.isiOS()) { |
| 65 | // iPhone or Mac, open through native Maps app |
| 66 | href = 'maps://?q=' + COORDINATES[i].lat + ',' + COORDINATES[i].lng; |
| 67 | |
| 68 | // or use the code below to search by address rather than by coordinates |
| 69 | // href = 'maps://?q=' + encodeURIComponent(COORDINATES[i].address); |
| 70 | } else if (navigator.isAndroid()) { |
| 71 | // Android device, open through native Google Maps |
| 72 | href = 'geo:' + COORDINATES[i].lat + ',' + COORDINATES[i].lng; |
| 73 | |
| 74 | // or use the code below to search by address rather than by coordinates |
| 75 | // href = 'geo:0,0?q=' + encodeURIComponent(COORDINATES[i].address); |
| 76 | } else { |
| 77 | // fallback to web Google Maps |
| 78 | href = 'https://maps.google.com/maps?q=' + COORDINATES[i].lat + ',' + COORDINATES[i].lng; |
| 79 | |
| 80 | // or use the code below to search by address rather than by coordinates |
| 81 | // href = 'https://maps.google.com/maps?q=' + encodeURIComponent(COORDINATES[i].address); |
| 82 | } |
| 83 | |
| 84 | // create button to get address directions |
| 85 | const mapsBtn = $('<div class="vap-gm-infowindow-button"></div>') |
| 86 | .append( |
| 87 | $('<a class="vap-btn blue" target="_blank"></a>') |
| 88 | .attr('href', href) |
| 89 | .text(Joomla.JText._('VAP_GET_DIRECTIONS_BTN')) |
| 90 | ); |
| 91 | |
| 92 | infowindow.setContent(COORDINATES[i].label + mapsBtn[0].outerHTML); |
| 93 | infowindow.open(map, marker); |
| 94 | } |
| 95 | })(marker, i)); |
| 96 | } |
| 97 | |
| 98 | if (COORDINATES.length > 1) { |
| 99 | // fit zoom according to the registered bounds |
| 100 | map.fitBounds(markerBounds); |
| 101 | } |
| 102 | |
| 103 | map.setCenter(markerBounds.getCenter()); |
| 104 | }); |
| 105 | })(jQuery); |
| 106 | |
| 107 | </script> |
| 108 |