PluginProbe ʕ •ᴥ•ʔ
Widget Options – Advanced Conditional Visibility for Gutenberg Blocks & Classic Widgets / 3.7.13
Widget Options – Advanced Conditional Visibility for Gutenberg Blocks & Classic Widgets v3.7.13
4.2.5 4.2.4 trunk 3.7.10 3.7.11 3.7.12 3.7.13 3.7.14 3.7.2 3.7.5 3.7.6 3.7.7 3.7.8 3.7.9 3.8 3.8.1 3.8.10 3.8.2 3.8.3 3.8.4 3.8.5 3.8.6 3.8.7 3.8.8 3.8.9 3.8.9.1 3.9.0 3.9.1 3.9.2 3.9.3 3.9.4 3.9.5 3.9.6 4.0.0 4.0.1 4.0.2 4.0.3 4.0.4 4.0.5 4.0.5.1 4.0.6 4.0.6.1 4.0.7 4.0.8 4.0.9 4.1.0 4.1.1 4.1.2 4.1.3 4.2.0 4.2.1 4.2.2 4.2.3
widget-options / assets / js / wpWidgetOpts.js
widget-options / assets / js Last commit date
jquery.liveFilter.js 4 years ago jquery.liveFilter.min.js 4 years ago jquery.widgetopts.beaver.js 4 years ago jquery.widgetopts.beaver.min.js 4 years ago select2-settings.js 4 years ago select2-settings.min.js 4 years ago select2.min.js 4 years ago settings.js 4 years ago settings.min.js 4 years ago widgets.js 4 years ago widgets.min.js 4 years ago wpWidgetOpts.js 4 years ago wpWidgetOpts.min.js 4 years ago
wpWidgetOpts.js
422 lines
1 /*global ajaxurl, isRtl */
2 var wpWidgetOpts;
3 (function($) {
4 var $document = $( document );
5
6 wpWidgetOpts = {
7 /**
8 * A closed Sidebar that gets a Widget dragged over it.
9 *
10 * @var element|null
11 */
12 hoveredSidebar: null,
13
14 init : function() {
15 var self = this,
16 title = $( '.wp-admin.widgets-php .wrap a.page-title-action' ),
17 tabs = $( '.extended-widget-opts-tabs' ),
18 chooser = $( '.widgetsopts-chooser' ),
19 selectSidebar = chooser.find( '.widgetopts-chooser-sidebars' );
20 // ta = chooser.find('.widgets-chooser-sidebars'),
21 // sidebars = $('div.widgets-sortables'),
22 // isRTL = !! ( 'undefined' !== typeof isRtl && isRtl );
23
24 if( tabs.length > 0 ){
25 self.loaded( '', 'loaded' );
26 }
27
28 //runs on customizer
29 $( '.widget-liquid-right .widget, .inactive-sidebar .widget, #accordion-panel-widgets .customize-control-widget_form' ).each(function (i, widget) {
30 self.loaded( '', 'loaded' );
31 });
32
33 //fires when widget added
34 $document.on( 'widget-added', function( event, widget ) {
35 self.loaded( widget, 'added' );
36 });
37
38 //fires when widget updated
39 $document.on( 'widget-updated', function( event, widget ) {
40 self.loaded( widget, 'updated' );
41 });
42
43 //toggle accordions
44 $document.on( 'click', '.extended-widget-opts-inner-lists h4',function(){
45 var getid = $(this).attr('id');
46 $( '.extended-widget-opts-inner-lists .'+ getid ).slideToggle(250);
47 } );
48
49 //toggle widget logic notice
50 $document.on( 'click', '.widget-opts-toggler-note',function(e){
51 $( this ).parent( 'p' ).parent( '.widget-opts-logic' ).find( '.widget-opts-toggle-note' ).slideToggle( 250 );
52 e.preventDefault();
53 e.stopPropagation();
54 } );
55
56 //add link to settings page on title
57 if( title.length > 0 ){
58 title.after('<a href="'+ widgetopts10n.opts_page +'" class="page-title-action hide-if-no-customize">'+ widgetopts10n.translation.manage_settings +'</a>');
59 }
60
61 //live search filter
62 self.live_search();
63
64 //append move and clone button to .widget-control-actions
65 $( '.widget-control-actions .alignleft .widget-control-remove' ).after( widgetopts10n.controls );
66
67 //chooser for move and clone action
68 self.do_chooser( chooser, selectSidebar );
69
70 //add sidebar options
71 self.sidebarOptions();
72 self.removeSidebarWidgets();
73
74 },
75 loaded : function( widget, action ){
76 var widget_id,
77 selected = 0,
78 selected_styling = 0,
79 selected_main = 0,
80 selected_visibility = 0,
81 selected_settings = 0,
82 in_customizer = false,
83 tabs = '.extended-widget-opts-tabs',
84 styling_tabs = '.extended-widget-opts-styling-tabs',
85 visibility_main = '.extended-widget-opts-visibility-m-tabs',
86 visibility_tabs = '.extended-widget-opts-visibility-tabs',
87 settings_tabs = '.extended-widget-opts-settings-tabs',
88 selectedtab = '#extended-widget-opts-selectedtab',
89 selectedstyling = '#extended-widget-opts-styling-selectedtab',
90 selectedmain = '#extended-widget-opts-visibility-m-selectedtab',
91 selectedvisibility = '#extended-widget-opts-visibility-selectedtab',
92 selectedsettings = '#extended-widget-opts-settings-selectedtab';
93
94 // check for wp.customize return boolean
95 if ( typeof wp !== 'undefined' ) {
96 in_customizer = typeof wp.customize !== 'undefined' ? true : false;
97 }
98 if( '' != widget ){
99 widget_id = '#' + widget.attr('id');
100
101 if( $( widget_id ).find( selectedtab ).length > 0 ){
102 selected = $( '#' + widget.attr('id') ).find( selectedtab ).val();
103 selected = parseInt( selected );
104 }
105
106 if( $( widget_id ).find( selectedvisibility ).length > 0 ){
107 selected_visibility = $( '#' + widget.attr('id') ).find( selectedvisibility ).val();
108 selected_visibility = parseInt( selected_visibility );
109 }
110
111 if( $( widget_id ).find( selectedmain ).length > 0 ){
112 selected_main = $( '#' + widget.attr('id') ).find( selectedmain ).val();
113 selected_main = parseInt( selected_main );
114 }
115
116 if( $( widget_id ).find( selectedsettings ).length > 0 ){
117 selected_settings = $( '#' + widget.attr('id') ).find( selectedsettings ).val();
118 selected_settings = parseInt( selected_settings );
119 }
120 // console.log( in_customizer );
121 }
122 if( action == 'added' ){
123 selected = 0;
124 selected_main = 0,
125 selected_visibility = 0;
126 selected_settings = 0;
127 }
128
129 if( '' != widget ){
130 if( $( widget_id ).find( tabs ).length > 0 ){
131 $( widget_id ).find( tabs ).tabs({ active: selected });
132 }
133 if( $( widget_id ).find( visibility_main ).length > 0 ){
134 $( widget_id ).find( visibility_main ).tabs({ active: selected_main });
135 }
136 if( $( widget_id ).find( visibility_tabs ).length > 0 ){
137 $( widget_id ).find( visibility_tabs ).tabs({ active: selected_visibility });
138 }
139 if( $( widget_id ).find( settings_tabs ).length > 0 ){
140 $( widget_id ).find( settings_tabs ).tabs({ active: selected_settings });
141 }
142 }else{
143 $( tabs ).tabs({ active: selected });
144 $( styling_tabs ).tabs({ active: selected_styling });
145 $( visibility_main ).tabs({ active: selected_main });
146 $( visibility_tabs ).tabs({ active: selected_visibility });
147 $( settings_tabs ).tabs({ active: selected_settings });
148 }
149
150 $( tabs ).click('tabsselect', function (event, ui) {
151 if( $(this).find( selectedtab ).length > 0 ){
152 $(this).find( selectedtab ).val( $(this).tabs('option', 'active') );
153 }
154 });
155
156 $( visibility_tabs ).click('tabsselect', function (event, ui) {
157 if( $(this).find( selectedvisibility ).length > 0 ){
158 $(this).find( selectedvisibility ).val( $(this).tabs('option', 'active') );
159 }
160 });
161
162 $( visibility_main ).click('tabsselect', function (event, ui) {
163 if( $(this).find( selectedmain ).length > 0 ){
164 $(this).find( selectedmain ).val( $(this).tabs('option', 'active') );
165 }
166 });
167
168 $( settings_tabs ).click('tabsselect', function (event, ui) {
169 if( $(this).find( selectedsettings ).length > 0 ){
170 $(this).find( selectedsettings ).val( $(this).tabs('option', 'active') );
171 }
172 });
173 },
174 live_search : function(){
175 if ( typeof $.fn.liveFilter !== 'undefined' && $( '#widgetopts-widgets-search' ).length > 0 ) {
176 // Add separator to distinguish between visible and hidden widgets
177 $('.widget:last-of-type').after('<div class="widgetopts-separator" />');
178
179 // Add data attribute for order to each widget
180 $('#widgets-left .widget').each(function() {
181 var index = $(this).index() + 1;
182 $(this).attr( 'data-widget-index', index );
183 });
184
185 // Add liveFilter : credits to https://wordpress.org/plugins/widget-search-filter/ plugin
186 $('#widgets-left').liveFilter('#widgetopts-widgets-search', '.widget', {
187 filterChildSelector: '.widget-title h4, .widget-title h3',
188 after: function(contains, containsNot) {
189
190 // Move all hidden widgets to end.
191 containsNot.each(function() {
192 $(this).insertAfter($(this).parent().find('.widgetopts-separator'));
193 });
194
195 // Sort all visible widgets by original index
196 contains.sort(function(a,b) {
197 return a.getAttribute('data-widget-index') - b.getAttribute('data-widget-index');
198 });
199
200 // Move all visible back
201 contains.each(function() {
202 $(this).insertBefore($(this).parent().find('.widgetopts-separator'));
203 });
204
205 }
206 });
207
208 //add clear search
209 $( '#wpbody-content' ).on( 'keyup', '.widgetopts-widgets-search', function(e){
210 p = $(this).parent().find( '.widgetopts-clear-results' );
211 if ( '' !== $(this).val() ) {
212 p.addClass( 'widgetopts-is-visible' );
213 }else{
214 p.removeClass( 'widgetopts-is-visible' );
215 }
216 } );
217
218 $( '#wpbody-content' ).on( 'click', '.widgetopts-clear-results', function(e){
219 s = $(this).parent().find( '.widgetopts-widgets-search' );
220 s.val( '' ).focus().trigger( 'keyup' );
221
222 if( s.attr( 'id' ) == 'widgetopts-search-chooser' ){
223 $( '.widgets-chooser-sidebars li:not(:first)' ).removeClass( 'widgets-chooser-selected' );
224 }else if( s.hasClass('widgetsopts-widgets-search') ){
225 $( '.widgetopts-chooser-sidebars li:not(:first)' ).removeClass( 'widgetopts-chooser-selected' );
226 }
227
228 e.preventDefault();
229 e.stopPropagation();
230 return false;
231 } );
232
233 //add sidebar chooser search field
234 $('.widgets-chooser').prepend( widgetopts10n.search_form );
235 //live filter
236 $('.widgets-chooser').liveFilter('#widgetopts-search-chooser', '.widgets-chooser-sidebars li', {
237 // filterChildSelector: 'li',
238 after: function( contains, containsNot ) {
239 //hide
240 containsNot.each(function() {
241 $(this).addClass( 'widgetopts-is-hidden' ).removeClass( 'widgets-chooser-selected' );
242 });
243 contains.each(function() {
244 $(this).removeClass( 'widgetopts-is-hidden' ).removeClass( 'widgets-chooser-selected' );
245 });
246 if( contains.length > 0 ){
247 $( contains[0] ).addClass( 'widgets-chooser-selected' );
248 }
249
250 }
251 });
252
253 }
254 },
255 do_chooser : function( chooser, selectSidebar ){
256 var self = this;
257
258 //add sidebar lists on chooser
259 $( '#widgets-right .widgets-holder-wrap' ).each( function( index, element ) {
260 var $element = $( element ),
261 name = $element.find( '.sidebar-name h2' ).text(),
262 id = $element.find( '.widgets-sortables' ).attr( 'id' ),
263 li = $('<li tabindex="0">').text(name.trim());
264
265 if ( index === 0 ) {
266 li.addClass( 'widgetopts-chooser-selected' );
267 }
268
269 selectSidebar.append( li );
270 li.attr( 'data-sidebarId', id );
271 });
272
273 //do click
274 $document.on( 'click', '.widgetopts-control', function(e){
275 var lbl = $(this).text(),
276 action = $( this ).attr( 'data-action' );
277
278 if( $(this).hasClass( 'widgetopts-control-open' ) ){
279 self.closeChooser();
280 $( '.widgetopts-control-open' ).removeClass( 'widgetopts-control-open' );
281 }else{
282
283 chooser.find( '.widgetopts-chooser-action span' ).text( lbl );
284 chooser.find( '.widgetopts-chooser-action' ).attr( 'data-action', action );
285 $(this).parents('.widget-control-actions').find('.clear').after( chooser );
286
287 chooser.slideDown( 300, function() {
288 selectSidebar.find('.widgets-chooser-selected').focus();
289 });
290 $( '.widgetopts-control-open' ).removeClass( 'widgetopts-control-open' );
291 $(this).addClass( 'widgetopts-control-open' );
292
293 self.chooserSearch();
294 }
295
296 e.preventDefault();
297 } );
298
299 //add selected on click
300 $document.on( 'click', '.widgetopts-chooser-sidebars li', function(e){
301 selectSidebar.find('.widgetopts-chooser-selected').removeClass( 'widgetopts-chooser-selected' );
302 $(this).addClass( 'widgetopts-chooser-selected' );
303 } );
304
305 //do action
306 $document.on( 'click', '.widgetsopts-chooser .widgetopts-chooser-action', function(e){
307 var $container = $( 'html,body' ),
308 $action = $( this ).attr( 'data-action' ),
309 parentSidebar = $( this ).parents('.widgets-sortables').attr('id'),
310 widgetID = $( this ).parents('.widget').attr('id'),
311 $widget = $( '#'+ widgetID );
312 sidebarID = $( '.widgetopts-chooser-selected' ).attr('data-sidebarId');
313 // console.log( $action + ' ' + parentSidebar +' ' + widgetID + ' ' + sidebarID);
314 //remove chooser
315 $( '#'+ widgetID + ' .widgetsopts-chooser' ).remove();
316 $widget.find(' .widgetopts-control-open' ).removeClass( 'widgetopts-control-open' );
317
318 switch ( $action ) {
319 case 'move':
320 $( '#' + parentSidebar ).find( '#' + widgetID ).appendTo( '#' + sidebarID );
321
322 $('#' + sidebarID).sortable('refresh');
323 $widget.addClass( 'widgetopts-move-ds' );
324 $( '#' + sidebarID ).parent('.widgets-holder-wrap').removeClass( 'closed' );
325 wpWidgets.save( $( '#' + widgetID ), 0, 0, 1 );
326 break;
327 default:
328 break;
329
330 }
331
332 var $scrollTo = $( '.widgetopts-move-ds' );
333
334 $container.animate({ scrollTop: $scrollTo.offset().top - ( $container.offset().top + $container.scrollTop() + 60 ) }, 200 );
335 $( '.widgetopts-move-ds' ).removeClass( '.widgetopts-move-ds' );
336 e.preventDefault();
337 } );
338
339 //cancel chooser
340 $document.on( 'click', '.widgetsopts-chooser .widgetsopts-chooser-cancel', function(e){
341 self.closeChooser( chooser );
342 e.preventDefault();
343 } );
344 },
345 closeChooser : function( chooser ) {
346 var self = this;
347
348 $( '.widgetsopts-chooser' ).slideUp( 200, function() {
349 $( '.widgetopts-control' ).removeClass( 'widgetopts-control-open' );
350 $( '#wpbody-content' ).append( this );
351 });
352 },
353 chooserSearch : function(){
354 //add livefilter
355 if( $( '#widgetsopts-widgets-search' ).length > 0 ){
356 $('.widgetsopts-chooser').liveFilter('#widgetsopts-widgets-search', '.widgetopts-chooser-sidebars li', {
357 // filterChildSelector: 'li',
358 after: function( contains, containsNot ) {
359 //hide
360 containsNot.each(function() {
361 $(this).addClass( 'widgetopts-is-hidden' ).removeClass( 'widgetopts-chooser-selected' );
362 });
363 contains.each(function() {
364 $(this).removeClass( 'widgetopts-is-hidden' ).removeClass( 'widgetopts-chooser-selected' );
365 });
366 if( contains.length > 0 ){
367 $( contains[0] ).addClass( 'widgetopts-chooser-selected' );
368 }
369
370 }
371 });
372 }
373 },
374 sidebarOptions : function(){
375 var self = this;
376 if( widgetopts10n.sidebaropts.length > 0 ){
377 $( '#widgets-right .widgets-holder-wrap' ).each( function( index, element ) {
378 var sidebar_opts_h2 = $(this).find('.widgets-sortables h2').text();
379 dl_link = widgetopts10n.sidebaropts.replace( '__sidebaropts__', $(this).find('.widgets-sortables').attr('id') );
380 dl_link = dl_link.replace( '__sidebar_opts__', sidebar_opts_h2.trim() );
381 $(this).append( dl_link );
382 });
383 }
384 },
385 removeSidebarWidgets : function(){
386 var self = this;
387 var $container = $( 'html,body' );
388 $document.on( 'click', '.sidebaropts-clear', function(e){
389 //show confirmation
390 $(this).parent().find( '.sidebaropts-confirm' ).addClass( 'sidebaropts-confirmed' );
391 $(this).parent().find( '.sidebaropts-confirm' ).slideToggle(250);
392
393 e.preventDefault();
394 });
395
396 $document.on( 'click', '.sidebaropts-confirmed .button', function(e){
397 sidebar_id = $(this).parent().parent().parent().find('.widgets-sortables');
398
399 if( $(this).hasClass( 'button-primary' ) ){
400 var $scrollTo = sidebar_id;
401
402 $(this).parent().slideToggle(50);
403 $container.animate({ scrollTop: $scrollTo.offset().top - 50 }, 200 );
404
405 sidebar_id.find( '.widget' ).each( function( index, element ) {
406 $( element ).fadeOut();
407 wpWidgets.save( $( element ), 1, 1, 0 );
408 });
409
410 }else{
411 $(this).parent().slideToggle(250);
412 }
413
414 e.preventDefault();
415 });
416 }
417 };
418
419 $document.ready( function(){ wpWidgetOpts.init(); } );
420
421 })(jQuery);
422