ReduxFramework_background

Main ReduxFramework_background class.

Defined (1)

The class is defined in the following location(s).

/library/admin/redux-framework/inc/fields/background/field_background.php  
  1. class ReduxFramework_background { 
  2.  
  3. /** 
  4. * Field Constructor. 
  5. * Required - must call the parent constructor, then assign field and value to vars, and obviously call the render field function 
  6. * @since 3.1.5 
  7. * @access public 
  8. * @return void 
  9. */ 
  10. function __construct( $field = array(), $value = '', $parent ) { 
  11.  
  12. $this->parent = $parent; 
  13. $this->field = $field; 
  14. $this->value = $value; 
  15.  
  16. /** 
  17. * Field Render Function. 
  18. * Takes the vars and outputs the HTML for the field in the settings 
  19. * @since 1.0.0 
  20. * @access public 
  21. * @return void 
  22. */ 
  23. public function render() { 
  24.  
  25. $defaults = array( 
  26. 'background-color' => true,  
  27. 'background-repeat' => true,  
  28. 'background-attachment' => true,  
  29. 'background-position' => true,  
  30. 'background-image' => true,  
  31. 'background-gradient' => false,  
  32. 'background-clip' => false,  
  33. 'background-origin' => false,  
  34. 'background-size' => true,  
  35. 'preview_media' => false,  
  36. 'preview' => true,  
  37. 'preview_height' => '200px',  
  38. 'transparent' => true,  
  39. ); 
  40.  
  41. $this->field = wp_parse_args( $this->field, $defaults ); 
  42.  
  43. // No errors please 
  44. $defaults = array( 
  45. 'background-color' => '',  
  46. 'background-repeat' => '',  
  47. 'background-attachment' => '',  
  48. 'background-position' => '',  
  49. 'background-image' => '',  
  50. 'background-clip' => '',  
  51. 'background-origin' => '',  
  52. 'background-size' => '',  
  53. 'media' => array(),  
  54. ); 
  55.  
  56. $this->value = wp_parse_args( $this->value, $defaults ); 
  57.  
  58. $defaults = array( 
  59. 'id' => '',  
  60. 'width' => '',  
  61. 'height' => '',  
  62. 'thumbnail' => '',  
  63. ); 
  64.  
  65. $this->value['media'] = wp_parse_args( $this->value['media'], $defaults ); 
  66.  
  67. // select2 args 
  68. if ( isset( $this->field['select2'] ) ) { // if there are any let's pass them to js 
  69. $select2_params = json_encode( $this->field['select2'] ); 
  70. $select2_params = htmlspecialchars( $select2_params, ENT_QUOTES ); 
  71.  
  72. echo '<input type="hidden" class="select2_params" value="' . $select2_params . '">'; 
  73.  
  74. if ( $this->field['background-color'] === true ) { 
  75.  
  76. if ( isset( $this->value['color'] ) && empty( $this->value['background-color'] ) ) { 
  77. $this->value['background-color'] = $this->value['color']; 
  78.  
  79. echo '<input data-id="' . $this->field['id'] . '" name="' . $this->field['name'] . $this->field['name_suffix'] . '[background-color]" id="' . $this->field['id'] . '-color" class="redux-color redux-background-input redux-color-init ' . $this->field['class'] . '" type="text" value="' . $this->value['background-color'] . '" data-default-color="' . ( isset( $this->field['default']['background-color'] ) ? $this->field['default']['background-color'] : "" ) . '" />'; 
  80. echo '<input type="hidden" class="redux-saved-color" id="' . $this->field['id'] . '-saved-color' . '" value="">'; 
  81.  
  82. if ( ! isset( $this->field['transparent'] ) || $this->field['transparent'] !== false ) { 
  83. $tChecked = ""; 
  84. if ( $this->value['background-color'] == "transparent" ) { 
  85. $tChecked = ' checked="checked"'; 
  86. echo '<label for="' . $this->field['id'] . '-transparency" class="color-transparency-check"><input type="checkbox" class="checkbox color-transparency redux-background-input ' . $this->field['class'] . '" id="' . $this->field['id'] . '-transparency" data-id="' . $this->field['id'] . '-color" value="1"' . $tChecked . '> ' . __( 'Transparent', 'evolve' ) . '</label>'; 
  87.  
  88. if ( $this->field['background-repeat'] === true || $this->field['background-position'] === true || $this->field['background-attachment'] === true ) { 
  89. echo '<br />'; 
  90.  
  91.  
  92. if ( $this->field['background-repeat'] === true ) { 
  93. $array = array( 
  94. 'no-repeat' => 'No Repeat',  
  95. 'repeat' => 'Repeat All',  
  96. 'repeat-x' => 'Repeat Horizontally',  
  97. 'repeat-y' => 'Repeat Vertically',  
  98. 'inherit' => 'Inherit',  
  99. ); 
  100. echo '<select id="' . $this->field['id'] . '-repeat-select" data-placeholder="' . __( 'Background Repeat', 'evolve' ) . '" name="' . $this->field['name'] . $this->field['name_suffix'] . '[background-repeat]" class="redux-select-item redux-background-input redux-background-repeat ' . $this->field['class'] . '">'; 
  101. echo '<option></option>'; 
  102.  
  103. foreach ( $array as $k => $v ) { 
  104. echo '<option value="' . $k . '"' . selected( $this->value['background-repeat'], $k, false ) . '>' . $v . '</option>'; 
  105. echo '</select>'; 
  106.  
  107. if ( $this->field['background-clip'] === true ) { 
  108. $array = array( 
  109. 'inherit' => 'Inherit',  
  110. 'border-box' => 'Border Box',  
  111. 'content-box' => 'Content Box',  
  112. 'padding-box' => 'Padding Box',  
  113. ); 
  114. echo '<select id="' . $this->field['id'] . '-repeat-select" data-placeholder="' . __( 'Background Clip', 'evolve' ) . '" name="' . $this->field['name'] . $this->field['name_suffix'] . '[background-clip]" class="redux-select-item redux-background-input redux-background-clip ' . $this->field['class'] . '">'; 
  115. echo '<option></option>'; 
  116.  
  117. foreach ( $array as $k => $v ) { 
  118. echo '<option value="' . $k . '"' . selected( $this->value['background-clip'], $k, false ) . '>' . $v . '</option>'; 
  119. echo '</select>'; 
  120.  
  121. if ( $this->field['background-origin'] === true ) { 
  122. $array = array( 
  123. 'inherit' => 'Inherit',  
  124. 'border-box' => 'Border Box',  
  125. 'content-box' => 'Content Box',  
  126. 'padding-box' => 'Padding Box',  
  127. ); 
  128. echo '<select id="' . $this->field['id'] . '-repeat-select" data-placeholder="' . __( 'Background Origin', 'evolve' ) . '" name="' . $this->field['name'] . $this->field['name_suffix'] . '[background-origin]" class="redux-select-item redux-background-input redux-background-origin ' . $this->field['class'] . '">'; 
  129. echo '<option></option>'; 
  130.  
  131. foreach ( $array as $k => $v ) { 
  132. echo '<option value="' . $k . '"' . selected( $this->value['background-origin'], $k, false ) . '>' . $v . '</option>'; 
  133. echo '</select>'; 
  134.  
  135. if ( $this->field['background-size'] === true ) { 
  136. $array = array( 
  137. 'inherit' => 'Inherit',  
  138. 'cover' => 'Cover',  
  139. 'contain' => 'Contain',  
  140. ); 
  141. echo '<select id="' . $this->field['id'] . '-repeat-select" data-placeholder="' . __( 'Background Size', 'evolve' ) . '" name="' . $this->field['name'] . $this->field['name_suffix'] . '[background-size]" class="redux-select-item redux-background-input redux-background-size ' . $this->field['class'] . '">'; 
  142. echo '<option></option>'; 
  143.  
  144. foreach ( $array as $k => $v ) { 
  145. echo '<option value="' . $k . '"' . selected( $this->value['background-size'], $k, false ) . '>' . $v . '</option>'; 
  146. echo '</select>'; 
  147.  
  148. if ( $this->field['background-attachment'] === true ) { 
  149. $array = array( 
  150. 'fixed' => 'Fixed',  
  151. 'scroll' => 'Scroll',  
  152. 'inherit' => 'Inherit',  
  153. ); 
  154. echo '<select id="' . $this->field['id'] . '-attachment-select" data-placeholder="' . __( 'Background Attachment', 'evolve' ) . '" name="' . $this->field['name'] . $this->field['name_suffix'] . '[background-attachment]" class="redux-select-item redux-background-input redux-background-attachment ' . $this->field['class'] . '">'; 
  155. echo '<option></option>'; 
  156. foreach ( $array as $k => $v ) { 
  157. echo '<option value="' . $k . '"' . selected( $this->value['background-attachment'], $k, false ) . '>' . $v . '</option>'; 
  158. echo '</select>'; 
  159.  
  160. if ( $this->field['background-position'] === true ) { 
  161. $array = array( 
  162. 'left top' => 'Left Top',  
  163. 'left center' => 'Left center',  
  164. 'left bottom' => 'Left Bottom',  
  165. 'center top' => 'Center Top',  
  166. 'center center' => 'Center Center',  
  167. 'center bottom' => 'Center Bottom',  
  168. 'right top' => 'Right Top',  
  169. 'right center' => 'Right center',  
  170. 'right bottom' => 'Right Bottom',  
  171. ); 
  172. echo '<select id="' . $this->field['id'] . '-position-select" data-placeholder="' . __( 'Background Position', 'evolve' ) . '" name="' . $this->field['name'] . $this->field['name_suffix'] . '[background-position]" class="redux-select-item redux-background-input redux-background-position ' . $this->field['class'] . '">'; 
  173. echo '<option></option>'; 
  174.  
  175. foreach ( $array as $k => $v ) { 
  176. echo '<option value="' . $k . '"' . selected( $this->value['background-position'], $k, false ) . '>' . $v . '</option>'; 
  177. echo '</select>'; 
  178.  
  179. if ( $this->field['background-image'] === true ) { 
  180. echo '<br />'; 
  181.  
  182. if ( empty( $this->value ) && ! empty( $this->field['default'] ) ) { // If there are standard values and value is empty 
  183. if ( is_array( $this->field['default'] ) ) { 
  184. if ( ! empty( $this->field['default']['media']['id'] ) ) { 
  185. $this->value['media']['id'] = $this->field['default']['media']['id']; 
  186. } else if ( ! empty( $this->field['default']['id'] ) ) { 
  187. $this->value['media']['id'] = $this->field['default']['id']; 
  188.  
  189. if ( ! empty( $this->field['default']['url'] ) ) { 
  190. $this->value['background-image'] = $this->field['default']['url']; 
  191. } else if ( ! empty( $this->field['default']['media']['url'] ) ) { 
  192. $this->value['background-image'] = $this->field['default']['media']['url']; 
  193. } else if ( ! empty( $this->field['default']['background-image'] ) ) { 
  194. $this->value['background-image'] = $this->field['default']['background-image']; 
  195. } else { 
  196. if ( is_numeric( $this->field['default'] ) ) { // Check if it's an attachment ID 
  197. $this->value['media']['id'] = $this->field['default']; 
  198. } else { // Must be a URL 
  199. $this->value['background-image'] = $this->field['default']; 
  200.  
  201.  
  202. if ( empty( $this->value['background-image'] ) && ! empty( $this->value['media']['id'] ) ) { 
  203. $img = wp_get_attachment_image_src( $this->value['media']['id'], 'full' ); 
  204. $this->value['background-image'] = $img[0]; 
  205. $this->value['media']['width'] = $img[1]; 
  206. $this->value['media']['height'] = $img[2]; 
  207.  
  208. $hide = 'hide '; 
  209.  
  210. if ( ( isset( $this->field['preview_media'] ) && $this->field['preview_media'] === false ) ) { 
  211. $this->field['class'] .= " noPreview"; 
  212.  
  213. if ( ( ! empty( $this->field['background-image'] ) && $this->field['background-image'] === true ) || isset( $this->field['preview'] ) && $this->field['preview'] === false ) { 
  214. $hide = ''; 
  215.  
  216. $placeholder = isset( $this->field['placeholder'] ) ? $this->field['placeholder'] : __( 'No media selected', 'evolve' ); 
  217.  
  218. echo '<input placeholder="' . $placeholder . '" type="text" class="redux-background-input ' . $hide . 'upload ' . $this->field['class'] . '" name="' . $this->field['name'] . $this->field['name_suffix'] . '[background-image]" id="' . $this->parent->args['opt_name'] . '[' . $this->field['id'] . '][background-image]" value="' . $this->value['background-image'] . '" />'; 
  219. echo '<input type="hidden" class="upload-id ' . $this->field['class'] . '" name="' . $this->field['name'] . $this->field['name_suffix'] . '[media][id]" id="' . $this->parent->args['opt_name'] . '[' . $this->field['id'] . '][media][id]" value="' . $this->value['media']['id'] . '" />'; 
  220. echo '<input type="hidden" class="upload-height" name="' . $this->field['name'] . $this->field['name_suffix'] . '[media][height]" id="' . $this->parent->args['opt_name'] . '[' . $this->field['id'] . '][media][height]" value="' . $this->value['media']['height'] . '" />'; 
  221. echo '<input type="hidden" class="upload-width" name="' . $this->field['name'] . $this->field['name_suffix'] . '[media][width]" id="' . $this->parent->args['opt_name'] . '[' . $this->field['id'] . '][media][width]" value="' . $this->value['media']['width'] . '" />'; 
  222. echo '<input type="hidden" class="upload-thumbnail" name="' . $this->field['name'] . $this->field['name_suffix'] . '[media][thumbnail]" id="' . $this->parent->args['opt_name'] . '[' . $this->field['id'] . '][media][thumbnail]" value="' . $this->value['media']['thumbnail'] . '" />'; 
  223.  
  224. //Preview 
  225. $hide = ''; 
  226.  
  227. if ( ( isset( $this->field['preview_media'] ) && $this->field['preview_media'] === false ) || empty( $this->value['background-image'] ) ) { 
  228. $hide = 'hide '; 
  229.  
  230. if ( empty( $this->value['media']['thumbnail'] ) && ! empty( $this->value['background-image'] ) ) { // Just in case 
  231. if ( ! empty( $this->value['media']['id'] ) ) { 
  232. $image = wp_get_attachment_image_src( $this->value['media']['id'], array( 
  233. 150,  
  234. 150 
  235. ) ); 
  236. $this->value['media']['thumbnail'] = $image[0]; 
  237. } else { 
  238. $this->value['media']['thumbnail'] = $this->value['background-image']; 
  239.  
  240. echo '<div class="' . $hide . 'screenshot">'; 
  241. echo '<a class="of-uploaded-image" href="' . $this->value['background-image'] . '" target="_blank">'; 
  242. echo '<img class="redux-option-image" id="image_' . $this->value['media']['id'] . '" src="' . $this->value['media']['thumbnail'] . '" alt="" target="_blank" rel="external" />'; 
  243. echo '</a>'; 
  244. echo '</div>'; 
  245.  
  246. //Upload controls DIV 
  247. echo '<div class="upload_button_div">'; 
  248.  
  249. //If the user has WP3.5+ show upload/remove button 
  250. echo '<span class="button redux-background-upload" id="' . $this->field['id'] . '-media">' . __( 'Upload', 'evolve' ) . '</span>'; 
  251.  
  252. $hide = ''; 
  253. if ( empty( $this->value['background-image'] ) || $this->value['background-image'] == '' ) { 
  254. $hide = ' hide'; 
  255.  
  256. echo '<span class="button removeCSS redux-remove-background' . $hide . '" id="reset_' . $this->field['id'] . '" rel="' . $this->field['id'] . '">' . __( 'Remove', 'evolve' ) . '</span>'; 
  257.  
  258. echo '</div>'; 
  259.  
  260.  
  261. /** 
  262. * Preview 
  263. * */ 
  264. if ( ! isset( $this->field['preview'] ) || $this->field['preview'] !== false ): 
  265.  
  266. $css = $this->getCSS(); 
  267. if ( empty( $css ) ) { 
  268. $css = "display:none;"; 
  269. $css .= "height: " . $this->field['preview_height'] . ";"; 
  270. echo '<p class="clear ' . $this->field['id'] . '_previewer background-preview" style="' . $css . '"> </p>'; 
  271.  
  272. endif; 
  273.  
  274. /** 
  275. * Enqueue Function. 
  276. * If this field requires any scripts, or css define this function and register/enqueue the scripts/css 
  277. * @since 1.0.0 
  278. * @access public 
  279. * @return void 
  280. */ 
  281. public function enqueue() { 
  282. if ( function_exists( 'wp_enqueue_media' ) ) { 
  283. wp_enqueue_media(); 
  284. } else { 
  285. if (!wp_script_is ( 'media-upload' )) { 
  286. wp_enqueue_script( 'media-upload' ); 
  287.  
  288. if (!wp_style_is ( 'select2-css' )) { 
  289. wp_enqueue_style( 'select2-css' ); 
  290.  
  291. if (!wp_style_is ( 'wp-color-picker' )) { 
  292. wp_enqueue_style( 'wp-color-picker' ); 
  293.  
  294. if (!wp_script_is ( 'redux-field-background-js' )) { 
  295. wp_enqueue_script( 
  296. 'redux-field-background-js',  
  297. ReduxFramework::$_url . 'inc/fields/background/field_background' . Redux_Functions::isMin() . '.js',  
  298. array( 'jquery', 'wp-color-picker', 'select2-js', 'redux-js' ),  
  299. time(),  
  300. true 
  301. ); 
  302.  
  303. if ($this->parent->args['dev_mode']) { 
  304. if (!wp_style_is ( 'redux-field-background-css' )) { 
  305. wp_enqueue_style( 
  306. 'redux-field-background-css',  
  307. ReduxFramework::$_url . 'inc/fields/background/field_background.css',  
  308. array(),  
  309. time(),  
  310. 'all' 
  311. ); 
  312.  
  313. if (!wp_style_is ( 'redux-color-picker-css' )) { 
  314. wp_enqueue_style( 'redux-color-picker-css' ); 
  315.  
  316. public static function getCSS( $value = array() ) { 
  317.  
  318. $css = ''; 
  319.  
  320. if ( ! empty( $value ) && is_array( $value ) ) { 
  321. foreach ( $value as $key => $value ) { 
  322. if ( ! empty( $value ) && $key != "media" ) { 
  323. if ( $key == "background-image" ) { 
  324. $css .= $key . ":url('" . $value . "');"; 
  325. } else { 
  326. $css .= $key . ":" . $value . ";"; 
  327.  
  328. return $css; 
  329.  
  330. public function output() { 
  331. $style = $this->getCSS( $this->value ); 
  332.  
  333. if ( ! empty( $style ) ) { 
  334.  
  335. if ( ! empty( $this->field['output'] ) && is_array( $this->field['output'] ) ) { 
  336. $keys = implode( ", ", $this->field['output'] ); 
  337. $this->parent->outputCSS .= $keys . "{" . $style . '}'; 
  338.  
  339. if ( ! empty( $this->field['compiler'] ) && is_array( $this->field['compiler'] ) ) { 
  340. $keys = implode( ", ", $this->field['compiler'] ); 
  341. $this->parent->compilerCSS .= $keys . "{" . $style . '}';