Customizer Search - Version 1.0.0

Version Description

  • Initial Release
Download this release

Release Info

Developer Nikschavan
Plugin Icon 128x128 Customizer Search
Version 1.0.0
Comparing to
See all releases

Version 1.0.0

Files changed (8) hide show
  1. assets/css/customizer-search-admin.css +20 -0
  2. assets/js/customizer-search-admin.js +156 -0
  3. class-bsf-customizer-search.php +72 -0
  4. class-customizer-search.php +72 -0
  5. customizer-search.php +23 -0
  6. languages/customizer-search.pot +58 -0
  7. readme.txt +26 -0
  8. templates/admin-customize-js-templates.php +41 -0
assets/css/customizer-search-admin.css ADDED
@@ -0,0 +1,20 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ .search-input {
2
+ display: block;
3
+ margin-bottom: 8px;
4
+ }
5
+
6
+ .customizer-search-section {
7
+ padding: 10px;
8
+ }
9
+
10
+ .customizer-search-input {
11
+ width: 75%
12
+ }
13
+
14
+ .customizer-search-section {
15
+ padding: 10px;
16
+ }
17
+
18
+ .customize-pane-parent {
19
+ overflow: inherit;
20
+ }
assets/js/customizer-search-admin.js ADDED
@@ -0,0 +1,156 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ /**
2
+ * Customizer Admin JS
3
+ *
4
+ * @since 1.0.0
5
+ * @package Customizer_Search
6
+ */
7
+
8
+ ( function( $ ) {
9
+
10
+ /**
11
+ * Selector for the search field
12
+ * @type {String}
13
+ */
14
+ var searchInputSelector = '#customizer-search-input';
15
+
16
+ /**
17
+ * Handles logic for the admin customize interface.
18
+ *
19
+ * @class CustomizerSearchAdmin
20
+ * @since 1.0.0
21
+ */
22
+ CustomizerSearchAdmin = {
23
+
24
+ /**
25
+ * Initializes the admin customize interface.
26
+ *
27
+ * @since 1.0.0
28
+ * @access private
29
+ * @method _init
30
+ */
31
+ _init: function()
32
+ {
33
+ this._bind();
34
+ var searchArray = this._searchArray(),
35
+ sections = _wpCustomizeSettings.sections;
36
+
37
+ $(document).on('keyup', searchInputSelector, function(event) {
38
+ event.preventDefault();
39
+ $this = $( searchInputSelector );
40
+ string = $this.val();
41
+
42
+ if ( string.length > 2 ) {
43
+ CustomizerSearchAdmin._searchString( string, searchArray, sections );
44
+ } else {
45
+ $( 'li.accordion-section' ).removeClass('search-not-found').addClass('search-found');
46
+ $( 'li.accordion-panel' ).removeClass('search-not-found').addClass('search-found');
47
+ }
48
+
49
+ });
50
+
51
+ $( document ).on('click', '.clear-search', function(event) {
52
+ CustomizerSearchAdmin._clearSearch();
53
+ });
54
+ },
55
+
56
+ /**
57
+ * Binds admin customize events.
58
+ *
59
+ * @since 1.0.0
60
+ * @access private
61
+ * @method _bind
62
+ */
63
+ _bind: function()
64
+ {
65
+ wp.customize.previewer.targetWindow.bind( $.proxy( this._showHeaderFooterMessage, this ) );
66
+ },
67
+
68
+ /**
69
+ * Shows the message that is shown for when a header
70
+ * or footer is already set for this page.
71
+ *
72
+ * @since 1.0.0
73
+ * @access private
74
+ * @method _showHeaderFooterMessage
75
+ */
76
+ _showHeaderFooterMessage: function()
77
+ {
78
+ var template = wp.template( 'fl-theme-builder-header-footer-message' );
79
+
80
+ if( $( '#accordion-section-customizer-search' ).length == 0 ) {
81
+ $( '#accordion-section-themes' ).after( template() );
82
+ }
83
+ },
84
+
85
+ /**
86
+ * Search for key inside an array.
87
+ *
88
+ * @since 1.0.0
89
+ */
90
+ _searchArray: function()
91
+ {
92
+ searchArray = _wpCustomizeSettings.controls;
93
+
94
+ $.each(searchArray, function(index, val) {
95
+ // We are removing 'nav_menu_item' options from searchArray.
96
+ if (index.toLowerCase().indexOf("nav_menu_item") >= 0) {
97
+ delete searchArray[index];
98
+ }
99
+
100
+ // We are removing 'theme_' options from searchArray.
101
+ if (index.toLowerCase().indexOf("theme_") >= 0) {
102
+ delete searchArray[index];
103
+ }
104
+ });
105
+
106
+ return searchArray;
107
+ },
108
+
109
+ /**
110
+ * Searches for the string in the given source array.
111
+ *
112
+ * @since 1.0.0
113
+ * @param {String} key Key to be searched.
114
+ * @param {Array} sourceArray Array in which the key is to be searched.
115
+ * @param {Array} sections Section in the customizer.
116
+ */
117
+ _searchString: function( key, sourceArray, sections ) {
118
+ resultArray = []
119
+
120
+ $.each(sourceArray, function(index, val) {
121
+ if ( typeof val.label !== "undefined" ) {
122
+ if (val.label.toLowerCase().indexOf(key) >= 0) {
123
+ resultArray.push( sourceArray[index] );
124
+ }
125
+ }
126
+ });
127
+
128
+ $.each(resultArray, function(index, val) {
129
+ $found = $('li#accordion-section-' + val['section']);
130
+ $foundPanel = $('li#accordion-panel-' + sections[val['section']]['panel']);
131
+ $found.addClass('search-found');
132
+ $foundPanel.addClass('search-found');
133
+ $found.siblings('.control-section').removeClass('search-found').addClass('search-not-found');
134
+ $foundPanel.siblings('.control-section').removeClass('search-found').addClass('search-not-found');
135
+ });
136
+ },
137
+
138
+ /**
139
+ * Clear Search input and display all the options
140
+ *
141
+ * @since 1.0.0
142
+ * @access private
143
+ */
144
+ _clearSearch: function() {
145
+ $( '#customizer-search-input' ).val('');
146
+ $( 'li.accordion-section' ).removeClass('search-not-found').addClass('search-found');
147
+ $( 'li.accordion-panel' ).removeClass('search-not-found').addClass('search-found');
148
+
149
+ $( searchInputSelector ).focus();
150
+ }
151
+ };
152
+
153
+ // Initialize
154
+ $( function() { CustomizerSearchAdmin._init(); } );
155
+
156
+ } )( jQuery );
class-bsf-customizer-search.php ADDED
@@ -0,0 +1,72 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <?php
2
+ /**
3
+ * Initial Class for Customizer Search
4
+ *
5
+ * @since 1.0.0
6
+ * @package BSF_Customizer_Search
7
+ */
8
+
9
+ /**
10
+ * Handles Customizer logic for the theme builder.
11
+ *
12
+ * @since 1.0
13
+ */
14
+ class BSF_Customizer_Search {
15
+
16
+ /**
17
+ * Instance of BSF_Customizer_Search
18
+ *
19
+ * @var BSF_Customizer_Search
20
+ */
21
+ private static $instance;
22
+
23
+ /**
24
+ * Initiator
25
+ */
26
+ public static function instance() {
27
+
28
+ if ( ! isset( self::$instance ) ) {
29
+ self::$instance = new BSF_Customizer_Search();
30
+
31
+ self::$instance->hooks();
32
+ }
33
+
34
+ return self::$instance;
35
+ }
36
+
37
+ /**
38
+ * Initialize hooks.
39
+ *
40
+ * @since 1.0
41
+ * @return void
42
+ */
43
+ private function hooks() {
44
+ add_action( 'customize_controls_enqueue_scripts', array( $this, 'enqueue_scripts' ) );
45
+ add_action( 'customize_controls_print_footer_scripts', array( $this, 'footer_scripts' ) );
46
+ }
47
+
48
+ /**
49
+ * Enqueues scripts for the Customizer.
50
+ *
51
+ * @since 1.0
52
+ * @return void
53
+ */
54
+ public function enqueue_scripts() {
55
+ $slug = 'customizer-search-admin';
56
+
57
+ wp_enqueue_style( $slug, BSFCS_URL . 'assets/css/' . $slug . '.css', array(), BSFCS_VER );
58
+ wp_enqueue_script( $slug, BSFCS_URL . 'assets/js/' . $slug . '.js', array(), BSFCS_VER, true );
59
+ }
60
+
61
+ /**
62
+ * Renders the Customizer footer scripts.
63
+ *
64
+ * @since 1.0
65
+ * @return void
66
+ */
67
+ public function footer_scripts() {
68
+ include BSFCS_DIR . 'templates/admin-customize-js-templates.php';
69
+ }
70
+ }
71
+
72
+ BSF_Customizer_Search::instance();
class-customizer-search.php ADDED
@@ -0,0 +1,72 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <?php
2
+ /**
3
+ * Initial Class for Customizer Search
4
+ *
5
+ * @since 1.0.0
6
+ * @package Customizer_Search
7
+ */
8
+
9
+ /**
10
+ * Handles Customizer logic for the theme builder.
11
+ *
12
+ * @since 1.0
13
+ */
14
+ class Customizer_Search {
15
+
16
+ /**
17
+ * Instance of Customizer_Search
18
+ *
19
+ * @var Customizer_Search
20
+ */
21
+ private static $instance;
22
+
23
+ /**
24
+ * Initiator
25
+ */
26
+ public static function instance() {
27
+
28
+ if ( ! isset( self::$instance ) ) {
29
+ self::$instance = new Customizer_Search();
30
+
31
+ self::$instance->hooks();
32
+ }
33
+
34
+ return self::$instance;
35
+ }
36
+
37
+ /**
38
+ * Initialize hooks.
39
+ *
40
+ * @since 1.0
41
+ * @return void
42
+ */
43
+ private function hooks() {
44
+ add_action( 'customize_controls_enqueue_scripts', array( $this, 'enqueue_scripts' ) );
45
+ add_action( 'customize_controls_print_footer_scripts', array( $this, 'footer_scripts' ) );
46
+ }
47
+
48
+ /**
49
+ * Enqueues scripts for the Customizer.
50
+ *
51
+ * @since 1.0
52
+ * @return void
53
+ */
54
+ public function enqueue_scripts() {
55
+ $slug = 'customizer-search-admin';
56
+
57
+ wp_enqueue_style( $slug, CS_URL . 'assets/css/' . $slug . '.css', array(), CS_VER );
58
+ wp_enqueue_script( $slug, CS_URL . 'assets/js/' . $slug . '.js', array(), CS_VER, true );
59
+ }
60
+
61
+ /**
62
+ * Renders the Customizer footer scripts.
63
+ *
64
+ * @since 1.0
65
+ * @return void
66
+ */
67
+ public function footer_scripts() {
68
+ include CS_DIR . 'templates/admin-customize-js-templates.php';
69
+ }
70
+ }
71
+
72
+ Customizer_Search::instance();
customizer-search.php ADDED
@@ -0,0 +1,23 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <?php
2
+ /**
3
+ * Plugin Name: Customizer Search
4
+ * Plugin URI: https://github.com/Nikschavan/customizer-search
5
+ * Description: Search all the options in customizer.
6
+ * Author: Brainstorm Force
7
+ * Author URI: https://www.brainstormforce.com/
8
+ * Text Domain: customizer-search
9
+ * Domain Path: /languages
10
+ * Version: 1.0.0
11
+ *
12
+ * @package Customizer_Search
13
+ */
14
+
15
+ define( 'BSFCS_VER', '1.0.0' );
16
+ define( 'BSFCS_DIR', plugin_dir_path( __FILE__ ) );
17
+ define( 'BSFCS_URL', plugins_url( '/', __FILE__ ) );
18
+ define( 'BSFCS_PATH', plugin_basename( __FILE__ ) );
19
+
20
+ /**
21
+ * Load the plugin.
22
+ */
23
+ require_once 'class-bsf-customizer-search.php';
languages/customizer-search.pot ADDED
@@ -0,0 +1,58 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ # Copyright (C) 2017 Brainstorm Force
2
+ # This file is distributed under the same license as the Customizer Search package.
3
+ msgid ""
4
+ msgstr ""
5
+ "Project-Id-Version: Customizer Search 1.0.0\n"
6
+ "Report-Msgid-Bugs-To: "
7
+ "https://wordpress.org/support/plugin/customizer-search\n"
8
+ "POT-Creation-Date: 2017-07-29 10:22:15+00:00\n"
9
+ "MIME-Version: 1.0\n"
10
+ "Content-Type: text/plain; charset=utf-8\n"
11
+ "Content-Transfer-Encoding: 8bit\n"
12
+ "PO-Revision-Date: 2017-MO-DA HO:MI+ZONE\n"
13
+ "Last-Translator: FULL NAME <EMAIL@ADDRESS>\n"
14
+ "Language-Team: LANGUAGE <LL@li.org>\n"
15
+ "X-Generator: grunt-wp-i18n 0.5.4\n"
16
+ "X-Poedit-KeywordsList: "
17
+ "__;_e;_x:1,2c;_ex:1,2c;_n:1,2;_nx:1,2,4c;_n_noop:1,2;_nx_noop:1,2,3c;esc_"
18
+ "attr__;esc_html__;esc_attr_e;esc_html_e;esc_attr_x:1,2c;esc_html_x:1,2c;\n"
19
+ "Language: en\n"
20
+ "Plural-Forms: nplurals=2; plural=(n != 1);\n"
21
+ "X-Poedit-Country: United States\n"
22
+ "X-Poedit-SourceCharset: UTF-8\n"
23
+ "X-Poedit-Basepath: ../\n"
24
+ "X-Poedit-SearchPath-0: .\n"
25
+ "X-Poedit-Bookmarks: \n"
26
+ "X-Textdomain-Support: yes\n"
27
+
28
+ #: templates/admin-customize-js-templates.php:14
29
+ msgid "Search"
30
+ msgstr ""
31
+
32
+ #: templates/admin-customize-js-templates.php:16
33
+ msgid "Search..."
34
+ msgstr ""
35
+
36
+ #: templates/admin-customize-js-templates.php:17
37
+ msgid "Clear"
38
+ msgstr ""
39
+
40
+ #. Plugin Name of the plugin/theme
41
+ msgid "Customizer Search"
42
+ msgstr ""
43
+
44
+ #. Plugin URI of the plugin/theme
45
+ msgid "https://github.com/Nikschavan/customizer-search"
46
+ msgstr ""
47
+
48
+ #. Description of the plugin/theme
49
+ msgid "Search all the options in customizer."
50
+ msgstr ""
51
+
52
+ #. Author of the plugin/theme
53
+ msgid "Brainstorm Force"
54
+ msgstr ""
55
+
56
+ #. Author URI of the plugin/theme
57
+ msgid "https://www.brainstormforce.com/"
58
+ msgstr ""
readme.txt ADDED
@@ -0,0 +1,26 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ === Customizer Search Settings ===
2
+ Contributors: brainstormforce, Nikschavan
3
+ Donate link: https://www.paypal.me/BrainstormForce
4
+ Tags: customizer, search
5
+ Requires at least: 4.4
6
+ Tested up to: 4.8.1
7
+ Stable tag: 1.0.0
8
+ License: GPLv2 or later
9
+ License URI: http://www.gnu.org/licenses/gpl-2.0.html
10
+
11
+ Search all the options in customizer.
12
+
13
+ == Description ==
14
+
15
+ Search all the options in customizer.
16
+
17
+ == Installation ==
18
+
19
+ 1. Upload the plugin files to the `/wp-content/plugins/customizer-search` directory, or install the plugin through the WordPress plugins screen directly.
20
+ 1. Activate the plugin through the 'Plugins' screen in WordPress
21
+ 1. Search field will appear when in the customizer.
22
+
23
+ == Changelog ==
24
+
25
+ = 1.0.0 =
26
+ * Initial Release
templates/admin-customize-js-templates.php ADDED
@@ -0,0 +1,41 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <?php
2
+ /**
3
+ * Underscore js Template for adding customizer setting for customizer search.
4
+ *
5
+ * @since 1.0.0
6
+ * @package Customizer_Search
7
+ */
8
+
9
+ ?>
10
+
11
+ <script type="text/html" id="tmpl-fl-theme-builder-header-footer-message">
12
+ <div id="accordion-section-customizer-search" style="display: block;">
13
+ <h3 class="customizer-search-section accordion-section-title">
14
+ <span class="search-input"><?php _e( 'Search', 'customizer-search' ); ?></span>
15
+ <span class="search-field-wrapper">
16
+ <input type="text" placeholder="<?php _e( 'Search...', 'customizer-search' ); ?>" name="customizer-search-input" autofocus="autofocus" id="customizer-search-input" class="customizer-search-input">
17
+ <button type="button" class="button clear-search" tabindex="0"><?php _e( 'Clear', 'customizer-search' ); ?></button>
18
+ </span>
19
+
20
+ </h3>
21
+ </div>
22
+ <style type="text/css">
23
+ #accordion-section-customizer-search {
24
+ margin-bottom: 0;
25
+ }
26
+
27
+ #accordion-section-customizer-search .accordion-section-title:after{
28
+ content: none;
29
+ }
30
+
31
+ .search-not-found {
32
+ height: 0;
33
+ transition: height 0.3s ease-in-out;
34
+ }
35
+
36
+ .search-found {
37
+ height: 100%;
38
+ transition: height 0.3s ease-in-out;
39
+ }
40
+ </style>
41
+ </script>