premium-maps.php — Premium Addons for Elementor – Powerful Elementor Templates & Widgets 2.5.6

premium-addons-for-elementor / widgets / premium-maps.php

premium-addons-for-elementor / widgets Last commit date

premium-maps.php

653 lines

1	<?php
2	namespace Elementor;
3
4	if ( ! defined( 'ABSPATH' ) ) exit; // If this file is called directly, abort.
5
6	class Premium_Maps_Widget extends Widget_Base
7	{
8	public function get_name() {
9	return 'premium-addon-maps';
10	}
11
12	public function is_reload_preview_required()
13	{
14	return true;
15	}
16
17	public function get_title() {
18	return \PremiumAddons\Helper_Functions::get_prefix() . ' Maps';
19	}
20
21	public function get_icon() {
22	return 'pa-maps';
23	}
24
25	public function get_categories() {
26	return [ 'premium-elements' ];
27	}
28
29	public function get_script_depends() {
30	return ['premium-maps-api-js' , 'premium-maps-js'];
31	}
32
33	// Adding the controls fields for the premium maps
34	// This will controls the animation, colors and background, dimensions etc
35	protected function _register_controls() {
36
37	/* Start Map Settings Section */
38	$this->start_controls_section('premium_maps_map_settings',
39	[
40	'label' => esc_html__('Center Location', 'premium-addons-for-elementor'),
41	]
42	);
43
44	$map_api = get_option( 'pa_maps_save_settings' )['premium-map-api'];
45	$map_api_disable = get_option( 'pa_maps_save_settings' )['premium-map-disable-api'];
46	if( ! isset( $map_api ) \|\| empty( $map_api ) \|\| $map_api_disable ){
47	$this->add_control('premium_maps_api_url',
48	[
49	'label' => '<span style="line-height: 1.4em;">Premium Maps requires an API key. Get your API key from <a target="_blank" href="https://developers.google.com/maps/documentation/javascript/get-api-key">here</a> and add it to Premium Addons admin page. Go to Dashboard -> Premium Addons for Elementor -> Google Maps API</span>',
50	'type' => Controls_Manager::RAW_HTML,
51	]
52	);
53	}
54
55	$this->add_control('premium_map_notice',
56	[
57	'label' => __( 'Find Latitude & Longitude', 'elementor' ),
58	'type' => Controls_Manager::RAW_HTML,
59	'raw' => '<form onsubmit="getAddress(this);" action="javascript:void(0);"><input type="text" id="premium-map-get-address" class="premium-map-get-address" style="margin-top:10px; margin-bottom:10px;"><input type="submit" value="Search" class="elementor-button elementor-button-default" onclick="getAddress(this)"></form><div class="premium-address-result" style="margin-top:10px; line-height: 1.3; font-size: 12px;"></div>',
60	'label_block' => true,
61	]
62	);
63
64
65	$this->add_control('premium_maps_center_lat',
66	[
67	'label' => esc_html__('Center Latitude', 'premium-addons-for-elementor'),
68	'type' => Controls_Manager::TEXT,
69	'description' => esc_html__('Center latitude and longitude are required to identify your location', 'premium-addons-for-elementor'),
70	'default' => '18.591212',
71	'label_block' => true,
72	]
73	);
74
75	$this->add_control('premium_maps_center_long',
76	[
77	'label' => esc_html__('Center Longitude', 'premium-addons-for-elementor'),
78	'type' => Controls_Manager::TEXT,
79	'description' => esc_html__('Center latitude and longitude are required to identify your location', 'premium-addons-for-elementor'),
80	'default' => '73.741261',
81	'label_block' => true,
82	]
83	);
84
85	$this->end_controls_section();
86
87	$this->start_controls_section('premium_maps_map_pins_settings',
88	[
89	'label' => esc_html__('Markers', 'premium-addons-for-elementor'),
90	]
91	);
92
93	$repeater = new REPEATER();
94
95	$repeater->add_control('premium_map_pin_notice',
96	[
97	'label' => __( 'Find Latitude & Longitude', 'elementor' ),
98	'type' => Controls_Manager::RAW_HTML,
99	'raw' => '<form onsubmit="getPinAddress(this);" action="javascript:void(0);"><input type="text" id="premium-map-get-address" class="premium-map-get-address" style="margin-top:10px; margin-bottom:10px;"><input type="submit" value="Search" class="elementor-button elementor-button-default" onclick="getPinAddress(this)"></form><div class="premium-address-result" style="margin-top:10px; line-height: 1.3; font-size: 12px;"></div>',
100	'label_block' => true,
101	]
102	);
103
104	$repeater->add_control('map_latitude',
105	[
106	'label' => esc_html__('Latitude', 'premium-addons-for-elementor'),
107	'type' => Controls_Manager::TEXT,
108	'description' => 'Click <a href="https://www.latlong.net/" target="_blank">here</a> to get your location coordinates',
109	'label_block' => true,
110	]
111	);
112
113	$repeater->add_control('map_longitude',
114	[
115	'name' => 'map_longitude',
116	'label' => esc_html__('Longitude', 'premium-addons-for-elementor'),
117	'type' => Controls_Manager::TEXT,
118	'description' => 'Click <a href="https://www.latlong.net/" target="_blank">here</a> to get your location coordinates',
119	'label_block' => true,
120	]
121	);
122
123	$repeater->add_control('pin_title',
124	[
125	'label' => esc_html__('Title', 'premium-addons-for-elementor'),
126	'type' => Controls_Manager::TEXT,
127	'dynamic' => [ 'active' => true ],
128	'label_block' => true,
129	]
130	);
131
132	$repeater->add_control('pin_desc',
133	[
134	'label' => esc_html__('Description', 'premium-addons-for-elementor'),
135	'type' => Controls_Manager::WYSIWYG,
136	'dynamic' => [ 'active' => true ],
137	'label_block' => true,
138	]
139	);
140
141	$repeater->add_control('pin_icon',
142	[
143	'label' => esc_html__('Custom Icon', 'premium-addons-for-elementor'),
144	'type' => Controls_Manager::MEDIA,
145	]
146	);
147
148	$this->add_control('premium_maps_map_pins',
149	[
150	'label' => esc_html__('Map Pins', 'premium-addons-for-elementor'),
151	'type' => Controls_Manager::REPEATER,
152	'default' => [
153	'map_latitude' => '18.591212',
154	'map_longitude' => '73.741261',
155	'pin_title' => esc_html__('Premium Google Maps', 'premium-addons-for-elementor'),
156	'pin_desc' => esc_html__('Add an optional description to your map pin', 'premium-addons-for-elementor'),
157	],
158	'fields' => array_values( $repeater->get_controls() ),
159	]
160	);
161
162	$this->end_controls_section();
163
164	$this->start_controls_section('premium_maps_controls_section',
165	[
166	'label' => esc_html__('Controls', 'premium-addons-for-elementor'),
167	]
168	);
169
170	$this->add_control('premium_maps_map_type',
171	[
172	'label' => esc_html__( 'Map Type', 'premium-addons-for-elementor' ),
173	'type' => Controls_Manager::SELECT,
174	'options' => [
175	'roadmap' => esc_html__( 'Road Map', 'premium-addons-for-elementor' ),
176	'satellite' => esc_html__( 'Satellite', 'premium-addons-for-elementor' ),
177	'terrain' => esc_html__( 'Terrain', 'premium-addons-for-elementor' ),
178	'hybrid' => esc_html__( 'Hybrid', 'premium-addons-for-elementor' ),
179	],
180	'default' => 'roadmap',
181	]
182	);
183
184	$this->add_responsive_control('premium_maps_map_height',
185	[
186	'label' => esc_html__( 'Height', 'premium-addons-for-elementor' ),
187	'type' => Controls_Manager::SLIDER,
188	'default' => [
189	'size' => 500,
190	],
191	'range' => [
192	'px' => [
193	'min' => 80,
194	'max' => 1400,
195	],
196	],
197	'selectors' => [
198	'{{WRAPPER}} .premium_maps_map_height' => 'height: {{SIZE}}px;',
199	],
200	]
201	);
202
203	$this->add_control('premium_maps_map_zoom',
204	[
205	'label' => esc_html__( 'Zoom', 'premium-addons-for-elementor' ),
206	'type' => Controls_Manager::SLIDER,
207	'default' => [
208	'size' => 12,
209	],
210	'range' => [
211	'px' => [
212	'min' => 0,
213	'max' => 22,
214	],
215	],
216	]
217	);
218
219	$this->add_control('premium_maps_map_option_map_type_control',
220	[
221	'label' => esc_html__( 'Map Type Controls', 'premium-addons-for-elementor' ),
222	'type' => Controls_Manager::SWITCHER,
223	]
224	);
225
226	$this->add_control('premium_maps_map_option_zoom_controls',
227	[
228	'label' => esc_html__( 'Zoom Controls', 'premium-addons-for-elementor' ),
229	'type' => Controls_Manager::SWITCHER,
230	]
231	);
232
233	$this->add_control('premium_maps_map_option_streeview',
234	[
235	'label' => esc_html__( 'Street View Control', 'premium-addons-for-elementor' ),
236	'type' => Controls_Manager::SWITCHER,
237	]
238	);
239
240	$this->add_control('premium_maps_map_option_fullscreen_control',
241	[
242	'label' => esc_html__( 'Fullscreen Control', 'premium-addons-for-elementor' ),
243	'type' => Controls_Manager::SWITCHER,
244	]
245	);
246
247	$this->add_control('premium_maps_map_option_mapscroll',
248	[
249	'label' => esc_html__( 'Scroll Wheel Zoom', 'premium-addons-for-elementor' ),
250	'type' => Controls_Manager::SWITCHER,
251	]
252	);
253
254	$this->add_control('premium_maps_marker_open',
255	[
256	'label' => esc_html__( 'Info Container Always Opened', 'premium-addons-for-elementor' ),
257	'type' => Controls_Manager::SWITCHER,
258	]
259	);
260
261	$this->add_control('premium_maps_marker_hover_open',
262	[
263	'label' => esc_html__( 'Info Container Opened when Hovered', 'premium-addons-for-elementor' ),
264	'type' => Controls_Manager::SWITCHER,
265	]
266	);
267
268	$this->add_control('premium_maps_marker_mouse_out',
269	[
270	'label' => esc_html__( 'Info Container Closed when Mouse Out', 'premium-addons-for-elementor' ),
271	'type' => Controls_Manager::SWITCHER,
272	'condition' => [
273	'premium_maps_marker_hover_open' => 'yes'
274	]
275	]
276	);
277
278	$this->add_control('premium_maps_map_option_cluster',
279	[
280	'label' => esc_html__( 'Marker Clustering', 'premium-addons-for-elementor' ),
281	'type' => Controls_Manager::SWITCHER,
282	]
283	);
284
285	$this->end_controls_section();
286
287	$this->start_controls_section('premium_maps_custom_styling_section',
288	[
289	'label' => esc_html__('Map Style', 'premium-addons-for-elementor'),
290	]
291	);
292
293	$this->add_control('premium_maps_custom_styling',
294	[
295	'label' => esc_html__('JSON Code', 'premium-addons-for-elementor'),
296	'type' => Controls_Manager::TEXTAREA,
297	'description' => 'Get your custom styling from <a href="https://snazzymaps.com/" target="_blank">here</a>',
298	'label_block' => true,
299	]
300	);
301
302	/End Map Options Section/
303	$this->end_controls_section();
304
305	/Start Title Style Section/
306	$this->start_controls_section('premium_maps_pin_title_style',
307	[
308	'label' => esc_html__('Title', 'premium-addons-for-elementor'),
309	'tab' => Controls_Manager::TAB_STYLE,
310	]
311	);
312
313	/Pin Title Color/
314	$this->add_control('premium_maps_pin_title_color',
315	[
316	'label' => esc_html__('Color', 'premium-addons-for-elementor'),
317	'type' => Controls_Manager::COLOR,
318	'scheme' => [
319	'type' => Scheme_Color::get_type(),
320	'value' => Scheme_Color::COLOR_1,
321	],
322	'selectors' => [
323	'{{WRAPPER}} .premium-maps-info-title' => 'color: {{VALUE}};',
324	]
325	]
326	);
327
328	$this->add_group_control(
329	Group_Control_Typography::get_type(),
330	[
331	'name' => 'pin_title_typography',
332	'scheme' => Scheme_Typography::TYPOGRAPHY_1,
333	'selector' => '{{WRAPPER}} .premium-maps-info-title',
334	]
335	);
336
337	$this->add_responsive_control('premium_maps_pin_title_margin',
338	[
339	'label' => esc_html__('Margin', 'premium-addons-for-elementor'),
340	'type' => Controls_Manager::DIMENSIONS,
341	'size_units' => ['px', 'em', '%'],
342	'selectors' => [
343	'{{WRAPPER}} .premium-maps-info-title' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
344	]
345	]
346	);
347
348	/Pin Title Padding/
349	$this->add_responsive_control('premium_maps_pin_title_padding',
350	[
351	'label' => esc_html__('Padding', 'premium-addons-for-elementor'),
352	'type' => Controls_Manager::DIMENSIONS,
353	'size_units' => ['px', 'em', '%'],
354	'selectors' => [
355	'{{WRAPPER}} .premium-maps-info-title' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
356	]
357	]
358	);
359
360	/Pin Title ALign/
361	$this->add_responsive_control('premium_maps_pin_title_align',
362	[
363	'label' => esc_html__( 'Alignment', 'premium-addons-for-elementor' ),
364	'type' => Controls_Manager::CHOOSE,
365	'options' => [
366	'left' => [
367	'title'=> esc_html__( 'Left', 'premium-addons-for-elementor' ),
368	'icon' => 'fa fa-align-left',
369	],
370	'center' => [
371	'title'=> esc_html__( 'Center', 'premium-addons-for-elementor' ),
372	'icon' => 'fa fa-align-center',
373	],
374	'right' => [
375	'title'=> esc_html__( 'Right', 'premium-addons-for-elementor' ),
376	'icon' => 'fa fa-align-right',
377	],
378	],
379	'default' => 'center',
380	'selectors' => [
381	'{{WRAPPER}} .premium-maps-info-title' => 'text-align: {{VALUE}};',
382	],
383	]
384	);
385
386	/End Title Style Section/
387	$this->end_controls_section();
388
389	/Start Pin Style Section/
390	$this->start_controls_section('premium_maps_pin_text_style',
391	[
392	'label' => esc_html__('Description', 'premium-addons-for-elementor'),
393	'tab' => Controls_Manager::TAB_STYLE,
394	]
395	);
396
397	$this->add_control('premium_maps_pin_text_color',
398	[
399	'label' => esc_html__('Color', 'premium-addons-for-elementor'),
400	'type' => Controls_Manager::COLOR,
401	'scheme' => [
402	'type' => Scheme_Color::get_type(),
403	'value' => Scheme_Color::COLOR_2,
404	],
405	'selectors' => [
406	'{{WRAPPER}} .premium-maps-info-desc' => 'color: {{VALUE}};',
407	]
408	]
409	);
410
411	$this->add_group_control(
412	Group_Control_Typography::get_type(),
413	[
414	'name' => 'pin_text_typo',
415	'scheme' => Scheme_Typography::TYPOGRAPHY_1,
416	'selector' => '{{WRAPPER}} .premium-maps-info-desc',
417	]
418	);
419
420	$this->add_responsive_control('premium_maps_pin_text_margin',
421	[
422	'label' => esc_html__('Margin', 'premium-addons-for-elementor'),
423	'type' => Controls_Manager::DIMENSIONS,
424	'size_units' => ['px', 'em', '%'],
425	'selectors' => [
426	'{{WRAPPER}} .premium-maps-info-desc' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
427	]
428	]
429	);
430
431	$this->add_responsive_control('premium_maps_pin_text_padding',
432	[
433	'label' => esc_html__('Padding', 'premium-addons-for-elementor'),
434	'type' => Controls_Manager::DIMENSIONS,
435	'size_units' => ['px', 'em', '%'],
436	'selectors' => [
437	'{{WRAPPER}} .premium-maps-info-desc' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
438	]
439	]
440	);
441
442	/Pin Title ALign/
443	$this->add_responsive_control('premium_maps_pin_description_align',
444	[
445	'label' => esc_html__( 'Alignment', 'premium-addons-for-elementor' ),
446	'type' => Controls_Manager::CHOOSE,
447	'options' => [
448	'left' => [
449	'title'=> esc_html__( 'Left', 'premium-addons-for-elementor' ),
450	'icon' => 'fa fa-align-left',
451	],
452	'center' => [
453	'title'=> esc_html__( 'Center', 'premium-addons-for-elementor' ),
454	'icon' => 'fa fa-align-center',
455	],
456	'right' => [
457	'title'=> esc_html__( 'Right', 'premium-addons-for-elementor' ),
458	'icon' => 'fa fa-align-right',
459	],
460	],
461	'default' => 'center',
462	'selectors' => [
463	'{{WRAPPER}} .premium-maps-info-desc' => 'text-align: {{VALUE}};',
464	],
465	]
466	);
467
468	/End Pin Style Section/
469	$this->end_controls_section();
470
471	/Start Map Style Section/
472	$this->start_controls_section('premium_maps_box_style',
473	[
474	'label' => esc_html__('Map', 'premium-addons-for-elementor'),
475	'tab' => Controls_Manager::TAB_STYLE,
476	]
477	);
478
479	/First Border/
480	$this->add_group_control(
481	Group_Control_Border::get_type(),
482	[
483	'name' => 'map_border',
484	'selector' => '{{WRAPPER}} .premium-maps-container',
485	]
486	);
487
488	/First Border Radius/
489	$this->add_control('premium_maps_box_radius',
490	[
491	'label' => esc_html__('Border Radius', 'premium-addons-for-elementor'),
492	'type' => Controls_Manager::SLIDER,
493	'size_units' => ['px', '%', 'em'],
494	'selectors' => [
495	'{{WRAPPER}} .premium-maps-container,{{WRAPPER}} .premium_maps_map_height' => 'border-radius: {{SIZE}}{{UNIT}};'
496	]
497	]
498	);
499
500	/Box Shadow/
501	$this->add_group_control(
502	Group_Control_Box_Shadow::get_type(),
503	[
504	'label' => esc_html__('Shadow','premium-addons-for-elementor'),
505	'name' => 'premium_maps_box_shadow',
506	'selector' => '{{WRAPPER}} .premium-maps-container',
507	]
508	);
509
510	/First Margin/
511	$this->add_responsive_control('premium_maps_box_margin',
512	[
513	'label' => esc_html__('Margin', 'premium-addons-for-elementor'),
514	'type' => Controls_Manager::DIMENSIONS,
515	'size_units' => [ 'px', 'em', '%' ],
516	'selectors' => [
517	'{{WRAPPER}} .premium-maps-container' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}}',
518	]
519	]
520	);
521
522	/First Padding/
523	$this->add_responsive_control('premium_maps_box_padding',
524	[
525	'label' => esc_html__('Padding', 'premium-addons-for-elementor'),
526	'type' => Controls_Manager::DIMENSIONS,
527	'size_units' => [ 'px', 'em', '%' ],
528	'selectors' => [
529	'{{WRAPPER}} .premium-maps-container' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}}',
530	]
531	]
532	);
533
534	/End Map Style Section/
535	$this->end_controls_section();
536
537	}
538
539	protected function render($instance = [])
540	{
541	// get our input from the widget settings.
542	$settings = $this->get_settings_for_display();
543
544	$map_pins = $settings['premium_maps_map_pins'];
545
546	if( !empty( $settings['premium_maps_custom_styling'] ) ){
547	$map_custom_style = $settings['premium_maps_custom_styling'];
548	} else {
549	$map_custom_style = '';
550	}
551
552	if ($settings['premium_maps_map_option_streeview'] == 'yes') {
553	$street_view = 'true';
554	} else {
555	$street_view = 'false';
556	}
557
558	if ($settings['premium_maps_map_option_mapscroll'] == 'yes') {
559	$scroll_wheel = 'true';
560	} else {
561	$scroll_wheel = 'false';
562	}
563
564	if ($settings['premium_maps_map_option_fullscreen_control'] == 'yes') {
565	$enable_full_screen = 'true';
566	} else {
567	$enable_full_screen = 'false';
568	}
569
570	if ($settings['premium_maps_map_option_zoom_controls'] == 'yes') {
571	$enable_zoom_control = 'true';
572	} else {
573	$enable_zoom_control = 'false';
574	}
575
576	if ($settings['premium_maps_map_option_map_type_control'] == 'yes') {
577	$map_type_control = 'true';
578	} else {
579	$map_type_control = 'false';
580	}
581
582	if ($settings['premium_maps_marker_open'] == 'yes') {
583	$automatic_open = 'true';
584	} else {
585	$automatic_open = 'false';
586	}
587
588	if ($settings['premium_maps_marker_hover_open'] == 'yes') {
589	$hover_open = 'true';
590	} else {
591	$hover_open = 'false';
592	}
593
594	if ($settings['premium_maps_marker_mouse_out'] == 'yes') {
595	$hover_close = 'true';
596	} else {
597	$hover_close = 'false';
598	}
599
600	if($settings['premium_maps_map_option_cluster'] == 'yes') {
601	$marker_cluster = 'true';
602	} else {
603	$marker_cluster = 'false';
604	}
605
606	$centerlat = !empty($settings['premium_maps_center_lat']) ? $settings['premium_maps_center_lat'] : 18.591212;
607	$centerlong = !empty($settings['premium_maps_center_long']) ? $settings['premium_maps_center_long'] : 73.741261;
608
609	$map_settings = [
610	'zoom' => $settings['premium_maps_map_zoom']['size'],
611	'maptype' => $settings['premium_maps_map_type'],
612	'streetViewControl' => $street_view,
613	'centerlat' => $centerlat,
614	'centerlong' => $centerlong,
615	'scrollwheel' => $scroll_wheel,
616	'fullScreen' => $enable_full_screen,
617	'zoomControl' => $enable_zoom_control,
618	'typeControl' => $map_type_control,
619	'automaticOpen' => $automatic_open,
620	'hoverOpen' => $hover_open,
621	'hoverClose' => $hover_close,
622	'cluster' => $marker_cluster
623	];
624
625	$this->add_render_attribute('style_wrapper', 'data-style', $settings['premium_maps_custom_styling']);
626	?>
627
628	<div class="premium-maps-container" id="premium-maps-container">
629	<?php if(count($map_pins)){
630	?>
631	<div class="premium_maps_map_height" data-settings='<?php echo wp_json_encode($map_settings); ?>' <?php echo $this->get_render_attribute_string('style_wrapper'); ?>>
632	<?php
633	foreach($map_pins as $pin){
634	?>
635	<div class="premium-pin" data-lng="<?php echo $pin['map_longitude']; ?>" data-lat="<?php echo $pin['map_latitude']; ?>" data-icon="<?php echo $pin['pin_icon']['url']; ?>">
636	<?php if(!empty($pin['pin_title'])\|\| !empty($pin['pin_desc'])):?>
637
638	<div class='premium-maps-info-container'><p class='premium-maps-info-title'><?php echo $pin['pin_title']; ?></p><div class='premium-maps-info-desc'><?php echo $pin['pin_desc']; ?></div></div>
639	<?php endif; ?>
640	</div>
641	<?php
642	}
643	?>
644	</div>
645	<?php
646	} ?>
647
648	</div>
649
650	<?php
651	}
652	}
653	Plugin::instance()->widgets_manager->register_widget_type(new Premium_Maps_Widget());