panorama / shortcode.php

shortcode.php in Panorama – Turn Photos into Immersive Virtual Tours 1.6.0, at shortcode.php

238 lines 8.4 KB

Raw Download Zip

1	<?php
2	// Shortcode for Panorama Pro
3	function bppiv_image_viewer( $atts ){
4	extract( shortcode_atts( array(
5	'id' => null,
6
7	), $atts )); ob_start(); ?>
8
9	<?php
10	$block = null;
11	// Check Post-Type
12	$post_type = get_post_type($id);
13	if($post_type != 'bppiv-image-viewer'){
14	return false;
15	}
16	// Meta Data
17	$bppiv_meta = get_post_meta($id, '_bppivimages_', true);
18
19	$bppiv_width = '100%';
20	$bppiv_height = '320px';
21
22	if( isset($bppiv_meta['bppiv_image_width']['width']) ) {
23	$bppiv_width = $bppiv_meta['bppiv_image_width']['width'].$bppiv_meta['bppiv_image_width']['unit'];
24	}
25	if( isset($bppiv_meta['bppiv_image_height']['height']) ) {
26	$bppiv_height = $bppiv_meta['bppiv_image_height']['height'].$bppiv_meta['bppiv_image_height']['unit'];
27	}
28
29	$pan_type = isset($bppiv_meta['bppiv_type']) ? $bppiv_meta['bppiv_type'] : '';
30
31	// Load More Meta Data
32	$btn_text = isset($bppiv_meta['loadMore_btn_text']) ? $bppiv_meta['loadMore_btn_text'] : '';
33	$btn_color = isset($bppiv_meta['loadMore_text_color']) ? $bppiv_meta['loadMore_text_color'] : '';
34	$btn_bg = isset($bppiv_meta['loadMore_btn_bg']) ? $bppiv_meta['loadMore_btn_bg'] : '';
35	$btn_hover_bg = isset($bppiv_meta['loadMore_hover_bg']) ? $bppiv_meta['loadMore_hover_bg'] : '';
36
37	$get_value = bppiv_isset($bppiv_meta);
38
39	if(file_exists(BPPIV_PATH."blocks/$pan_type.php")){
40	include(BPPIV_PATH."blocks/$pan_type.php");
41	}
42
43	// echo "<pre>";
44	// print_r($block);
45	// echo "</pre>";
46
47	return render_block($block);
48
49	if( $pan_type !== 'video2'){
50	wp_enqueue_script( 'bppiv-pro' );
51
52	wp_enqueue_style( 'bppiv-font-material' );
53	wp_enqueue_style( 'bppiv-pannellum-css' );
54	wp_enqueue_style( 'bppiv-main-style' );
55	}
56
57	?>
58
59
60	<?php if( $pan_type === 'gallery'): ?>
61
62	<div id="gallery-container" ></div>
63	<!-- Load MOre Button -->
64	<?php if( is_array($bppiv_meta['bppiv_pan_gallery']) && count( $bppiv_meta['bppiv_pan_gallery']) > 0 ): ?>
65	<div class="pan_loadMore"><?php echo esc_html($btn_text ); ?></div>
66	<?php endif; ?>
67
68	<div id="panorama-container" class="bppiv_panorama" data-settings='<?php echo esc_attr( wp_json_encode( $bppiv_meta)); ?>'>
69	<!-- Progress bar -->
70	<div id="bppiv-progress-bar"></div>
71	<!-- Close button -->
72	<div class="close"> <i class="material-icons">close</i> </div>
73	<!-- Main container -->
74	<div id="bppiv-main-container"></div>
75
76	</div>
77
78
79
80	<?php elseif( $pan_type === 'gstreet'): ?>
81	<div id="bppiv_panorama<?php echo esc_attr($id); ?>" class="bppiv_panorama pan_gstreet" data-settings='<?php echo esc_attr( wp_json_encode( $bppiv_meta)); ?>'>
82	</div>
83	<!-- Image 360 Degree -->
84	<?php elseif( $pan_type === 'image360'): ?>
85
86	<div id="bppiv_panorama<?php echo esc_attr($id); ?>" class="bppiv_panorama" data-settings='<?php echo esc_attr( wp_json_encode( $bppiv_meta)); ?>'>
87
88	<!-- Custom Control -->
89	<?php if($pan_type ==='image360' && isset($bppiv_meta['custom_control']) && $bppiv_meta['custom_control'] === "1"): ?>
90	<div id="controls">
91	<div class="ctrl" id="pan-up">▲</div>
92	<div class="ctrl" id="pan-down">▼</div>
93	<div class="ctrl" id="pan-left"><svg width="20px" height="15px" xmlns="http://www.w3.org/2000/svg"><path d="M14 5v10l-9-5 9-5z"/></svg></div>
94	<div class="ctrl" id="pan-right"><svg width="20px" height="15px" xmlns="http://www.w3.org/2000/svg"><path d="M15 10l-9 5V5l9 5z"/></svg></div>
95	<div class="ctrl" id="zoom-in">+</div>
96	<div class="ctrl" id="zoom-out">−</div>
97	<div class="ctrl" id="fullscreen">⤢</div>
98	</div>
99	<?php endif; ?>
100	</div>
101	<?php elseif( $pan_type === 'video2'):
102	wp_enqueue_script('videojs');
103	wp_enqueue_style('videojs');
104	wp_enqueue_script('videojs-vr');
105	wp_enqueue_style('videojs-vr');
106	wp_enqueue_script('videojs-init');
107
108	$attributes = [
109	'enabledInitialView' => $bppiv_meta['initial_view_video'] ?? null,
110	'initialView' => $bppiv_meta['initial_view_video_property'] ?? null,
111	]
112	?>
113	<div>
114	<div class="bppiv_panorama_video2" style="width: <?php echo esc_attr($bppiv_width) ?>" data-attributes="<?php echo esc_attr(wp_json_encode($attributes)) ?>">
115	<video class="video-js" playsinline webkit-playsinline
116	preload="auto" id="<?php echo esc_attr('bppiv_panorama_video2_'.$id) ?>" controls>
117	<source src="<?php echo esc_url($bppiv_meta['bppiv_video_src']['url'] ?? '') ?>" />
118	<p class="vjs-no-js">
119	To view this video please enable JavaScript, and consider upgrading to a
120	web browser that supports HTML5 video
121	</p>
122	</video>
123	</div>
124	</div>
125
126	<?php else: ?>
127	<div id="bppiv_panorama<?php echo esc_attr($id); ?>" class="bppiv_panorama" data-settings='<?php echo esc_attr( wp_json_encode( $bppiv_meta)); ?>'></div>
128	<?php endif; ?>
129
130	<style>
131	<?php echo '#bppiv_panorama'. esc_attr($id); ?> {
132	width: <?php echo esc_attr($bppiv_width); ?>;
133	height: <?php echo esc_attr($bppiv_height); ?>;
134	}
135	.pan_loadMore {
136	background: <?php echo esc_attr($btn_bg); ?>;
137	color: <?php echo esc_attr($btn_color); ?>;
138	}
139	.photo:hover {
140	border-color: <?php echo esc_attr($btn_bg); ?>;
141	}
142	.pan_loadMore:hover,
143	.item-badge:hover {
144	background: <?php echo esc_attr($btn_hover_bg); ?>;
145	color: <?php echo esc_attr($btn_color); ?>;
146	}
147	</style>
148
149	<?php
150	if(in_array($pan_type, ['video', 'video2'])){
151	?>
152	<style>
153	.camera_position_wrapper {
154	position: absolute;
155	top: 0px;
156	left: 0px;
157	display: flex;
158	width: 100%;
159	}
160	.camera_position_wrapper .camera_close {
161	position: absolute;
162	top: 0;
163	right: 0;
164	background: #333;
165	color: #fff;
166	padding: 10px;
167	font-size: 24px;
168	line-height: 0;
169	height: 100%;
170	}
171	.camera_position_wrapper p {
172	margin: 0;
173	flex: 1;
174	padding: 0 10px;
175	background: #fff;
176	}
177	.bppiv_panorama_video2 {
178	max-width: 100%;
179	position: relative;
180	}
181	.bppiv_panorama_video2 video {
182	max-width: 100%;
183	width: 100%;
184	}
185	</style>
186
187	<?php
188	}
189	return ob_get_clean();
190
191	}
192	add_shortcode( 'panorama', 'bppiv_image_viewer' );
193
194	// Shortcode for Panorama Pro
195	function panorama_product_viewer_callback( $attrs ){
196
197	ob_start();
198
199	$meta = get_post_meta(get_the_ID(), '_bppiv_product_', true);
200	if($meta['video360'] === '1' && $meta['type'] === 'video'){
201	wp_enqueue_script('bppiv-panolens');
202	}else if($meta['type'] === 'image'){
203	wp_enqueue_script('bppiv-pannellum-js');
204	wp_enqueue_style('bppiv-pannellum-css');
205	}
206
207	wp_enqueue_script('bppiv-product');
208	wp_enqueue_style('bppiv-product');
209
210	$attributes = '';
211	if($meta['video_autoplay']){
212	$attributes .= ' autoplay';
213	}
214
215	if($meta['video_mute']){
216	$attributes .= ' muted';
217	}
218
219	if($meta['video_loop']){
220	$attributes .= ' loop';
221	}
222
223	if($meta['video_show_controls']){
224	$attributes .= ' controls';
225	}
226
227	?>
228	<div id="bppiv_product_panorama" data-settings="<?php echo esc_attr(wp_json_encode($meta)) ?>">
229	<?php if($meta['type'] === 'video' && $meta['video360'] === '0') { ?>
230	<video style="max-width: 100%;" <?php echo esc_attr($attributes); ?> src="<?php echo esc_url($meta['video_src']) ?>"></video>
231	<?php } ?>
232
233	</div>
234	<?php
235	return ob_get_clean();
236	}
237	add_shortcode( 'panorama_product_viewer', 'panorama_product_viewer_callback' );
238