| 1 |
<?php |
| 2 |
if (!defined('ABSPATH')) exit; |
| 3 |
|
| 4 |
/** Sticker controls shared by every legacy hotspot repeater item. */ |
| 5 |
class WPVR_Sticker_Fields { |
| 6 |
public static function render($hotspot) { |
| 7 |
$templates = array( |
| 8 |
'social_proof' => __('Social Proof', 'wpvr'), |
| 9 |
'discount_button' => __('Simple Discount Button', 'wpvr'), |
| 10 |
'button_with_separate_icon' => __('Button with separate icon', 'wpvr'), |
| 11 |
'add_to_cart' => __('Add to cart', 'wpvr'), |
| 12 |
'social_share' => __('Social Share', 'wpvr'), |
| 13 |
); |
| 14 |
$template = $hotspot['hotspot-sticker-template'] ?? 'social_proof'; |
| 15 |
if (!isset($templates[$template])) $template = 'social_proof'; |
| 16 |
$buttons = 'discount_button button_with_separate_icon add_to_cart social_share'; |
| 17 |
// name => label, control type, default, applicable templates (empty means all). |
| 18 |
$fields = array( |
| 19 |
'client-name' => array(__('Client Name', 'wpvr'), 'text', 'Elena R.', 'social_proof'), |
| 20 |
'client-avatar' => array(__('Client Avatar', 'wpvr'), 'media', '', 'social_proof'), |
| 21 |
'review-text' => array(__('Review Text', 'wpvr'), 'textarea', 'The support is super responsive and responds without worries to our requests and needs! Big up to the entire RexTheme team!', 'social_proof'), |
| 22 |
'rating' => array(__('Star Rating', 'wpvr'), 'number', 5, 'social_proof', 1, 5), |
| 23 |
'star-color' => array(__('Star Color', 'wpvr'), 'text', '#EF991F', 'social_proof'), |
| 24 |
'text-color' => array(__('Text Color', 'wpvr'), 'text', '#ffffff', 'social_proof add_to_cart'), |
| 25 |
'prefix-text' => array(__('Text Before Button', 'wpvr'), 'text', '$1,090 -', 'add_to_cart'), |
| 26 |
'sub-text' => array(__('Sub Text', 'wpvr'), 'text', 'Ready to ship', 'add_to_cart'), |
| 27 |
'show-placeholder-text' => array(__('Show Additional Text', 'wpvr'), 'toggle', 'on', 'add_to_cart social_share'), |
| 28 |
'main-bg' => array(__('Main Background', 'wpvr'), 'toggle', 'on', $buttons), |
| 29 |
'bg-color' => array(__('Background Color', 'wpvr'), 'text', '#201b2c', ''), |
| 30 |
'bg-opacity' => array(__('Background Opacity (%)', 'wpvr'), 'number', 95, '', 0, 100), |
| 31 |
'blur' => array(__('Blur (px)', 'wpvr'), 'number', 12, '', 0, 40), |
| 32 |
'brightness' => array(__('Brightness (%)', 'wpvr'), 'number', 100, '', 0, 200), |
| 33 |
'border-color' => array(__('Border Color', 'wpvr'), 'text', '#3a3051', ''), |
| 34 |
'border-radius' => array(__('Border Radius (px)', 'wpvr'), 'corners', 20, ''), |
| 35 |
'padding' => array(__('Padding (px)', 'wpvr'), 'sides', 21, $buttons), |
| 36 |
'btn-text' => array(__('Button Text', 'wpvr'), 'text', 'GET 20% OFF NOW', $buttons), |
| 37 |
'btn-url' => array(__('Button URL', 'wpvr'), 'url', '', 'discount_button button_with_separate_icon add_to_cart'), |
| 38 |
'btn-new-tab' => array(__('Open in New Tab', 'wpvr'), 'toggle', 'off', 'discount_button button_with_separate_icon add_to_cart'), |
| 39 |
'btn-bg' => array(__('Button Background', 'wpvr'), 'toggle', 'on', $buttons), |
| 40 |
'btn-color' => array(__('Button Color', 'wpvr'), 'text', '#EF991F', $buttons), |
| 41 |
'btn-text-color' => array(__('Button Text Color', 'wpvr'), 'text', '#000000', $buttons), |
| 42 |
'btn-width' => array(__('Button Width (px)', 'wpvr'), 'number', '', $buttons, 0), |
| 43 |
'btn-height' => array(__('Button Height (px)', 'wpvr'), 'number', '', $buttons, 0), |
| 44 |
'btn-radius' => array(__('Button Radius (px)', 'wpvr'), 'number', 10, $buttons, 0), |
| 45 |
'btn-border' => array(__('Button Border Width (px)', 'wpvr'), 'number', 0, $buttons, 0), |
| 46 |
'btn-border-color' => array(__('Button Border Color', 'wpvr'), 'text', '#EF991F', $buttons), |
| 47 |
'btn-text-size' => array(__('Button Text Size (px)', 'wpvr'), 'number', 18, $buttons, 8), |
| 48 |
'btn-text-weight' => array(__('Button Font Weight', 'wpvr'), 'number', 700, $buttons, 100, 900), |
| 49 |
'btn-icon' => array(__('Button Icon', 'wpvr'), 'text', 'fas fa-tag', 'discount_button button_with_separate_icon'), |
| 50 |
'btn-icon-color' => array(__('Button Icon Color', 'wpvr'), 'text', '#000000', 'discount_button button_with_separate_icon'), |
| 51 |
'icon-box-bg-color' => array(__('Icon Box Background Color', 'wpvr'), 'text', '#ffffff', 'button_with_separate_icon'), |
| 52 |
'icon-box-radius' => array(__('Icon Box Radius (px)', 'wpvr'), 'number', 30, 'button_with_separate_icon', 0), |
| 53 |
'icon-box-border' => array(__('Icon Box Border Width (px)', 'wpvr'), 'number', 0, 'button_with_separate_icon', 0), |
| 54 |
'icon-box-border-color' => array(__('Icon Box Border Color', 'wpvr'), 'text', '#ffffff', 'button_with_separate_icon'), |
| 55 |
'icon-box-size' => array(__('Icon Box Size (px)', 'wpvr'), 'number', 60, 'button_with_separate_icon', 20), |
| 56 |
'social-color' => array(__('Social Icon Color', 'wpvr'), 'text', '#ffffff', 'social_share'), |
| 57 |
'social-size' => array(__('Social Icon Size (px)', 'wpvr'), 'number', 20, 'social_share', 10), |
| 58 |
'social-gap' => array(__('Social Icon Gap (px)', 'wpvr'), 'number', 16, 'social_share', 0), |
| 59 |
'social-links' => array(__('Social Links', 'wpvr'), 'links', array( |
| 60 |
array('id' => '1', 'icon' => 'fab fa-linkedin-in', 'customSvg' => '', 'url' => 'https://linkedin.com', 'openNewTab' => 'on'), |
| 61 |
array('id' => '2', 'icon' => 'fab fa-facebook-f', 'customSvg' => '', 'url' => 'https://facebook.com', 'openNewTab' => 'on'), |
| 62 |
array('id' => '3', 'icon' => 'fab fa-instagram', 'customSvg' => '', 'url' => 'https://instagram.com', 'openNewTab' => 'on'), |
| 63 |
array('id' => '4', 'icon' => 'fab fa-dribbble', 'customSvg' => '', 'url' => 'https://dribbble.com', 'openNewTab' => 'on'), |
| 64 |
), 'social_share'), |
| 65 |
); |
| 66 |
$special = array('bg-opacity' => 75, 'border-color' => '#40355a', 'btn-height' => 60, 'btn-text-weight' => 600); |
| 67 |
$overrides = array( |
| 68 |
'discount_button' => array('border-radius' => 15), |
| 69 |
'button_with_separate_icon' => array_merge($special, array('border-radius' => 135, 'btn-text' => 'Limited “Midnight Horizon” Edition', 'btn-color' => '#ffffff', 'btn-width' => 356, 'btn-radius' => 30, 'btn-border-color' => '#ffffff')), |
| 70 |
'add_to_cart' => array_merge($special, array('border-radius' => 15, 'btn-text' => 'ADD TO CART', 'btn-color' => '#3f04fe', 'btn-text-color' => '#ffffff', 'btn-width' => 163, 'btn-border-color' => '#ffffff', 'btn-icon' => 'none')), |
| 71 |
'social_share' => array_merge($special, array('border-radius' => 15, 'btn-text' => 'SHARE EXPERIENCE', 'btn-color' => '#201a2b', 'btn-text-color' => '#ffffff', 'btn-width' => 222, 'btn-border' => 1, 'btn-border-color' => '#3a3051', 'btn-icon' => 'none')), |
| 72 |
); |
| 73 |
$sections = array( |
| 74 |
'client-name' => array(__('Testimonial', 'wpvr'), 'social_proof'), |
| 75 |
'prefix-text' => array(__('Product Text', 'wpvr'), 'add_to_cart'), |
| 76 |
'main-bg' => array(__('Card Appearance', 'wpvr'), ''), |
| 77 |
'btn-text' => array(__('Button', 'wpvr'), $buttons), |
| 78 |
'icon-box-bg-color' => array(__('Separate Icon', 'wpvr'), 'button_with_separate_icon'), |
| 79 |
'social-color' => array(__('Social Icons', 'wpvr'), 'social_share'), |
| 80 |
); |
| 81 |
?> |
| 82 |
<div class="wpvr-legacy-sticker-settings" style="display:<?php echo ($hotspot['hotspot-type'] ?? '') === 'sticker' ? 'block' : 'none'; ?>"> |
| 83 |
<div class="wpvr-sticker-panel-heading"><?php esc_html_e('Sticker Settings', 'wpvr'); ?></div> |
| 84 |
<label class="wpvr-sticker-template-label"> |
| 85 |
<?php esc_html_e('Sticker Template', 'wpvr'); ?>: |
| 86 |
<select name="hotspot-sticker-template" class="wpvr-sticker-template"> |
| 87 |
<?php foreach ($templates as $key => $label) { ?> |
| 88 |
<option value="<?php echo esc_attr($key); ?>" <?php selected($template, $key); ?>><?php echo esc_html($label); ?></option> |
| 89 |
<?php } ?> |
| 90 |
</select> |
| 91 |
</label> |
| 92 |
<?php foreach ($fields as $key => $field) { |
| 93 |
list($label, $type, $default, $applies) = $field; |
| 94 |
$defaults = array(); |
| 95 |
$parts = $type === 'corners' ? array('topLeft', 'topRight', 'bottomRight', 'bottomLeft') : array('top', 'right', 'bottom', 'left'); |
| 96 |
foreach ($templates as $id => $unused) { |
| 97 |
$value = $overrides[$id][$key] ?? $default; |
| 98 |
$defaults[$id] = in_array($type, array('corners', 'sides'), true) ? array_fill_keys($parts, $value) : $value; |
| 99 |
} |
| 100 |
$name = 'hotspot-sticker-' . $key; |
| 101 |
$value = $hotspot[$name] ?? ($key === 'main-bg' ? ($hotspot['hotspot-sticker-card-bg'] ?? $defaults[$template]) : $defaults[$template]); |
| 102 |
if (in_array($type, array('corners', 'sides'), true)) { |
| 103 |
if (is_object($value)) $value = (array) $value; |
| 104 |
if (!is_array($value)) $value = array_fill_keys($parts, is_numeric($value) ? $value : $defaults[$template][$parts[0]]); |
| 105 |
} |
| 106 |
if ($type === 'links' && !is_array($value)) { |
| 107 |
$decoded = json_decode((string) $value, true); |
| 108 |
$value = is_array($decoded) ? $decoded : $defaults[$template]; |
| 109 |
} |
| 110 |
$visible = !$applies || in_array($template, explode(' ', $applies), true); |
| 111 |
?> |
| 112 |
<?php if (isset($sections[$key])) { ?> |
| 113 |
<h4 class="wpvr-sticker-section" data-templates="<?php echo esc_attr($sections[$key][1]); ?>"><?php echo esc_html($sections[$key][0]); ?></h4> |
| 114 |
<?php } ?> |
| 115 |
<div class="wpvr-sticker-field" data-templates="<?php echo esc_attr($applies); ?>" data-kind="<?php echo esc_attr($type); ?>" data-defaults="<?php echo esc_attr(wp_json_encode($defaults)); ?>" style="margin-top:15px;display:<?php echo $visible ? 'block' : 'none'; ?>"> |
| 116 |
<label style="display:block"> |
| 117 |
<span class="wpvr-sticker-field-label"><?php echo esc_html($label); ?>:</span> |
| 118 |
<?php if ($type === 'textarea') { ?> |
| 119 |
<textarea name="<?php echo esc_attr($name); ?>" class="wpvr-sticker-value" rows="4"><?php echo esc_textarea($value); ?></textarea> |
| 120 |
<?php } elseif ($type === 'number') { ?> |
| 121 |
<!-- The legacy repeater does not serialize number inputs. --> |
| 122 |
<input type="hidden" name="<?php echo esc_attr($name); ?>" class="wpvr-sticker-value" value="<?php echo esc_attr($value); ?>"> |
| 123 |
<input type="number" class="wpvr-sticker-number" value="<?php echo esc_attr($value); ?>" step="1" min="<?php echo esc_attr($field[4] ?? 0); ?>" <?php if (isset($field[5])) { ?>max="<?php echo esc_attr($field[5]); ?>"<?php } ?>> |
| 124 |
<?php } elseif ($type === 'toggle') { ?> |
| 125 |
<select name="<?php echo esc_attr($name); ?>" class="wpvr-sticker-value"> |
| 126 |
<option value="on" <?php selected($value, 'on'); ?>><?php esc_html_e('On', 'wpvr'); ?></option> |
| 127 |
<option value="off" <?php selected($value, 'off'); ?>><?php esc_html_e('Off', 'wpvr'); ?></option> |
| 128 |
</select> |
| 129 |
<?php } elseif (in_array($type, array('corners', 'sides', 'links'), true)) { ?> |
| 130 |
<input type="hidden" name="<?php echo esc_attr($name); ?>" class="wpvr-sticker-value" value="<?php echo esc_attr(wp_json_encode($value)); ?>"> |
| 131 |
<?php } else { ?> |
| 132 |
<input type="<?php echo esc_attr($type === 'media' ? 'url' : $type); ?>" name="<?php echo esc_attr($name); ?>" class="wpvr-sticker-value" value="<?php echo esc_attr($value); ?>"> |
| 133 |
<?php } ?> |
| 134 |
</label> |
| 135 |
<?php if (in_array($type, array('corners', 'sides'), true)) { ?> |
| 136 |
<div class="wpvr-sticker-sides"> |
| 137 |
<?php foreach ($parts as $part) { ?> |
| 138 |
<label class="wpvr-sticker-side"> |
| 139 |
<?php echo esc_html(array('topLeft' => __('Top left', 'wpvr'), 'topRight' => __('Top right', 'wpvr'), 'bottomRight' => __('Bottom right', 'wpvr'), 'bottomLeft' => __('Bottom left', 'wpvr'), 'top' => __('Top', 'wpvr'), 'right' => __('Right', 'wpvr'), 'bottom' => __('Bottom', 'wpvr'), 'left' => __('Left', 'wpvr'))[$part]); ?> |
| 140 |
<input type="number" min="0" data-part="<?php echo esc_attr($part); ?>" value="<?php echo esc_attr($value[$part] ?? 0); ?>" style="width:100%"> |
| 141 |
</label> |
| 142 |
<?php } ?> |
| 143 |
</div> |
| 144 |
<?php } elseif ($type === 'media') { ?> |
| 145 |
<button type="button" class="button wpvr-sticker-avatar-select"><?php esc_html_e('Select Image', 'wpvr'); ?></button> |
| 146 |
<button type="button" class="button wpvr-sticker-avatar-remove"><?php esc_html_e('Remove', 'wpvr'); ?></button> |
| 147 |
<?php } elseif ($type === 'links') { ?> |
| 148 |
<div class="wpvr-sticker-links"></div> |
| 149 |
<button type="button" class="button wpvr-sticker-link-add"><?php esc_html_e('Add Social Link', 'wpvr'); ?></button> |
| 150 |
<?php } ?> |
| 151 |
</div> |
| 152 |
<?php } ?> |
| 153 |
</div> |
| 154 |
<?php |
| 155 |
} |
| 156 |
} |
| 157 |
|