| 1 |
<?php |
| 2 |
// Not allowed by directly accessing. |
| 3 |
if(!defined('ABSPATH')){ |
| 4 |
die('Access not allowed!'); |
| 5 |
} |
| 6 |
/** |
| 7 |
* Plugin option form element class |
| 8 |
* Type Preloader_Preview, actually this includes a set of settings and a preview for these settings |
| 9 |
* |
| 10 |
* @package LoftLoader |
| 11 |
* @version 1.0 |
| 12 |
* @link http://www.loftocean.com/ |
| 13 |
* @author Suihai Huang from Loft Ocean Team |
| 14 |
|
| 15 |
* @since version 1.0 |
| 16 |
*/ |
| 17 |
|
| 18 |
if(!class_exists('LoftLoader_Preloader_Preview')){ |
| 19 |
class LoftLoader_Preloader_Preview extends LoftLoader_Form_Base{ |
| 20 |
private $preview; // Section preview |
| 21 |
private $setting; // Section setting |
| 22 |
public function __construct($name, $title, $description, $options, $values, $extra = array()){ |
| 23 |
parent::__construct($name, $title, $description, $options, $values, $extra); |
| 24 |
// Assign the setting for each section |
| 25 |
foreach($options as $section){ |
| 26 |
switch($section['section']){ |
| 27 |
case 'preview': |
| 28 |
$this->preview = $section; |
| 29 |
break; |
| 30 |
case 'setting': |
| 31 |
$this->setting = $section; |
| 32 |
break; |
| 33 |
} |
| 34 |
} |
| 35 |
} |
| 36 |
/** |
| 37 |
* @description rewrite the render function |
| 38 |
*/ |
| 39 |
public function render(){ |
| 40 |
if(!empty($this->preview) && !empty($this->setting)){ |
| 41 |
$replace = array( |
| 42 |
'[[PREVIEW-TITLE]]' => $this->preview_title(), |
| 43 |
'[[PREVIEW-DESCRIPTION]]' => $this->preview_description(), |
| 44 |
'[[PREVIEW-CONTENT]]' => $this->preview_content(), |
| 45 |
'[[SETTING-CONTENT]]' => $this->setting_content() |
| 46 |
); |
| 47 |
echo strtr($this->template(), $replace); |
| 48 |
} |
| 49 |
} |
| 50 |
/** |
| 51 |
* @description rewrite the html template function |
| 52 |
*/ |
| 53 |
protected function template(){ |
| 54 |
$html = <<<ETO |
| 55 |
<div class="preview-section"> |
| 56 |
<div class="preview-wrapper"><h3>[[PREVIEW-TITLE]]</h3>[[PREVIEW-DESCRIPTION]][[PREVIEW-CONTENT]]</div> |
| 57 |
<div class="preview-settings">[[SETTING-CONTENT]]</div> |
| 58 |
</div> |
| 59 |
ETO; |
| 60 |
return $html; |
| 61 |
} |
| 62 |
/** |
| 63 |
* @description add new function to get the preview title |
| 64 |
*/ |
| 65 |
protected function preview_title(){ |
| 66 |
return $this->get_property($this->preview, 'title'); |
| 67 |
} |
| 68 |
/** |
| 69 |
* @description add new function to get the preview description |
| 70 |
*/ |
| 71 |
protected function preview_description(){ |
| 72 |
$description = $this->get_property($this->preview, 'description'); |
| 73 |
if($description){ |
| 74 |
return '<span class="description">' . $description . '</span>'; |
| 75 |
} |
| 76 |
} |
| 77 |
/** |
| 78 |
* @description add new function to get the preview content |
| 79 |
*/ |
| 80 |
protected function preview_content(){ |
| 81 |
$html = '<div class="preview-frame">'; |
| 82 |
$html .= '<div id="loftloader-wrapper">'; |
| 83 |
$html .= '<div class="loader-inner"><div id="loader"><span></span></div></div>'; |
| 84 |
$html .= '<div class="loader-section section-up"></div>'; |
| 85 |
$html .= '<div class="loader-section section-down"></div>'; |
| 86 |
$html .= '</div>'; |
| 87 |
$html .= '</div>'; |
| 88 |
return $html; |
| 89 |
} |
| 90 |
/** |
| 91 |
* @description add new function to get the settings content |
| 92 |
*/ |
| 93 |
protected function setting_content(){ |
| 94 |
$html = ''; |
| 95 |
if(!empty($this->setting)){ |
| 96 |
foreach((array)$this->setting['content'] as $item){ |
| 97 |
$returnHTML = $this->setting_section_html($item['content']); |
| 98 |
if(!empty($returnHTML)){ |
| 99 |
$html .= '<div class="setting-group">'; |
| 100 |
$html .= '<h3>' . $item['title'] . '</h3>'; |
| 101 |
$html .= '<ul>' . $returnHTML . '</ul>'; |
| 102 |
$html .= '</div>'; |
| 103 |
} |
| 104 |
} |
| 105 |
} |
| 106 |
return $html; |
| 107 |
} |
| 108 |
/** |
| 109 |
* @description add new function to get the settings elements html |
| 110 |
*/ |
| 111 |
protected function setting_section_html($section){ |
| 112 |
$html = ''; |
| 113 |
$values = $this->values; |
| 114 |
foreach((array)$section as $element){ |
| 115 |
$elementHTML = ''; |
| 116 |
if(strpos($element['name'], '[') !== false){ |
| 117 |
$subs = (strpos($element['name'], '[') !== false) ? strtr($element['name'], array(']' => '', '[' => '][')) : $element['name']; |
| 118 |
$name = $this->name . '[' . $subs . ']'; // Name of the element |
| 119 |
$value = $values; |
| 120 |
foreach(explode('][', $subs) as $sub){ |
| 121 |
$value = $value[$sub]; |
| 122 |
} |
| 123 |
} |
| 124 |
else{ |
| 125 |
$name = $this->name . '[' . $element['name'] . ']'; // Element name |
| 126 |
$value = $values[$element['name']]; // Element value |
| 127 |
} |
| 128 |
$value = is_array($value) ? $value : trim($value); |
| 129 |
switch($element['type']){ |
| 130 |
case 'number': |
| 131 |
$elementHTML .= '<input type=number name="' . $name . '" value="' . $value . '" min=1 max=400 title="Number between 1-400"> px'; |
| 132 |
break; |
| 133 |
case 'select': |
| 134 |
if(is_array($element['options']) && (count($element['options']) > 0)){ |
| 135 |
$class = (isset($element['extra']) && isset($element['extra']['class']) && $element['extra']['class']) ? ' class="' . $element['extra']['class'] . '"' : ''; |
| 136 |
$id = (isset($element['extra']) && isset($element['extra']['id']) && $element['extra']['id']) ? ' id="' . $element['extra']['id'] . '"' : ''; |
| 137 |
$elementHTML = '<select name="' . $name . '"'. $class . $id .'>'; |
| 138 |
foreach((array)$element['options'] as $val => $attr){ |
| 139 |
$selected = selected($value, $val, false); |
| 140 |
$elementHTML .= '<option value="' . $val . '"' . $selected . '>' . $attr['label'] . '</option>'; |
| 141 |
} |
| 142 |
$elementHTML .= '</select>'; |
| 143 |
} |
| 144 |
break; |
| 145 |
case 'color-picker': |
| 146 |
$id = (isset($element['extra']) && isset($element['extra']['id']) && $element['extra']['id']) ? ' id="' . $element['extra']['id'] . '"' : ''; |
| 147 |
$value = !empty($value) ? $value : $element['options']['defaultValue']; |
| 148 |
$value = !empty($value) ? $value : '#222222'; |
| 149 |
$elementHTML = '<input' . $id . ' class="loader-color-picker" type="text" name="' . $name . '" value="' . $value . '" data-default-color="' . $value . '" />'; |
| 150 |
break; |
| 151 |
case 'media': |
| 152 |
$val = array_filter($value); |
| 153 |
if(!empty($val)){ |
| 154 |
$elementHTML = '<div class="bg-img-holder"><img src="' . $value['url'] . '"></div>'; |
| 155 |
$elementHTML .= '<a class="button loader-set-image hide">' . esc_html__('Upload Image', 'loftloader') . '</a>'; |
| 156 |
$elementHTML .= '<span class="bg-img-remove">' . esc_html__('Remove Image', 'loftloader') . '</span>'; |
| 157 |
$elementHTML .= '<input class="admin-image-id" type="hidden" value="' . ($value['id'] ? $value['id']: '') . '" name="' . $name . '[id]">'; |
| 158 |
$elementHTML .= '<input class="admin-image-url preloader-preview-image" type="hidden" value="' . ($value['url'] ? $value['url'] : '') . '" name="' . $name . '[url]">'; |
| 159 |
} |
| 160 |
else{ |
| 161 |
$elementHTML = '<a class="button loader-set-image">' . esc_html__('Upload Image', 'loftloader') . '</a>'; |
| 162 |
$elementHTML .= '<span class="bg-img-remove hide">' . esc_html__('Remove Image', 'loftloader') . '</span>'; |
| 163 |
$elementHTML .= '<input class="admin-image-id" type="hidden" name="' . $name . '[id]">'; |
| 164 |
$elementHTML .= '<input class="admin-image-url preloader-preview-image" type="hidden" name="' . $name . '[url]">'; |
| 165 |
} |
| 166 |
break; |
| 167 |
case 'slider': |
| 168 |
$class = (isset($element['extra']) && isset($element['extra']['class']) && $element['extra']['class']) ? ' ' . $element['extra']['class'] : ''; |
| 169 |
$value = !empty($value) ? $value : $element['options']['default']; |
| 170 |
$value = !empty($value) ? $value : '100'; |
| 171 |
$min = (isset($element['options']) && isset($element['options']['min']) && $element['options']['min']) ? $element['options']['min'] : 0; |
| 172 |
$max = (isset($element['options']) && isset($element['options']['max']) && $element['options']['max']) ? $element['options']['max'] : 100; |
| 173 |
$step = (isset($element['options']) && isset($element['options']['step']) && $element['options']['step']) ? $element['options']['step'] : 5; |
| 174 |
$elementHTML .= '<label class="amount opacity">'; |
| 175 |
$elementHTML .= '<input name="' . $name . '" type="text" class="opacity-amount" readonly value="' . $value . '">'; |
| 176 |
$elementHTML .= '</label>'; |
| 177 |
$elementHTML .= '<div class="ui-slider loader-ui-slider' . $class . '" data-default="' . intval($value) . '" data-min="' . $min . '" data-max="' . $max . '" data-step="' . $step . '"></div>'; |
| 178 |
$elementHTML .= '</fieldset>'; |
| 179 |
break; |
| 180 |
} |
| 181 |
$wrapperClass = (isset($element['extra']) && isset($element['extra']['wrapperClass']) && $element['extra']['wrapperClass']) ? $element['extra']['wrapperClass'] : ''; |
| 182 |
$template = $this->element_template($wrapperClass); |
| 183 |
$replace = array('[[TITLE]]' => $element['title'], '[[CONTENT]]' => $elementHTML); |
| 184 |
$html .= strtr($template, $replace); |
| 185 |
} |
| 186 |
return !empty($html) ? $html : false; |
| 187 |
} |
| 188 |
/** |
| 189 |
* @description the element template |
| 190 |
*/ |
| 191 |
private function element_template($class){ |
| 192 |
$class = !empty($class) ? ' class="' . $class . '"' : ''; |
| 193 |
$html = <<<ETO |
| 194 |
<li$class> |
| 195 |
<h4>[[TITLE]]</h4> |
| 196 |
<fieldset><legend class="screen-reader-text"><span>[[TITLE]]</span></legend>[[CONTENT]]</fieldset> |
| 197 |
</li> |
| 198 |
ETO; |
| 199 |
return $html; |
| 200 |
} |
| 201 |
/** |
| 202 |
* @description helper function to get the element from array provided |
| 203 |
*/ |
| 204 |
private function get_property($var, $index){ |
| 205 |
if(isset($var[$index])){ |
| 206 |
return $var[$index]; |
| 207 |
} |
| 208 |
return false; |
| 209 |
} |
| 210 |
} |
| 211 |
} |
