WP VR – 360 Panorama and virtual tour creator for WordPress - Version 6.1.0

Version Description

(31-7-2020) = * Style issue fixed for on click content

=

Download this release

Release Info

Developer rextheme
Plugin Icon 128x128 WP VR – 360 Panorama and virtual tour creator for WordPress
Version 6.1.0
Comparing to
See all releases

Code changes from version 5.9.0 to 6.1.0

Files changed (8) hide show
  1. README.txt +10 -3
  2. admin/css/wpvr-admin.css +50 -16
  3. admin/partials/wpvr-meta-box-builder-display.php +3 -0
  4. admin/partials/wpvr_documentation.php +1 -1
  5. public/class-wpvr-public.php +71 -55
  6. public/css/wpvr-public.css +32 -23
  7. public/js/wpvr-public.js +7 -5
  8. wpvr.php +64 -53
README.txt CHANGED
@@ -4,7 +4,7 @@ Donate link: https://rextheme.com/wp-vr-360-panorama-and-virtual-tour-creator-fo
4
  Tags: virtual tour, real estate tour, panorama, panorama viewer, virtual tour, 360 panorama, interactive tour
5
  Requires at least: 4.0
6
  Tested up to: 5.4.2
7
- Stable tag: 5.9.0
8
  Requires PHP: 7.0.0
9
  License: GPLv2 or later
10
  License URI: http://www.gnu.org/licenses/gpl-2.0.html
@@ -27,7 +27,7 @@ Simply provide a 360 panoramic image, and this plugin will transform it into a r
27
  == Why Use WPVR? ==
28
  WPVR gives all the features needed to create a quality virtual tour without any hassle.
29
 
30
- https://www.youtube.com/watch?v=vG411d1qX3c
31
 
32
  Get several exclusive features, such as:
33
 
@@ -38,7 +38,7 @@ You can also add an auto rotation effect, scene fade animation when transmitting
38
 
39
  Plus, it includes the feature to preview the tour at the back-end for proper inspection and tour creation.
40
 
