[ Index ]

PHP Cross Reference of WordPress Trunk (Updated Daily)

title

Body

[close]

/wp-admin/js/ -> site-health.js (source)

   1  /**
   2   * Interactions used by the Site Health modules in WordPress.
   3   *
   4   * @output wp-admin/js/site-health.js
   5   */
   6  
   7  /* global ajaxurl, ClipboardJS, SiteHealth, wp */
   8  
   9  jQuery( document ).ready( function( $ ) {
  10  
  11      var __ = wp.i18n.__,
  12          _n = wp.i18n._n,
  13          sprintf = wp.i18n.sprintf;
  14  
  15      var data;
  16      var clipboard = new ClipboardJS( '.site-health-copy-buttons .copy-button' );
  17      var isDebugTab = $( '.health-check-body.health-check-debug-tab' ).length;
  18      var pathsSizesSection = $( '#health-check-accordion-block-wp-paths-sizes' );
  19  
  20      // Debug information copy section.
  21      clipboard.on( 'success', function( e ) {
  22          var $wrapper = $( e.trigger ).closest( 'div' );
  23          $( '.success', $wrapper ).addClass( 'visible' );
  24  
  25          wp.a11y.speak( __( 'Site information has been added to your clipboard.' ) );
  26      } );
  27  
  28      // Accordion handling in various areas.
  29      $( '.health-check-accordion' ).on( 'click', '.health-check-accordion-trigger', function() {
  30          var isExpanded = ( 'true' === $( this ).attr( 'aria-expanded' ) );
  31  
  32          if ( isExpanded ) {
  33              $( this ).attr( 'aria-expanded', 'false' );
  34              $( '#' + $( this ).attr( 'aria-controls' ) ).attr( 'hidden', true );
  35          } else {
  36              $( this ).attr( 'aria-expanded', 'true' );
  37              $( '#' + $( this ).attr( 'aria-controls' ) ).attr( 'hidden', false );
  38          }
  39      } );
  40  
  41      // Site Health test handling.
  42  
  43      $( '.site-health-view-passed' ).on( 'click', function() {
  44          var goodIssuesWrapper = $( '#health-check-issues-good' );
  45  
  46          goodIssuesWrapper.toggleClass( 'hidden' );
  47          $( this ).attr( 'aria-expanded', ! goodIssuesWrapper.hasClass( 'hidden' ) );
  48      } );
  49  
  50      /**
  51       * Append a new issue to the issue list.
  52       *
  53       * @since 5.2.0
  54       *
  55       * @param {Object} issue The issue data.
  56       */
  57  	function AppendIssue( issue ) {
  58          var template = wp.template( 'health-check-issue' ),
  59              issueWrapper = $( '#health-check-issues-' + issue.status ),
  60              heading,
  61              count;
  62  
  63          SiteHealth.site_status.issues[ issue.status ]++;
  64  
  65          count = SiteHealth.site_status.issues[ issue.status ];
  66  
  67          if ( 'critical' === issue.status ) {
  68              heading = sprintf( _n( '%s critical issue', '%s critical issues', count ), '<span class="issue-count">' + count + '</span>' );
  69          } else if ( 'recommended' === issue.status ) {
  70              heading = sprintf( _n( '%s recommended improvement', '%s recommended improvements', count ), '<span class="issue-count">' + count + '</span>' );
  71          } else if ( 'good' === issue.status ) {
  72              heading = sprintf( _n( '%s item with no issues detected', '%s items with no issues detected', count ), '<span class="issue-count">' + count + '</span>' );
  73          }
  74  
  75          if ( heading ) {
  76              $( '.site-health-issue-count-title', issueWrapper ).html( heading );
  77          }
  78  
  79          $( '.issues', '#health-check-issues-' + issue.status ).append( template( issue ) );
  80      }
  81  
  82      /**
  83       * Update site health status indicator as asynchronous tests are run and returned.
  84       *
  85       * @since 5.2.0
  86       */
  87  	function RecalculateProgression() {
  88          var r, c, pct;
  89          var $progress = $( '.site-health-progress' );
  90          var $wrapper = $progress.closest( '.site-health-progress-wrapper' );
  91          var $progressLabel = $( '.site-health-progress-label', $wrapper );
  92          var $circle = $( '.site-health-progress svg #bar' );
  93          var totalTests = parseInt( SiteHealth.site_status.issues.good, 0 ) + parseInt( SiteHealth.site_status.issues.recommended, 0 ) + ( parseInt( SiteHealth.site_status.issues.critical, 0 ) * 1.5 );
  94          var failedTests = ( parseInt( SiteHealth.site_status.issues.recommended, 0 ) * 0.5 ) + ( parseInt( SiteHealth.site_status.issues.critical, 0 ) * 1.5 );
  95          var val = 100 - Math.ceil( ( failedTests / totalTests ) * 100 );
  96  
  97          if ( 0 === totalTests ) {
  98              $progress.addClass( 'hidden' );
  99              return;
 100          }
 101  
 102          $wrapper.removeClass( 'loading' );
 103  
 104          r = $circle.attr( 'r' );
 105          c = Math.PI * ( r * 2 );
 106  
 107          if ( 0 > val ) {
 108              val = 0;
 109          }
 110          if ( 100 < val ) {
 111              val = 100;
 112          }
 113  
 114          pct = ( ( 100 - val ) / 100 ) * c;
 115  
 116          $circle.css( { strokeDashoffset: pct } );
 117  
 118          if ( 1 > parseInt( SiteHealth.site_status.issues.critical, 0 ) ) {
 119              $( '#health-check-issues-critical' ).addClass( 'hidden' );
 120          }
 121  
 122          if ( 1 > parseInt( SiteHealth.site_status.issues.recommended, 0 ) ) {
 123              $( '#health-check-issues-recommended' ).addClass( 'hidden' );
 124          }
 125  
 126          if ( 80 <= val && 0 === parseInt( SiteHealth.site_status.issues.critical, 0 ) ) {
 127              $wrapper.addClass( 'green' ).removeClass( 'orange' );
 128  
 129              $progressLabel.text( __( 'Good' ) );
 130              wp.a11y.speak( __( 'All site health tests have finished running. Your site is looking good, and the results are now available on the page.' ) );
 131          } else {
 132              $wrapper.addClass( 'orange' ).removeClass( 'green' );
 133  
 134              $progressLabel.text( __( 'Should be improved' ) );
 135              wp.a11y.speak( __( 'All site health tests have finished running. There are items that should be addressed, and the results are now available on the page.' ) );
 136          }
 137  
 138          if ( ! isDebugTab ) {
 139              $.post(
 140                  ajaxurl,
 141                  {
 142                      'action': 'health-check-site-status-result',
 143                      '_wpnonce': SiteHealth.nonce.site_status_result,
 144                      'counts': SiteHealth.site_status.issues
 145                  }
 146              );
 147  
 148              if ( 100 === val ) {
 149                  $( '.site-status-all-clear' ).removeClass( 'hide' );
 150                  $( '.site-status-has-issues' ).addClass( 'hide' );
 151              }
 152          }
 153      }
 154  
 155      /**
 156       * Queue the next asynchronous test when we're ready to run it.
 157       *
 158       * @since 5.2.0
 159       */
 160  	function maybeRunNextAsyncTest() {
 161          var doCalculation = true;
 162  
 163          if ( 1 <= SiteHealth.site_status.async.length ) {
 164              $.each( SiteHealth.site_status.async, function() {
 165                  var data = {
 166                      'action': 'health-check-' + this.test.replace( '_', '-' ),
 167                      '_wpnonce': SiteHealth.nonce.site_status
 168                  };
 169  
 170                  if ( this.completed ) {
 171                      return true;
 172                  }
 173  
 174                  doCalculation = false;
 175  
 176                  this.completed = true;
 177  
 178                  $.post(
 179                      ajaxurl,
 180                      data,
 181                      function( response ) {
 182                          /** This filter is documented in wp-admin/includes/class-wp-site-health.php */
 183                          AppendIssue( wp.hooks.applyFilters( 'site_status_test_result', response.data ) );
 184                          maybeRunNextAsyncTest();
 185                      }
 186                  );
 187  
 188                  return false;
 189              } );
 190          }
 191  
 192          if ( doCalculation ) {
 193              RecalculateProgression();
 194          }
 195      }
 196  
 197      if ( 'undefined' !== typeof SiteHealth && ! isDebugTab ) {
 198          if ( 0 === SiteHealth.site_status.direct.length && 0 === SiteHealth.site_status.async.length ) {
 199              RecalculateProgression();
 200          } else {
 201              SiteHealth.site_status.issues = {
 202                  'good': 0,
 203                  'recommended': 0,
 204                  'critical': 0
 205              };
 206          }
 207  
 208          if ( 0 < SiteHealth.site_status.direct.length ) {
 209              $.each( SiteHealth.site_status.direct, function() {
 210                  AppendIssue( this );
 211              } );
 212          }
 213  
 214          if ( 0 < SiteHealth.site_status.async.length ) {
 215              data = {
 216                  'action': 'health-check-' + SiteHealth.site_status.async[0].test.replace( '_', '-' ),
 217                  '_wpnonce': SiteHealth.nonce.site_status
 218              };
 219  
 220              SiteHealth.site_status.async[0].completed = true;
 221  
 222              $.post(
 223                  ajaxurl,
 224                  data,
 225                  function( response ) {
 226                      AppendIssue( response.data );
 227                      maybeRunNextAsyncTest();
 228                  }
 229              );
 230          } else {
 231              RecalculateProgression();
 232          }
 233      }
 234  
 235  	function getDirectorySizes() {
 236          var data = {
 237              action: 'health-check-get-sizes',
 238              _wpnonce: SiteHealth.nonce.site_status_result
 239          };
 240  
 241          var timestamp = ( new Date().getTime() );
 242  
 243          // After 3 seconds announce that we're still waiting for directory sizes.
 244          var timeout = window.setTimeout( function() {
 245              wp.a11y.speak( __( 'Please wait...' ) );
 246          }, 3000 );
 247  
 248          $.post( {
 249              type: 'POST',
 250              url: ajaxurl,
 251              data: data,
 252              dataType: 'json'
 253          } ).done( function( response ) {
 254              updateDirSizes( response.data || {} );
 255          } ).always( function() {
 256              var delay = ( new Date().getTime() ) - timestamp;
 257  
 258              $( '.health-check-wp-paths-sizes.spinner' ).css( 'visibility', 'hidden' );
 259              RecalculateProgression();
 260  
 261              if ( delay > 3000  ) {
 262                  // We have announced that we're waiting.
 263                  // Announce that we're ready after giving at least 3 seconds for the first announcement
 264                  // to be read out, or the two may collide.
 265                  if ( delay > 6000 ) {
 266                      delay = 0;
 267                  } else {
 268                      delay = 6500 - delay;
 269                  }
 270  
 271                  window.setTimeout( function() {
 272                      wp.a11y.speak( __( 'All site health tests have finished running.' ) );
 273                  }, delay );
 274              } else {
 275                  // Cancel the announcement.
 276                  window.clearTimeout( timeout );
 277              }
 278  
 279              $( document ).trigger( 'site-health-info-dirsizes-done' );
 280          } );
 281      }
 282  
 283  	function updateDirSizes( data ) {
 284          var copyButton = $( 'button.button.copy-button' );
 285          var clipdoardText = copyButton.attr( 'data-clipboard-text' );
 286  
 287          $.each( data, function( name, value ) {
 288              var text = value.debug || value.size;
 289  
 290              if ( typeof text !== 'undefined' ) {
 291                  clipdoardText = clipdoardText.replace( name + ': loading...', name + ': ' + text );
 292              }
 293          } );
 294  
 295          copyButton.attr( 'data-clipboard-text', clipdoardText );
 296  
 297          pathsSizesSection.find( 'td[class]' ).each( function( i, element ) {
 298              var td = $( element );
 299              var name = td.attr( 'class' );
 300  
 301              if ( data.hasOwnProperty( name ) && data[ name ].size ) {
 302                  td.text( data[ name ].size );
 303              }
 304          } );
 305      }
 306  
 307      if ( isDebugTab ) {
 308          if ( pathsSizesSection.length ) {
 309              getDirectorySizes();
 310          } else {
 311              RecalculateProgression();
 312          }
 313      }
 314  } );


Generated: Sat Nov 23 20:47:33 2019 Cross-referenced by PHPXref 0.7