mirror of
https://github.com/WordPress/WordPress.git
synced 2024-11-12 13:44:21 +01:00
956725990f
Depending on the amount of meta boxes and the layout settings under Screen Options, sortable meta boxes may not be actually sortable. In these cases, jQuery UI sortable needs to be disabled and the user interface shouldn't use a CSS `cursor: move`. The use of consistent and relevant cursors may be important for users who have a cognitive disability, since cursors give a visual clue as to an element's functionality. Using the move cursor for elements which cannot be moved may be confusing or counter-intuitive for users. Props adamsilverstein, antpb, anevins. Fixes #47131. Built from https://develop.svn.wordpress.org/trunk@46250 git-svn-id: http://core.svn.wordpress.org/trunk@46062 1a063a9b-81f0-0310-95a4-ce76da25c4cd
1649 lines
43 KiB
JavaScript
1649 lines
43 KiB
JavaScript
/**
|
|
* @output wp-admin/js/common.js
|
|
*/
|
|
|
|
/* global setUserSetting, ajaxurl, commonL10n, alert, confirm, pagenow */
|
|
/* global columns, screenMeta */
|
|
|
|
/**
|
|
* Adds common WordPress functionality to the window.
|
|
*
|
|
* @param {jQuery} $ jQuery object.
|
|
* @param {Object} window The window object.
|
|
* @param {mixed} undefined Unused.
|
|
*/
|
|
( function( $, window, undefined ) {
|
|
var $document = $( document ),
|
|
$window = $( window ),
|
|
$body = $( document.body );
|
|
|
|
/**
|
|
* Removed in 3.3.0, needed for back-compatibility.
|
|
*
|
|
* @since 2.7.0
|
|
* @deprecated 3.3.0
|
|
*/
|
|
window.adminMenu = {
|
|
init : function() {},
|
|
fold : function() {},
|
|
restoreMenuState : function() {},
|
|
toggle : function() {},
|
|
favorites : function() {}
|
|
};
|
|
|
|
// Show/hide/save table columns.
|
|
window.columns = {
|
|
|
|
/**
|
|
* Initializes the column toggles in the screen options.
|
|
*
|
|
* Binds an onClick event to the checkboxes to show or hide the table columns
|
|
* based on their toggled state. And persists the toggled state.
|
|
*
|
|
* @since 2.7.0
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
init : function() {
|
|
var that = this;
|
|
$('.hide-column-tog', '#adv-settings').click( function() {
|
|
var $t = $(this), column = $t.val();
|
|
if ( $t.prop('checked') )
|
|
that.checked(column);
|
|
else
|
|
that.unchecked(column);
|
|
|
|
columns.saveManageColumnsState();
|
|
});
|
|
},
|
|
|
|
/**
|
|
* Saves the toggled state for the columns.
|
|
*
|
|
* Saves whether the columns should be shown or hidden on a page.
|
|
*
|
|
* @since 3.0.0
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
saveManageColumnsState : function() {
|
|
var hidden = this.hidden();
|
|
$.post(ajaxurl, {
|
|
action: 'hidden-columns',
|
|
hidden: hidden,
|
|
screenoptionnonce: $('#screenoptionnonce').val(),
|
|
page: pagenow
|
|
});
|
|
},
|
|
|
|
/**
|
|
* Makes a column visible and adjusts the column span for the table.
|
|
*
|
|
* @since 3.0.0
|
|
* @param {string} column The column name.
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
checked : function(column) {
|
|
$('.column-' + column).removeClass( 'hidden' );
|
|
this.colSpanChange(+1);
|
|
},
|
|
|
|
/**
|
|
* Hides a column and adjusts the column span for the table.
|
|
*
|
|
* @since 3.0.0
|
|
* @param {string} column The column name.
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
unchecked : function(column) {
|
|
$('.column-' + column).addClass( 'hidden' );
|
|
this.colSpanChange(-1);
|
|
},
|
|
|
|
/**
|
|
* Gets all hidden columns.
|
|
*
|
|
* @since 3.0.0
|
|
*
|
|
* @returns {string} The hidden column names separated by a comma.
|
|
*/
|
|
hidden : function() {
|
|
return $( '.manage-column[id]' ).filter( '.hidden' ).map(function() {
|
|
return this.id;
|
|
}).get().join( ',' );
|
|
},
|
|
|
|
/**
|
|
* Gets the checked column toggles from the screen options.
|
|
*
|
|
* @since 3.0.0
|
|
*
|
|
* @returns {string} String containing the checked column names.
|
|
*/
|
|
useCheckboxesForHidden : function() {
|
|
this.hidden = function(){
|
|
return $('.hide-column-tog').not(':checked').map(function() {
|
|
var id = this.id;
|
|
return id.substring( id, id.length - 5 );
|
|
}).get().join(',');
|
|
};
|
|
},
|
|
|
|
/**
|
|
* Adjusts the column span for the table.
|
|
*
|
|
* @since 3.1.0
|
|
*
|
|
* @param {int} diff The modifier for the column span.
|
|
*/
|
|
colSpanChange : function(diff) {
|
|
var $t = $('table').find('.colspanchange'), n;
|
|
if ( !$t.length )
|
|
return;
|
|
n = parseInt( $t.attr('colspan'), 10 ) + diff;
|
|
$t.attr('colspan', n.toString());
|
|
}
|
|
};
|
|
|
|
$document.ready(function(){columns.init();});
|
|
|
|
/**
|
|
* Validates that the required form fields are not empty.
|
|
*
|
|
* @since 2.9.0
|
|
*
|
|
* @param {jQuery} form The form to validate.
|
|
*
|
|
* @returns {boolean} Returns true if all required fields are not an empty string.
|
|
*/
|
|
window.validateForm = function( form ) {
|
|
return !$( form )
|
|
.find( '.form-required' )
|
|
.filter( function() { return $( ':input:visible', this ).val() === ''; } )
|
|
.addClass( 'form-invalid' )
|
|
.find( ':input:visible' )
|
|
.change( function() { $( this ).closest( '.form-invalid' ).removeClass( 'form-invalid' ); } )
|
|
.length;
|
|
};
|
|
|
|
// stub for doing better warnings
|
|
/**
|
|
* Shows message pop-up notice or confirmation message.
|
|
*
|
|
* @since 2.7.0
|
|
*
|
|
* @type {{warn: showNotice.warn, note: showNotice.note}}
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
window.showNotice = {
|
|
|
|
/**
|
|
* Shows a delete confirmation pop-up message.
|
|
*
|
|
* @since 2.7.0
|
|
*
|
|
* @returns {boolean} Returns true if the message is confirmed.
|
|
*/
|
|
warn : function() {
|
|
var msg = commonL10n.warnDelete || '';
|
|
if ( confirm(msg) ) {
|
|
return true;
|
|
}
|
|
|
|
return false;
|
|
},
|
|
|
|
/**
|
|
* Shows an alert message.
|
|
*
|
|
* @since 2.7.0
|
|
*
|
|
* @param text The text to display in the message.
|
|
*/
|
|
note : function(text) {
|
|
alert(text);
|
|
}
|
|
};
|
|
|
|
/**
|
|
* Represents the functions for the meta screen options panel.
|
|
*
|
|
* @since 3.2.0
|
|
*
|
|
* @type {{element: null, toggles: null, page: null, init: screenMeta.init,
|
|
* toggleEvent: screenMeta.toggleEvent, open: screenMeta.open,
|
|
* close: screenMeta.close}}
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
window.screenMeta = {
|
|
element: null, // #screen-meta
|
|
toggles: null, // .screen-meta-toggle
|
|
page: null, // #wpcontent
|
|
|
|
/**
|
|
* Initializes the screen meta options panel.
|
|
*
|
|
* @since 3.2.0
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
init: function() {
|
|
this.element = $('#screen-meta');
|
|
this.toggles = $( '#screen-meta-links' ).find( '.show-settings' );
|
|
this.page = $('#wpcontent');
|
|
|
|
this.toggles.click( this.toggleEvent );
|
|
},
|
|
|
|
/**
|
|
* Toggles the screen meta options panel.
|
|
*
|
|
* @since 3.2.0
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
toggleEvent: function() {
|
|
var panel = $( '#' + $( this ).attr( 'aria-controls' ) );
|
|
|
|
if ( !panel.length )
|
|
return;
|
|
|
|
if ( panel.is(':visible') )
|
|
screenMeta.close( panel, $(this) );
|
|
else
|
|
screenMeta.open( panel, $(this) );
|
|
},
|
|
|
|
/**
|
|
* Opens the screen meta options panel.
|
|
*
|
|
* @since 3.2.0
|
|
*
|
|
* @param {jQuery} panel The screen meta options panel div.
|
|
* @param {jQuery} button The toggle button.
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
open: function( panel, button ) {
|
|
|
|
$( '#screen-meta-links' ).find( '.screen-meta-toggle' ).not( button.parent() ).css( 'visibility', 'hidden' );
|
|
|
|
panel.parent().show();
|
|
|
|
/**
|
|
* Sets the focus to the meta options panel and adds the necessary CSS classes.
|
|
*
|
|
* @since 3.2.0
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
panel.slideDown( 'fast', function() {
|
|
panel.focus();
|
|
button.addClass( 'screen-meta-active' ).attr( 'aria-expanded', true );
|
|
});
|
|
|
|
$document.trigger( 'screen:options:open' );
|
|
},
|
|
|
|
/**
|
|
* Closes the screen meta options panel.
|
|
*
|
|
* @since 3.2.0
|
|
*
|
|
* @param {jQuery} panel The screen meta options panel div.
|
|
* @param {jQuery} button The toggle button.
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
close: function( panel, button ) {
|
|
/**
|
|
* Hides the screen meta options panel.
|
|
*
|
|
* @since 3.2.0
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
panel.slideUp( 'fast', function() {
|
|
button.removeClass( 'screen-meta-active' ).attr( 'aria-expanded', false );
|
|
$('.screen-meta-toggle').css('visibility', '');
|
|
panel.parent().hide();
|
|
});
|
|
|
|
$document.trigger( 'screen:options:close' );
|
|
}
|
|
};
|
|
|
|
/**
|
|
* Initializes the help tabs in the help panel.
|
|
*
|
|
* @param {Event} e The event object.
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
$('.contextual-help-tabs').delegate('a', 'click', function(e) {
|
|
var link = $(this),
|
|
panel;
|
|
|
|
e.preventDefault();
|
|
|
|
// Don't do anything if the click is for the tab already showing.
|
|
if ( link.is('.active a') )
|
|
return false;
|
|
|
|
// Links
|
|
$('.contextual-help-tabs .active').removeClass('active');
|
|
link.parent('li').addClass('active');
|
|
|
|
panel = $( link.attr('href') );
|
|
|
|
// Panels
|
|
$('.help-tab-content').not( panel ).removeClass('active').hide();
|
|
panel.addClass('active').show();
|
|
});
|
|
|
|
/**
|
|
* Update custom permalink structure via buttons.
|
|
*/
|
|
var permalinkStructureFocused = false,
|
|
$permalinkStructure = $( '#permalink_structure' ),
|
|
$permalinkStructureInputs = $( '.permalink-structure input:radio' ),
|
|
$permalinkCustomSelection = $( '#custom_selection' ),
|
|
$availableStructureTags = $( '.form-table.permalink-structure .available-structure-tags button' );
|
|
|
|
// Change permalink structure input when selecting one of the common structures.
|
|
$permalinkStructureInputs.on( 'change', function() {
|
|
if ( 'custom' === this.value ) {
|
|
return;
|
|
}
|
|
|
|
$permalinkStructure.val( this.value );
|
|
|
|
// Update button states after selection.
|
|
$availableStructureTags.each( function() {
|
|
changeStructureTagButtonState( $( this ) );
|
|
} );
|
|
} );
|
|
|
|
$permalinkStructure.on( 'click input', function() {
|
|
$permalinkCustomSelection.prop( 'checked', true );
|
|
} );
|
|
|
|
// Check if the permalink structure input field has had focus at least once.
|
|
$permalinkStructure.on( 'focus', function( event ) {
|
|
permalinkStructureFocused = true;
|
|
$( this ).off( event );
|
|
} );
|
|
|
|
/**
|
|
* Enables or disables a structure tag button depending on its usage.
|
|
*
|
|
* If the structure is already used in the custom permalink structure,
|
|
* it will be disabled.
|
|
*
|
|
* @param {object} button Button jQuery object.
|
|
*/
|
|
function changeStructureTagButtonState( button ) {
|
|
if ( -1 !== $permalinkStructure.val().indexOf( button.text().trim() ) ) {
|
|
button.attr( 'data-label', button.attr( 'aria-label' ) );
|
|
button.attr( 'aria-label', button.attr( 'data-used' ) );
|
|
button.attr( 'aria-pressed', true );
|
|
button.addClass( 'active' );
|
|
} else if ( button.attr( 'data-label' ) ) {
|
|
button.attr( 'aria-label', button.attr( 'data-label' ) );
|
|
button.attr( 'aria-pressed', false );
|
|
button.removeClass( 'active' );
|
|
}
|
|
}
|
|
|
|
// Check initial button state.
|
|
$availableStructureTags.each( function() {
|
|
changeStructureTagButtonState( $( this ) );
|
|
} );
|
|
|
|
// Observe permalink structure field and disable buttons of tags that are already present.
|
|
$permalinkStructure.on( 'change', function() {
|
|
$availableStructureTags.each( function() {
|
|
changeStructureTagButtonState( $( this ) );
|
|
} );
|
|
} );
|
|
|
|
$availableStructureTags.on( 'click', function() {
|
|
var permalinkStructureValue = $permalinkStructure.val(),
|
|
selectionStart = $permalinkStructure[ 0 ].selectionStart,
|
|
selectionEnd = $permalinkStructure[ 0 ].selectionEnd,
|
|
textToAppend = $( this ).text().trim(),
|
|
textToAnnounce = $( this ).attr( 'data-added' ),
|
|
newSelectionStart;
|
|
|
|
// Remove structure tag if already part of the structure.
|
|
if ( -1 !== permalinkStructureValue.indexOf( textToAppend ) ) {
|
|
permalinkStructureValue = permalinkStructureValue.replace( textToAppend + '/', '' );
|
|
|
|
$permalinkStructure.val( '/' === permalinkStructureValue ? '' : permalinkStructureValue );
|
|
|
|
// Announce change to screen readers.
|
|
$( '#custom_selection_updated' ).text( textToAnnounce );
|
|
|
|
// Disable button.
|
|
changeStructureTagButtonState( $( this ) );
|
|
|
|
return;
|
|
}
|
|
|
|
// Input field never had focus, move selection to end of input.
|
|
if ( ! permalinkStructureFocused && 0 === selectionStart && 0 === selectionEnd ) {
|
|
selectionStart = selectionEnd = permalinkStructureValue.length;
|
|
}
|
|
|
|
$permalinkCustomSelection.prop( 'checked', true );
|
|
|
|
// Prepend and append slashes if necessary.
|
|
if ( '/' !== permalinkStructureValue.substr( 0, selectionStart ).substr( -1 ) ) {
|
|
textToAppend = '/' + textToAppend;
|
|
}
|
|
|
|
if ( '/' !== permalinkStructureValue.substr( selectionEnd, 1 ) ) {
|
|
textToAppend = textToAppend + '/';
|
|
}
|
|
|
|
// Insert structure tag at the specified position.
|
|
$permalinkStructure.val( permalinkStructureValue.substr( 0, selectionStart ) + textToAppend + permalinkStructureValue.substr( selectionEnd ) );
|
|
|
|
// Announce change to screen readers.
|
|
$( '#custom_selection_updated' ).text( textToAnnounce );
|
|
|
|
// Disable button.
|
|
changeStructureTagButtonState( $( this ) );
|
|
|
|
// If input had focus give it back with cursor right after appended text.
|
|
if ( permalinkStructureFocused && $permalinkStructure[0].setSelectionRange ) {
|
|
newSelectionStart = ( permalinkStructureValue.substr( 0, selectionStart ) + textToAppend ).length;
|
|
$permalinkStructure[0].setSelectionRange( newSelectionStart, newSelectionStart );
|
|
$permalinkStructure.focus();
|
|
}
|
|
} );
|
|
|
|
$document.ready( function() {
|
|
var checks, first, last, checked, sliced, mobileEvent, transitionTimeout, focusedRowActions,
|
|
lastClicked = false,
|
|
pageInput = $('input.current-page'),
|
|
currentPage = pageInput.val(),
|
|
isIOS = /iPhone|iPad|iPod/.test( navigator.userAgent ),
|
|
isAndroid = navigator.userAgent.indexOf( 'Android' ) !== -1,
|
|
isIE8 = $( document.documentElement ).hasClass( 'ie8' ),
|
|
$adminMenuWrap = $( '#adminmenuwrap' ),
|
|
$wpwrap = $( '#wpwrap' ),
|
|
$adminmenu = $( '#adminmenu' ),
|
|
$overlay = $( '#wp-responsive-overlay' ),
|
|
$toolbar = $( '#wp-toolbar' ),
|
|
$toolbarPopups = $toolbar.find( 'a[aria-haspopup="true"]' ),
|
|
$sortables = $('.meta-box-sortables'),
|
|
wpResponsiveActive = false,
|
|
$adminbar = $( '#wpadminbar' ),
|
|
lastScrollPosition = 0,
|
|
pinnedMenuTop = false,
|
|
pinnedMenuBottom = false,
|
|
menuTop = 0,
|
|
menuState,
|
|
menuIsPinned = false,
|
|
height = {
|
|
window: $window.height(),
|
|
wpwrap: $wpwrap.height(),
|
|
adminbar: $adminbar.height(),
|
|
menu: $adminMenuWrap.height()
|
|
},
|
|
$headerEnd = $( '.wp-header-end' );
|
|
|
|
/**
|
|
* Makes the fly-out submenu header clickable, when the menu is folded.
|
|
*
|
|
* @param {Event} e The event object.
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
$adminmenu.on('click.wp-submenu-head', '.wp-submenu-head', function(e){
|
|
$(e.target).parent().siblings('a').get(0).click();
|
|
});
|
|
|
|
/**
|
|
* Collapses the admin menu.
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
$( '#collapse-button' ).on( 'click.collapse-menu', function() {
|
|
var viewportWidth = getViewportWidth() || 961;
|
|
|
|
// reset any compensation for submenus near the bottom of the screen
|
|
$('#adminmenu div.wp-submenu').css('margin-top', '');
|
|
|
|
if ( viewportWidth < 960 ) {
|
|
if ( $body.hasClass('auto-fold') ) {
|
|
$body.removeClass('auto-fold').removeClass('folded');
|
|
setUserSetting('unfold', 1);
|
|
setUserSetting('mfold', 'o');
|
|
menuState = 'open';
|
|
} else {
|
|
$body.addClass('auto-fold');
|
|
setUserSetting('unfold', 0);
|
|
menuState = 'folded';
|
|
}
|
|
} else {
|
|
if ( $body.hasClass('folded') ) {
|
|
$body.removeClass('folded');
|
|
setUserSetting('mfold', 'o');
|
|
menuState = 'open';
|
|
} else {
|
|
$body.addClass('folded');
|
|
setUserSetting('mfold', 'f');
|
|
menuState = 'folded';
|
|
}
|
|
}
|
|
|
|
$document.trigger( 'wp-collapse-menu', { state: menuState } );
|
|
});
|
|
|
|
/**
|
|
* Handles the `aria-haspopup` attribute on the current menu item when it has a submenu.
|
|
*
|
|
* @since 4.4.0
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
function currentMenuItemHasPopup() {
|
|
var $current = $( 'a.wp-has-current-submenu' );
|
|
|
|
if ( 'folded' === menuState ) {
|
|
// When folded or auto-folded and not responsive view, the current menu item does have a fly-out sub-menu.
|
|
$current.attr( 'aria-haspopup', 'true' );
|
|
} else {
|
|
// When expanded or in responsive view, reset aria-haspopup.
|
|
$current.attr( 'aria-haspopup', 'false' );
|
|
}
|
|
}
|
|
|
|
$document.on( 'wp-menu-state-set wp-collapse-menu wp-responsive-activate wp-responsive-deactivate', currentMenuItemHasPopup );
|
|
|
|
/**
|
|
* Ensures an admin submenu is within the visual viewport.
|
|
*
|
|
* @since 4.1.0
|
|
*
|
|
* @param {jQuery} $menuItem The parent menu item containing the submenu.
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
function adjustSubmenu( $menuItem ) {
|
|
var bottomOffset, pageHeight, adjustment, theFold, menutop, wintop, maxtop,
|
|
$submenu = $menuItem.find( '.wp-submenu' );
|
|
|
|
menutop = $menuItem.offset().top;
|
|
wintop = $window.scrollTop();
|
|
maxtop = menutop - wintop - 30; // max = make the top of the sub almost touch admin bar
|
|
|
|
bottomOffset = menutop + $submenu.height() + 1; // Bottom offset of the menu
|
|
pageHeight = $wpwrap.height(); // Height of the entire page
|
|
adjustment = 60 + bottomOffset - pageHeight;
|
|
theFold = $window.height() + wintop - 50; // The fold
|
|
|
|
if ( theFold < ( bottomOffset - adjustment ) ) {
|
|
adjustment = bottomOffset - theFold;
|
|
}
|
|
|
|
if ( adjustment > maxtop ) {
|
|
adjustment = maxtop;
|
|
}
|
|
|
|
if ( adjustment > 1 ) {
|
|
$submenu.css( 'margin-top', '-' + adjustment + 'px' );
|
|
} else {
|
|
$submenu.css( 'margin-top', '' );
|
|
}
|
|
}
|
|
|
|
if ( 'ontouchstart' in window || /IEMobile\/[1-9]/.test(navigator.userAgent) ) { // touch screen device
|
|
// iOS Safari works with touchstart, the rest work with click
|
|
mobileEvent = isIOS ? 'touchstart' : 'click';
|
|
|
|
/**
|
|
* Closes any open submenus when touch/click is not on the menu.
|
|
*
|
|
* @param {Event} e The event object.
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
$body.on( mobileEvent+'.wp-mobile-hover', function(e) {
|
|
if ( $adminmenu.data('wp-responsive') ) {
|
|
return;
|
|
}
|
|
|
|
if ( ! $( e.target ).closest( '#adminmenu' ).length ) {
|
|
$adminmenu.find( 'li.opensub' ).removeClass( 'opensub' );
|
|
}
|
|
});
|
|
|
|
/**
|
|
* Handles the opening or closing the submenu based on the mobile click|touch event.
|
|
*
|
|
* @param {Event} event The event object.
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
$adminmenu.find( 'a.wp-has-submenu' ).on( mobileEvent + '.wp-mobile-hover', function( event ) {
|
|
var $menuItem = $(this).parent();
|
|
|
|
if ( $adminmenu.data( 'wp-responsive' ) ) {
|
|
return;
|
|
}
|
|
|
|
// Show the sub instead of following the link if:
|
|
// - the submenu is not open
|
|
// - the submenu is not shown inline or the menu is not folded
|
|
if ( ! $menuItem.hasClass( 'opensub' ) && ( ! $menuItem.hasClass( 'wp-menu-open' ) || $menuItem.width() < 40 ) ) {
|
|
event.preventDefault();
|
|
adjustSubmenu( $menuItem );
|
|
$adminmenu.find( 'li.opensub' ).removeClass( 'opensub' );
|
|
$menuItem.addClass('opensub');
|
|
}
|
|
});
|
|
}
|
|
|
|
if ( ! isIOS && ! isAndroid ) {
|
|
$adminmenu.find( 'li.wp-has-submenu' ).hoverIntent({
|
|
|
|
/**
|
|
* Opens the submenu when hovered over the menu item for desktops.
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
over: function() {
|
|
var $menuItem = $( this ),
|
|
$submenu = $menuItem.find( '.wp-submenu' ),
|
|
top = parseInt( $submenu.css( 'top' ), 10 );
|
|
|
|
if ( isNaN( top ) || top > -5 ) { // the submenu is visible
|
|
return;
|
|
}
|
|
|
|
if ( $adminmenu.data( 'wp-responsive' ) ) {
|
|
// The menu is in responsive mode, bail
|
|
return;
|
|
}
|
|
|
|
adjustSubmenu( $menuItem );
|
|
$adminmenu.find( 'li.opensub' ).removeClass( 'opensub' );
|
|
$menuItem.addClass( 'opensub' );
|
|
},
|
|
|
|
/**
|
|
* Closes the submenu when no longer hovering the menu item.
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
out: function(){
|
|
if ( $adminmenu.data( 'wp-responsive' ) ) {
|
|
// The menu is in responsive mode, bail
|
|
return;
|
|
}
|
|
|
|
$( this ).removeClass( 'opensub' ).find( '.wp-submenu' ).css( 'margin-top', '' );
|
|
},
|
|
timeout: 200,
|
|
sensitivity: 7,
|
|
interval: 90
|
|
});
|
|
|
|
/**
|
|
* Opens the submenu on when focused on the menu item.
|
|
*
|
|
* @param {Event} event The event object.
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
$adminmenu.on( 'focus.adminmenu', '.wp-submenu a', function( event ) {
|
|
if ( $adminmenu.data( 'wp-responsive' ) ) {
|
|
// The menu is in responsive mode, bail
|
|
return;
|
|
}
|
|
|
|
$( event.target ).closest( 'li.menu-top' ).addClass( 'opensub' );
|
|
|
|
/**
|
|
* Closes the submenu on blur from the menu item.
|
|
*
|
|
* @param {Event} event The event object.
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
}).on( 'blur.adminmenu', '.wp-submenu a', function( event ) {
|
|
if ( $adminmenu.data( 'wp-responsive' ) ) {
|
|
return;
|
|
}
|
|
|
|
$( event.target ).closest( 'li.menu-top' ).removeClass( 'opensub' );
|
|
|
|
/**
|
|
* Adjusts the size for the submenu.
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
}).find( 'li.wp-has-submenu.wp-not-current-submenu' ).on( 'focusin.adminmenu', function() {
|
|
adjustSubmenu( $( this ) );
|
|
});
|
|
}
|
|
|
|
/*
|
|
* The `.below-h2` class is here just for backward compatibility with plugins
|
|
* that are (incorrectly) using it. Do not use. Use `.inline` instead. See #34570.
|
|
* If '.wp-header-end' is found, append the notices after it otherwise
|
|
* after the first h1 or h2 heading found within the main content.
|
|
*/
|
|
if ( ! $headerEnd.length ) {
|
|
$headerEnd = $( '.wrap h1, .wrap h2' ).first();
|
|
}
|
|
$( 'div.updated, div.error, div.notice' ).not( '.inline, .below-h2' ).insertAfter( $headerEnd );
|
|
|
|
/**
|
|
* Makes notices dismissible.
|
|
*
|
|
* @since 4.4.0
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
function makeNoticesDismissible() {
|
|
$( '.notice.is-dismissible' ).each( function() {
|
|
var $el = $( this ),
|
|
$button = $( '<button type="button" class="notice-dismiss"><span class="screen-reader-text"></span></button>' ),
|
|
btnText = commonL10n.dismiss || '';
|
|
|
|
// Ensure plain text
|
|
$button.find( '.screen-reader-text' ).text( btnText );
|
|
$button.on( 'click.wp-dismiss-notice', function( event ) {
|
|
event.preventDefault();
|
|
$el.fadeTo( 100, 0, function() {
|
|
$el.slideUp( 100, function() {
|
|
$el.remove();
|
|
});
|
|
});
|
|
});
|
|
|
|
$el.append( $button );
|
|
});
|
|
}
|
|
|
|
$document.on( 'wp-updates-notice-added wp-plugin-install-error wp-plugin-update-error wp-plugin-delete-error wp-theme-install-error wp-theme-delete-error', makeNoticesDismissible );
|
|
|
|
// Init screen meta
|
|
screenMeta.init();
|
|
|
|
/**
|
|
* Checks a checkbox.
|
|
*
|
|
* This event needs to be delegated. Ticket #37973.
|
|
*
|
|
* @returns {boolean} Returns whether a checkbox is checked or not.
|
|
*/
|
|
$body.on( 'click', 'tbody > tr > .check-column :checkbox', function( event ) {
|
|
// Shift click to select a range of checkboxes.
|
|
if ( 'undefined' == event.shiftKey ) { return true; }
|
|
if ( event.shiftKey ) {
|
|
if ( !lastClicked ) { return true; }
|
|
checks = $( lastClicked ).closest( 'form' ).find( ':checkbox' ).filter( ':visible:enabled' );
|
|
first = checks.index( lastClicked );
|
|
last = checks.index( this );
|
|
checked = $(this).prop('checked');
|
|
if ( 0 < first && 0 < last && first != last ) {
|
|
sliced = ( last > first ) ? checks.slice( first, last ) : checks.slice( last, first );
|
|
sliced.prop( 'checked', function() {
|
|
if ( $(this).closest('tr').is(':visible') )
|
|
return checked;
|
|
|
|
return false;
|
|
});
|
|
}
|
|
}
|
|
lastClicked = this;
|
|
|
|
// Toggle the "Select all" checkboxes depending if the other ones are all checked or not.
|
|
var unchecked = $(this).closest('tbody').find(':checkbox').filter(':visible:enabled').not(':checked');
|
|
|
|
/**
|
|
* Determines if all checkboxes are checked.
|
|
*
|
|
* @returns {boolean} Returns true if there are no unchecked checkboxes.
|
|
*/
|
|
$(this).closest('table').children('thead, tfoot').find(':checkbox').prop('checked', function() {
|
|
return ( 0 === unchecked.length );
|
|
});
|
|
|
|
return true;
|
|
});
|
|
|
|
/**
|
|
* Controls all the toggles on bulk toggle change.
|
|
*
|
|
* When the bulk checkbox is changed, all the checkboxes in the tables are changed accordingly.
|
|
* When the shift-button is pressed while changing the bulk checkbox the checkboxes in the table are inverted.
|
|
*
|
|
* This event needs to be delegated. Ticket #37973.
|
|
*
|
|
* @param {Event} event The event object.
|
|
*
|
|
* @returns {boolean}
|
|
*/
|
|
$body.on( 'click.wp-toggle-checkboxes', 'thead .check-column :checkbox, tfoot .check-column :checkbox', function( event ) {
|
|
var $this = $(this),
|
|
$table = $this.closest( 'table' ),
|
|
controlChecked = $this.prop('checked'),
|
|
toggle = event.shiftKey || $this.data('wp-toggle');
|
|
|
|
$table.children( 'tbody' ).filter(':visible')
|
|
.children().children('.check-column').find(':checkbox')
|
|
/**
|
|
* Updates the checked state on the checkbox in the table.
|
|
*
|
|
* @returns {boolean} True checks the checkbox, False unchecks the checkbox.
|
|
*/
|
|
.prop('checked', function() {
|
|
if ( $(this).is(':hidden,:disabled') ) {
|
|
return false;
|
|
}
|
|
|
|
if ( toggle ) {
|
|
return ! $(this).prop( 'checked' );
|
|
} else if ( controlChecked ) {
|
|
return true;
|
|
}
|
|
|
|
return false;
|
|
});
|
|
|
|
$table.children('thead, tfoot').filter(':visible')
|
|
.children().children('.check-column').find(':checkbox')
|
|
|
|
/**
|
|
* Syncs the bulk checkboxes on the top and bottom of the table.
|
|
*
|
|
* @returns {boolean} True checks the checkbox, False unchecks the checkbox.
|
|
*/
|
|
.prop('checked', function() {
|
|
if ( toggle ) {
|
|
return false;
|
|
} else if ( controlChecked ) {
|
|
return true;
|
|
}
|
|
|
|
return false;
|
|
});
|
|
});
|
|
|
|
/**
|
|
* Shows row actions on focus of its parent container element or any other elements contained within.
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
$( '#wpbody-content' ).on({
|
|
focusin: function() {
|
|
clearTimeout( transitionTimeout );
|
|
focusedRowActions = $( this ).find( '.row-actions' );
|
|
// transitionTimeout is necessary for Firefox, but Chrome won't remove the CSS class without a little help.
|
|
$( '.row-actions' ).not( this ).removeClass( 'visible' );
|
|
focusedRowActions.addClass( 'visible' );
|
|
},
|
|
focusout: function() {
|
|
// Tabbing between post title and .row-actions links needs a brief pause, otherwise
|
|
// the .row-actions div gets hidden in transit in some browsers (ahem, Firefox).
|
|
transitionTimeout = setTimeout( function() {
|
|
focusedRowActions.removeClass( 'visible' );
|
|
}, 30 );
|
|
}
|
|
}, '.has-row-actions' );
|
|
|
|
// Toggle list table rows on small screens
|
|
$( 'tbody' ).on( 'click', '.toggle-row', function() {
|
|
$( this ).closest( 'tr' ).toggleClass( 'is-expanded' );
|
|
});
|
|
|
|
$('#default-password-nag-no').click( function() {
|
|
setUserSetting('default_password_nag', 'hide');
|
|
$('div.default-password-nag').hide();
|
|
return false;
|
|
});
|
|
|
|
/**
|
|
* Handles tab keypresses in theme and plugin editor textareas.
|
|
*
|
|
* @param {Event} e The event object.
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
$('#newcontent').bind('keydown.wpevent_InsertTab', function(e) {
|
|
var el = e.target, selStart, selEnd, val, scroll, sel;
|
|
|
|
// After pressing escape key (keyCode: 27), the tab key should tab out of the textarea.
|
|
if ( e.keyCode == 27 ) {
|
|
// when pressing Escape: Opera 12 and 27 blur form fields, IE 8 clears them
|
|
e.preventDefault();
|
|
$(el).data('tab-out', true);
|
|
return;
|
|
}
|
|
|
|
// Only listen for plain tab key (keyCode: 9) without any modifiers.
|
|
if ( e.keyCode != 9 || e.ctrlKey || e.altKey || e.shiftKey )
|
|
return;
|
|
|
|
// After tabbing out, reset it so next time the tab key can be used again.
|
|
if ( $(el).data('tab-out') ) {
|
|
$(el).data('tab-out', false);
|
|
return;
|
|
}
|
|
|
|
selStart = el.selectionStart;
|
|
selEnd = el.selectionEnd;
|
|
val = el.value;
|
|
|
|
// If any text is selected, replace the selection with a tab character.
|
|
if ( document.selection ) {
|
|
el.focus();
|
|
sel = document.selection.createRange();
|
|
sel.text = '\t';
|
|
} else if ( selStart >= 0 ) {
|
|
scroll = this.scrollTop;
|
|
el.value = val.substring(0, selStart).concat('\t', val.substring(selEnd) );
|
|
el.selectionStart = el.selectionEnd = selStart + 1;
|
|
this.scrollTop = scroll;
|
|
}
|
|
|
|
// Cancel the regular tab functionality, to prevent losing focus of the textarea.
|
|
if ( e.stopPropagation )
|
|
e.stopPropagation();
|
|
if ( e.preventDefault )
|
|
e.preventDefault();
|
|
});
|
|
|
|
// Reset page number variable for new filters/searches but not for bulk actions. See #17685.
|
|
if ( pageInput.length ) {
|
|
|
|
/**
|
|
* Handles pagination variable when filtering the list table.
|
|
*
|
|
* Set the pagination argument to the first page when the post-filter form is submitted.
|
|
* This happens when pressing the 'filter' button on the list table page.
|
|
*
|
|
* The pagination argument should not be touched when the bulk action dropdowns are set to do anything.
|
|
*
|
|
* The form closest to the pageInput is the post-filter form.
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
pageInput.closest('form').submit( function() {
|
|
/*
|
|
* action = bulk action dropdown at the top of the table
|
|
* action2 = bulk action dropdow at the bottom of the table
|
|
*/
|
|
if ( $('select[name="action"]').val() == -1 && $('select[name="action2"]').val() == -1 && pageInput.val() == currentPage )
|
|
pageInput.val('1');
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Resets the bulk actions when the search button is clicked.
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
$('.search-box input[type="search"], .search-box input[type="submit"]').mousedown(function () {
|
|
$('select[name^="action"]').val('-1');
|
|
});
|
|
|
|
/**
|
|
* Scrolls into view when focus.scroll-into-view is triggered.
|
|
*
|
|
* @param {Event} e The event object.
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
$('#contextual-help-link, #show-settings-link').on( 'focus.scroll-into-view', function(e){
|
|
if ( e.target.scrollIntoView )
|
|
e.target.scrollIntoView(false);
|
|
});
|
|
|
|
/**
|
|
* Disables the submit upload buttons when no data is entered.
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
(function(){
|
|
var button, input, form = $('form.wp-upload-form');
|
|
|
|
// Exit when no upload form is found.
|
|
if ( ! form.length )
|
|
return;
|
|
|
|
button = form.find('input[type="submit"]');
|
|
input = form.find('input[type="file"]');
|
|
|
|
/**
|
|
* Determines if any data is entered in any file upload input.
|
|
*
|
|
* @since 3.5.0
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
function toggleUploadButton() {
|
|
// When no inputs have a value, disable the upload buttons.
|
|
button.prop('disabled', '' === input.map( function() {
|
|
return $(this).val();
|
|
}).get().join(''));
|
|
}
|
|
|
|
// Update the status initially.
|
|
toggleUploadButton();
|
|
// Update the status when any file input changes.
|
|
input.on('change', toggleUploadButton);
|
|
})();
|
|
|
|
/**
|
|
* Pins the menu while distraction-free writing is enabled.
|
|
*
|
|
* @param {Event} event Event data.
|
|
*
|
|
* @since 4.1.0
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
function pinMenu( event ) {
|
|
var windowPos = $window.scrollTop(),
|
|
resizing = ! event || event.type !== 'scroll';
|
|
|
|
if ( isIOS || isIE8 || $adminmenu.data( 'wp-responsive' ) ) {
|
|
return;
|
|
}
|
|
|
|
/*
|
|
* When the menu is higher than the window and smaller than the entire page.
|
|
* It should be adjusted to be able to see the entire menu.
|
|
*
|
|
* Otherwise it can be accessed normally.
|
|
*/
|
|
if ( height.menu + height.adminbar < height.window ||
|
|
height.menu + height.adminbar + 20 > height.wpwrap ) {
|
|
unpinMenu();
|
|
return;
|
|
}
|
|
|
|
menuIsPinned = true;
|
|
|
|
// If the menu is higher than the window, compensate on scroll.
|
|
if ( height.menu + height.adminbar > height.window ) {
|
|
// Check for overscrolling, this happens when swiping up at the top of the document in modern browsers.
|
|
if ( windowPos < 0 ) {
|
|
// Stick the menu to the top.
|
|
if ( ! pinnedMenuTop ) {
|
|
pinnedMenuTop = true;
|
|
pinnedMenuBottom = false;
|
|
|
|
$adminMenuWrap.css({
|
|
position: 'fixed',
|
|
top: '',
|
|
bottom: ''
|
|
});
|
|
}
|
|
|
|
return;
|
|
} else if ( windowPos + height.window > $document.height() - 1 ) {
|
|
// When overscrolling at the bottom, stick the menu to the bottom.
|
|
if ( ! pinnedMenuBottom ) {
|
|
pinnedMenuBottom = true;
|
|
pinnedMenuTop = false;
|
|
|
|
$adminMenuWrap.css({
|
|
position: 'fixed',
|
|
top: '',
|
|
bottom: 0
|
|
});
|
|
}
|
|
|
|
return;
|
|
}
|
|
|
|
if ( windowPos > lastScrollPosition ) {
|
|
// When a down scroll has been detected.
|
|
|
|
// If it was pinned to the top, unpin and calculate relative scroll.
|
|
if ( pinnedMenuTop ) {
|
|
pinnedMenuTop = false;
|
|
// Calculate new offset position.
|
|
menuTop = $adminMenuWrap.offset().top - height.adminbar - ( windowPos - lastScrollPosition );
|
|
|
|
if ( menuTop + height.menu + height.adminbar < windowPos + height.window ) {
|
|
menuTop = windowPos + height.window - height.menu - height.adminbar;
|
|
}
|
|
|
|
$adminMenuWrap.css({
|
|
position: 'absolute',
|
|
top: menuTop,
|
|
bottom: ''
|
|
});
|
|
} else if ( ! pinnedMenuBottom && $adminMenuWrap.offset().top + height.menu < windowPos + height.window ) {
|
|
// Pin it to the bottom.
|
|
pinnedMenuBottom = true;
|
|
|
|
$adminMenuWrap.css({
|
|
position: 'fixed',
|
|
top: '',
|
|
bottom: 0
|
|
});
|
|
}
|
|
} else if ( windowPos < lastScrollPosition ) {
|
|
// When a scroll up is detected.
|
|
|
|
// If it was pinned to the bottom, unpin and calculate relative scroll.
|
|
if ( pinnedMenuBottom ) {
|
|
pinnedMenuBottom = false;
|
|
|
|
// Calculate new offset position.
|
|
menuTop = $adminMenuWrap.offset().top - height.adminbar + ( lastScrollPosition - windowPos );
|
|
|
|
if ( menuTop + height.menu > windowPos + height.window ) {
|
|
menuTop = windowPos;
|
|
}
|
|
|
|
$adminMenuWrap.css({
|
|
position: 'absolute',
|
|
top: menuTop,
|
|
bottom: ''
|
|
});
|
|
} else if ( ! pinnedMenuTop && $adminMenuWrap.offset().top >= windowPos + height.adminbar ) {
|
|
|
|
// Pin it to the top.
|
|
pinnedMenuTop = true;
|
|
|
|
$adminMenuWrap.css({
|
|
position: 'fixed',
|
|
top: '',
|
|
bottom: ''
|
|
});
|
|
}
|
|
} else if ( resizing ) {
|
|
// Window is being resized.
|
|
|
|
pinnedMenuTop = pinnedMenuBottom = false;
|
|
|
|
// Calculate the new offset.
|
|
menuTop = windowPos + height.window - height.menu - height.adminbar - 1;
|
|
|
|
if ( menuTop > 0 ) {
|
|
$adminMenuWrap.css({
|
|
position: 'absolute',
|
|
top: menuTop,
|
|
bottom: ''
|
|
});
|
|
} else {
|
|
unpinMenu();
|
|
}
|
|
}
|
|
}
|
|
|
|
lastScrollPosition = windowPos;
|
|
}
|
|
|
|
/**
|
|
* Determines the height of certain elements.
|
|
*
|
|
* @since 4.1.0
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
function resetHeights() {
|
|
height = {
|
|
window: $window.height(),
|
|
wpwrap: $wpwrap.height(),
|
|
adminbar: $adminbar.height(),
|
|
menu: $adminMenuWrap.height()
|
|
};
|
|
}
|
|
|
|
/**
|
|
* Unpins the menu.
|
|
*
|
|
* @since 4.1.0
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
function unpinMenu() {
|
|
if ( isIOS || ! menuIsPinned ) {
|
|
return;
|
|
}
|
|
|
|
pinnedMenuTop = pinnedMenuBottom = menuIsPinned = false;
|
|
$adminMenuWrap.css({
|
|
position: '',
|
|
top: '',
|
|
bottom: ''
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Pins and unpins the menu when applicable.
|
|
*
|
|
* @since 4.1.0
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
function setPinMenu() {
|
|
resetHeights();
|
|
|
|
if ( $adminmenu.data('wp-responsive') ) {
|
|
$body.removeClass( 'sticky-menu' );
|
|
unpinMenu();
|
|
} else if ( height.menu + height.adminbar > height.window ) {
|
|
pinMenu();
|
|
$body.removeClass( 'sticky-menu' );
|
|
} else {
|
|
$body.addClass( 'sticky-menu' );
|
|
unpinMenu();
|
|
}
|
|
}
|
|
|
|
if ( ! isIOS ) {
|
|
$window.on( 'scroll.pin-menu', pinMenu );
|
|
$document.on( 'tinymce-editor-init.pin-menu', function( event, editor ) {
|
|
editor.on( 'wp-autoresize', resetHeights );
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Changes the sortables and responsiveness of metaboxes.
|
|
*
|
|
* @since 3.8.0
|
|
*
|
|
*@returns {void}
|
|
*/
|
|
window.wpResponsive = {
|
|
|
|
/**
|
|
* Initializes the wpResponsive object.
|
|
*
|
|
* @since 3.8.0
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
init: function() {
|
|
var self = this;
|
|
|
|
this.maybeDisableSortables = this.maybeDisableSortables.bind( this );
|
|
|
|
// Modify functionality based on custom activate/deactivate event
|
|
$document.on( 'wp-responsive-activate.wp-responsive', function() {
|
|
self.activate();
|
|
}).on( 'wp-responsive-deactivate.wp-responsive', function() {
|
|
self.deactivate();
|
|
});
|
|
|
|
$( '#wp-admin-bar-menu-toggle a' ).attr( 'aria-expanded', 'false' );
|
|
|
|
// Toggle sidebar when toggle is clicked.
|
|
$( '#wp-admin-bar-menu-toggle' ).on( 'click.wp-responsive', function( event ) {
|
|
event.preventDefault();
|
|
|
|
// close any open toolbar submenus.
|
|
$adminbar.find( '.hover' ).removeClass( 'hover' );
|
|
|
|
$wpwrap.toggleClass( 'wp-responsive-open' );
|
|
if ( $wpwrap.hasClass( 'wp-responsive-open' ) ) {
|
|
$(this).find('a').attr( 'aria-expanded', 'true' );
|
|
$( '#adminmenu a:first' ).focus();
|
|
} else {
|
|
$(this).find('a').attr( 'aria-expanded', 'false' );
|
|
}
|
|
} );
|
|
|
|
// Add menu events.
|
|
$adminmenu.on( 'click.wp-responsive', 'li.wp-has-submenu > a', function( event ) {
|
|
if ( ! $adminmenu.data('wp-responsive') ) {
|
|
return;
|
|
}
|
|
|
|
$( this ).parent( 'li' ).toggleClass( 'selected' );
|
|
event.preventDefault();
|
|
});
|
|
|
|
self.trigger();
|
|
$document.on( 'wp-window-resized.wp-responsive', $.proxy( this.trigger, this ) );
|
|
|
|
// This needs to run later as UI Sortable may be initialized later on $(document).ready().
|
|
$window.on( 'load.wp-responsive', this.maybeDisableSortables );
|
|
$document.on( 'postbox-toggled', this.maybeDisableSortables );
|
|
|
|
// When the screen columns are changed, potentially disable sortables.
|
|
$( '#screen-options-wrap input' ).on( 'click', this.maybeDisableSortables );
|
|
},
|
|
|
|
/**
|
|
* Disable sortables if there is only one metabox, or the screen is in one column mode. Otherwise, enable sortables.
|
|
*
|
|
* @since 5.3.0
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
maybeDisableSortables: function() {
|
|
var width = navigator.userAgent.indexOf('AppleWebKit/') > -1 ? $window.width() : window.innerWidth;
|
|
|
|
if (
|
|
( width <= 782 ) ||
|
|
( 1 >= $sortables.find( '.ui-sortable-handle:visible' ).length && jQuery( '.columns-prefs-1 input' ).prop( 'checked' ) )
|
|
) {
|
|
this.disableSortables();
|
|
} else {
|
|
this.enableSortables();
|
|
}
|
|
},
|
|
|
|
/**
|
|
* Changes properties of body and admin menu.
|
|
*
|
|
* Pins and unpins the menu and adds the auto-fold class to the body.
|
|
* Makes the admin menu responsive and disables the metabox sortables.
|
|
*
|
|
* @since 3.8.0
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
activate: function() {
|
|
setPinMenu();
|
|
|
|
if ( ! $body.hasClass( 'auto-fold' ) ) {
|
|
$body.addClass( 'auto-fold' );
|
|
}
|
|
|
|
$adminmenu.data( 'wp-responsive', 1 );
|
|
this.disableSortables();
|
|
},
|
|
|
|
/**
|
|
* Changes properties of admin menu and enables metabox sortables.
|
|
*
|
|
* Pin and unpin the menu.
|
|
* Removes the responsiveness of the admin menu and enables the metabox sortables.
|
|
*
|
|
* @since 3.8.0
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
deactivate: function() {
|
|
setPinMenu();
|
|
$adminmenu.removeData('wp-responsive');
|
|
|
|
this.maybeDisableSortables();
|
|
},
|
|
|
|
/**
|
|
* Sets the responsiveness and enables the overlay based on the viewport width.
|
|
*
|
|
* @since 3.8.0
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
trigger: function() {
|
|
var viewportWidth = getViewportWidth();
|
|
|
|
// Exclude IE < 9, it doesn't support @media CSS rules.
|
|
if ( ! viewportWidth ) {
|
|
return;
|
|
}
|
|
|
|
if ( viewportWidth <= 782 ) {
|
|
if ( ! wpResponsiveActive ) {
|
|
$document.trigger( 'wp-responsive-activate' );
|
|
wpResponsiveActive = true;
|
|
}
|
|
} else {
|
|
if ( wpResponsiveActive ) {
|
|
$document.trigger( 'wp-responsive-deactivate' );
|
|
wpResponsiveActive = false;
|
|
}
|
|
}
|
|
|
|
if ( viewportWidth <= 480 ) {
|
|
this.enableOverlay();
|
|
} else {
|
|
this.disableOverlay();
|
|
}
|
|
|
|
this.maybeDisableSortables();
|
|
},
|
|
|
|
/**
|
|
* Inserts a responsive overlay and toggles the window.
|
|
*
|
|
* @since 3.8.0
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
enableOverlay: function() {
|
|
if ( $overlay.length === 0 ) {
|
|
$overlay = $( '<div id="wp-responsive-overlay"></div>' )
|
|
.insertAfter( '#wpcontent' )
|
|
.hide()
|
|
.on( 'click.wp-responsive', function() {
|
|
$toolbar.find( '.menupop.hover' ).removeClass( 'hover' );
|
|
$( this ).hide();
|
|
});
|
|
}
|
|
|
|
$toolbarPopups.on( 'click.wp-responsive', function() {
|
|
$overlay.show();
|
|
});
|
|
},
|
|
|
|
/**
|
|
* Disables the responsive overlay and removes the overlay.
|
|
*
|
|
* @since 3.8.0
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
disableOverlay: function() {
|
|
$toolbarPopups.off( 'click.wp-responsive' );
|
|
$overlay.hide();
|
|
},
|
|
|
|
/**
|
|
* Disables sortables.
|
|
*
|
|
* @since 3.8.0
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
disableSortables: function() {
|
|
if ( $sortables.length ) {
|
|
try {
|
|
$sortables.sortable( 'disable' );
|
|
$sortables.find( '.ui-sortable-handle' ).addClass( 'is-non-sortable' );
|
|
} catch ( e ) {}
|
|
}
|
|
},
|
|
|
|
/**
|
|
* Enables sortables.
|
|
*
|
|
* @since 3.8.0
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
enableSortables: function() {
|
|
if ( $sortables.length ) {
|
|
try {
|
|
$sortables.sortable( 'enable' );
|
|
$sortables.find( '.ui-sortable-handle' ).removeClass( 'is-non-sortable' );
|
|
} catch ( e ) {}
|
|
}
|
|
}
|
|
};
|
|
|
|
/**
|
|
* Add an ARIA role `button` to elements that behave like UI controls when JavaScript is on.
|
|
*
|
|
* @since 4.5.0
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
function aria_button_if_js() {
|
|
$( '.aria-button-if-js' ).attr( 'role', 'button' );
|
|
}
|
|
|
|
$( document ).ajaxComplete( function() {
|
|
aria_button_if_js();
|
|
});
|
|
|
|
/**
|
|
* Get the viewport width.
|
|
*
|
|
* @since 4.7.0
|
|
*
|
|
* @returns {number|boolean} The current viewport width or false if the
|
|
* browser doesn't support innerWidth (IE < 9).
|
|
*/
|
|
function getViewportWidth() {
|
|
var viewportWidth = false;
|
|
|
|
if ( window.innerWidth ) {
|
|
// On phones, window.innerWidth is affected by zooming.
|
|
viewportWidth = Math.max( window.innerWidth, document.documentElement.clientWidth );
|
|
}
|
|
|
|
return viewportWidth;
|
|
}
|
|
|
|
/**
|
|
* Sets the admin menu collapsed/expanded state.
|
|
*
|
|
* Sets the global variable `menuState` and triggers a custom event passing
|
|
* the current menu state.
|
|
*
|
|
* @since 4.7.0
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
function setMenuState() {
|
|
var viewportWidth = getViewportWidth() || 961;
|
|
|
|
if ( viewportWidth <= 782 ) {
|
|
menuState = 'responsive';
|
|
} else if ( $body.hasClass( 'folded' ) || ( $body.hasClass( 'auto-fold' ) && viewportWidth <= 960 && viewportWidth > 782 ) ) {
|
|
menuState = 'folded';
|
|
} else {
|
|
menuState = 'open';
|
|
}
|
|
|
|
$document.trigger( 'wp-menu-state-set', { state: menuState } );
|
|
}
|
|
|
|
// Set the menu state when the window gets resized.
|
|
$document.on( 'wp-window-resized.set-menu-state', setMenuState );
|
|
|
|
/**
|
|
* Sets ARIA attributes on the collapse/expand menu button.
|
|
*
|
|
* When the admin menu is open or folded, updates the `aria-expanded` and
|
|
* `aria-label` attributes of the button to give feedback to assistive
|
|
* technologies. In the responsive view, the button is always hidden.
|
|
*
|
|
* @since 4.7.0
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
$document.on( 'wp-menu-state-set wp-collapse-menu', function( event, eventData ) {
|
|
var $collapseButton = $( '#collapse-button' ),
|
|
ariaExpanded = 'true',
|
|
ariaLabelText = commonL10n.collapseMenu;
|
|
|
|
if ( 'folded' === eventData.state ) {
|
|
ariaExpanded = 'false';
|
|
ariaLabelText = commonL10n.expandMenu;
|
|
}
|
|
|
|
$collapseButton.attr({
|
|
'aria-expanded': ariaExpanded,
|
|
'aria-label': ariaLabelText
|
|
});
|
|
});
|
|
|
|
window.wpResponsive.init();
|
|
setPinMenu();
|
|
setMenuState();
|
|
currentMenuItemHasPopup();
|
|
makeNoticesDismissible();
|
|
aria_button_if_js();
|
|
|
|
$document.on( 'wp-pin-menu wp-window-resized.pin-menu postboxes-columnchange.pin-menu postbox-toggled.pin-menu wp-collapse-menu.pin-menu wp-scroll-start.pin-menu', setPinMenu );
|
|
|
|
// Set initial focus on a specific element.
|
|
$( '.wp-initial-focus' ).focus();
|
|
|
|
// Toggle update details on update-core.php.
|
|
$body.on( 'click', '.js-update-details-toggle', function() {
|
|
var $updateNotice = $( this ).closest( '.js-update-details' ),
|
|
$progressDiv = $( '#' + $updateNotice.data( 'update-details' ) );
|
|
|
|
/*
|
|
* When clicking on "Show details" move the progress div below the update
|
|
* notice. Make sure it gets moved just the first time.
|
|
*/
|
|
if ( ! $progressDiv.hasClass( 'update-details-moved' ) ) {
|
|
$progressDiv.insertAfter( $updateNotice ).addClass( 'update-details-moved' );
|
|
}
|
|
|
|
// Toggle the progress div visibility.
|
|
$progressDiv.toggle();
|
|
// Toggle the Show Details button expanded state.
|
|
$( this ).attr( 'aria-expanded', $progressDiv.is( ':visible' ) );
|
|
});
|
|
});
|
|
|
|
// Fire a custom jQuery event at the end of window resize.
|
|
( function() {
|
|
var timeout;
|
|
|
|
/**
|
|
* Triggers the WP window-resize event.
|
|
*
|
|
* @since 3.8.0
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
function triggerEvent() {
|
|
$document.trigger( 'wp-window-resized' );
|
|
}
|
|
|
|
/**
|
|
* Fires the trigger event again after 200 ms.
|
|
*
|
|
* @since 3.8.0
|
|
*
|
|
* @returns {void}
|
|
*/
|
|
function fireOnce() {
|
|
window.clearTimeout( timeout );
|
|
timeout = window.setTimeout( triggerEvent, 200 );
|
|
}
|
|
|
|
$window.on( 'resize.wp-fire-once', fireOnce );
|
|
}());
|
|
|
|
// Make Windows 8 devices play along nicely.
|
|
(function(){
|
|
if ( '-ms-user-select' in document.documentElement.style && navigator.userAgent.match(/IEMobile\/10\.0/) ) {
|
|
var msViewportStyle = document.createElement( 'style' );
|
|
msViewportStyle.appendChild(
|
|
document.createTextNode( '@-ms-viewport{width:auto!important}' )
|
|
);
|
|
document.getElementsByTagName( 'head' )[0].appendChild( msViewportStyle );
|
|
}
|
|
})();
|
|
|
|
}( jQuery, window ));
|