Changeset 2499825

Timestamp:

03/20/2021 12:10:51 AM (5 years ago)

Author:

intelchip

Message:

New updates.

• Set different zoom levels for mobile/tablet viewports.
• Removed previous tags before 1.0.6

Location:

osm-map-elementor

Files:

• tags/1.0.0 (deleted)
• tags/1.0.3 (deleted)
• tags/1.0.4 (deleted)
• tags/1.0.5 (deleted)
• trunk/constants.php (modified) (1 diff)
• trunk/osm-map-elementor.php (modified) (1 diff)
• trunk/osm-map.php (modified) (12 diffs)
• trunk/readme.txt (modified) (2 diffs)

osm-map-elementor/trunk/constants.php

@@ -1 +1 @@
 <?php
 define('OSM_MAP_SLUG', 'osm-map-elementor');
-define('OSM_MAP_VERSION', '1.0.6');
+define('OSM_PLUGIN_FOLDER', basename(__DIR__));
+define('OSM_MAP_VERSION', '1.0.7');

osm-map-elementor/trunk/osm-map-elementor.php

@@ -5 +5 @@
  * Author:          ACT Innovate
  * Author URI:      https://github.com/flopperj/elementor-osm-map
- * Version:         1.0.6
+ * Version:         1.0.7
  */
 

osm-map-elementor/trunk/osm-map.php

@@ -11 +11 @@
 use Elementor\Core\Kits\Documents\Tabs\Global_Colors;
 use Elementor\Core\Kits\Documents\Tabs\Global_Typography;
