/** * Render html UI_Slider. * * @since 4.0.0 */ public function render() { $html = ''; $ui_stepper = new UI_Stepper(array('id' => $this->settings['id'] . '-stepper', 'name' => $this->settings['name'], 'max_value' => $this->settings['max_value'], 'min_value' => $this->settings['min_value'], 'value' => $this->settings['value'], 'step_value' => $this->settings['step_value'])); $ui_stepper_html = $ui_stepper->render(); $html .= '<div class="cherry-slider-wrap">'; $html .= '<div class="cherry-slider-input">'; $html .= $ui_stepper_html; $html .= '</div>'; $html .= '<div class="cherry-slider-holder">'; $html .= '<div class="cherry-slider-unit" data-left-limit="' . esc_html($this->settings['min_value']) . '" data-right-limit="' . esc_html($this->settings['max_value']) . '" data-value="' . esc_html($this->settings['value']) . '"></div>'; $html .= '</div>'; $html .= '<div class="clear"></div>'; $html .= '</div>'; return $html; }
/** * Render html UI_Range_Slider. * * @since 4.0.0 */ public function render() { $html = ''; $ui_left_stepper = new UI_Stepper(array('id' => $this->settings['id'] . '-left-stepper', 'name' => $this->settings['name'] . '[left_value]', 'max_value' => $this->settings['max_value'], 'min_value' => $this->settings['min_value'], 'value' => $this->settings['value']['left_value'], 'step_value' => $this->settings['step_value'], 'class' => 'range-slider-left-stepper')); $ui_right_stepper = new UI_Stepper(array('id' => $this->settings['id'] . '-right-stepper', 'name' => $this->settings['name'] . '[right_value]', 'max_value' => $this->settings['max_value'], 'min_value' => $this->settings['min_value'], 'value' => $this->settings['value']['right_value'], 'step_value' => $this->settings['step_value'], 'class' => 'range-slider-right-stepper')); $html .= '<div class="cherry-range-slider-wrap">'; $html .= '<div class="cherry-range-slider-left-input">'; $html .= $ui_left_stepper->render(); $html .= '</div>'; $html .= '<div class="cherry-range-slider-holder">'; $html .= '<div class="cherry-range-slider-unit" data-left-limit="' . $this->settings['min_value'] . '" data-right-limit="' . $this->settings['max_value'] . '" data-left-value="' . $this->settings['value']['left_value'] . '" data-right-value="' . $this->settings['value']['right_value'] . '"></div>'; $html .= '</div>'; $html .= '<div class="cherry-range-slider-right-input">'; $html .= $ui_right_stepper->render(); $html .= '</div>'; $html .= '<div class="clear"></div>'; $html .= '</div>'; return $html; }
/** * Render html UI_Slider. * * @since 4.0.0 */ public function render() { $html = ''; $class = $this->settings['class']; $class .= ' ' . $this->settings['master']; $html .= '<div class="cherry-ui-container ' . esc_attr($class) . '">'; $ui_stepper = new UI_Stepper(array('id' => $this->settings['id'] . '-stepper', 'name' => $this->settings['name'], 'max_value' => $this->settings['max_value'], 'min_value' => $this->settings['min_value'], 'value' => $this->settings['value'], 'step_value' => $this->settings['step_value'])); $ui_stepper_html = $ui_stepper->render(); if ('' !== $this->settings['label']) { $html .= '<label class="cherry-label" for="' . esc_attr($this->settings['id']) . '">' . esc_html($this->settings['label']) . '</label> '; } $html .= '<div class="cherry-slider-wrap">'; $html .= '<div class="cherry-slider-holder">'; $html .= '<input type="range" class="cherry-slider-unit" step="' . esc_attr($this->settings['step_value']) . '" min="' . esc_attr($this->settings['min_value']) . '" max="' . esc_attr($this->settings['max_value']) . '" value="' . esc_attr($this->settings['value']) . '">'; $html .= '</div>'; $html .= '<div class="cherry-slider-input">'; $html .= $ui_stepper_html; $html .= '</div>'; $html .= '</div>'; $html .= '</div>'; return $html; }
/** * Render html UI_Slider. * * @since 4.0.0 */ public function render() { $html = ''; $master_class = !empty($this->settings['master']) && isset($this->settings['master']) ? esc_html($this->settings['master']) : ''; $html .= '<div class="cherry-ui-container ' . $master_class . '">'; $ui_stepper = new UI_Stepper(array('id' => $this->settings['id'] . '-stepper', 'name' => $this->settings['name'], 'max_value' => $this->settings['max_value'], 'min_value' => $this->settings['min_value'], 'value' => $this->settings['value'], 'step_value' => $this->settings['step_value'])); $ui_stepper_html = $ui_stepper->render(); if ('' !== $this->settings['label']) { $html .= '<label class="cherry-label" for="' . esc_attr($this->settings['id']) . '">' . esc_html($this->settings['label']) . '</label> '; } $html .= '<div class="cherry-slider-wrap">'; $html .= '<div class="cherry-slider-input">'; $html .= $ui_stepper_html; $html .= '</div>'; $html .= '<div class="cherry-slider-holder">'; $html .= '<div class="cherry-slider-unit" data-left-limit="' . esc_attr($this->settings['min_value']) . '" data-right-limit="' . esc_attr($this->settings['max_value']) . '" data-value="' . esc_attr($this->settings['value']) . '"></div>'; $html .= '</div>'; $html .= '<div class="clear"></div>'; $html .= '</div>'; $html .= '</div>'; return $html; }
/** * Render html UI_Typography. * * @since 4.0.0 */ public function render() { $html = ''; $text_align = array('notdefined' => __('Not defined', 'cherry'), 'inherit' => __('Inherit', 'cherry'), 'left' => __('Left', 'cherry'), 'right' => __('Right', 'cherry'), 'center' => __('Center', 'cherry'), 'justify' => __('Justify', 'cherry')); $google_fonts_array = $this->get_google_font(); $standart_fonts_array = $this->get_standart_font(); $character_array = array(); $style_array = array(); $fonttype = ''; $html .= '<div class="cherry-ui-typography-wrap">'; //Font Family $html .= '<div class="cherry-column-section">'; $html .= '<div class="inner">'; $html .= '<div class="field-font-family">'; $html .= '<label for="' . $this->settings['id'] . '-family">' . __('Font Family', 'cherry') . '</label> '; $html .= '<select id="' . $this->settings['id'] . '-family" class="cherry-ui-select cherry-font-family" name="' . $this->settings['name'] . '[family]">'; if ($standart_fonts_array && !empty($standart_fonts_array) && is_array($standart_fonts_array)) { $html .= '<optgroup label="' . __('Standart Webfonts', 'cherry') . '" data-font-type="standart">'; foreach ($standart_fonts_array as $font_key => $font_value) { $category = is_array($font_value['category']) ? implode(",", $font_value['category']) : $font_value['category']; $style = is_array($font_value['variants']) ? implode(",", $font_value['variants']) : $font_value['variants']; $character = is_array($font_value['subsets']) ? implode(",", $font_value['subsets']) : $font_value['subsets']; $selected_state = ''; if ($this->settings['value']['family'] && !empty($this->settings['value']['family'])) { if (!is_array($this->settings['value']['family'])) { $this->settings['value']['family'] = array($this->settings['value']['family']); } foreach ($this->settings['value']['family'] as $key => $value) { $selected_state = selected($value, $font_value['family'], false); if ($selected_state == " selected='selected'") { $fonttype = 'standart'; break; } } } $html .= '<option value="' . $font_value['family'] . '" data-category="' . $category . '" data-style="' . $style . '" data-character="' . $character . '" ' . $selected_state . '>' . esc_html($font_value['family']) . '</option>'; } $html .= '</optgroup>'; } if ($google_fonts_array && !empty($google_fonts_array) && is_array($google_fonts_array)) { $html .= '<optgroup label="' . __('Google Webfonts', 'cherry') . '" data-font-type="web">'; foreach ($google_fonts_array as $font_key => $font_value) { $category = is_array($font_value['category']) ? implode(",", $font_value['category']) : $font_value['category']; $style = is_array($font_value['variants']) ? implode(",", $font_value['variants']) : $font_value['variants']; $character = is_array($font_value['subsets']) ? implode(",", $font_value['subsets']) : $font_value['subsets']; foreach ($font_value['variants'] as $style_key => $style_value) { if (!array_key_exists($style_value, $style_array)) { $text_piece_1 = preg_replace('/[0-9]/s', '', $style_value); $text_piece_2 = preg_replace('/[A-Za-z]/s', ' ', $style_value); $value_text = ucwords($text_piece_2 . ' ' . $text_piece_1); $style_array[$style_value] = $value_text; } } foreach ($font_value['subsets'] as $character_key => $character_value) { if (!array_key_exists($character_value, $character_array)) { $value_text = str_replace('-ext', ' Extended', $character_value); $value_text = ucwords($value_text); $character_array[$character_value] = $value_text; } } $selected_state = ''; if ($this->settings['value']['family'] && !empty($this->settings['value']['family'])) { if (!is_array($this->settings['value']['family'])) { $this->settings['value']['family'] = array($this->settings['value']['family']); } foreach ($this->settings['value']['family'] as $key => $value) { $selected_state = selected($value, $font_value['family'], false); if ($selected_state == " selected='selected'") { $fonttype = 'web'; break; } } } $html .= '<option value="' . $font_value['family'] . '" data-category="' . $category . '" data-style="' . $style . '" data-character="' . $character . '" ' . $selected_state . '>' . esc_html($font_value['family']) . '</option>'; } $html .= '</optgroup>'; } $html .= '</select>'; $html .= '</div>'; $html .= '<div class="field-font-style">'; if ($style_array && !empty($style_array) && is_array($style_array)) { $html .= '<label for="' . $this->settings['id'] . '-style">' . __('Font Style', 'cherry') . '</label> '; $ui_style_select = new UI_Select(array('id' => $this->settings['id'] . '-style', 'name' => $this->settings['name'] . '[style]', 'value' => $this->settings['value']['style'], 'options' => $style_array, 'class' => 'cherry-font-style')); $html .= $ui_style_select->render(); } $html .= '</div>'; $html .= '<div class="field-font-character">'; if ($character_array && !empty($character_array) && is_array($character_array)) { $html .= '<label for="' . $this->settings['id'] . '-character">' . __('Character Sets', 'cherry') . '</label> '; $ui_character_select = new UI_Select(array('id' => $this->settings['id'] . '-character', 'name' => $this->settings['name'] . '[character]', 'value' => $this->settings['value']['character'], 'options' => $character_array, 'class' => 'cherry-font-character')); $html .= $ui_character_select->render(); } $html .= '</div>'; $html .= '</div>'; $html .= '</div>'; $html .= '<div class="cherry-column-section">'; $html .= '<div class="inner">'; $html .= '<div class="field-font-size">'; $html .= '<label for="' . $this->settings['id'] . '-size">' . __('Size', 'cherry') . '</label> '; $ui_size_stepper = new UI_Stepper(array('id' => $this->settings['id'] . '-size>', 'name' => $this->settings['name'] . '[size]', 'value' => $this->settings['value']['size'], 'max_value' => 500, 'min_value' => 0, 'step_value' => 1, 'class' => 'font-size')); $html .= $ui_size_stepper->render(); $html .= '</div>'; $html .= '<div class="field-font-lineheight">'; $html .= '<label for="' . $this->settings['id'] . '-lineheight">' . __('Line-height', 'cherry') . '</label> '; $ui_lineheight_stepper = new UI_Stepper(array('id' => $this->settings['id'] . '-lineheight>', 'name' => $this->settings['name'] . '[lineheight]', 'value' => $this->settings['value']['lineheight'], 'max_value' => 500, 'min_value' => 0, 'step_value' => 1, 'class' => 'font-lineheight')); $html .= $ui_lineheight_stepper->render(); $html .= '</div>'; $html .= '<div class="field-font-letter-spacing">'; $html .= '<label for="' . $this->settings['id'] . '-letterspacing">' . __('Letter-spacing', 'cherry') . '</label> '; $ui_letterspacing_stepper = new UI_Stepper(array('id' => $this->settings['id'] . '-letterspacing>', 'name' => $this->settings['name'] . '[letterspacing]', 'value' => $this->settings['value']['letterspacing'], 'max_value' => 50, 'min_value' => -50, 'step_value' => 1, 'class' => 'font-letterspacing')); $html .= $ui_letterspacing_stepper->render(); $html .= '</div>'; $html .= '<div class="field-font-color">'; $html .= '<label for="' . $this->settings['id'] . '-color">' . __('Font color', 'cherry') . '</label> '; $ui_colorpicker = new UI_Colorpicker(array('id' => $this->settings['id'] . '-color', 'name' => $this->settings['name'] . '[color]', 'value' => $this->settings['value']['color'], 'class' => 'cherry-color-picker')); $html .= $ui_colorpicker->render(); $html .= '</div>'; $html .= '<div class="field-font-align">'; $html .= '<label for="' . $this->settings['id'] . '-align">' . __('Text align', 'cherry') . '</label> '; $ui_align_select = new UI_Select(array('id' => $this->settings['id'] . '-align', 'name' => $this->settings['name'] . '[align]', 'value' => $this->settings['value']['align'], 'options' => $text_align, 'class' => 'cherry-text-align')); $html .= $ui_align_select->render(); $html .= '</div>'; $html .= '<div class="clear"></div>'; $html .= '</div>'; $html .= '</div>'; $html .= '<div class="clear"></div>'; $ui_preview_textarea = new UI_Textarea(array('id' => $this->settings['id'] . '-preview', 'name' => 'none', 'value' => "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.", 'rows' => 4, 'class' => 'cherry-font-preview')); $html .= $ui_preview_textarea->render(); $html .= '<input class="cherry-font-category" name="' . $this->settings['name'] . '[category]" value="" type="hidden" />'; $html .= '<input class="font-type" name="' . $this->settings['name'] . '[fonttype]" type="hidden" value="' . esc_html($fonttype) . '">'; $html .= '</div>'; return $html; }
/** * Add form item. Returns form item with selected arguments. * * @since 4.0.0 * @param array $args Input argument name => argument value */ public function add_form_item($args = array()) { $default = array('class' => '', 'inline_style' => '', 'type' => '', 'value' => '', 'multiple' => false, 'max_value' => '100', 'min_value' => '0', 'step_value' => '1', 'default_value' => '', 'options' => '', 'placeholder' => '', 'upload_button_text' => __('Choose Media', 'cherry'), 'remove_button_text' => __('Remove Media', 'cherry'), 'return_data_type' => 'id', 'multi_upload' => true, 'display_image' => true, 'display_input' => true, 'library_type' => '', 'label' => '', 'title' => '', 'description' => '', 'hint' => '', 'toggle' => array('true_toggle' => __('On', 'cherry'), 'false_toggle' => __('Off', 'cherry'))); extract(array_merge($default, $args)); $value = $value == '' || $value == false && $value != 0 ? $default_value : $value; $item_id = $id; $name = $this->generate_field_name($id); $id = $this->generate_field_id($id); $item_inline_style = $inline_style ? 'style="' . $inline_style . '"' : ''; $output = ''; if (is_array($this->options['hidden_items']) && in_array($item_id, $this->options['hidden_items'])) { return; } switch ($type) { case 'submit': // $output .= '<input ' . $item_inline_style . ' class="' . $class . ' '.$this->options['class']['submit'].'" id="' . $id . '" name="' . $name . '" type="'.$type.'" value="' . esc_html( $value ) . '" >'; $type .= ' ' . $class; $item_inline_style .= ' id=' . $id; $output .= get_submit_button($value, $type, $name, false, $item_inline_style); break; case 'reset': $output .= '<input ' . $item_inline_style . ' class="' . $class . ' ' . $this->options['class']['submit'] . '" id="' . $id . '" name="' . $name . '" type="reset" value="' . esc_html($value) . '" >'; break; case 'text': $ui_text = new UI_Text(array('id' => $id, 'name' => $name, 'value' => $value, 'placeholder' => $placeholder, 'class' => $class)); $output .= $ui_text->render(); break; case 'textarea': $ui_textarea = new UI_Textarea(array('id' => $id, 'name' => $name, 'value' => $value, 'placeholder' => $placeholder, 'class' => $class)); $output .= $ui_textarea->render(); break; case 'select': $ui_select = new UI_Select(array('id' => $id, 'name' => $name, 'multiple' => $multiple, 'value' => $value, 'options' => $options, 'class' => $class)); $output .= $ui_select->render(); break; case 'checkbox': $ui_checkbox = new UI_Checkbox(array('id' => $id, 'name' => $name, 'value' => $value, 'options' => $options, 'class' => $class)); $output .= $ui_checkbox->render(); break; case 'radio': $ui_radio = new UI_Radio(array('id' => $id, 'name' => $name, 'value' => $value, 'options' => $options, 'class' => $class)); $output .= $ui_radio->render(); break; case 'switcher': $ui_switcher = new UI_Switcher(array('id' => $id, 'name' => $name, 'value' => $value, 'toggle' => $toggle, 'class' => $class)); $output .= $ui_switcher->render(); break; case 'stepper': $ui_stepper = new UI_Stepper(array('id' => $id, 'name' => $name, 'value' => $value, 'max_value' => $max_value, 'min_value' => $min_value, 'step_value' => $step_value, 'class' => $class)); $output .= $ui_stepper->render(); break; case 'slider': $ui_slider = new UI_Slider(array('id' => $id, 'name' => $name, 'value' => $value, 'max_value' => $max_value, 'min_value' => $min_value, 'step_value' => $step_value, 'class' => $class)); $output .= $ui_slider->render(); break; case 'rangeslider': $ui_range_slider = new UI_Range_Slider(array('id' => $id, 'name' => $name, 'value' => $value, 'max_value' => $max_value, 'min_value' => $min_value, 'step_value' => $step_value, 'class' => $class)); $output .= $ui_range_slider->render(); break; case 'colorpicker': $ui_colorpicker = new UI_Colorpicker(array('id' => $id, 'name' => $name, 'value' => $value, 'class' => $class)); $output .= $ui_colorpicker->render(); break; case 'media': $ui_media = new UI_Media(array('id' => $id, 'name' => $name, 'value' => $value, 'multi_upload' => $multi_upload, 'library_type' => $library_type, 'class' => $class)); $output .= $ui_media->render(); break; case 'background': $ui_background = new UI_Background(array('id' => $id, 'name' => $name, 'value' => $value, 'multi_upload' => $multi_upload, 'library_type' => $library_type, 'class' => $class)); $output .= $ui_background->render(); break; case 'typography': $ui_typography = new UI_Typography(array('id' => $id, 'name' => $name, 'value' => $value, 'class' => $class)); $output .= $ui_typography->render(); break; case 'ace-editor': $ui_ace_editor = new UI_Ace_Editor(array('id' => $id, 'name' => $name, 'value' => $value, 'class' => $class)); $output .= $ui_ace_editor->render(); break; case 'repeater': $ui_repeater = new UI_Repeater(array('id' => $id, 'name' => $name, 'value' => $value, 'class' => $class)); $output .= $ui_repeater->render(); break; case 'static_area_editor': $ui_statics = new UI_Static_Area_Editor(array('id' => $id, 'name' => $name, 'value' => $value, 'options' => $options, 'class' => $class)); $output .= $ui_statics->render(); break; case 'layouteditor': $ui_layout_editor = new UI_Layout_Editor(array('id' => $id, 'name' => $name, 'value' => $value, 'class' => $class)); $output .= $ui_layout_editor->render(); break; case 'editor': //$wrap = false; ob_start(); $settings = array('textarea_name' => $name, 'media_buttons' => 1, 'teeny' => 0, 'textarea_rows' => 10, 'tinymce' => array('setup' => 'function(ed) { ed.onChange.add(function(ed) { tinyMCE.triggerSave(); }); }')); wp_editor($value, $id, $settings); $output .= ob_get_clean(); _WP_Editors::editor_js(); _WP_Editors::enqueue_scripts(); break; } return $this->wrap_item($output, $id, 'cherry-section cherry-' . $type . ' ' . $this->options['class']['section'], $title, $label, $description, $hint); }