41
- >Read detailed [documentation](https://rextheme.com/docs/wp-vr/) and [video tutorials](https://www.youtube.com/watch?v=vG411d1qX3c&list=PLelDqLncNWcVNqy7zoqtt8N-pyqy0-93z) for assistance.
42
 
43
  **Create an interactive realistic tour with multiple scenes**
44
  Add several scenes and add hotspots to connect them into a tour. Create multiple hotspots for every scene at your own will, to connect to different scenes and generate a realistic tour experience.
@@ -415,5 +415,12 @@ Simply add "/plugins/wpvr" to exclusion field (or use the location where you sto
415
  * Export/import SSL error fixed
416
  * JS error fixed
417
 
 
 
 
 
 
 
 
418
  == Upgrade Notice ==
419
  Please do update the WP VR to the latest version. Each update makes it sure your plugin is supporting all tour features.  
4
  Tags: virtual tour, real estate tour, panorama, panorama viewer, virtual tour, 360 panorama, interactive tour
5
  Requires at least: 4.0
6
  Tested up to: 5.4.2
7
+ Stable tag: 6.1.0
8
  Requires PHP: 7.0.0
9
  License: GPLv2 or later
10
  License URI: http://www.gnu.org/licenses/gpl-2.0.html
27
  == Why Use WPVR? ==
28
  WPVR gives all the features needed to create a quality virtual tour without any hassle.
29
 
30
+ https://www.youtube.com/watch?v=SWsv-bplne8
31
 
32
  Get several exclusive features, such as:
33
 
38
 
39
  Plus, it includes the feature to preview the tour at the back-end for proper inspection and tour creation.
40
 
41
+ >Read detailed [documentation](https://rextheme.com/docs/wp-vr/) and [video tutorials](https://www.youtube.com/playlist?list=PLelDqLncNWcUndi1NkXJh2BH62OYmIayt) for assistance.
42
 
43
  **Create an interactive realistic tour with multiple scenes**
44
  Add several scenes and add hotspots to connect them into a tour. Create multiple hotspots for every scene at your own will, to connect to different scenes and generate a realistic tour experience.
415
  * Export/import SSL error fixed
416
  * JS error fixed
417
 
418
+ = 6.0.0 (28-7-2020) =
419
+ * Error fix for safari
420
+ * JS error fix for optimization
421
+
422
+ = 6.1.0 (31-7-2020) =
423
+ * Style issue fixed for on click content
424
+
425
  == Upgrade Notice ==
426
  Please do update the WP VR to the latest version. Each update makes it sure your plugin is supporting all tour features.  
admin/css/wpvr-admin.css CHANGED
@@ -252,12 +252,13 @@ div.custom-tooltip:hover span:after {
252
  left: 50%;
253
  transform: translate(-50%, -50%);
254
  z-index: 99;
255
- width: 80%;
256
- max-height: 80%;
257
  overflow: auto;
258
  background: #fff;
259
  border-radius: 5px;
260
  }
 
261
  .icons-selector .selector {
262
  width: 100%;
263
  }
@@ -297,10 +298,10 @@ div.custom-tooltip:hover span:after {
297
  color: red;
298
  line-height: 26px;
299
  position: absolute;
300
- top: 6px;
301
- right: 6px;
302
  text-align: center;
303
- z-index: 99;
304
  font-size: 13px;
305
  border-radius: 100%;
306
  cursor: pointer;
@@ -453,9 +454,9 @@ div.custom-tooltip:hover span:after {
453
  .pnlm-container {
454
  width: 100%!important;
455
  }
456
- div.custom-tooltip span {
457
  width: 420px!important;
458
- }
459
  .custom-tooltip p {
460
  width: 420px;
461
  }
@@ -466,10 +467,11 @@ div.custom-tooltip:hover span:after {
466
  }
467
 
468
  }
 
469
  @media (max-width: 991px){
470
- div.custom-tooltip span {
471
  width: 540px!important;
472
- }
473
  .custom-tooltip p {
474
  width: 530px;
475
  }
@@ -671,6 +673,11 @@ div.custom-tooltip:hover span:after {
671
  display: block !important;
672
  }
673
 
 
 
 
 
 
674
  .pano-alert {
675
  position: absolute;
676
  top: 50%;
@@ -1984,13 +1991,16 @@ button.delete-hotspot{
1984
  .wpvr-product-container .wpvr-pr-right-block a h2:before {
1985
  display: none;
1986
  }
 
 
 
1987
  .wpvr-product-container .wpvr-pr-right-block .add_to_cart_inline {
1988
  border: none!important;
1989
  padding: 0!important;
1990
- overflow: auto;
1991
  text-align: left!important;
1992
  border-radius: 0!important;
1993
  }
 
1994
  .wpvr-product-container .wpvr-pr-right-block .add_to_cart_inline .amount {
1995
  display: inline-block;
1996
  margin-bottom: 7px;
@@ -1999,24 +2009,25 @@ button.delete-hotspot{
1999
  text-decoration: line-through;
2000
  opacity: 0.5;
2001
  }
2002
- .wpvr-product-container .wpvr-pr-right-block .add_to_cart_inline .add_to_cart_button {
2003
- width: 170px;
2004
  font-size: 16px;
2005
  text-align: center;
2006
  border-radius: 5px;
2007
  background-color: rgb(32, 28, 254);
2008
- height: 46px;
2009
- line-height: 46px;
2010
  color: #fff;
2011
- display: block;
2012
- padding: 0 20px;
2013
  box-shadow: none;
2014
  margin-top: auto;
2015
  transition: all 0.3s ease;
2016
  text-decoration: none;
 
 
 
2017
  }
2018
 
2019
 
 
2020
  /*-----------------responsive style------------------*/
2021
  @media (max-width: 1760px) and (min-width: 1701px){
2022
  .rex-pano-tab-content .general .inner-nav-content .inner-single-content .color-icon img {
@@ -2058,6 +2069,13 @@ button.delete-hotspot{
2058
  width: calc(100% - 630px);
2059
  }
2060
 
 
 
 
 
 
 
 
2061
  .rex-pano-tab-content .general .general-inner-tab .inner-nav li > span {
2062
  flex-flow: column;
2063
  text-align: center;
@@ -2110,6 +2128,14 @@ button.delete-hotspot{
2110
  height: 290px;
2111
  }
2112
 
 
 
 
 
 
 
 
 
2113
  .rex-pano-tabs {
2114
  display: block;
2115
  margin-left: 0;
@@ -2165,6 +2191,14 @@ button.delete-hotspot{
2165
  margin-right: 0;
2166
  }
2167
 
 
 
 
 
 
 
 
 
2168
  .rex-pano-tabs .rex-pano-tab-nav.main-nav li span {
2169
  padding: 0 10px;
2170
  }
252
  left: 50%;
253
  transform: translate(-50%, -50%);
254
  z-index: 99;
255
+ width: 90%;
256
+ height: 293px;
257
  overflow: auto;
258
  background: #fff;
259
  border-radius: 5px;
260
  }
261
+
262
  .icons-selector .selector {
263
  width: 100%;
264
  }
298
  color: red;
299
  line-height: 26px;
300
  position: absolute;
301
+ top: 43px;
302
+ right: 26px;
303
  text-align: center;
304
+ z-index: 999;
305
  font-size: 13px;
306
  border-radius: 100%;
307
  cursor: pointer;
454
  .pnlm-container {
455
  width: 100%!important;
456
  }
457
+ /* div.custom-tooltip span {
458
  width: 420px!important;
459
+ } */
460
  .custom-tooltip p {
461
  width: 420px;
462
  }
467
  }
468
 
469
  }
470
+
471
  @media (max-width: 991px){
472
+ /* div.custom-tooltip span {
473
  width: 540px!important;
474
+ } */
475
  .custom-tooltip p {
476
  width: 530px;
477
  }
673
  display: block !important;
674
  }
675
 
676
+ .rex-pano-sub-tabs .rex-pano-tab.clearfix,
677
+ .rex-pano-tabs .rex-pano-tab.clearfix {
678
+ overflow: initial;
679
+ }
680
+
681
  .pano-alert {
682
  position: absolute;
683
  top: 50%;
1991
  .wpvr-product-container .wpvr-pr-right-block a h2:before {
1992
  display: none;
1993
  }
1994
+ .wpvr-product-container .wpvr-pr-right-block .wpvr-cart-wrap {
1995
+ display: block;
1996
+ }
1997
  .wpvr-product-container .wpvr-pr-right-block .add_to_cart_inline {
1998
  border: none!important;
1999
  padding: 0!important;
 
2000
  text-align: left!important;
2001
  border-radius: 0!important;
2002
  }
2003
+
2004
  .wpvr-product-container .wpvr-pr-right-block .add_to_cart_inline .amount {
2005
  display: inline-block;
2006
  margin-bottom: 7px;
2009
  text-decoration: line-through;
2010
  opacity: 0.5;
2011
  }
2012
+ .wpvr-product-container .wpvr-pr-right-block .add_to_cart_inline a.button {
 
2013
  font-size: 16px;
2014
  text-align: center;
2015
  border-radius: 5px;
2016
  background-color: rgb(32, 28, 254);
 
 
2017
  color: #fff;
2018
+ display: inline-block;
2019
+ padding: 8px 10px;
2020
  box-shadow: none;
2021
  margin-top: auto;
2022
  transition: all 0.3s ease;
2023
  text-decoration: none;
2024
+ white-space: normal;
2025
+ line-height: normal;
2026
+ border-color: transparent;
2027
  }
2028
 
2029
 
2030
+
2031
  /*-----------------responsive style------------------*/
2032
  @media (max-width: 1760px) and (min-width: 1701px){
2033
  .rex-pano-tab-content .general .inner-nav-content .inner-single-content .color-icon img {
2069
  width: calc(100% - 630px);
2070
  }
2071
 
2072
+ #custom-ifram {
2073
+ height: 278px;
2074
+ }
2075
+ .iframe-wrapper #cross {
2076
+ top: 47px;
2077
+ right: 20px;
2078
+ }
2079
  .rex-pano-tab-content .general .general-inner-tab .inner-nav li > span {
2080
  flex-flow: column;
2081
  text-align: center;
2128
  height: 290px;
2129
  }
2130
 
2131
+ #custom-ifram {
2132
+ height: 228px;
2133
+ }
2134
+ .iframe-wrapper #cross {
2135
+ top: 21px;
2136
+ right: 17px;
2137
+ }
2138
+
2139
  .rex-pano-tabs {
2140
  display: block;
2141
  margin-left: 0;
2191
  margin-right: 0;
2192
  }
2193
 
2194
+ #custom-ifram {
2195
+ height: 296px;
2196
+ }
2197
+ .iframe-wrapper #cross {
2198
+ top: 24px;
2199
+ right: 20px;
2200
+ }
2201
+
2202
  .rex-pano-tabs .rex-pano-tab-nav.main-nav li span {
2203
  padding: 0 10px;
2204
  }
admin/partials/wpvr-meta-box-builder-display.php CHANGED
@@ -524,6 +524,9 @@ var scenes = response[1];
524
  jQuery("#custom-ifram").fadeToggle();
525
  jQuery(".iframe-wrapper").toggleClass("show-modal");
526
  jQuery('button.ff-btn.ff-btn-submit.ff-btn-md').prop('disabled', true);
 
 
 
527
  }
528
 
529
  function wpvrtooltip(hotSpotDiv, args) {
524
  jQuery("#custom-ifram").fadeToggle();
525
  jQuery(".iframe-wrapper").toggleClass("show-modal");
526
  jQuery('button.ff-btn.ff-btn-submit.ff-btn-md').prop('disabled', true);
527
+
528
+ //------add to cart button------
529
+ jQuery('.wpvr-product-container p.add_to_cart_inline a.button').wrap('<span class="wpvr-cart-wrap"></span>');
530
  }
531
 
532
  function wpvrtooltip(hotSpotDiv, args) {
admin/partials/wpvr_documentation.php CHANGED
@@ -173,7 +173,7 @@ if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
173
  <div id="tab2" class="block-wrapper">
174
  <div class="video-wrapper">
175
  <div class="video-left">
176
- <iframe src="https://www.youtube.com/embed/videoseries?list=PLelDqLncNWcVNqy7zoqtt8N-pyqy0-93z" width="100%" height="100%" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
177
  </div>
178
 
179
  <div class="video-right">
173
  <div id="tab2" class="block-wrapper">
174
  <div class="video-wrapper">
175
  <div class="video-left">
176
+ <iframe src="https://www.youtube.com/embed/videoseries?list=PLelDqLncNWcUndi1NkXJh2BH62OYmIayt" width="100%" height="100%" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
177
  </div>
178
 
179
  <div class="video-right">
public/class-wpvr-public.php CHANGED
@@ -918,34 +918,91 @@ class Wpvr_Public {
918
  if ($bg_music == 'on') {
919
  $html .= '<div id="adcontrol'.$id.'" class="adcontrol" style="right:'.$audio_right.'">';
920
  $html .= '<audio id="vrAudio'.$id.'" onended="audionEnd'.$id.'()" '.$bg_loop.'>
921
- <source src="'.$bg_music_url.'" type="audio/mpeg">
922
- Your browser does not support the audio element.
923
- </audio>
924
- <button onclick="playPause'.$id.'()" class="ctrl audio_control" id="audio_control'.$id.'"><i id="vr-volume'.$id.'" class="fas fa-volume-up" style="color:#fff;"></i></button>
925
- ';
926
  $html .= '</div>';
927
  }
928
  }
929
 
930
- $html .= '<i class="fa fa-times cross"></i>';
931
- $html .= '<div class="wpvr-hotspot-tweak-contents" style="display: none">';
932
- ob_start();
933
- do_action('wpvr_hotspot_tweak_contents', $scene_data);
934
- $hotspot_content = ob_get_clean();
935
- $html .= $hotspot_content;
 
 
 
 
 
936
  $html .= '</div>';
937
- $html .= '<div class="custom-ifram" style="display: none">';
 
 
 
 
 
 
 
938
  $html .= '</div>';
 
939
  $html .= '</div>';
940
 
941
 
942
 
943
  //script started
944
  $html .= '<script>';
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
945
  $html .= 'var response = '.$response.';';
946
  $html .= 'var scenes = response[1];';
947
  $html .= 'if(scenes) {';
948
- $html .= 'var scenedata = scenes.scenes;';
949
  $html .= 'for(var i in scenedata) {';
950
  $html .= 'var scenehotspot = scenedata[i].hotSpots;';
951
  $html .= 'for(var i = 0; i < scenehotspot.length; i++) {';
@@ -1098,49 +1155,7 @@ class Wpvr_Public {
1098
  ';
1099
 
1100
 
1101
- if (isset($postdata['bg_music'])) {
1102
- if ($bg_music == 'on') {
1103
- $html .= '
1104
- var x'.$id.' = document.getElementById("vrAudio'.$id.'");
1105
-
1106
- var playing'.$id.' = false;
1107
-
1108
- function playPause'.$id.'() {
1109
-
1110
- if (playing'.$id.') {
1111
- jQuery("#vr-volume'.$id.'").removeClass("fas fa-volume-up");
1112
- jQuery("#vr-volume'.$id.'").addClass("fas fa-volume-mute");
1113
- x'.$id.'.pause();
1114
- playing'.$id.' = false;
1115
-
1116
- }
1117
- else {
1118
- jQuery("#vr-volume'.$id.'").removeClass("fas fa-volume-mute");
1119
- jQuery("#vr-volume'.$id.'").addClass("fas fa-volume-up");
1120
- x'.$id.'.play();
1121
- playing'.$id.' = true;
1122
- }
1123
- }
1124
-
1125
- function audionEnd'.$id.'() {
1126
- playing'.$id.' = false;
1127
- jQuery("#vr-volume'.$id.'").removeClass("fas fa-volume-up");
1128
- jQuery("#vr-volume'.$id.'").addClass("fas fa-volume-mute");
1129
- }
1130
- ';
1131
 
1132
- if ($autoplay_bg_music == 'on') {
1133
- $html .= '
1134
- document.getElementById("pano'.$id.'").addEventListener("click", musicPlay'.$id.');
1135
- function musicPlay'.$id.'() {
1136
- playing'.$id.' = true;
1137
- document.getElementById("vrAudio'.$id.'").play();
1138
- document.getElementById("pano'.$id.'").removeEventListener("click", musicPlay'.$id.');
1139
- }
1140
- ';
1141
- }
1142
- }
1143
- }
1144
 
1145
  if (!$autoload) {
1146
  $html .= '
@@ -1162,6 +1177,7 @@ class Wpvr_Public {
1162
  });';
1163
  }
1164
 
 
1165
  $html .= '</script>';
1166
  //script end
1167
 
918
  if ($bg_music == 'on') {
919
  $html .= '<div id="adcontrol'.$id.'" class="adcontrol" style="right:'.$audio_right.'">';
920
  $html .= '<audio id="vrAudio'.$id.'" onended="audionEnd'.$id.'()" '.$bg_loop.'>
921
+ <source src="'.$bg_music_url.'" type="audio/mpeg">
922
+ Your browser does not support the audio element.
923
+ </audio>
924
+ <button onclick="playPause'.$id.'()" class="ctrl audio_control" id="audio_control'.$id.'"><i id="vr-volume'.$id.'" class="fas fa-volume-up" style="color:#fff;"></i></button>
925
+ ';
926
  $html .= '</div>';
927
  }
928
  }
929
 
930
+
931
+ $html .= '<div class="wpvr-hotspot-tweak-contents-wrapper" style="display: none">';
932
+ $html .= '<i class="fa fa-times cross"></i>';
933
+ $html .= '<div class="wpvr-hotspot-tweak-contents-flex">';
934
+ $html .= '<div class="wpvr-hotspot-tweak-contents">';
935
+ ob_start();
936
+ do_action('wpvr_hotspot_tweak_contents', $scene_data);
937
+ $hotspot_content = ob_get_clean();
938
+ $html .= $hotspot_content;
939
+ $html .= '</div>';
940
+ $html .= '</div>';
941
  $html .= '</div>';
942
+
943
+ $html .= '<div class="custom-ifram-wrapper" style="display: none;">';
944
+ $html .= '<i class="fa fa-times cross"></i>';
945
+
946
+ $html .= '<div class="custom-ifram-flex">';
947
+ $html .= '<div class="custom-ifram">';
948
+ $html .= '</div>';
949
+ $html .= '</div>';
950
  $html .= '</div>';
951
+
952
  $html .= '</div>';
953
 
954
 
955
 
956
  //script started
957
  $html .= '<script>';
958
+ if (isset($postdata['bg_music'])) {
959
+ if ($bg_music == 'on') {
960
+ $html .= '
961
+ var x'.$id.' = document.getElementById("vrAudio'.$id.'");
962
+
963
+ var playing'.$id.' = false;
964
+
965
+ function playPause'.$id.'() {
966
+
967
+ if (playing'.$id.') {
968
+ jQuery("#vr-volume'.$id.'").removeClass("fas fa-volume-up");
969
+ jQuery("#vr-volume'.$id.'").addClass("fas fa-volume-mute");
970
+ x'.$id.'.pause();
971
+ playing'.$id.' = false;
972
+
973
+ }
974
+ else {
975
+ jQuery("#vr-volume'.$id.'").removeClass("fas fa-volume-mute");
976
+ jQuery("#vr-volume'.$id.'").addClass("fas fa-volume-up");
977
+ x'.$id.'.play();
978
+ playing'.$id.' = true;
979
+ }
980
+ }
981
+
982
+ function audionEnd'.$id.'() {
983
+ playing'.$id.' = false;
984
+ jQuery("#vr-volume'.$id.'").removeClass("fas fa-volume-up");
985
+ jQuery("#vr-volume'.$id.'").addClass("fas fa-volume-mute");
986
+ }
987
+ ';
988
+
989
+ if ($autoplay_bg_music == 'on') {
990
+ $html .= '
991
+ document.getElementById("pano'.$id.'").addEventListener("click", musicPlay'.$id.');
992
+ function musicPlay'.$id.'() {
993
+ playing'.$id.' = true;
994
+ document.getElementById("vrAudio'.$id.'").play();
995
+ document.getElementById("pano'.$id.'").removeEventListener("click", musicPlay'.$id.');
996
+ }
997
+ ';
998
+ }
999
+ }
1000
+ }
1001
+ $html .= 'jQuery(document).ready(function() {';
1002
  $html .= 'var response = '.$response.';';
1003
  $html .= 'var scenes = response[1];';
1004
  $html .= 'if(scenes) {';
1005
+ $html .= 'var scenedata = scenes.scenes;';
1006
  $html .= 'for(var i in scenedata) {';
1007
  $html .= 'var scenehotspot = scenedata[i].hotSpots;';
1008
  $html .= 'for(var i = 0; i < scenehotspot.length; i++) {';
1155
  ';
1156
 
1157
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1158
 
 
 
 
 
 
 
 
 
 
 
 
 
1159
 
1160
  if (!$autoload) {
1161
  $html .= '
1177
  });';
1178
  }
1179
 
1180
+ $html .= '});';
1181
  $html .= '</script>';
1182
  //script end
1183
 
public/css/wpvr-public.css CHANGED
@@ -337,26 +337,40 @@ div.custom-tooltip:hover span:after {
337
  margin: 0 50%;
338
  }
339
 
340
- div.custom-ifram {
341
  position: absolute;
342
- top: 50%;
 
343
  left: 50%;
344
- transform: translate(-50%, -50%);
345
  z-index: 99;
346
  width: 80%;
347
- max-height: 80%;
348
- overflow: auto;
 
 
 
 
 
 
 
 
349
  background: #fff;
350
  border-radius: 5px;
351
  }
352
 
 
 
 
 
 
353
 
354
  .pano-wrap:before {
355
  content: "";
356
  position: absolute;
357
  left: 0;
358
  top: 0;
359
- background: rgba(0,0,0,0.4);
360
  width: 100%;
361
  height: 100%;
362
  z-index: 99;
@@ -371,23 +385,24 @@ div.custom-ifram {
371
 
372
  .pano-wrap .cross {
373
  background: #fff;
374
- width: 15px;
375
- height: 15px;
376
  color: red;
377
- line-height: 15px;
378
  position: absolute;
379
- top: 2px;
380
- right: 2px;
381
  text-align: center;
382
  z-index: 99;
383
- font-size: 10px;
384
  border-radius: 100%;
385
- padding-left: 1px;
386
  cursor: pointer;
387
  opacity: 0;
388
  visibility: hidden;
389
  transition: all 0.4s ease;
390
  box-sizing: border-box;
 
391
  }
392
  .pano-wrap.show-modal .cross {
393
  opacity: 1;
@@ -454,6 +469,7 @@ div.custom-ifram {
454
  .wpvr-product-container {
455
  display: flex;
456
  align-items: center;
 
457
  background: #fff;
458
  padding: 15px;
459
  border-radius: 5px;
@@ -469,7 +485,7 @@ div.custom-ifram {
469
  height: auto;
470
  }
471
  .wpvr-product-container .wpvr-pr-right-block {
472
- width: 50%;
473
  padding-left: 15px;
474
  box-sizing: border-box;
475
  text-align: left;
@@ -490,7 +506,6 @@ div.custom-ifram {
490
  .wpvr-product-container .wpvr-pr-right-block .add_to_cart_inline {
491
  border: none!important;
492
  padding: 0!important;
493
- overflow: auto;
494
  text-align: left;
495
  border-radius: 0;
496
  }
@@ -526,7 +541,7 @@ div.custom-ifram {
526
  height: 300px;
527
  }
528
  div.custom-ifram {
529
- width: 90%;
530
  }
531
  .custom-tooltip p {
532
  width: 430px;
@@ -547,8 +562,7 @@ div.custom-ifram {
547
  width: 330px;
548
  }
549
 
550
- .wpvr-product-container .wpvr-pr-right-block .add_to_cart_inline .add_to_cart_button {
551
- width: 182px;
552
  font-size: 14px;
553
  }
554
 
@@ -626,8 +640,6 @@ div.custom-ifram {
626
  /* ----woocommerce product---- */
627
  .wpvr-product-container {
628
  display: block;
629
- max-height: 225px;
630
- overflow: auto;
631
  }
632
  .wpvr-product-container .wpvr-pr-left-block {
633
  width: 100%;
@@ -646,9 +658,6 @@ div.custom-ifram {
646
  .wpvr-product-container .wpvr-pr-right-block .add_to_cart_inline {
647
  text-align: center;
648
  }
649
- .wpvr-product-container .wpvr-pr-right-block .add_to_cart_inline .add_to_cart_button {
650
- margin: 0 auto;
651
- }
652
 
653
  }
654
 
337
  margin: 0 50%;
338
  }
339
 
340
+ .custom-ifram-wrapper {
341
  position: absolute;
342
+ top: 10%;
343
+ bottom: 10%;
344
  left: 50%;
345
+ transform: translateX(-50%);
346
  z-index: 99;
347
  width: 80%;
348
+ max-width: 980px;
349
+ }
350
+
351
+ .custom-ifram-flex {
352
+ height: 100%;
353
+ width: 100%;
354
+ display: flex;
355
+ flex-flow: column;
356
+ align-items: center;
357
+ justify-content: center;
358
  background: #fff;
359
  border-radius: 5px;
360
  }
361
 
362
+ div.custom-ifram {
363
+ width: 100%;
364
+ max-height: 100%;
365
+ overflow: auto;
366
+ }
367
 
368
  .pano-wrap:before {
369
  content: "";
370
  position: absolute;
371
  left: 0;
372
  top: 0;
373
+ background: rgba(0,0,0,0.7);
374
  width: 100%;
375
  height: 100%;
376
  z-index: 99;
385
 
386
  .pano-wrap .cross {
387
  background: #fff;
388
+ width: 24px;
389
+ height: 24px;
390
  color: red;
391
+ line-height: 26px;
392
  position: absolute;
393
+ top: -13px;
394
+ right: -10px;
395
  text-align: center;
396
  z-index: 99;
397
+ font-size: 13px;
398
  border-radius: 100%;
399
+ padding-left: 0px;
400
  cursor: pointer;
401
  opacity: 0;
402
  visibility: hidden;
403
  transition: all 0.4s ease;
404
  box-sizing: border-box;
405
+ box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
406
  }
407
  .pano-wrap.show-modal .cross {
408
  opacity: 1;
469
  .wpvr-product-container {
470
  display: flex;
471
  align-items: center;
472
+ justify-content: center;
473
  background: #fff;
474
  padding: 15px;
475
  border-radius: 5px;
485
  height: auto;
486
  }
487
  .wpvr-product-container .wpvr-pr-right-block {
488
+ max-width: 50%;
489
  padding-left: 15px;
490
  box-sizing: border-box;
491
  text-align: left;
506
  .wpvr-product-container .wpvr-pr-right-block .add_to_cart_inline {
507
  border: none!important;
508
  padding: 0!important;
 
509
  text-align: left;
510
  border-radius: 0;
511
  }
541
  height: 300px;
542
  }
543
  div.custom-ifram {
544
+ width: 100%;
545
  }
546
  .custom-tooltip p {
547
  width: 430px;
562
  width: 330px;
563
  }
564
 
565
+ .wpvr-product-container .wpvr-pr-right-block .add_to_cart_inline a.button {
 
566
  font-size: 14px;
567
  }
568
 
640
  /* ----woocommerce product---- */
641
  .wpvr-product-container {
642
  display: block;
 
 
643
  }
644
  .wpvr-product-container .wpvr-pr-left-block {
645
  width: 100%;
658
  .wpvr-product-container .wpvr-pr-right-block .add_to_cart_inline {
659
  text-align: center;
660
  }
 
 
 
661
 
662
  }
663
 
public/js/wpvr-public.js CHANGED
@@ -34,8 +34,8 @@
34
  function wpvrhotspot(hotSpotDiv, args) {
35
  var argst = args.replace(/\\/g, '');
36
  jQuery(document).ready(function($){
37
- $(hotSpotDiv.target).parent().siblings(".custom-ifram").html(argst);
38
- $(hotSpotDiv.target).parent().siblings(".custom-ifram").fadeToggle();
39
  $(hotSpotDiv.target).parent().parent(".pano-wrap").toggleClass("show-modal");
40
  });
41
  }
@@ -54,9 +54,11 @@ function wpvrtooltip(hotSpotDiv, args) {
54
  jQuery(document).ready(function($){
55
 
56
  $(".cross").on("click", function(e){
57
- e.preventDefault();
58
- $(this).siblings(".custom-ifram").fadeOut();
59
- $(this).parent(".pano-wrap").removeClass("show-modal");
 
 
60
  $('iframe').attr('src', $('iframe').attr('src'));
61
  if($('#wpvr-video').length != 0) {
62
  $('#wpvr-video').get(0).pause();
34
  function wpvrhotspot(hotSpotDiv, args) {
35
  var argst = args.replace(/\\/g, '');
36
  jQuery(document).ready(function($){
37
+ $(hotSpotDiv.target).parent().siblings(".custom-ifram-wrapper").find('.custom-ifram').html(argst);
38
+ $(hotSpotDiv.target).parent().siblings(".custom-ifram-wrapper").fadeToggle();
39
  $(hotSpotDiv.target).parent().parent(".pano-wrap").toggleClass("show-modal");
40
  });
41
  }
54
  jQuery(document).ready(function($){
55
 
56
  $(".cross").on("click", function(e){
57
+ e.preventDefault();
58
+
59
+ $(this).parent(".custom-ifram-wrapper").fadeOut();
60
+ $(this).parents(".pano-wrap").removeClass("show-modal");
61
+
62
  $('iframe').attr('src', $('iframe').attr('src'));
63
  if($('#wpvr-video').length != 0) {
64
  $('#wpvr-video').get(0).pause();
wpvr.php CHANGED
@@ -16,7 +16,7 @@
16
  * Plugin Name: WP VR
17
  * Plugin URI: https://rextheme.com/wpvr/
18
  * Description: WP VR - 360 Panorama and virtual tour creator for WordPress is a customized panaroma & virtual builder tool for WordPress Website.
19
- * Version: 5.9.0
20
  * Author: Rextheme
21
  * Author URI: http://rextheme.com/
22
  * License: GPL-2.0+
@@ -877,20 +877,75 @@ function wpvr_block_render( $attributes ) {
877
  }
878
  }
879
 
880
- $html .= '<i class="fa fa-times cross"></i>';
881
- $html .= '<div class="wpvr-hotspot-tweak-contents" style="display: none">';
882
- ob_start();
883
- do_action('wpvr_hotspot_tweak_contents', $scene_data);
884
- $hotspot_content = ob_get_clean();
885
- $html .= $hotspot_content;
 
 
 
 
 
886
  $html .= '</div>';
887
- $html .= '<div class="custom-ifram" style="display: none;">';
 
 
 
 
 
 
888
  $html .= '</div>';
889
  $html .= '</div>';
890
 
891
  //script started
 
892
  $html .= '<script>';
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
893
 
 
 
 
 
 
 
 
 
 
 
 
 
 
894
  $html .= 'var response = '.$response.';';
895
  $html .= 'var scenes = response[1];';
896
  $html .= 'if(scenes) {';
@@ -1047,50 +1102,6 @@ function wpvr_block_render( $attributes ) {
1047
  });
1048
  ';
1049
 
1050
- if (isset($postdata['bg_music'])) {
1051
- if ($bg_music == 'on') {
1052
- $html .= '
1053
- var x'.$id.' = document.getElementById("vrAudio'.$id.'");
1054
-
1055
- var playing'.$id.' = false;
1056
-
1057
- function playPause'.$id.'() {
1058
-
1059
- if (playing'.$id.') {
1060
- jQuery("#vr-volume'.$id.'").removeClass("fas fa-volume-up");
1061
- jQuery("#vr-volume'.$id.'").addClass("fas fa-volume-mute");
1062
- x'.$id.'.pause();
1063
- playing'.$id.' = false;
1064
-
1065
- }
1066
- else {
1067
- jQuery("#vr-volume'.$id.'").removeClass("fas fa-volume-mute");
1068
- jQuery("#vr-volume'.$id.'").addClass("fas fa-volume-up");
1069
- x'.$id.'.play();
1070
- playing'.$id.' = true;
1071
- }
1072
- }
1073
-
1074
- function audionEnd'.$id.'() {
1075
- playing'.$id.' = false;
1076
- jQuery("#vr-volume'.$id.'").removeClass("fas fa-volume-up");
1077
- jQuery("#vr-volume'.$id.'").addClass("fas fa-volume-mute");
1078
- }
1079
- ';
1080
-
1081
- if ($autoplay_bg_music == 'on') {
1082
- $html .= '
1083
- document.getElementById("pano'.$id.'").addEventListener("click", musicPlay'.$id.');
1084
- function musicPlay'.$id.'() {
1085
- playing'.$id.' = true;
1086
- document.getElementById("vrAudio'.$id.'").play();
1087
- document.getElementById("pano'.$id.'").removeEventListener("click", musicPlay'.$id.');
1088
- }
1089
- ';
1090
- }
1091
- }
1092
- }
1093
-
1094
  if (!$autoload) {
1095
  $html .= '
1096
 
@@ -1110,7 +1121,7 @@ function wpvr_block_render( $attributes ) {
1110
  jQuery("#pano'.$id.'").find(".pnlm-panorama-info").show();
1111
  });';
1112
  }
1113
-
1114
  $html .= '</script>';
1115
  //script end
1116
  return $html;
16
  * Plugin Name: WP VR
17
  * Plugin URI: https://rextheme.com/wpvr/
18
  * Description: WP VR - 360 Panorama and virtual tour creator for WordPress is a customized panaroma & virtual builder tool for WordPress Website.
19
+ * Version: 6.1.0
20
  * Author: Rextheme
21
  * Author URI: http://rextheme.com/
22
  * License: GPL-2.0+
877
  }
878
  }
879
 
880
+
881
+ $html .= '<div class="wpvr-hotspot-tweak-contents-wrapper" style="display: none">';
882
+ $html .= '<i class="fa fa-times cross"></i>';
883
+ $html .= '<div class="wpvr-hotspot-tweak-contents-flex">';
884
+ $html .= '<div class="wpvr-hotspot-tweak-contents">';
885
+ ob_start();
886
+ do_action('wpvr_hotspot_tweak_contents', $scene_data);
887
+ $hotspot_content = ob_get_clean();
888
+ $html .= $hotspot_content;
889
+ $html .= '</div>';
890
+ $html .= '</div>';
891
  $html .= '</div>';
892
+
893
+ $html .= '<div class="custom-ifram-wrapper" style="display: none;">';
894
+ $html .= '<i class="fa fa-times cross"></i>';
895
+ $html .= '<div class="custom-ifram-flex">';
896
+ $html .= '<div class="custom-ifram">';
897
+ $html .= '</div>';
898
+ $html .= '</div>';
899
  $html .= '</div>';
900
  $html .= '</div>';
901
 
902
  //script started
903
+
904
  $html .= '<script>';
905
+ if (isset($postdata['bg_music'])) {
906
+ if ($bg_music == 'on') {
907
+ $html .= '
908
+ var x'.$id.' = document.getElementById("vrAudio'.$id.'");
909
+
910
+ var playing'.$id.' = false;
911
+
912
+ function playPause'.$id.'() {
913
+
914
+ if (playing'.$id.') {
915
+ jQuery("#vr-volume'.$id.'").removeClass("fas fa-volume-up");
916
+ jQuery("#vr-volume'.$id.'").addClass("fas fa-volume-mute");
917
+ x'.$id.'.pause();
918
+ playing'.$id.' = false;
919
+
920
+ }
921
+ else {
922
+ jQuery("#vr-volume'.$id.'").removeClass("fas fa-volume-mute");
923
+ jQuery("#vr-volume'.$id.'").addClass("fas fa-volume-up");
924
+ x'.$id.'.play();
925
+ playing'.$id.' = true;
926
+ }
927
+ }
928
+
929
+ function audionEnd'.$id.'() {
930
+ playing'.$id.' = false;
931
+ jQuery("#vr-volume'.$id.'").removeClass("fas fa-volume-up");
932
+ jQuery("#vr-volume'.$id.'").addClass("fas fa-volume-mute");
933
+ }
934
+ ';
935
 
936
+ if ($autoplay_bg_music == 'on') {
937
+ $html .= '
938
+ document.getElementById("pano'.$id.'").addEventListener("click", musicPlay'.$id.');
939
+ function musicPlay'.$id.'() {
940
+ playing'.$id.' = true;
941
+ document.getElementById("vrAudio'.$id.'").play();
942
+ document.getElementById("pano'.$id.'").removeEventListener("click", musicPlay'.$id.');
943
+ }
944
+ ';
945
+ }
946
+ }
947
+ }
948
+ $html .= 'jQuery(document).ready(function() {';
949
  $html .= 'var response = '.$response.';';
950
  $html .= 'var scenes = response[1];';
951
  $html .= 'if(scenes) {';
1102
  });
1103
  ';
1104
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1105
  if (!$autoload) {
1106
  $html .= '
1107
 
1121
  jQuery("#pano'.$id.'").find(".pnlm-panorama-info").show();
1122
  });';
1123
  }
1124
+ $html .= '});';
1125
  $html .= '</script>';
1126
  //script end
1127
  return $html;