+use Elementor\Core\Responsive\Responsive;
 
 /**
@@ -256 +257 @@
         );
 
-        $this->add_control(
+        $this->add_responsive_control(
             'zoom',
             [
                 'label' => __('Zoom Level', self::$slug),
                 'type' => \Elementor\Controls_Manager::SLIDER,
-                'default' => [
-                    'size' => 10,
-                ],
                 'range' => [
                     'px' => [
@@ -269 +267 @@
                         'max' => 20,
                     ],
+                ],
+                'devices' => ['desktop', 'tablet', 'mobile'],
+                'desktop_default' => [
+                    'size' => 10,
+                    'unit' => 'px',
+                ],
+                'tablet_default' => [
+                    'size' => 10,
+                    'unit' => 'px',
+                ],
+                'mobile_default' => [
+                    'size' => 10,
+                    'unit' => 'px',
                 ],
                 'separator' => 'before',
@@ -1346 +1357 @@
         $settings = $this->get_settings_for_display();
         $markers = $this->get_settings_for_display('marker_list');
+        $settings['breakpoints'] = Responsive::get_breakpoints();
 
         if (0 === absint($settings['zoom']['size'])) {
@@ -1379 +1391 @@
         echo '<div id="osm-map-' . $this->get_id() . '" 
         class="osm-map-container" 
-        data-center="' . implode(',', $center_coords) . '" 
-        data-zoom="' . $settings['zoom']['size'] . '"></div>';
+        data-center="' . implode(',', $center_coords) . '"></div>';
 
         ?>
@@ -1390 +1401 @@
             jQuery(window).ready(function () {
                 "use strict";
+                const displaySettings = <?php echo json_encode($settings); ?>;
                 const mapId = '<?php echo 'osm-map-' . $this->get_id(); ?>';
                 const mapContainer = jQuery('#' + mapId);
                 const center = mapContainer.data('center');
-                const zoom = mapContainer.data('zoom');
+                const hasDesktopZoomLevel = displaySettings && displaySettings.hasOwnProperty('zoom') && displaySettings.zoom && displaySettings.zoom.hasOwnProperty('size');
+                const hasTabletZoomLevel = displaySettings && displaySettings.hasOwnProperty('zoom_tablet') && displaySettings.zoom_tablet && displaySettings.zoom_tablet.hasOwnProperty('size');
+                const hasMobileZoomLevel = displaySettings && displaySettings.hasOwnProperty('zoom_mobile') && displaySettings.zoom_mobile && displaySettings.zoom_mobile.hasOwnProperty('size');
+                let zoomLevel = hasDesktopZoomLevel ? displaySettings.zoom.size : 10;
+
+                // look at break points for different screen sizes
+                const viewPortWidth = jQuery('body').width();
+                const isTabletView = displaySettings &&
+                    displaySettings.hasOwnProperty('breakpoints') && displaySettings.breakpoints &&
+                    displaySettings.breakpoints.hasOwnProperty('sm') &&
+                    displaySettings.breakpoints.hasOwnProperty('md') &&
+                    viewPortWidth > displaySettings.breakpoints.sm &&
+                    viewPortWidth <= displaySettings.breakpoints.md;
+                const isMobileView = displaySettings &&
+                    displaySettings.hasOwnProperty('breakpoints') && displaySettings.breakpoints &&
+                    displaySettings.breakpoints.hasOwnProperty('sm') &&
+                    viewPortWidth <= displaySettings.breakpoints.sm;
+
+                // check for tablet and mobile screen sizes
+                if (hasTabletZoomLevel && isTabletView) {
+                    zoomLevel = displaySettings.zoom_tablet.size;
+                } else if (hasMobileZoomLevel && isMobileView) {
+                    zoomLevel = displaySettings.zoom_mobile.size;
+                }
 
                 // avoid recreating the html element
@@ -1408 +1443 @@
                 if (center) {
                     let centerCoords = center.split(',');
-                    map.setView(centerCoords, zoom);
+                    map.setView(centerCoords, zoomLevel);
                 }
 
@@ -1537 +1572 @@
                 const buildMarkers = function (markers) {
 
+                    let _markers = [];
                     jQuery.each(markers, function () {
                         const marker = L.marker([this.lat, this.lng], markerOptions);
+                        _markers.push(marker);
 
                         // add marker to map
@@ -1640 +1677 @@
 
                     // set center coordinates
-                    map.setView([lat, lng], zoom);
+                    map.setView([lat, lng], zoomLevel);
 
                     // build our markers
@@ -1678 +1715 @@
 
         $styles = [
-            'leaflet' => plugins_url('/osm-map-elementor/assets/leaflet/leaflet.css'),
-            'mapbox-gl' => plugins_url('/osm-map-elementor/assets/css/mapbox-gl.css'),
-            'leaflet-fa-markers' => plugins_url('/osm-map-elementor/assets/leaflet-fa-markers/L.Icon.FontAwesome.css'),
-            'osm-map-elementor' => plugins_url('/osm-map-elementor/assets/css/osm-map-elementor.css')
+            'leaflet' => plugins_url('/' . OSM_PLUGIN_FOLDER . '/assets/leaflet/leaflet.css'),
+            'mapbox-gl' => plugins_url('/' . OSM_PLUGIN_FOLDER . '/assets/css/mapbox-gl.css'),
+            'leaflet-fa-markers' => plugins_url('/' . OSM_PLUGIN_FOLDER . '/assets/leaflet-fa-markers/L.Icon.FontAwesome.css'),
+            'osm-map-elementor' => plugins_url('/' . OSM_PLUGIN_FOLDER . '/assets/css/osm-map-elementor.css')
         ];
 
         // load fontawesome
         if (!empty($widget_settings) && !array_key_exists('enable_fontawesome', $widget_settings) || !empty($widget_settings['enable_fontawesome'])) {
-            $styles['font-awesome-free'] = plugins_url('/osm-map-elementor/assets/fontawesome-free-5.15.1/css/all.min.css');
+            $styles['font-awesome-free'] = plugins_url('/' . OSM_PLUGIN_FOLDER . '/assets/fontawesome-free-5.15.1/css/all.min.css');
         }
 
@@ -1699 +1736 @@
             // queue google maps key if provided
             $admin_scripts = [
-                'osm-map-elementor-controls' => plugins_url('/osm-map-elementor/assets/js/osm-map-controls.js')
+                'osm-map-elementor-controls' => plugins_url('/' . OSM_PLUGIN_FOLDER . '/assets/js/osm-map-controls.js')
             ];
 
@@ -1717 +1754 @@
         // queue widget view js
         $scripts = [
-            'leaflet' => plugins_url('/osm-map-elementor/assets/leaflet/leaflet.js'),
-            'mapbox-gl' => plugins_url('/osm-map-elementor/assets/js/mapbox-gl.js'),
-            'leaflet-mapbox-gl' => plugins_url('/osm-map-elementor/assets/leaflet/leaflet-mapbox-gl.js'),
-            'leaflet-fa-markers' => plugins_url('/osm-map-elementor/assets/leaflet-fa-markers/L.Icon.FontAwesome.js'),
+            'leaflet' => plugins_url('/' . OSM_PLUGIN_FOLDER . '/assets/leaflet/leaflet.js'),
+            'mapbox-gl' => plugins_url('/' . OSM_PLUGIN_FOLDER . '/assets/js/mapbox-gl.js'),
+            'leaflet-mapbox-gl' => plugins_url('/' . OSM_PLUGIN_FOLDER . '/assets/leaflet/leaflet-mapbox-gl.js'),
+            'leaflet-fa-markers' => plugins_url('/' . OSM_PLUGIN_FOLDER . '/assets/leaflet-fa-markers/L.Icon.FontAwesome.js'),
         ];
         $deps = [];

osm-map-elementor/trunk/readme.txt

@@ -1 +1 @@
 === OSM Map Widget for Elementor ===
 Plugin Name: OSM Map Widget for Elementor
-Version: 1.0.6
+Version: 1.0.7
 Author: ACT Innovate
 Author URI: https://github.com/flopperj/osm-map-elementor
@@ -8 +8 @@
 Tested up to: 5.6
 Requires PHP: 5.6
-Stable tag: 1.0.6
+Stable tag: 1.0.7
 License: GPLv3
 License URI: https://www.gnu.org/licenses/gpl-3.0.html