[ // 'default' config 'engine' => 'default', // Search engine to use (if SearchWP is available). 'input' => [ 'delay' => 300, // Impose delay (in milliseconds) before firing a search. 'min_chars' => 3, // Wait for at least 3 characters before triggering a search. ], 'results' => [ 'position' => 'bottom', // Where to position the results (bottom|top). 'width' => 'auto', // Whether the width should automatically match the input (auto|css). 'offset' => [ 'x' => 0, // X offset (in pixels). 'y' => 5, // Y offset (in pixels). ], ], 'spinner' => [ // Powered by https://spin.js.org/. 'lines' => 12, // The number of lines to draw. 'length' => 8, // The length of each line. 'width' => 3, // The line thickness. 'radius' => 8, // The radius of the inner circle. 'scale' => 1, // Scales overall size of the spinner. 'corners' => 1, // Corner roundness (0..1). 'color' => '#424242', // CSS color or array of colors. 'fadeColor' => 'transparent', // CSS color or array of colors. 'speed' => 1, // Rounds per second. 'rotate' => 0, // The rotation offset. 'animation' => 'searchwp-spinner-line-fade-quick', // The CSS animation name for the lines. 'direction' => 1, // 1: clockwise, -1: counterclockwise 'zIndex' => 2e9, // The z-index (defaults to 2000000000). 'className' => 'spinner', // The CSS class to assign to the spinner. 'top' => '50%', // Top position relative to parent. 'left' => '50%', // Left position relative to parent. 'shadow' => '0 0 1px transparent', // Box-shadow for the lines. 'position' => 'absolute', // Element positioning. ], ], ]; /** * Equivalent of __construct() — implement our hooks. * * @since 1.0 * * @uses add_action() to trigger asset enqueue and output base styles in the footer * @uses add_filter() to filter search forms generated by get_search_form() * @uses apply_filters() to ensure developer can filter the configs array via searchwp_live_search_configs filter */ public function setup() { $this->apply_settings(); $this->hooks(); // The configs store all the various configuration arrays that can be used at runtime. $this->configs = apply_filters( 'searchwp_live_search_configs', $this->configs ); } /** * Hooks. * * @since 1.7.0 */ private function hooks() { add_action( 'wp_enqueue_scripts', [ $this, 'assets' ] ); add_filter( 'get_search_form', [ $this, 'get_search_form' ], 999, 1 ); add_action( 'wp_footer', [ $this, 'base_styles' ] ); // Gutenberg integration. add_action( 'wp_footer', [ $this, 'gutenberg_integration' ] ); } /** * Apply settings to the form. * * @since 1.7.0 */ private function apply_settings() { $settings_api = searchwp_live_search()->get( 'Settings_Api' ); if ( ! $settings_api->get( 'enable-live-search' ) ) { add_filter( 'searchwp_live_search_hijack_get_search_form', '__return_false' ); add_filter( 'searchwp_live_search_hijack_search_form_block', '__return_false' ); } $include_css = $settings_api->get( 'include-frontend-css' ); if ( $include_css === 'position' ) { $this->dequeue_styles(); } if ( $include_css === 'none' ) { $this->dequeue_styles(); $this->dequeue_base_styles(); } $this->configs['default']['results']['position'] = $settings_api->get( 'results-pane-position' ); $this->configs['default']['results']['width'] = empty( $settings_api->get( 'results-pane-auto-width' ) ) ? 'css' : 'auto'; } /** * Dequeue visual form styles. * * @since 1.7.0 */ private function dequeue_styles() { add_action( 'wp_enqueue_scripts', function () { wp_dequeue_style( 'searchwp-live-search' ); }, 20 ); } /** * Dequeue base (positioning) form styles. * * @since 1.7.0 */ private function dequeue_base_styles() { add_filter( 'searchwp_live_search_base_styles', '__return_false' ); } /** * Take over search blocks by adding body class. * * @since 1.0 */ public function gutenberg_integration() { if ( ! apply_filters( 'searchwp_live_search_hijack_search_form_block', true ) ) { return; } $engine = apply_filters( 'searchwp_live_search_get_search_form_engine', 'default' ); $config = apply_filters( 'searchwp_live_search_get_search_form_config', 'default' ); // Allow for block-specific. $engine = apply_filters( 'searchwp_live_search_get_search_form_engine_blocks', $engine ); $config = apply_filters( 'searchwp_live_search_get_search_form_config_blocks', $config ); ?> esc_url( $ajaxurl ), 'origin_id' => get_queried_object_id(), 'config' => $this->configs, 'msg_no_config_found' => esc_html__( 'No valid SearchWP Live Search configuration found!', 'searchwp-live-ajax-search' ), 'aria_instructions' => esc_html__( 'When autocomplete results are available use up and down arrows to review and enter to go to the desired page. Touch device users, explore by touch or with swipe gestures.' , 'searchwp-live-ajax-search' ), ]; // We need to JSON encode the configs. $encoded_data = [ 'l10n_print_after' => 'searchwp_live_search_params = ' . wp_json_encode( $params ) . ';', ]; // Localize and enqueue the script with all of the variable goodness. wp_localize_script( 'swp-live-search-client', 'searchwp_live_search_params', $encoded_data ); wp_enqueue_script( 'swp-live-search-client' ); } /** * Callback to the get_search_form filter, allows us to automagically enable live search on form fields * generated using get_search_form(). * * @since 1.0 * * @param string $html The generated markup for the search form. * * @uses apply_filters() to allow devs to disable this functionality * @uses apply_filters() to allow devs to set the default SearchWP search engine * @uses apply_filters() to allow devs to set the default config to use * @uses str_replace() to inject our HTML5 data attributes where we want them * @uses esc_attr() to escape the search engine and config name * * @return string Markup for the search form */ public function get_search_form( $html ) { if ( ! apply_filters( 'searchwp_live_search_hijack_get_search_form', true ) ) { return $html; } $engine = apply_filters( 'searchwp_live_search_get_search_form_engine', 'default' ); $config = apply_filters( 'searchwp_live_search_get_search_form_config', 'default' ); // We're going to use 'name="s"' as our anchor for replacement. $html = str_replace( 'name="s"', 'name="s" data-swplive="true" data-swpengine="' . esc_attr( $engine ) . '" data-swpconfig="' . esc_attr( $config ) . '"', $html ); return $html; } /** * Output the base styles (absolutely minimal) necessary to properly set up the results wrapper. * * @since 1.0 * * @uses apply_filters() to allow devs to disable this functionality */ public function base_styles() { if ( ! apply_filters( 'searchwp_live_search_base_styles', true ) ) { return; } ?>