header-separator.php (12593B)
1 <?php 2 3 function materialis_header_background_settings_separator_options($section, $prefix, $group, $inner, $priority) 4 { 5 materialis_header_separator_options($section, $prefix, $group, $inner, $priority); 6 } 7 8 add_action("materialis_header_background_settings", 'materialis_header_background_settings_separator_options', 3, 5); 9 10 11 function materialis_header_separator_options($section, $prefix, $group, $inner, $priority) 12 { 13 14 $priority = 4; 15 $group = "{$prefix}_options_separator_group_button"; 16 17 materialis_add_kirki_field(array( 18 'type' => 'checkbox', 19 'label' => esc_html__('Use Bottom Separator', 'materialis'), 20 'section' => $section, 21 'settings' => $prefix . '_show_separator', 22 'default' => $inner ? false : false, 23 'priority' => $priority, 24 )); 25 26 materialis_add_kirki_field(array( 27 'type' => 'sidebar-button-group', 28 'settings' => $group, 29 'label' => esc_html__('Options', 'materialis'), 30 'section' => $section, 31 'priority' => $priority, 32 'in_row_with' => array($prefix . '_show_separator'), 33 'active_callback' => array( 34 array( 35 'setting' => $prefix . '_show_separator', 36 'operator' => '==', 37 'value' => true, 38 ), 39 ), 40 )); 41 42 43 materialis_add_kirki_field(array( 44 'type' => 'sectionseparator', 45 'label' => esc_html__('Bottom Separator Options', 'materialis'), 46 'section' => $section, 47 'settings' => $prefix . '_separator_header_separator_2', 48 'priority' => $priority, 49 'group' => $group, 50 )); 51 52 materialis_add_kirki_field(array( 53 'type' => 'select', 54 'settings' => $prefix . '_separator', 55 'label' => esc_html__('Type', 'materialis'), 56 'section' => $section, 57 'default' => 'materialis/1.wave-and-line', 58 'choices' => materialis_get_separators_list(), 59 'priority' => $priority, 60 'active_callback' => array( 61 array( 62 'setting' => $prefix . '_show_separator', 63 'operator' => '==', 64 'value' => true, 65 ), 66 ), 67 'group' => $group, 68 )); 69 70 71 materialis_add_kirki_field(array( 72 'type' => 'color', 73 'settings' => "{$prefix}_separator_color", 74 'label' => esc_attr__('Color', 'materialis'), 75 'section' => $section, 76 'priority' => $priority, 77 'choices' => array( 78 'alpha' => true, 79 ), 80 'default' => $inner ? "#F5FAFD" : "#ffffff", 81 'output' => array( 82 array( 83 'element' => $inner ? "body .header .svg-white-bg" : ".materialis-front-page .header-separator .svg-white-bg", 84 'property' => 'fill', 85 'suffix' => '!important', 86 ), 87 88 89 ), 90 91 'transport' => 'postMessage', 92 'js_vars' => array( 93 array( 94 'element' => $inner ? "body .header .svg-white-bg" : ".materialis-front-page .header-separator .svg-white-bg", 95 'property' => 'fill', 96 'suffix' => '!important', 97 ), 98 ), 99 100 'active_callback' => array( 101 array( 102 'setting' => $prefix . '_show_separator', 103 'operator' => '==', 104 'value' => true, 105 ), 106 ), 107 108 'group' => $group, 109 )); 110 111 112 materialis_add_kirki_field(array( 113 'type' => 'color', 114 'settings' => "{$prefix}_separator_color_accent", 115 'label' => esc_attr__('Accent Color', 'materialis'), 116 'section' => $section, 117 'priority' => $priority, 118 'choices' => array( 119 'alpha' => true, 120 ), 121 'default' => materialis_get_theme_colors('color2'), 122 'output' => array( 123 array( 124 'element' => $inner ? ".materialis-inner-page .header .svg-accent" : ".materialis-front-page .header-separator path.svg-accent", 125 'property' => 'stroke', 126 'suffix' => '!important', 127 ), 128 129 130 ), 131 132 'transport' => 'postMessage', 133 'js_vars' => array( 134 array( 135 'element' => $inner ? "body.page .header path.svg-accent" : ".materialis-front-page .header-separator path.svg-accent", 136 'property' => 'stroke', 137 'suffix' => '!important', 138 ), 139 ), 140 141 'active_callback' => array( 142 array( 143 'setting' => $prefix . '_show_separator', 144 'operator' => '==', 145 'value' => true, 146 ), 147 148 array( 149 'setting' => $prefix . '_separator', 150 'operator' => 'in', 151 'value' => materialis_get_2_colors_separators(array(), true), 152 ), 153 ), 154 'group' => $group, 155 )); 156 157 materialis_add_kirki_field(array( 158 'type' => 'slider', 159 'label' => esc_html__('Height', 'materialis'), 160 'section' => $section, 161 'settings' => $prefix . '_separator_height', 162 'default' => 154, 163 'transport' => 'postMessage', 164 'priority' => $priority, 165 'choices' => array( 166 'min' => '0', 167 'max' => '400', 168 'step' => '1', 169 ), 170 "output" => array( 171 array( 172 "element" => $inner ? ".header-separator svg" : ".materialis-front-page .header-separator svg", 173 'property' => 'height', 174 'suffix' => '!important', 175 'units' => 'px', 176 ), 177 ), 178 'js_vars' => array( 179 array( 180 'element' => $inner ? ".header-separator svg" : ".materialis-front-page .header-separator svg", 181 'function' => 'css', 182 'property' => 'height', 183 'units' => "px", 184 'suffix' => '!important', 185 ), 186 ), 187 'active_callback' => array( 188 array( 189 'setting' => $prefix . '_show_separator', 190 'operator' => '==', 191 'value' => true, 192 ), 193 ), 194 'group' => $group, 195 )); 196 } 197 198 199 function materialis_get_2_colors_separators($separators = array(), $onlyIDs = false) 200 { 201 $separators = array_merge( 202 $separators, 203 array( 204 'materialis/1.wave-and-line' => esc_html__('Wave and line', 'materialis'), 205 'materialis/1.wave-and-line-negative' => esc_html__('Wave and line Negative', 'materialis'), 206 ) 207 ); 208 209 if ($onlyIDs) { 210 return array_keys($separators); 211 212 } 213 214 return $separators; 215 } 216 217 function materialis_prepend_2_colors_separators($separators, $use_only_defaults) 218 { 219 if ($use_only_defaults) { 220 return $separators; 221 } 222 223 return materialis_get_2_colors_separators($separators); 224 225 } 226 227 add_filter('materialis_separators_list_prepend', 'materialis_prepend_2_colors_separators', 10, 2); 228 229 230 function materialis_get_separators_list($use_only_defaults = false) 231 { 232 $extras = array( 233 'materialis/3.waves-noCentric' => esc_html__('Wave no centric', 'materialis'), 234 'materialis/3.waves-noCentric-negative' => esc_html__('Wave no centric Negative', 'materialis'), 235 'materialis/4.clouds' => esc_html__('Clouds 2', 'materialis'), 236 'materialis/5.triple-waves-3' => esc_html__('Triple Waves 1', 'materialis'), 237 'materialis/5.triple-waves-3-negative' => esc_html__('Triple Waves 1 Negative', 'materialis'), 238 'materialis/6.triple-waves-2' => esc_html__('Triple Waves 2', 'materialis'), 239 'materialis/6.triple-waves-2-negative' => esc_html__('Triple Waves 2 Negative', 'materialis'), 240 'materialis/7.stright-angles-1' => esc_html__('Stright Angles 1', 'materialis'), 241 'materialis/7.stright-angles-1-negative' => esc_html__('Stright Angles 1 Negative', 'materialis'), 242 'materialis/8.stright-angles-2' => esc_html__('Triple Waves 2', 'materialis'), 243 'materialis/8.stright-angles-2-negative' => esc_html__('Triple Waves 2 Negative', 'materialis'), 244 ); 245 246 247 $separators = array( 248 'tilt' => esc_html__('Tilt', 'materialis'), 249 'tilt-flipped' => esc_html__('Tilt Flipped', 'materialis'), 250 'opacity-tilt' => esc_html__('Tilt Opacity', 'materialis'), 251 'triangle' => esc_html__('Triangle', 'materialis'), 252 'triangle-negative' => esc_html__('Triangle Negative', 'materialis'), 253 'triangle-asymmetrical' => esc_html__('Triangle Asymmetrical', 'materialis'), 254 'triangle-asymmetrical-negative' => esc_html__('Triangle Asymmetrical Negative', 'materialis'), 255 'opacity-fan' => esc_html__('Fan Opacity', 'materialis'), 256 'mountains' => esc_html__('Mountains', 'materialis'), 257 'pyramids' => esc_html__('Pyramids', 'materialis'), 258 'pyramids-negative' => esc_html__('Pyramids Negative', 'materialis'), 259 'waves' => esc_html__('Waves', 'materialis'), 260 'waves-negative' => esc_html__('Waves Negative', 'materialis'), 261 'wave-brush' => esc_html__('Waves Brush', 'materialis'), 262 'waves-pattern' => esc_html__('Waves Pattern', 'materialis'), 263 'clouds' => esc_html__('Clouds', 'materialis'), 264 'clouds-negative' => esc_html__('Clouds Negative', 'materialis'), 265 'curve' => esc_html__('Curve', 'materialis'), 266 'curve-negative' => esc_html__('Curve Negative', 'materialis'), 267 'curve-asymmetrical' => esc_html__('Curve Asymmetrical', 'materialis'), 268 'curve-asymmetrical-negative' => esc_html__('Curve Asymmetrical Negative', 'materialis'), 269 'drops' => esc_html__('Drops', 'materialis'), 270 'drops-negative' => esc_html__('Drops Negative', 'materialis'), 271 'arrow' => esc_html__('Arrow', 'materialis'), 272 'arrow-negative' => esc_html__('Arrow Negative', 'materialis'), 273 'book' => esc_html__('Book', 'materialis'), 274 'book-negative' => esc_html__('Book Negative', 'materialis'), 275 'split' => esc_html__('Split', 'materialis'), 276 'split-negative' => esc_html__('Split Negative', 'materialis'), 277 'zigzag' => esc_html__('Zigzag', 'materialis'), 278 ); 279 280 if ( ! $use_only_defaults) { 281 $separators = array_merge($extras, $separators); 282 } 283 284 $prepend_separators = apply_filters('materialis_separators_list_prepend', array(), $use_only_defaults); 285 $append_separators = apply_filters('materialis_separators_list_append', array(), $use_only_defaults); 286 287 $separators = array_merge($prepend_separators, $separators, $append_separators); 288 289 return $separators; 290 } 291 292 293 function materialis_print_header_separator($prefix = null) 294 { 295 $inner = materialis_is_inner(true); 296 297 if ( ! $prefix) { 298 $prefix = $inner ? "inner_header" : "header"; 299 } 300 301 $show = materialis_get_theme_mod($prefix . '_show_separator', $inner ? false : false); 302 if ($show) { 303 304 $separator = materialis_get_theme_mod($prefix . '_separator', 'materialis/1.wave-and-line'); 305 306 $reverse = ""; 307 308 if (strpos($separator, "materialis/") !== false) { 309 $reverse = strpos($separator, "-negative") === false ? "" : "header-separator-reverse"; 310 } else { 311 $reverse = strpos($separator, "-negative") === false ? "header-separator-reverse" : ""; 312 } 313 314 echo '<div class="header-separator header-separator-bottom ' . esc_attr($reverse) . '">'; 315 ob_start(); 316 317 // local svg as template ( ensure it will work with filters in child theme ) 318 locate_template("/assets/separators/" . $separator . ".svg", true, true); 319 320 $content = ob_get_clean(); 321 echo $content; 322 echo '</div>'; 323 324 } 325 }