From 38abd22dc2742875e1eedf92e73394a9dff1cafc Mon Sep 17 00:00:00 2001 From: Thuan Bui Date: Sun, 21 Feb 2021 19:49:07 +0700 Subject: [PATCH] Simplifed Remove Customizer JS, Remove autocomplete JS, Remove Dummy Content --- assets/js/autoComplete.min.js | 1 - assets/js/customize-preview.js | 205 ------- assets/js/full-screen-morphing-search.js | 92 --- class-full-screen-morphing-search.php | 192 +----- functions-full-screen-morphing-search.php | 673 ---------------------- 5 files changed, 3 insertions(+), 1160 deletions(-) delete mode 100644 assets/js/autoComplete.min.js delete mode 100644 assets/js/customize-preview.js diff --git a/assets/js/autoComplete.min.js b/assets/js/autoComplete.min.js deleted file mode 100644 index 6614fc2..0000000 --- a/assets/js/autoComplete.min.js +++ /dev/null @@ -1 +0,0 @@ -var a,b;a=this,b=function(){"use strict";function e(e,t){for(var n=0;ne.length)&&(t=e.length);for(var n=0,i=new Array(t);n=e.length?{done:!0}:{done:!1,value:e[i++]}},e:function(e){throw e},f:t}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var r,o=!0,s=!1;return{s:function(){n=e[Symbol.iterator]()},n:function(){var e=n.next();return o=e.done,e},e:function(e){s=!0,r=e},f:function(){try{o||null==n.return||n.return()}finally{if(s)throw r}}}}function u(e,t){for(var n=document.getElementsByClassName(e.resultsList.className),i=0;i=e.length&&(o=0),o<0&&(o=e.length-1),e[o].setAttribute("aria-selected","true"),e[o].classList.add("autoComplete_selected")},a=n.resultsList.navigation||function(e){var t=document.getElementById(n.resultsList.idName);if(!t)return n.inputField.removeEventListener("keydown",a);t=t.getElementsByTagName(n.resultItem.element),27===e.keyCode?(n.inputField.value="",u(n)):40===e.keyCode||9===e.keyCode?i(e,t,!0,n):38===e.keyCode||9===e.keyCode?i(e,t,!1,n):13===e.keyCode&&(e.preventDefault(),-1'.concat(a,""):a,o++),r.push(a)}if(o===e.length)return r.join("")}else if(i.includes(e))return e=new RegExp("".concat(e),"i").exec(t),n.highlight?t.replace(e,''.concat(e,"")):t}(s,t,o))&&e?a.push({key:e,index:n,match:t,value:i}):t&&!e&&a.push({index:n,match:t,value:i}))}var i=o.data.store[n];if(o.data.key){var t,r=l(o.data.key);try{for(r.s();!(t=r.n()).done;)e(t.value)}catch(e){r.e(e)}finally{r.f()}}else e()},t=0;t=r.threshold&&o.replace(/ /g,"").length)?a.dataStore().then(function(e){try{return u(a),a.start(n,i),s.call(a)}catch(e){return t(e)}},t):(u(a),s.call(a));function s(){return e()}})}},{key:"init",value:function(){var e,n,i,r,t=this;this.inputField="string"==typeof this.selector?document.querySelector(this.selector):this.selector(),(e=this).inputField.setAttribute("type","text"),e.inputField.setAttribute("role","combobox"),e.inputField.setAttribute("aria-haspopup",!0),e.inputField.setAttribute("aria-expanded",!1),e.inputField.setAttribute("aria-controls",e.resultsList.idName),e.inputField.setAttribute("aria-autocomplete","both"),this.placeHolder&&this.inputField.setAttribute("placeholder",this.placeHolder),this.hook=(n=function(){t.compose()},i=this.debounce,function(){var e=this,t=arguments;clearTimeout(r),r=setTimeout(function(){return n.apply(e,t)},i)}),this.trigger.event.forEach(function(e){t.inputField.removeEventListener(e,t.hook),t.inputField.addEventListener(e,t.hook)}),d(this.inputField,null,"init")}},{key:"preInit",value:function(){var o=this,s=document;new MutationObserver(function(e,t){var n,i=s.querySelector(o.selector),r=l(e);try{for(r.s();!(n=r.n()).done;){n.value;i&&(t.disconnect(),d(i,null,"connect"),o.init())}}catch(e){r.e(e)}finally{r.f()}}).observe(s,{childList:!0,subtree:!0})}},{key:"unInit",value:function(){this.inputField.removeEventListener("input",this.hook),d(this.inputField,null,"unInit")}}])&&e(n.prototype,i),h&&e(n,h),T},"object"==typeof exports&&"undefined"!=typeof module?module.exports=b():"function"==typeof define&&define.amd?define(b):(a="undefined"!=typeof globalThis?globalThis:a||self).autoComplete=b(); diff --git a/assets/js/customize-preview.js b/assets/js/customize-preview.js deleted file mode 100644 index eefb38e..0000000 --- a/assets/js/customize-preview.js +++ /dev/null @@ -1,205 +0,0 @@ -/** - * File customize-preview.js. - * - * Theme Customizer enhancements for a better user experience. - * - * Contains handlers to make Theme Customizer preview reload changes asynchronously. - */ - -( function( $ ) { - - // FSMS Main Background Color. - wp.customize( 'fsmsp_options[fsmsp_main_background_color]', function( value ) { - value.bind( function( newval ) { - $( '#morphsearch, div.morphsearch-content' ).css( 'background-color', newval ); - } ); - } ); - - // FSMS Close Color. - wp.customize( 'fsmsp_options[fsmsp_close_icon_color]', function( value ) { - value.bind( function( newval ) { - document.querySelectorAll( 'span.morphsearch-close' )[0].style.setProperty( "--morphsearch-close-background", newval ); - /** - * @see https://stackoverflow.com/a/49618941/6837428 - */ - } ); - } ); - - // FSMS Search... Color. - wp.customize( 'fsmsp_options[fsmsp_search_text_color]', function( value ) { - value.bind( function( newval ) { - document.querySelectorAll( 'input.morphsearch-input' )[0].style.setProperty( "--morphsearch-input-placeholder", newval ); - } ); - } ); - - // FSMS Input Text Color. - wp.customize( 'fsmsp_options[fsmsp_input_text_color]', function( value ) { - value.bind( function( newval ) { - $( '#morphsearch .morphsearch-input' ).css( 'color', newval ); - } ); - } ); - - // FSMS Magnifier Submit Color. - wp.customize( 'fsmsp_options[fsmsp_magnifier_submit_color]', function( value ) { - value.bind( function( newval ) { - $( '#Capa_1 path' ).css( 'fill', newval ); - } ); - } ); - - // FSMS Headings Color. - wp.customize( 'fsmsp_options[fsmsp_headings_color]', function( value ) { - value.bind( function( newval ) { - $( 'div.dummy-column h2' ).css( 'color', newval ); - } ); - } ); - - // FSMS Columns Background Color. - wp.customize( 'fsmsp_options[fsmsp_columns_background_color]', function( value ) { - value.bind( function( newval ) { - $( 'div.dummy-media-object' ).css( 'background', newval ); - $( 'div.dummy-media-object' ).mouseout( function() { - $(this).css( 'background', newval ); - } ); - } ); - } ); - - // FSMS Columns Hover Background Color. - wp.customize( 'fsmsp_options[fsmsp_columns_hover_background_color]', function( value ) { - value.bind( function( newval ) { - $( 'div.dummy-media-object' ).mouseover( function() { - $(this).css( 'background', newval ); - } ); - } ); - } ); - - // FSMS Links Color. - wp.customize( 'fsmsp_options[fsmsp_links_color]', function( value ) { - value.bind( function( newval ) { - $( '.dummy-media-object h3 a' ).css( 'color', newval ); - $( 'div.dummy-media-object' ).mouseout( function() { - $(this).find( 'h3 a' ).css( 'color', newval ); - } ); - } ); - } ); - - // FSMS Links Hover Color. - wp.customize( 'fsmsp_options[fsmsp_links_hover_color]', function( value ) { - value.bind( function( newval ) { - $( 'div.dummy-media-object' ).mouseover( function() { - $(this).find( 'h3 a' ).css( 'color', newval ); - } ); - } ); - } ); - - // FSMS Search Form Text. - wp.customize( 'fsmsp_options[fsmsp_search_form_text]', function( value ) { - value.bind( function( newval ) { - $( 'input.morphsearch-input' ).attr( 'placeholder', newval ); - } ); - } ); - - /** - * MutationObserver to display the default placeholder text (search...), - * when the user erases all characters of his text in the FSMS Search Form Text option. - */ - let targetNodePhTxt = $( "input.morphsearch-input" )[0]; // Get the Node element. - let observerPhTxt = new MutationObserver( callbackPhTxt ); - let obsConfigPhTxt = { attributes: true }; - observerPhTxt.observe( targetNodePhTxt, obsConfigPhTxt ); - function callbackPhTxt(mutations) { - mutations.forEach( function( mutation ) { - if ( mutation.target.placeholder.length == 0 ) { - $( '.morphsearch-form .morphsearch-input' ).attr( 'placeholder', fsmsp_cp.fsmsp_placeholder_text ); - } - } ); - } - - /** - * MutationObserver to prevent weird behaviour in Chrome and Edge, when input of text control option is clicked/focused. - * Not needed but added to reflect same behaviour as on the live site (not Customizer preview). - * When the overlay comes out, focus() on .morphsearch-input, then close it if we press on the Esc button. - */ - let targetNode = $( '#morphsearch' )[0]; // Get the Node element. - let observerNode = new MutationObserver( mutationNodeCallback ); - let obsNodeConfig = { attributes: true }; - observerNode.observe( targetNode, obsNodeConfig ); - function mutationNodeCallback( mutations ) { - mutations.forEach( function( mutation ) { - if ( 'attributes' === mutation.type ) { - // This focus() will affect every input in a form[role=search] ! - $( '.morphsearch-input' ).focus(); - $( '.morphsearch' ).on( 'keydown', function( event ) { - if (event.keyCode === 27) { - // Remove the focus() first with blur() on every form[role=search] input ! - $( 'form[role=search] input' ).blur(); - // Close the overlay : $( '.morphsearch-close' ).click(); - $( '.morphsearch' ).removeClass( 'open' ); - } - } ); - } - } ); - } - - /** - * Following MutationObserver are to display the default icon for each column when no Icon/Image is provided. - * This will take effect when the Remove button is clicked while in the Customizer preview. - */ - - // 1- MutationObserver for article icon. - let targetObjArt = $( '.fsmsp-article-link' ); // Get the Object element NOT the Node. - let observerObjArt = new MutationObserver( callbackArt ); - let obsConfigArt = { childList: true }; - targetObjArt.each( function() { - /** - * Using .each( function() { } ); since we have more than one object element matching our request. - */ - observerObjArt.observe( this, obsConfigArt ); - } ); - function callbackArt( mutationList ) { - mutationList.forEach( function( mutation ) { - if ( mutation.type == 'childList' ) { - /** - * When - * is the only child left (this is when we click on the remove button after adding a chosen image/icon), - * we append the default article icon (fsmsp_cp.fsmsp_article_icon) to the targetObjArt. - */ - if ( mutation.target.childNodes.length == 1 ) { - targetObjArt.append( fsmsp_cp.fsmsp_article_icon ); - } - } - } ); - } - // 2- MutationObserver for category icon. - var targetObjCat = $( '.fsmsp-category-image' ); // Get the Object element NOT the Node. - var observerCat = new MutationObserver(callbackCategory); - var obsConfigCat = { childList: true }; - targetObjCat.each( function() { - observerCat.observe(this, obsConfigCat); - } ); - function callbackCategory( mutationList ) { - mutationList.forEach( function( mutation ) { - if ( mutation.type == 'childList' ) { - if ( mutation.target.childNodes.length == 1 ) { - targetObjCat.append( fsmsp_cp.fsmsp_category_icon ); - } - } - } ); - } - // 3- MutationObserver for tag icon. - var targetObjTag = $( '.fsmsp-tag-image' ); // Get the Object element NOT the Node. - var observerTag = new MutationObserver(callbackTag); - var obsConfigTag = { childList: true }; - targetObjTag.each( function() { - observerTag.observe(this, obsConfigTag); - } ); - function callbackTag( mutationList ) { - mutationList.forEach( function( mutation ) { - if ( mutation.type == 'childList' ) { - if ( mutation.target.childNodes.length == 1 ) { - targetObjTag.append( fsmsp_cp.fsmsp_tag_icon ); - } - } - } ); - } - -} )( jQuery ); \ No newline at end of file diff --git a/assets/js/full-screen-morphing-search.js b/assets/js/full-screen-morphing-search.js index 0f19f1b..7d9ce52 100644 --- a/assets/js/full-screen-morphing-search.js +++ b/assets/js/full-screen-morphing-search.js @@ -50,95 +50,3 @@ let fsmspBackgrounds = document.querySelectorAll('#morphsearch, div.morphsearch- fsmspLinks = document.querySelectorAll('div.dummy-media-object h3 a'); // Output default options' values ! -if (fsmsp_vars.fsmsp_options_does_not_exists) { - - // Output fsmsp_main_background_color. - for (let fsmspBackground of fsmspBackgrounds) { - fsmspBackground.style.backgroundColor = '#f1f1f1'; - } - - // Output fsmsp_close_icon_color. - document.querySelector('span.morphsearch-close').style.setProperty("--morphsearch-close-background", '#000'); - - // Output fsmsp_search_text_color. - morphSearchInputField.style.setProperty("--morphsearch-input-placeholder", '#c2c2c2'); - - // Output fsmsp_input_text_color. - morphSearchInputField.style.color = '#ec5a62'; - - // Output fsmsp_magnifier_submit_color. - document.querySelector('#Capa_1 path').setAttribute('fill', '#ddd'); - - // Output fsmsp_headings_color. - for (let fsmspHeading of fsmspHeadings) { - fsmspHeading.style.color = '#c2c2c2'; - } - - for (let fsmspColumn of fsmspColumns) { - - // Output fsmsp_columns_background_color. - fsmspColumn.style.background = '#ebebeb'; - - fsmspColumn.addEventListener("mouseover", function () { - // Output fsmsp_columns_hover_background_color. - this.style.background = '#e4e4e5'; - // Output fsmsp_links_hover_color. - this.lastElementChild.firstElementChild.style.color = '#ec5a62'; - }); - - fsmspColumn.addEventListener("mouseout", function () { - this.style.background = '#ebebeb'; - // Output fsmsp_links_color. - this.lastElementChild.firstElementChild.style.color = '#b2b2b2'; - }); - } - - // Output fsmsp_links_color. - for (let fsmspLink of fsmspLinks) { - fsmspLink.style.color = '#b2b2b2'; - } - - // Output fsmsp_search_form_text. - morphSearchInputField.placeholder = 'Search...'; - - -} else { - - for (let fsmspBackground of fsmspBackgrounds) { - fsmspBackground.style.backgroundColor = fsmsp_vars.fsmsp_main_background_color; - } - - document.querySelector('span.morphsearch-close').style.setProperty("--morphsearch-close-background", fsmsp_vars.fsmsp_close_icon_color); - - morphSearchInputField.style.setProperty("--morphsearch-input-placeholder", fsmsp_vars.fsmsp_search_text_color); - - morphSearchInputField.style.color = fsmsp_vars.fsmsp_input_text_color; - - document.querySelector('#Capa_1 path').setAttribute('fill', fsmsp_vars.fsmsp_magnifier_submit_color); - - for (let fsmspHeading of fsmspHeadings) { - fsmspHeading.style.color = fsmsp_vars.fsmsp_headings_color; - } - - for (let fsmspColumn of fsmspColumns) { - - fsmspColumn.style.background = fsmsp_vars.fsmsp_columns_background_color; - - fsmspColumn.addEventListener("mouseover", function () { - this.style.background = fsmsp_vars.fsmsp_columns_hover_background_color; - this.lastElementChild.firstElementChild.style.color = fsmsp_vars.fsmsp_links_hover_color; - }); - - fsmspColumn.addEventListener("mouseout", function () { - this.style.background = fsmsp_vars.fsmsp_columns_background_color; - this.lastElementChild.firstElementChild.style.color = fsmsp_vars.fsmsp_links_color - }); - } - - for (let fsmspLink of fsmspLinks) { - fsmspLink.style.color = fsmsp_vars.fsmsp_links_color; - } - - morphSearchInputField.placeholder = fsmsp_vars.fsmsp_search_form_text; - -} \ No newline at end of file diff --git a/class-full-screen-morphing-search.php b/class-full-screen-morphing-search.php index 5050ffa..a7ad685 100644 --- a/class-full-screen-morphing-search.php +++ b/class-full-screen-morphing-search.php @@ -58,33 +58,6 @@ class Full_Screen_Morphing_Search { // Load Javascript. wp_enqueue_script( $this->plugin->name, $this->plugin->url . 'assets/js/full-screen-morphing-search.js', array( 'jquery' ), '1.0', true ); - // Associative Array 'fsmsp_options'. - $fsmsp_options = get_option( 'fsmsp_options' ); - - // Declare PHP Variables to be passed to JS. - $fsmsp_options_does_not_exists = ( null === get_option( 'fsmsp_options', null ) ) ? true : false; - - // Localize full-screen-morphing-search.js ! - wp_localize_script( - $this->plugin->name, - 'fsmsp_vars', - array( - 'fsmsp_is_customize_preview' => is_customize_preview(), - 'fsmsp_options_does_not_exists' => $fsmsp_options_does_not_exists, - 'fsmsp_main_background_color' => esc_attr( ( ! empty( $fsmsp_options['fsmsp_main_background_color'] ) ? $fsmsp_options['fsmsp_main_background_color'] : '#f1f1f1' ) ), - 'fsmsp_close_icon_color' => esc_attr( ( ! empty( $fsmsp_options['fsmsp_close_icon_color'] ) ? $fsmsp_options['fsmsp_close_icon_color'] : '#000' ) ), - 'fsmsp_search_text_color' => esc_attr( ( ! empty( $fsmsp_options['fsmsp_search_text_color'] ) ? $fsmsp_options['fsmsp_search_text_color'] : '#c2c2c2' ) ), - 'fsmsp_input_text_color' => esc_attr( ( ! empty( $fsmsp_options['fsmsp_input_text_color'] ) ? $fsmsp_options['fsmsp_input_text_color'] : '#ec5a62' ) ), - 'fsmsp_magnifier_submit_color' => esc_attr( ( ! empty( $fsmsp_options['fsmsp_magnifier_submit_color'] ) ? $fsmsp_options['fsmsp_magnifier_submit_color'] : '#ddd' ) ), - 'fsmsp_headings_color' => esc_attr( ( ! empty( $fsmsp_options['fsmsp_headings_color'] ) ? $fsmsp_options['fsmsp_headings_color'] : '#c2c2c2' ) ), - 'fsmsp_columns_background_color' => esc_attr( ( ! empty( $fsmsp_options['fsmsp_columns_background_color'] ) ? $fsmsp_options['fsmsp_columns_background_color'] : '#ebebeb' ) ), - 'fsmsp_columns_hover_background_color' => esc_attr( ( ! empty( $fsmsp_options['fsmsp_columns_hover_background_color'] ) ? $fsmsp_options['fsmsp_columns_hover_background_color'] : '#e4e4e5' ) ), - 'fsmsp_links_color' => esc_attr( ( ! empty( $fsmsp_options['fsmsp_links_color'] ) ? $fsmsp_options['fsmsp_links_color'] : '#b2b2b2' ) ), - 'fsmsp_links_hover_color' => esc_attr( ( ! empty( $fsmsp_options['fsmsp_links_hover_color'] ) ? $fsmsp_options['fsmsp_links_hover_color'] : '#ec5a62' ) ), - 'fsmsp_search_form_text' => esc_attr( ( ! empty( $fsmsp_options['fsmsp_search_form_text'] ) ? $fsmsp_options['fsmsp_search_form_text'] : 'Search…' ) ), - ) - ); - } /** @@ -96,15 +69,14 @@ class Full_Screen_Morphing_Search { */ public function full_screen_morphing_search_output_morphing_search() { - $fsmsp_options = get_option( 'fsmsp_options' ); // Associative Array 'fsmsp_options'. ?>
array( 'post', 'page' ), - 'post_status' => 'publish', - 'posts_per_page' => -1, // all posts and pages. - ); - - $posts = get_posts( $fsmsp_ac ); - - if ( $posts ) : - foreach ( $posts as $k => $post ) { - $source[ $k ]['ID'] = $post->ID; - $source[ $k ]['label'] = $post->post_title; // The name of the post. - $source[ $k ]['permalink'] = get_permalink( $post->ID ); - } - - ?> - - 'postMessage' instead of the default 'transport' - * => 'refresh'. - * - * Used by hook: 'customize_preview_init' - */ -function fsmsp_customize_preview_js() { - $handle = 'fsmsp-customize-preview'; - $src = plugins_url( 'assets/js/customize-preview.js', __FILE__ ); - $deps = array( 'jquery', 'customize-preview' ); - $ver = '0.1'; - $in_footer = true; - wp_enqueue_script( $handle, $src, $deps, $ver, $in_footer ); - wp_localize_script( - 'fsmsp-customize-preview', - 'fsmsp_cp', - array( - 'fsmsp_article_icon' => '', - 'fsmsp_category_icon' => '', - 'fsmsp_tag_icon' => '', - 'fsmsp_placeholder_text' => esc_attr( 'Search…' ), - ) - ); -} -add_action( 'customize_preview_init', 'fsmsp_customize_preview_js' ); if ( ! function_exists( 'full_screen_morphing_search_add_svg_tags' ) ) { /** @@ -84,631 +39,3 @@ if ( ! function_exists( 'full_screen_morphing_search_add_svg_tags' ) ) { } add_filter( 'wp_kses_allowed_html', 'full_screen_morphing_search_add_svg_tags' ); } - -/** - * Add our Customizer content. - * - * @param WP_Customize_Manager $wp_customize Manager instance. - */ -function full_screen_morphing_search_customize_register( $wp_customize ) { - - // Add FSMS Plugin Panel. - $wp_customize->add_panel( - 'fsmsp_panel', - array( - 'title' => __( 'FSMS Plugin', 'full-screen-morphing-search' ), - 'priority' => 160, - ) - ); - - // Add Color Section. - $wp_customize->add_section( - 'fsmsp_color', - array( - 'title' => __( 'FSMS Colors', 'full-screen-morphing-search' ), - 'priority' => 5, - 'panel' => 'fsmsp_panel', - ) - ); - - // ===================================== - // = FSMS Main Background Color Picker = - // ===================================== - $wp_customize->add_setting( - 'fsmsp_options[fsmsp_main_background_color]', - array( - 'default' => '#f1f1f1', - 'sanitize_callback' => 'sanitize_hex_color', - 'capability' => 'edit_theme_options', - 'type' => 'option', - 'transport' => 'postMessage', - - ) - ); - - $wp_customize->add_control( - new WP_Customize_Color_Control( - $wp_customize, - 'fsmsp_options[fsmsp_main_background_color]', - array( - 'label' => __( 'FSMS Main Background Color', 'full-screen-morphing-search' ), - 'description' => esc_attr__( 'Change the main background color', 'full-screen-morphing-search' ), - 'section' => 'fsmsp_color', - 'settings' => 'fsmsp_options[fsmsp_main_background_color]', - ) - ) - ); - - // ===================== - // = FSMS Close Color. = - // ===================== - $wp_customize->add_setting( - 'fsmsp_options[fsmsp_close_icon_color]', - array( - 'default' => '#000', - 'sanitize_callback' => 'sanitize_hex_color', - 'capability' => 'edit_theme_options', - 'type' => 'option', - 'transport' => 'postMessage', - - ) - ); - - $wp_customize->add_control( - new WP_Customize_Color_Control( - $wp_customize, - 'fsmsp_options[fsmsp_close_icon_color]', - array( - 'label' => __( 'FSMS Close Icon Color', 'full-screen-morphing-search' ), - 'description' => esc_attr__( 'Change the close icon color', 'full-screen-morphing-search' ), - 'section' => 'fsmsp_color', - 'settings' => 'fsmsp_options[fsmsp_close_icon_color]', - ) - ) - ); - - // ========================= - // = FSMS Search... Color. = - // ========================= - $wp_customize->add_setting( - 'fsmsp_options[fsmsp_search_text_color]', - array( - 'default' => '#c2c2c2', - 'sanitize_callback' => 'sanitize_hex_color', - 'capability' => 'edit_theme_options', - 'type' => 'option', - 'transport' => 'postMessage', - - ) - ); - - $wp_customize->add_control( - new WP_Customize_Color_Control( - $wp_customize, - 'fsmsp_options[fsmsp_search_text_color]', - array( - 'label' => __( 'FSMS Search… text Color', 'full-screen-morphing-search' ), - 'description' => esc_attr__( 'Change the search… text color', 'full-screen-morphing-search' ), - 'section' => 'fsmsp_color', - 'settings' => 'fsmsp_options[fsmsp_search_text_color]', - ) - ) - ); - - // ========================== - // = FSMS Input Text Color. = - // ========================== - $wp_customize->add_setting( - 'fsmsp_options[fsmsp_input_text_color]', - array( - 'default' => '#ec5a62', - 'sanitize_callback' => 'sanitize_hex_color', - 'capability' => 'edit_theme_options', - 'type' => 'option', - 'transport' => 'postMessage', - - ) - ); - - $wp_customize->add_control( - new WP_Customize_Color_Control( - $wp_customize, - 'fsmsp_options[fsmsp_input_text_color]', - array( - 'label' => __( 'FSMS Input Text Color', 'full-screen-morphing-search' ), - 'description' => esc_attr__( 'Change the input text color', 'full-screen-morphing-search' ), - 'section' => 'fsmsp_color', - 'settings' => 'fsmsp_options[fsmsp_input_text_color]', - ) - ) - ); - - // ================================ - // = FSMS Magnifier Submit Color. = - // ================================ - $wp_customize->add_setting( - 'fsmsp_options[fsmsp_magnifier_submit_color]', - array( - 'default' => '#ddd', - 'sanitize_callback' => 'sanitize_hex_color', - 'capability' => 'edit_theme_options', - 'type' => 'option', - 'transport' => 'postMessage', - - ) - ); - - $wp_customize->add_control( - new WP_Customize_Color_Control( - $wp_customize, - 'fsmsp_options[fsmsp_magnifier_submit_color]', - array( - 'label' => __( 'FSMS Magnifier Submit Color', 'full-screen-morphing-search' ), - 'description' => esc_attr__( 'Change the magnifier submit color', 'full-screen-morphing-search' ), - 'section' => 'fsmsp_color', - 'settings' => 'fsmsp_options[fsmsp_magnifier_submit_color]', - ) - ) - ); - - // ======================== - // = FSMS Headings Color. = - // ======================== - $wp_customize->add_setting( - 'fsmsp_options[fsmsp_headings_color]', - array( - 'default' => '#c2c2c2', - 'sanitize_callback' => 'sanitize_hex_color', - 'capability' => 'edit_theme_options', - 'type' => 'option', - 'transport' => 'postMessage', - - ) - ); - - $wp_customize->add_control( - new WP_Customize_Color_Control( - $wp_customize, - 'fsmsp_options[fsmsp_headings_color]', - array( - 'label' => __( 'FSMS Headings Color', 'full-screen-morphing-search' ), - 'description' => esc_attr__( 'Change the headings color', 'full-screen-morphing-search' ), - 'section' => 'fsmsp_color', - 'settings' => 'fsmsp_options[fsmsp_headings_color]', - ) - ) - ); - - // ================================== - // = FSMS Columns Background Color. = - // ================================== - $wp_customize->add_setting( - 'fsmsp_options[fsmsp_columns_background_color]', - array( - 'default' => '#ebebeb', - 'sanitize_callback' => 'sanitize_hex_color', - 'capability' => 'edit_theme_options', - 'type' => 'option', - 'transport' => 'postMessage', - - ) - ); - - $wp_customize->add_control( - new WP_Customize_Color_Control( - $wp_customize, - 'fsmsp_options[fsmsp_columns_background_color]', - array( - 'label' => __( 'FSMS Columns Background Color', 'full-screen-morphing-search' ), - 'description' => esc_attr__( 'Change the columns background color', 'full-screen-morphing-search' ), - 'section' => 'fsmsp_color', - 'settings' => 'fsmsp_options[fsmsp_columns_background_color]', - 'input_attrs' => array( // Optional. - 'class' => 'color-picker', - 'data-alpha' => true, - ), - ) - ) - ); - - // ======================================== - // = FSMS Columns Hover Background Color. = - // ======================================== - $wp_customize->add_setting( - 'fsmsp_options[fsmsp_columns_hover_background_color]', - array( - 'default' => '#e4e4e5', - 'sanitize_callback' => 'sanitize_hex_color', - 'capability' => 'edit_theme_options', - 'type' => 'option', - 'transport' => 'postMessage', - ) - ); - - $wp_customize->add_control( - new WP_Customize_Color_Control( - $wp_customize, - 'fsmsp_options[fsmsp_columns_hover_background_color]', - array( - 'label' => __( 'FSMS Columns Hover Background Color', 'full-screen-morphing-search' ), - 'description' => esc_attr__( 'Change the columns hover background color', 'full-screen-morphing-search' ), - 'section' => 'fsmsp_color', - 'settings' => 'fsmsp_options[fsmsp_columns_hover_background_color]', - ) - ) - ); - - // ===================== - // = FSMS Links Color. = - // ===================== - $wp_customize->add_setting( - 'fsmsp_options[fsmsp_links_color]', - array( - 'default' => '#b2b2b2', - 'sanitize_callback' => 'sanitize_hex_color', - 'capability' => 'edit_theme_options', - 'type' => 'option', - 'transport' => 'postMessage', - ) - ); - - $wp_customize->add_control( - new WP_Customize_Color_Control( - $wp_customize, - 'fsmsp_options[fsmsp_links_color]', - array( - 'label' => __( 'FSMS Links Color', 'full-screen-morphing-search' ), - 'description' => esc_attr__( 'Change the links color', 'full-screen-morphing-search' ), - 'section' => 'fsmsp_color', - 'settings' => 'fsmsp_options[fsmsp_links_color]', - ) - ) - ); - - // =========================== - // = FSMS Links Hover Color. = - // =========================== - $wp_customize->add_setting( - 'fsmsp_options[fsmsp_links_hover_color]', - array( - 'default' => '#ec5a62', - 'sanitize_callback' => 'sanitize_hex_color', - 'capability' => 'edit_theme_options', - 'type' => 'option', - 'transport' => 'postMessage', - ) - ); - - $wp_customize->add_control( - new WP_Customize_Color_Control( - $wp_customize, - 'fsmsp_options[fsmsp_links_hover_color]', - array( - 'label' => __( 'FSMS Links Hover Color', 'full-screen-morphing-search' ), - 'description' => esc_attr__( 'Change the links hover color', 'full-screen-morphing-search' ), - 'section' => 'fsmsp_color', - 'settings' => 'fsmsp_options[fsmsp_links_hover_color]', - ) - ) - ); - - // Add Search Form Section. - $wp_customize->add_section( - 'fsmsp_search_form', - array( - 'title' => __( 'FSMS Search Form', 'full-screen-morphing-search' ), - 'priority' => 10, - 'panel' => 'fsmsp_panel', - ) - ); - - // ========================== - // = FSMS Search Form Text. = - // ========================== - $wp_customize->add_setting( - 'fsmsp_options[fsmsp_search_form_text]', - array( - 'default' => '', - 'sanitize_callback' => 'wp_filter_nohtml_kses', // Strips all HTML from a text string. - 'capability' => 'edit_theme_options', - 'type' => 'option', - 'transport' => 'postMessage', - ) - ); - - $wp_customize->add_control( - 'fsmsp_options[fsmsp_search_form_text]', - array( - 'label' => __( 'FSMS Search Form Text', 'full-screen-morphing-search' ), - 'description' => esc_attr__( 'Change the search form text. If leaved blank, it will return to original value !', 'full-screen-morphing-search' ), - 'section' => 'fsmsp_search_form', - 'settings' => 'fsmsp_options[fsmsp_search_form_text]', - 'type' => 'text', - 'input_attrs' => array( - 'placeholder' => __( 'Search…', 'full-screen-morphing-search' ), - ), - ) - ); - - // Add Icons Section. - $wp_customize->add_section( - 'fsmsp_icons', - array( - 'title' => __( 'FSMS Icons', 'full-screen-morphing-search' ), - 'priority' => 15, - 'panel' => 'fsmsp_panel', - ) - ); - - // ====================== - // = FSMS Article Icon. = - // ====================== - $wp_customize->add_setting( - 'fsmsp_options[fsmsp_article_icon]', - array( - 'default' => '', - 'type' => 'option', - 'transport' => 'postMessage', - 'sanitize_callback' => 'esc_url_raw', - ) - ); - - $wp_customize->add_control( - new WP_Customize_Image_Control( - $wp_customize, - 'fsmsp_options[fsmsp_article_icon]', - array( - 'label' => __( 'FSMS Article Icon', 'full-screen-morphing-search' ), - 'description' => esc_attr__( 'Change the article icon.', 'full-screen-morphing-search' ), - 'section' => 'fsmsp_icons', - 'settings' => 'fsmsp_options[fsmsp_article_icon]', - 'button_labels' => array( - 'select' => __( 'Select Article Icon' ), - 'change' => __( 'Change Article Icon' ), - 'remove' => __( 'Remove' ), - 'frame_title' => __( 'Select Article Icon' ), - 'frame_button' => __( 'Choose Article Icon' ), - ), - ) - ) - ); - - $wp_customize->selective_refresh->add_partial( - 'fsmsp_options[fsmsp_article_icon]', - array( - 'selector' => 'div.dummy-media-object a.fsmsp-article-link', - 'settings' => array( 'fsmsp_options[fsmsp_article_icon]' ), - 'render_callback' => 'full_screen_morphing_search_article_icon', - ) - ); - - // ==================================== - // = FSMS Article Icon/Image Classes. = - // ==================================== - $wp_customize->add_setting( - 'fsmsp_options[fsmsp_article_i_classes]', - array( - 'default' => true, - 'type' => 'option', - 'transport' => 'postMessage', - 'sanitize_callback' => 'wp_validate_boolean', - ) - ); - - $wp_customize->add_control( - 'fsmsp_options[fsmsp_article_i_classes]', - array( - 'label' => __( 'Article Icon/Image Round or Not ?!', 'full-screen-morphing-search' ), - 'section' => 'fsmsp_icons', - 'settings' => 'fsmsp_options[fsmsp_article_i_classes]', - 'type' => 'checkbox', - ) - ); - - $wp_customize->selective_refresh->add_partial( - 'fsmsp_options[fsmsp_article_i_classes]', - array( - 'selector' => 'div.dummy-media-object a.fsmsp-article-link', - 'settings' => array( 'fsmsp_options[fsmsp_article_i_classes]' ), - 'render_callback' => 'full_screen_morphing_search_article_icon', - ) - ); - - // ======================= - // = FSMS Category Icon. = - // ======================= - $wp_customize->add_setting( - 'fsmsp_options[fsmsp_category_icon]', - array( - 'default' => '', - 'type' => 'option', - 'transport' => 'postMessage', - 'sanitize_callback' => 'esc_url_raw', - ) - ); - - $wp_customize->add_control( - new WP_Customize_Image_Control( - $wp_customize, - 'fsmsp_options[fsmsp_category_icon]', - array( - 'label' => __( 'FSMS Category Icon', 'full-screen-morphing-search' ), - 'description' => esc_attr__( 'Change the category icon.', 'full-screen-morphing-search' ), - 'section' => 'fsmsp_icons', - 'settings' => 'fsmsp_options[fsmsp_category_icon]', - 'button_labels' => array( - 'select' => __( 'Select Category Icon' ), - 'change' => __( 'Change Category Icon' ), - 'remove' => __( 'Remove' ), - 'frame_title' => __( 'Select Category Icon' ), - 'frame_button' => __( 'Choose Category Icon' ), - ), - ) - ) - ); - - $wp_customize->selective_refresh->add_partial( - 'fsmsp_options[fsmsp_category_icon]', - array( - 'selector' => 'span.fsmsp-category-image', - 'settings' => array( 'fsmsp_options[fsmsp_category_icon]' ), - 'render_callback' => 'full_screen_morphing_search_category_icon', - ) - ); - - // ===================================== - // = FSMS Category Icon/Image Classes. = - // ===================================== - $wp_customize->add_setting( - 'fsmsp_options[fsmsp_category_i_classes]', - array( - 'default' => true, - 'type' => 'option', - 'transport' => 'postMessage', - 'sanitize_callback' => 'wp_validate_boolean', - ) - ); - - $wp_customize->add_control( - 'fsmsp_options[fsmsp_category_i_classes]', - array( - 'label' => __( 'Category Icon/Image Round or Not ?!', 'full-screen-morphing-search' ), - 'section' => 'fsmsp_icons', - 'settings' => 'fsmsp_options[fsmsp_category_i_classes]', - 'type' => 'checkbox', - ) - ); - - $wp_customize->selective_refresh->add_partial( - 'fsmsp_options[fsmsp_category_i_classes]', - array( - 'selector' => 'span.fsmsp-category-image', - 'settings' => array( 'fsmsp_options[fsmsp_category_i_classes]' ), - 'render_callback' => 'full_screen_morphing_search_category_icon', - ) - ); - - // ================== - // = FSMS Tag Icon. = - // ================== - $wp_customize->add_setting( - 'fsmsp_options[fsmsp_tag_icon]', - array( - 'default' => '', - 'type' => 'option', - 'transport' => 'postMessage', - 'sanitize_callback' => 'esc_url_raw', - ) - ); - - $wp_customize->add_control( - new WP_Customize_Image_Control( - $wp_customize, - 'fsmsp_options[fsmsp_tag_icon]', - array( - 'label' => __( 'FSMS Tag Icon', 'full-screen-morphing-search' ), - 'description' => esc_attr__( 'Change the tag icon.', 'full-screen-morphing-search' ), - 'section' => 'fsmsp_icons', - 'settings' => 'fsmsp_options[fsmsp_tag_icon]', - 'button_labels' => array( - 'select' => __( 'Select Tag Icon' ), - 'change' => __( 'Change Tag Icon' ), - 'remove' => __( 'Remove' ), - 'frame_title' => __( 'Select Tag Icon' ), - 'frame_button' => __( 'Choose Tag Icon' ), - ), - ) - ) - ); - - $wp_customize->selective_refresh->add_partial( - 'fsmsp_options[fsmsp_tag_icon]', - array( - 'selector' => 'span.fsmsp-tag-image', - 'settings' => array( 'fsmsp_options[fsmsp_tag_icon]' ), - 'render_callback' => 'full_screen_morphing_search_tag_icon', - ) - ); - - // ================================ - // = FSMS Tag Icon/Image Classes. = - // ================================ - $wp_customize->add_setting( - 'fsmsp_options[fsmsp_tag_i_classes]', - array( - 'default' => true, - 'type' => 'option', - 'transport' => 'postMessage', - 'sanitize_callback' => 'wp_validate_boolean', - ) - ); - - $wp_customize->add_control( - 'fsmsp_options[fsmsp_tag_i_classes]', - array( - 'label' => __( 'Tag Icon/Image Round or Not ?!', 'full-screen-morphing-search' ), - 'section' => 'fsmsp_icons', - 'settings' => 'fsmsp_options[fsmsp_tag_i_classes]', - 'type' => 'checkbox', - ) - ); - - $wp_customize->selective_refresh->add_partial( - 'fsmsp_options[fsmsp_tag_i_classes]', - array( - 'selector' => 'span.fsmsp-tag-image', - 'settings' => array( 'fsmsp_options[fsmsp_tag_i_classes]' ), - 'render_callback' => 'full_screen_morphing_search_tag_icon', - ) - ); - -} -add_action( 'customize_register', 'full_screen_morphing_search_customize_register' ); - -/** - * Render article icon for the selective refresh partial. - */ -function full_screen_morphing_search_article_icon() { - $image_url = get_option( 'fsmsp_options' )['fsmsp_article_icon']; - $attachment_id = attachment_url_to_postid( $image_url ); // Tries to convert an attachment URL into a post ID. - $article_i_classes = get_option( 'fsmsp_options' )['fsmsp_article_i_classes']; - $classes = ''; - if ( ! empty( $article_i_classes ) ) { - $classes = 'round fsmsp-article-icon'; - } else { - $classes = 'fsmsp-article-icon'; - } - echo wp_get_attachment_image( $attachment_id, 'thumbnail', '', array( 'class' => $classes ) ); // Get an HTML img element representing an image attachment. -} - -/** - * Render category icon for the selective refresh partial. - */ -function full_screen_morphing_search_category_icon() { - $imagecat_url = get_option( 'fsmsp_options' )['fsmsp_category_icon']; - $attachmentcat_id = attachment_url_to_postid( $imagecat_url ); - $category_i_classes = get_option( 'fsmsp_options' )['fsmsp_category_i_classes']; - $classes = ''; - if ( ! empty( $category_i_classes ) ) { - $classes = 'round fsmsp-category-icon'; - } else { - $classes = 'fsmsp-category-icon'; - } - echo wp_get_attachment_image( $attachmentcat_id, 'thumbnail', '', array( 'class' => $classes ) ); -} - -/** - * Render tag icon for the selective refresh partial. - */ -function full_screen_morphing_search_tag_icon() { - $imagetag_url = get_option( 'fsmsp_options' )['fsmsp_tag_icon']; - $attachmenttag_id = attachment_url_to_postid( $imagetag_url ); - $tag_i_classes = get_option( 'fsmsp_options' )['fsmsp_tag_i_classes']; - $classes = ''; - if ( ! empty( $tag_i_classes ) ) { - $classes = 'round fsmsp-tag-icon'; - } else { - $classes = 'fsmsp-tag-icon'; - } - echo wp_get_attachment_image( $attachmenttag_id, 'thumbnail', '', array( 'class' => $classes ) ); -}