| Server IP : 170.10.161.225 / Your IP : 216.73.216.78 Web Server : Apache System : Linux vps103298.mylogin.co 4.18.0-513.11.1.el8_9.x86_64 #1 SMP Wed Jan 17 02:00:40 EST 2024 x86_64 User : calvet ( 273824) PHP Version : 7.4.33 Disable Function : NONE MySQL : OFF | cURL : ON | WGET : ON | Perl : ON | Python : ON | Sudo : OFF | Pkexec : ON Directory : /home/www/calvetrealty.com/wp-content/plugins/divi-pixel/includes/modules/Panorama/ |
Upload File : |
<?php
class DIPI_Panorama extends DIPI_Builder_Module
{
public $slug = 'dipi_panorama';
public $vb_support = 'on';
protected $module_credits = array(
'module_uri' => 'https://divi-pixel.com/modules/masonry-gallery',
'author' => 'Divi Pixel',
'author_uri' => 'https://divi-pixel.com',
);
public function init()
{
$this->icon_path = plugin_dir_path(__FILE__) . 'icon.svg';
$this->name = esc_html__('Pixel Panorama', 'dipi-divi-pixel');
$this->settings_modal_toggles = [
'general' => [
'toggles' => [
'main_content' => esc_html__('Panorama Settings', 'dipi-divi-pixel'),
'background' => esc_html__('Overlay', 'dipi-divi-pixel'),
],
],
];
}
public function get_settings_modal_toggles()
{
$toggles = [
'general' => [],
];
$toggles['general']['toggles'] = [
'main_content' => array(
'title' => esc_html__('Panorama Settings', 'dipi-divi-pixel'),
),
'background' => array(
'title' => esc_html__('Overlay Background', 'dipi-divi-pixel'),
),
'layer-one' => array(
'title' => esc_html__('Layer 1', 'dipi-divi-pixel'),
),
];
return $toggles;
}
public function get_fields()
{
return array(
// 'content' => array(
// 'label' => esc_html__( 'Content', 'dipi-divi-pixel' ),
// 'type' => 'tiny_mce',
// 'option_category' => 'basic_option',
// 'description' => esc_html__( 'Content entered here will appear inside the module.', 'dipi-divi-pixel' ),
// 'toggle_slug' => 'main_content',
// ),
'type' => array(
'label' => esc_html__('Panorama Type', 'dipi-divi-pixel'),
'type' => 'select',
'options' => array(
esc_html__('2D Image', 'dipi-divi-pixel'),
esc_html__('Equirectangular', 'dipi-divi-pixel'),
esc_html__('Cube Map', 'dipi-divi-pixel'),
esc_html__('Video', 'dipi-divi-pixel'),
// esc_html__( 'Multires', 'dipi-divi-pixel' ),
),
'default' => 'Equirectangular',
'option_category' => 'basic_option',
'toggle_slug' => 'main_content',
'data_type' => '',
),
'image2d' => array(
'label' => esc_html__('Panorama Image', 'dipi-divi-pixel'),
'type' => 'upload',
'upload_button_text' => esc_attr__('Upload Panorama Image', 'dipi-divi-pixel'),
'choose_text' => esc_attr__('Chose Panorama Image', 'dipi-divi-pixel'),
'update_text' => esc_attr__('Update Panorama Image', 'dipi-divi-pixel'),
'hide_metadata' => true,
'option_category' => 'basic_option',
'toggle_slug' => 'main_content',
'dynamic_content' => 'image',
'show_if' => array(
'type' => '2D Image',
),
),
'direction' => array(
'label' => esc_html__('Scroll Direction', 'dipi-divi-pixel'),
'type' => 'select',
'options' => array(
esc_html__('Horizontal', 'dipi-divi-pixel'),
esc_html__('Vertical', 'dipi-divi-pixel'),
esc_html__('Both', 'dipi-divi-pixel'),
),
'default' => 'Both',
'option_category' => 'basic_option',
'toggle_slug' => 'main_content',
'data_type' => '',
'show_if' => array(
'type' => '2D Image',
),
),
'repeat' => array(
'label' => esc_html__('Repeat', 'dipi-divi-pixel'),
'type' => 'select',
'options' => array(
esc_html__('None', 'dipi-divi-pixel'),
esc_html__('Horizontal', 'dipi-divi-pixel'),
esc_html__('Vertical', 'dipi-divi-pixel'),
esc_html__('Both', 'dipi-divi-pixel'),
),
'default' => 'None',
'option_category' => 'basic_option',
'toggle_slug' => 'main_content',
'data_type' => '',
'show_if' => array(
'type' => '2D Image',
),
),
'image' => array(
'label' => esc_html__('Panorama Image', 'dipi-divi-pixel'),
'type' => 'upload',
'upload_button_text' => esc_attr__('Upload Panorama Image', 'dipi-divi-pixel'),
'choose_text' => esc_attr__('Chose Panorama Image', 'dipi-divi-pixel'),
'update_text' => esc_attr__('Update Panorama Image', 'dipi-divi-pixel'),
'hide_metadata' => true,
'option_category' => 'basic_option',
'toggle_slug' => 'main_content',
'dynamic_content' => 'image',
'show_if' => array(
'type' => 'Equirectangular',
),
),
'is_autoload' => [
'label' => esc_html__('Auto load', 'dipi-divi-pixel'),
'type' => 'yes_no_button',
'options' => [
'off' => esc_html__('No', 'et_builder'),
'on' => esc_html__('Yes', 'et_builder'),
],
'option_category' => 'basic_option',
'toggle_slug' => 'main_content',
'show_if' => array(
'type' => ['Equirectangular', 'Cube Map'],
),
],
'image0' => array(
'label' => esc_html__('Cube Map Image 1', 'dipi-divi-pixel'),
'type' => 'upload',
'upload_button_text' => esc_attr__('Upload Cube Map Image', 'dipi-divi-pixel'),
'choose_text' => esc_attr__('Chose Cube Map Image', 'dipi-divi-pixel'),
'update_text' => esc_attr__('Update Cube Map Image', 'dipi-divi-pixel'),
'option_category' => 'basic_option',
'toggle_slug' => 'main_content',
'dynamic_content' => 'image',
'hide_metadata' => true,
'show_if' => array(
'type' => 'Cube Map',
),
),
'image1' => array(
'label' => esc_html__('Cube Map Image 2', 'dipi-divi-pixel'),
'type' => 'upload',
'upload_button_text' => esc_attr__('Upload Cube Map Image', 'dipi-divi-pixel'),
'choose_text' => esc_attr__('Chose Cube Map Image', 'dipi-divi-pixel'),
'update_text' => esc_attr__('Update Cube Map Image', 'dipi-divi-pixel'),
'option_category' => 'basic_option',
'toggle_slug' => 'main_content',
'dynamic_content' => 'image',
'hide_metadata' => true,
'show_if' => array(
'type' => 'Cube Map',
),
),
'image2' => array(
'label' => esc_html__('Cube Map Image 3', 'dipi-divi-pixel'),
'type' => 'upload',
'upload_button_text' => esc_attr__('Upload Cube Map Image', 'dipi-divi-pixel'),
'choose_text' => esc_attr__('Chose Cube Map Image', 'dipi-divi-pixel'),
'update_text' => esc_attr__('Update Cube Map Image', 'dipi-divi-pixel'),
'option_category' => 'basic_option',
'toggle_slug' => 'main_content',
'dynamic_content' => 'image',
'hide_metadata' => true,
'show_if' => array(
'type' => 'Cube Map',
),
),
'image3' => array(
'label' => esc_html__('Cube Map Image 4', 'dipi-divi-pixel'),
'type' => 'upload',
'upload_button_text' => esc_attr__('Upload Cube Map Image', 'dipi-divi-pixel'),
'choose_text' => esc_attr__('Chose Cube Map Image', 'dipi-divi-pixel'),
'update_text' => esc_attr__('Update Cube Map Image', 'dipi-divi-pixel'),
'option_category' => 'basic_option',
'toggle_slug' => 'main_content',
'dynamic_content' => 'image',
'hide_metadata' => true,
'show_if' => array(
'type' => 'Cube Map',
),
),
'image4' => array(
'label' => esc_html__('Cube Map Image 5', 'dipi-divi-pixel'),
'type' => 'upload',
'upload_button_text' => esc_attr__('Upload Cube Map Image', 'dipi-divi-pixel'),
'choose_text' => esc_attr__('Chose Cube Map Image', 'dipi-divi-pixel'),
'update_text' => esc_attr__('Update Cube Map Image', 'dipi-divi-pixel'),
'option_category' => 'basic_option',
'toggle_slug' => 'main_content',
'dynamic_content' => 'image',
'hide_metadata' => true,
'show_if' => array(
'type' => 'Cube Map',
),
),
'image5' => array(
'label' => esc_html__('Cube Map Image 6', 'dipi-divi-pixel'),
'type' => 'upload',
'upload_button_text' => esc_attr__('Upload Cube Map Image', 'dipi-divi-pixel'),
'choose_text' => esc_attr__('Chose Cube Map Image', 'dipi-divi-pixel'),
'update_text' => esc_attr__('Update Cube Map Image', 'dipi-divi-pixel'),
'option_category' => 'basic_option',
'toggle_slug' => 'main_content',
'dynamic_content' => 'image',
'hide_metadata' => true,
'show_if' => array(
'type' => 'Cube Map',
),
),
'poster' => array(
'label' => esc_html__('Panorama Video Poster', 'dipi-divi-pixel'),
'type' => 'upload',
'upload_button_text' => esc_attr__('Upload Panorama Poster', 'dipi-divi-pixel'),
'choose_text' => esc_attr__('Chose Panorama Poster', 'dipi-divi-pixel'),
'update_text' => esc_attr__('Update Panorama Poster', 'dipi-divi-pixel'),
'option_category' => 'basic_option',
'toggle_slug' => 'main_content',
'dynamic_content' => 'image',
'hide_metadata' => true,
'show_if' => array(
'type' => 'Video',
),
),
'videomp4' => array(
'label' => esc_html__('Video MP4 File Or Youtube URL', 'et_builder'),
'type' => 'upload',
'option_category' => 'basic_option',
'data_type' => 'video',
'upload_button_text' => esc_attr__('Upload a video', 'et_builder'),
'choose_text' => esc_attr__('Choose a Video MP4 File', 'et_builder'),
'update_text' => esc_attr__('Set As Video', 'et_builder'),
'description' => esc_html__('Upload your desired video in .MP4 format, or type in the URL to the video you would like to display', 'et_builder'),
'toggle_slug' => 'main_content',
'computed_affects' => array(
'__video',
),
'mobile_options' => true,
'hover' => 'tabs',
'show_if' => array(
'type' => 'Video',
),
),
'videowebm' => array(
'label' => esc_html__('Video WEBM File Or Youtube URL', 'et_builder'),
'type' => 'upload',
'option_category' => 'basic_option',
'data_type' => 'video',
'upload_button_text' => esc_attr__('Upload a video', 'et_builder'),
'choose_text' => esc_attr__('Choose a Video WEBM File', 'et_builder'),
'update_text' => esc_attr__('Set As Video', 'et_builder'),
'description' => esc_html__('Upload your desired video in .WEBM format, or type in the URL to the video you would like to display', 'et_builder'),
'toggle_slug' => 'main_content',
'computed_affects' => array(
'__video',
),
'mobile_options' => true,
'hover' => 'tabs',
'show_if' => array(
'type' => 'Video',
),
),
);
}
public function get_advanced_fields_config()
{
$advanced_fields = [];
$advanced_fields['borders'] = array(
'default' => array(
'css' => array(
'main' => array(
'border_radii' => "%%order_class%% .wrapper",
'border_styles' => "%%order_class%% .wrapper",
),
),
),
);
$advanced_fields['box_shadow'] = array(
'default' => array(
'css' => array(
'main' => "%%order_class%% .wrapper",
),
),
);
$advanced_fields['margin_padding'] = array(
'css' => array(
'margin' => "%%order_class%% .dipi-panorma-wrapper",
'padding' => "%%order_class%% .dipi-panorma-wrapper",
'important' => 'all',
),
);
$advanced_fields['background'] = [
'css' => [
'main' => '%%order_class%% .dipi-panorama-overlay',
'important' => true,
],
'hover' => false,
'hover_enabled' => 'off',
'background__hover_enabled' => 'off',
'use_background_video' => false,
];
$advanced_fields['link_options'] = false;
$advanced_fields['link_options'] = false;
$advanced_fields['text'] = false;
$advanced_fields['fonts'] = false;
$advanced_fields['max_width'] = [
'use_max_width' => false,
'use_min_height' => false,
'use_module_alignment' => true,
'options' => [
'module_alignment' => [
'default' => 'center',
],
],
];
$advanced_fields['height'] = [
'use_height' => true,
'use_min_height' => false,
'use_max_height' => false,
'options' => [
'height' => [
'default' => '500px',
],
],
];
return $advanced_fields;
}
public function isYoutube($url)
{
if (strpos($url, 'youtube') > 0) {
return true;
}
return false;
}
public function getYoutubeID($url)
{
preg_match('%(?:youtube(?:-nocookie)?\.com/(?:[^/]+/.+/|(?:v|e(?:mbed)?)/|.*[?&]v=)|youtu\.be/)([^"&?/ ]{11})%i', $url, $match);
return $match[1];
}
public function render_panorama_video($attrs, $content, $render_slug)
{
if ($this->isYoutube($this->props['videomp4'])) {
return sprintf('
<div class="dipi-panorma-wrapper wrapper" style="height:100%%">
<div class="dipi-panorama-overlay">
<div class="dipi-panorama-overlay-content">
<div class="dipi-panorama-icon dipi-scroll-icon"></div><br />
<div class="dipi-panorama-icon dipi-hand-icon"></div>
</div>
</div>
<iframe height="100%%" width="100%%" src="https://www.youtube.com/embed/%1$s?controls=0" frameBorder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowFullScreen></iframe>
</div>',
$this->getYoutubeID($this->props['videomp4']),
$this->props['width'],
$this->props['height']
);
}
$videomp4 = '';
if (!empty($this->props['videomp4'])) {
$videomp4 = sprintf('<source src="%1$s" type="video/mp4"/>', $this->props['videomp4']);
}
$videowebm = '';
if (!empty($this->props['videowebm'])) {
$videowebm = sprintf('<source src="%1$s" type="video/webm"/>', $this->props['videowebm']);
}
return sprintf('
<div class="dipi-panorma-wrapper wrapper" style="height:100%%">
<div class="dipi-panorama-overlay">
<div class="dipi-panorama-overlay-content">
<div class="dipi-panorama-icon dipi-scroll-icon"></div><br />
<div class="dipi-panorama-icon dipi-hand-icon"></div>
</div>
</div>
<video class="dipi-panorama-video video-js vjs-default-skin vjs-big-play-centered"
controls
preload="none"
style="width:100%%;height:100%%"
poster="%3$s"
data-is-autoload="%6$s"
crossOrigin="anonymous">
%4$s
%5$s
<p class="vjs-no-js">
To view this video please enable JavaScript, and consider upgrading to
a web browser that supports HTML5 video
</p>
</video>
</div>',
$this->props['width'], // #1
$this->props['height'], // #2
$this->props['poster'], // #3
$videomp4, // #4
$videowebm, // #5
$this->props['is_autoload']// #6
);
}
public function render_panorama_image($attrs, $content, $render_slug)
{
$images = '';
if ($this->props['type'] == 'Equirectangular') {
$images = sprintf('data-image="%1$s"', $this->props['image']);
} else if ($this->props['type'] == 'Cube Map') {
$images = sprintf('data-image0="%1$s"
data-image1="%2$s"
data-image2="%3$s"
data-image3="%4$s"
data-image4="%5$s"
data-image5="%6$s"',
$this->props['image0'],
$this->props['image1'],
$this->props['image2'],
$this->props['image3'],
$this->props['image4'],
$this->props['image5']
);
}
return sprintf(
'<div class="dipi-panorma-wrapper wrapper" style="height:100%%">
<div class="dipi-panorama-overlay">
<div class="dipi-panorama-overlay-content">
<div class="dipi-panorama-icon dipi-scroll-icon"></div><br />
<div class="dipi-panorama-icon dipi-hand-icon"></div>
</div>
</div>
<div id="%6$s" class="dipi-panorama"
data-type="%1$s"
data-is-autoload="%7$s"
%2$s
style="width:%3$s; height: %4$s"></div>
</div>',
$this->props['type'], // #1
$images, // #2
'100%', // #3
$this->props['height'], // #4
$this->module_classname($render_slug), // #5
$this->module_id(), // #6
$this->props['is_autoload']// #7
);
}
public function render_panorama_image2d($attrs, $content, $render_slug)
{
ET_Builder_Element::set_style($render_slug, [
'selector' => '%%order_class%% .dipi-panorma-image2d',
'declaration' => "overflow: hidden;position: relative;",
]);
$img_src = $this->props['image2d'];
$img_size = getimagesize($this->props['image2d']);
$width = ($this->props['repeat'] === 'Horizontal' || $this->props['repeat'] === 'Both') ? $img_size[0] * 3 . 'px' : $img_size[0] . 'px';
$height = ($this->props['repeat'] === 'Vertical' || $this->props['repeat'] === 'Both') ? $img_size[1] * 3 . 'px' : $img_size[1] . 'px';
// $height = $this->props['height'];
$rs_height = $this->dipi_get_responsive_prop('height');
ET_Builder_Element::set_style($render_slug, [
'selector' => '%%order_class%% .dipi-panorma-image2d .dipi-img-drag',
'declaration' => "position: absolute;background-image:url($img_src);width:$width; height:$height;transform: translate(-50%,-50%);z-index:1;cursor: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAodJREFUeNq0Vz2IGkEUnjPXCqYyWG2njWChkO6MVTpzYJFCyKW08mzsJBe0P9MIaSQBm1RqZxo1hZXCHdholassBIlok8583/JW9sy57u7tPvjYH4b53pv35nszZ8qBxePxBB5pIAQ8AJ3pdLpWLuzMJiGJ2kJ6aJ9BfuOU+IVN0gHwmhECBeA78AvQgPfhcDi0XC5/OiEO2BhzC3CJS4wOKAKfhPQSuAeu4WDaCfG5jTHvZHJGe8f8RiIRtVgsSHQh5L+BD8DQk4ilmLjUXXEgVK/XVa/XU5lMRknO1+KY5vVSG0YHDEIVjUaN/wk3VW1JjGq9l4iyJ+bRZHt5muNvwNUJB196GrFMWnIzsRcRn7IBilDJUl9Kevwn5tZiwXW7XW273bbhxFByToGpH5PUZxPXajWVTCb191arRcKrYDCo4IS+z+HIF6n8jnk1Al7ljGS0crmsRqOReZ+3Renu4MS1JTEGaCIeji0Wiz3a59lsVjWbTeP7VrT/MTHJgIFIID38Y/bSjZGYqTCExxCc8ycaQpqDWTQomBA0mV5eHAoEI0ilUvvIDr/5PplMzApnqc27XC63M2yz2eyKxeKO/w24tUajYcyRfirHnfl8riqVyr5g2BRYMH4LyEfuQSyxnodqtar/zOfz+tKNx2PPiAMH8sjN/oZtDuT7yI0c0gFfiE+Re2mBI43Bd/KARVfyi3xt5yDgGTl3i+lwYasfP5scIqT6/b6SA6O9czUNZ+a/ODv/wOtbeP6KE5kk0NLQpVShUFCr1YqfBcz1YJvYLTnHkFSWmb35q6MrzJGbRYJ6Tl2nuJhtNpvpZEyNGElLju9ORxy4kVtFyGLYUO5W/x30/wkwAGYcYOCgmyR/AAAAAElFTkSuQmCC), auto;",
]);
ET_Builder_Element::set_style($render_slug, [
'selector' => '%%order_class%% .dipi-panorma-image2d .dipi-img-drag img',
'declaration' => "display:block;max-width:inherit",
]);
ET_Builder_Element::set_style($render_slug, [
'selector' => '%%order_class%% .dipi-panorama-overlay',
'declaration' => "display: flex;align-items: center;justify-content: center;text-align: center;position: absolute;width:100%;height:100%;z-index:2;transition:visibility 0.3s linear,opacity 0.3s linear;visibility:visible;opacity:1;",
]);
ET_Builder_Element::set_style($render_slug, [
'selector' => '%%order_class%% .dipi-panorama-overlay.light',
'declaration' => "color:#fff",
]);
ET_Builder_Element::set_style($render_slug, [
'selector' => '%%order_class%% .dipi-panorama-overlay.dark',
'declaration' => "color:#000",
]);
ET_Builder_Element::set_style($render_slug, [
'selector' => '%%order_class%%:hover .dipi-panorama-overlay',
'declaration' => "visibility:hidden;opacity:0;",
]);
ET_Builder_Element::set_style($render_slug, [
'selector' => '%%order_class%% .dipi-hand-icon',
'declaration' => "width: 25px;height: 30px;background-size: 100% 100%; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAyMy4xLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCINCgkgdmlld0JveD0iMCAwIDM5Ni41IDQ2OS4zIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCAzOTYuNSA0NjkuMzsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4NCgkuc3Qwe2ZpbGw6I0ZGRkZGRjtzdHJva2U6IzAwMDAwMDtzdHJva2UtbWl0ZXJsaW1pdDoxMDt9DQo8L3N0eWxlPg0KPGc+DQoJPGc+DQoJCTxwb2x5Z29uIGNsYXNzPSJzdDAiIHBvaW50cz0iMTMsMjc0LjggMTg2LjgsNDQ4LjYgMjkzLjksNDQ4LjYgMzQwLjUsNDQ4LjYgMzYyLjMsNDI2LjggMzgxLjMsMzg0LjYgMzg1LjYsMjk2LjIgMzg1LjYsMjI0LjkgDQoJCQkzNTguNSwyMDYuOSAzMjIuNCwyMDQgMjk3LjIsMTgxLjIgMjY2LjMsMTg1LjUgMjMyLjEsMTY0LjYgMTk4LjIsMTYxLjcgMTkwLjMsNzIuNCAxNTgsNTUuMiAxMzAuNCw3MC45IDEzMS40LDEzNC42IDEyOSwxODQgDQoJCQkxMjkuOSwyMTUuNCAxMjkuNSwyMzQuNiAxMjcuNiwyNTguNyAxMjYuMSwyNzcuNyA0OS42LDI0MC4xIDE4LjcsMjQ1LjMgCQkiLz4NCgkJPHBhdGggZD0iTTM1My44LDE5MmMtOC44LDAtMTYuOSwyLjctMjMuNyw3LjJjLTUuOC0xNi42LTIxLjctMjguNS00MC4zLTI4LjVjLTguOCwwLTE2LjksMi43LTIzLjcsNy4yDQoJCQljLTUuOC0xNi42LTIxLjctMjguNS00MC4zLTI4LjVjLTcuOCwwLTE1LjEsMi4xLTIxLjMsNS43Vjg1LjNjMC0yMy41LTE5LjEtNDIuNy00Mi43LTQyLjdzLTQyLjcsMTkuMS00Mi43LDQyLjd2MTgxLjNMODIsMjM4LjgNCgkJCWMtMjItMTYuNS01My4zLTE0LjMtNzIuNyw1LjJjLTEyLjUsMTIuNS0xMi41LDMyLjgsMCw0NS4ybDE1MS45LDE1MS45YzE4LjEsMTguMSw0Mi4yLDI4LjEsNjcuOSwyOC4xaDUwDQoJCQljNjQuNywwLDExNy4zLTUyLjYsMTE3LjMtMTE3LjNWMjM0LjdDMzk2LjUsMjExLjEsMzc3LjQsMTkyLDM1My44LDE5MnogTTM3NS4yLDM1MmMwLDUyLjktNDMuMSw5Ni05Niw5NmgtNTANCgkJCWMtMTkuOSwwLTM4LjctNy44LTUyLjgtMjEuOUwyNC41LDI3NC4yYy00LjItNC4yLTQuMi0xMC45LDAtMTUuMWM2LjYtNi42LDE1LjQtMTAsMjQuMy0xMGM3LjIsMCwxNC40LDIuMiwyMC41LDYuOGw1NC4xLDQwLjYNCgkJCWMzLjIsMi40LDcuNiwyLjgsMTEuMiwxczUuOS01LjUsNS45LTkuNVY4NS4zYzAtMTEuOCw5LjYtMjEuMywyMS4zLTIxLjNjMTEuOCwwLDIxLjMsOS42LDIxLjMsMjEuM3YxNjBjMCw1LjksNC44LDEwLjcsMTAuNywxMC43DQoJCQlzMTAuNy00LjgsMTAuNy0xMC43VjE5MmMwLTExLjgsOS42LTIxLjMsMjEuMy0yMS4zYzExLjgsMCwyMS4zLDkuNiwyMS4zLDIxLjN2NTMuM2MwLDUuOSw0LjgsMTAuNywxMC43LDEwLjcNCgkJCWM1LjksMCwxMC43LTQuOCwxMC43LTEwLjd2LTMyYzAtMTEuOCw5LjYtMjEuMywyMS4zLTIxLjNzMjEuMyw5LjYsMjEuMywyMS4zdjMyYzAsNS45LDQuOCwxMC43LDEwLjcsMTAuN3MxMC43LTQuOCwxMC43LTEwLjcNCgkJCXYtMTAuN2MwLTExLjgsOS42LTIxLjMsMjEuMy0yMS4zczIxLjMsOS42LDIxLjMsMjEuM0wzNzUuMiwzNTJMMzc1LjIsMzUyeiIvPg0KCTwvZz4NCjwvZz4NCjxnPg0KCTxnPg0KCQk8cGF0aCBkPSJNMTYxLjgsMGMtNDcuMSwwLTg1LjMsMzguMy04NS4zLDg1LjNjMCwxNC4yLDMuNywyOC4xLDExLDQxLjNjMiwzLjUsNS42LDUuNSw5LjMsNS41YzEuNywwLDMuNS0wLjQsNS4yLTEuMw0KCQkJYzUuMS0yLjksNy05LjQsNC4xLTE0LjVjLTUuNS05LjktOC4zLTIwLjQtOC4zLTMwLjljMC0zNS4zLDI4LjctNjQsNjQtNjRzNjQsMjguNyw2NCw2NGMwLDUuMS0wLjgsMTAuNC0yLjUsMTYuNw0KCQkJYy0xLjYsNS43LDEuOCwxMS41LDcuNSwxMy4xYzUuNiwxLjYsMTEuNS0xLjgsMTMuMS03LjVjMi4yLTguMiwzLjMtMTUuMywzLjMtMjIuNEMyNDcuMiwzOC4zLDIwOC45LDAsMTYxLjgsMHoiLz4NCgk8L2c+DQo8L2c+DQo8L3N2Zz4NCg==')",
]);
ET_Builder_Element::set_style($render_slug, [
'selector' => '%%order_class%% .dipi-scroll-icon',
'declaration' => "background-size: 100% 100%; margin-right: 8px!important; width: 30px;height: 40px; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAyMy4xLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCINCgkgdmlld0JveD0iMCAwIDUxMiA1MTIiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDUxMiA1MTI7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+DQoJLnN0MHtmaWxsOiNGRkZGRkY7fQ0KPC9zdHlsZT4NCjxlbGxpcHNlIGNsYXNzPSJzdDAiIGN4PSIyNTUuNiIgY3k9IjI1NC45IiByeD0iMTY3LjUiIHJ5PSIyMzYiLz4NCjxnPg0KCTxnPg0KCQk8cGF0aCBkPSJNMjU2LDBDMTU2LjYsMCw3NS43LDgyLjEsNzUuNywxODMuMXYxNDUuOGMwLDEwMSw4MC45LDE4My4xLDE4MC4zLDE4My4xYzk5LjQsMCwxODAuMy04MS45LDE4MC4zLTE4Mi41VjE4My4xDQoJCQlDNDM2LjMsODIuMSwzNTUuNCwwLDI1NiwweiBNNDAyLjQsMzI5LjVjMCw4Mi02NS43LDE0OC42LTE0Ni40LDE0OC42Yy04MC43LDAtMTQ2LjQtNjYuOS0xNDYuNC0xNDkuMlYxODMuMQ0KCQkJYzAtODIuMyw2NS43LTE0OS4yLDE0Ni40LTE0OS4yYzgwLjcsMCwxNDYuNCw2Ni45LDE0Ni40LDE0OS4yVjMyOS41eiIvPg0KCTwvZz4NCjwvZz4NCjxnPg0KCTxnPg0KCQk8cGF0aCBkPSJNMjU2LDE0MC4xYy05LjQsMC0xNyw3LjYtMTcsMTd2NTkuM2MwLDkuNCw3LjYsMTcsMTcsMTdjOS40LDAsMTctNy42LDE3LTE3di01OS4zQzI3MywxNDcuNywyNjUuNCwxNDAuMSwyNTYsMTQwLjF6Ii8+DQoJPC9nPg0KPC9nPg0KPC9zdmc+DQo=')",
]);
ET_Builder_Element::set_style($render_slug, [
'selector' => '%%order_class%% .dipi-panorama-icon',
'declaration' => "display: inline-block;vertical-align: middle;margin: 5px;",
]);
return sprintf(
'<div class="dipi-panorma-wrapper wrapper loaded dipi-panorma-image2d" style="height:100%%;">
<div class="dipi-panorama-overlay">
<div class="dipi-panorama-overlay-content">
<div class="dipi-panorama-icon dipi-scroll-icon"></div><br />
<div class="dipi-panorama-icon dipi-hand-icon"></div>
</div>
</div>
<div class="dipi-img-drag" data-direction="%3$s" data-repeat="%4$s"
data-module-height="%2$s"
data-module-height-tablet="%7$s"
data-module-height-phone="%8$s"
data-image-width="%5$s"
data-image-height="%6$s">
</div>
</div>',
$this->props['image2d'], // #1
$this->props['height'], // #2
$this->props['direction'], // #3
$this->props['repeat'], // #4
$img_size[0], // #5
$img_size[1], // #6
$rs_height['tablet'], // #7
$rs_height['phone'] // #8
);
}
public function render($attrs, $content, $render_slug)
{
wp_enqueue_script('dipi_panorama_public');
wp_enqueue_style('dipi_pannellum');
if (!isset($this->props['border_style_all']) || empty($this->props['border_style_all'])) {
ET_Builder_Element::set_style($render_slug, [
'selector' => '%%order_class%% .wrapper',
'declaration' => "border-style: solid;",
]);
}
$this->process_range_field_css( array(
'render_slug' => $render_slug,
'slug' => 'height',
'type' => 'height',
'selector' => '%%order_class%%',
'important' => false
) );
if ($this->props['type'] == 'Video') {
wp_enqueue_script('dipi_videojs_pannellum_plugin');
wp_enqueue_style('dipi_videojs');
return $this->render_panorama_video($attrs, $content, $render_slug);
} else if ($this->props['type'] == '2D Image') {
return $this->render_panorama_image2d($attrs, $content, $render_slug);
} else {
return $this->render_panorama_image($attrs, $content, $render_slug);
}
}
}
new DIPI_Panorama;