File Editor
Directories:
.. (Back)
widgets
Files:
accordion.js
accordion.min.js
code-editor.js
code-editor.min.js
color-picker.js
color-picker.min.js
comment.js
comment.min.js
common.js
common.min.js
custom-background.js
custom-background.min.js
custom-header.js
customize-controls.js
customize-controls.min.js
customize-nav-menus.js
customize-nav-menus.min.js
customize-widgets.js
customize-widgets.min.js
dashboard.js
dashboard.min.js
edit-comments.js
edit-comments.min.js
editor-expand.js
editor-expand.min.js
editor.js
editor.min.js
farbtastic.js
gallery.js
gallery.min.js
image-edit.js
image-edit.min.js
inline-edit-post.js
inline-edit-post.min.js
inline-edit-tax.js
inline-edit-tax.min.js
iris.min.js
language-chooser.js
language-chooser.min.js
link.js
link.min.js
media-gallery.js
media-gallery.min.js
media-upload.js
media-upload.min.js
media.js
media.min.js
nav-menu.js
nav-menu.min.js
password-strength-meter.js
password-strength-meter.min.js
plugin-install.js
plugin-install.min.js
post.js
post.min.js
postbox.js
postbox.min.js
privacy-tools.js
privacy-tools.min.js
revisions.js
revisions.min.js
set-post-thumbnail.js
set-post-thumbnail.min.js
site-health.js
site-health.min.js
svg-painter.js
svg-painter.min.js
tags-box.js
tags-box.min.js
tags-suggest.js
tags-suggest.min.js
tags.js
tags.min.js
theme-plugin-editor.js
theme-plugin-editor.min.js
theme.js
theme.min.js
updates.js
updates.min.js
user-profile.js
user-profile.min.js
user-suggest.js
user-suggest.min.js
widgets.js
widgets.min.js
word-count.js
word-count.min.js
xfn.js
xfn.min.js
Create New File
Create
Edit File: plugin-install.js
/** * @file Functionality for the plugin install screens. * * @output wp-admin/js/plugin-install.js */ /* global plugininstallL10n, tb_click, tb_remove, tb_position */ jQuery( document ).ready( function( $ ) { var tbWindow, $iframeBody, $tabbables, $firstTabbable, $lastTabbable, $focusedBefore = $(), $uploadViewToggle = $( '.upload-view-toggle' ), $wrap = $ ( '.wrap' ), $body = $( document.body ); window.tb_position = function() { var width = $( window ).width(), H = $( window ).height() - ( ( 792 < width ) ? 60 : 20 ), W = ( 792 < width ) ? 772 : width - 20; tbWindow = $( '#TB_window' ); if ( tbWindow.length ) { tbWindow.width( W ).height( H ); $( '#TB_iframeContent' ).width( W ).height( H ); tbWindow.css({ 'margin-left': '-' + parseInt( ( W / 2 ), 10 ) + 'px' }); if ( typeof document.body.style.maxWidth !== 'undefined' ) { tbWindow.css({ 'top': '30px', 'margin-top': '0' }); } } return $( 'a.thickbox' ).each( function() { var href = $( this ).attr( 'href' ); if ( ! href ) { return; } href = href.replace( /&width=[0-9]+/g, '' ); href = href.replace( /&height=[0-9]+/g, '' ); $(this).attr( 'href', href + '&width=' + W + '&height=' + ( H ) ); }); }; $( window ).resize( function() { tb_position(); }); /* * Custom events: when a Thickbox iframe has loaded and when the Thickbox * modal gets removed from the DOM. */ $body .on( 'thickbox:iframe:loaded', tbWindow, function() { /* * Return if it's not the modal with the plugin details iframe. Other * thickbox instances might want to load an iframe with content from * an external domain. Avoid to access the iframe contents when we're * not sure the iframe loads from the same domain. */ if ( ! tbWindow.hasClass( 'plugin-details-modal' ) ) { return; } iframeLoaded(); }) .on( 'thickbox:removed', function() { // Set focus back to the element that opened the modal dialog. // Note: IE 8 would need this wrapped in a fake setTimeout `0`. $focusedBefore.focus(); }); function iframeLoaded() { var $iframe = tbWindow.find( '#TB_iframeContent' ); // Get the iframe body. $iframeBody = $iframe.contents().find( 'body' ); // Get the tabbable elements and handle the keydown event on first load. handleTabbables(); // Set initial focus on the "Close" button. $firstTabbable.focus(); /* * When the "Install" button is disabled (e.g. the Plugin is already installed) * then we can't predict where the last focusable element is. We need to get * the tabbable elements and handle the keydown event again and again, * each time the active tab panel changes. */ $( '#plugin-information-tabs a', $iframeBody ).on( 'click', function() { handleTabbables(); }); // Close the modal when pressing Escape. $iframeBody.on( 'keydown', function( event ) { if ( 27 !== event.which ) { return; } tb_remove(); }); } /* * Get the tabbable elements and detach/attach the keydown event. * Called after the iframe has fully loaded so we have all the elements we need. * Called again each time a Tab gets clicked. * @todo Consider to implement a WordPress general utility for this and don't use jQuery UI. */ function handleTabbables() { var $firstAndLast; // Get all the tabbable elements. $tabbables = $( ':tabbable', $iframeBody ); // Our first tabbable element is always the "Close" button. $firstTabbable = tbWindow.find( '#TB_closeWindowButton' ); // Get the last tabbable element. $lastTabbable = $tabbables.last(); // Make a jQuery collection. $firstAndLast = $firstTabbable.add( $lastTabbable ); // Detach any previously attached keydown event. $firstAndLast.off( 'keydown.wp-plugin-details' ); // Attach again the keydown event on the first and last focusable elements. $firstAndLast.on( 'keydown.wp-plugin-details', function( event ) { constrainTabbing( event ); }); } // Constrain tabbing within the plugin modal dialog. function constrainTabbing( event ) { if ( 9 !== event.which ) { return; } if ( $lastTabbable[0] === event.target && ! event.shiftKey ) { event.preventDefault(); $firstTabbable.focus(); } else if ( $firstTabbable[0] === event.target && event.shiftKey ) { event.preventDefault(); $lastTabbable.focus(); } } /* * Open the Plugin details modal. The event is delegated to get also the links * in the plugins search tab, after the AJAX search rebuilds the HTML. It's * delegated on the closest ancestor and not on the body to avoid conflicts * with other handlers, see Trac ticket #43082. */ $( '.wrap' ).on( 'click', '.thickbox.open-plugin-details-modal', function( e ) { // The `data-title` attribute is used only in the Plugin screens. var title = $( this ).data( 'title' ) ? plugininstallL10n.plugin_information + ' ' + $( this ).data( 'title' ) : plugininstallL10n.plugin_modal_label; e.preventDefault(); e.stopPropagation(); // Store the element that has focus before opening the modal dialog, i.e. the control which opens it. $focusedBefore = $( this ); tb_click.call(this); // Set ARIA role, ARIA label, and add a CSS class. tbWindow .attr({ 'role': 'dialog', 'aria-label': plugininstallL10n.plugin_modal_label }) .addClass( 'plugin-details-modal' ); // Set title attribute on the iframe. tbWindow.find( '#TB_iframeContent' ).attr( 'title', title ); }); /* Plugin install related JS */ $( '#plugin-information-tabs a' ).click( function( event ) { var tab = $( this ).attr( 'name' ); event.preventDefault(); // Flip the tab. $( '#plugin-information-tabs a.current' ).removeClass( 'current' ); $( this ).addClass( 'current' ); // Only show the fyi box in the description section, on smaller screen, // where it's otherwise always displayed at the top. if ( 'description' !== tab && $( window ).width() < 772 ) { $( '#plugin-information-content' ).find( '.fyi' ).hide(); } else { $( '#plugin-information-content' ).find( '.fyi' ).show(); } // Flip the content. $( '#section-holder div.section' ).hide(); // Hide 'em all. $( '#section-' + tab ).show(); }); /* * When a user presses the "Upload Plugin" button, show the upload form in place * rather than sending them to the devoted upload plugin page. * The `?tab=upload` page still exists for no-js support and for plugins that * might access it directly. When we're in this page, let the link behave * like a link. Otherwise we're in the normal plugin installer pages and the * link should behave like a toggle button. */ if ( ! $wrap.hasClass( 'plugin-install-tab-upload' ) ) { $uploadViewToggle .attr({ role: 'button', 'aria-expanded': 'false' }) .on( 'click', function( event ) { event.preventDefault(); $body.toggleClass( 'show-upload-view' ); $uploadViewToggle.attr( 'aria-expanded', $body.hasClass( 'show-upload-view' ) ); }); } });
Save Changes
Rename File
Rename