[Summary view] [Print] [Text view]

   1  /**
   2   * @output wp-admin/js/dashboard.js
   3   */
   4  
   5  /* global pagenow, ajaxurl, postboxes, wpActiveEditor:true, ajaxWidgets */
   6  /* global ajaxPopulateWidgets, quickPressLoad,  */
   7  window.wp = window.wp || {};
   8  window.communityEventsData = window.communityEventsData || {};
   9  
  10  /**
  11   * Initializes the dashboard widget functionality.
  12   *
  13   * @since 2.7.0
  14   */
  15  jQuery( function($) {
  16      var welcomePanel = $( '#welcome-panel' ),
  17          welcomePanelHide = $('#wp_welcome_panel-hide'),
  18          updateWelcomePanel;
  19  
  20      /**
  21       * Saves the visibility of the welcome panel.
  22       *
  23       * @since 3.3.0
  24       *
  25       * @param {boolean} visible Should it be visible or not.
  26       *
  27       * @return {void}
  28       */
  29      updateWelcomePanel = function( visible ) {
  30          $.post(
  31              ajaxurl,
  32              {
  33                  action: 'update-welcome-panel',
  34                  visible: visible,
  35                  welcomepanelnonce: $( '#welcomepanelnonce' ).val()
  36              },
  37              function() {
  38                  wp.a11y.speak( wp.i18n.__( 'Screen Options updated.' ) );
  39              }
  40          );
  41      };
  42  
  43      // Unhide the welcome panel if the Welcome Option checkbox is checked.
  44      if ( welcomePanel.hasClass('hidden') && welcomePanelHide.prop('checked') ) {
  45          welcomePanel.removeClass('hidden');
  46      }
  47  
  48      // Hide the welcome panel when the dismiss button or close button is clicked.
  49      $('.welcome-panel-close, .welcome-panel-dismiss a', welcomePanel).on( 'click', function(e) {
  50          e.preventDefault();
  51          welcomePanel.addClass('hidden');
  52          updateWelcomePanel( 0 );
  53          $('#wp_welcome_panel-hide').prop('checked', false);
  54      });
  55  
  56      // Set welcome panel visibility based on Welcome Option checkbox value.
  57      welcomePanelHide.on( 'click', function() {
  58          welcomePanel.toggleClass('hidden', ! this.checked );
  59          updateWelcomePanel( this.checked ? 1 : 0 );
  60      });
  61  
  62      /**
  63       * These widgets can be populated via ajax.
  64       *
  65       * @since 2.7.0
  66       *
  67       * @type {string[]}
  68       *
  69       * @global
  70        */
  71      window.ajaxWidgets = ['dashboard_primary'];
  72  
  73      /**
  74       * Triggers widget updates via Ajax.
  75       *
  76       * @since 2.7.0
  77       *
  78       * @global
  79       *
  80       * @param {string} el Optional. Widget to fetch or none to update all.
  81       *
  82       * @return {void}
  83       */
  84      window.ajaxPopulateWidgets = function(el) {
  85          /**
  86           * Fetch the latest representation of the widget via Ajax and show it.
  87           *
  88           * @param {number} i Number of half-seconds to use as the timeout.
  89           * @param {string} id ID of the element which is going to be checked for changes.
  90           *
  91           * @return {void}
  92           */
  93  		function show(i, id) {
  94              var p, e = $('#' + id + ' div.inside:visible').find('.widget-loading');
  95              // If the element is found in the dom, queue to load latest representation.
  96              if ( e.length ) {
  97                  p = e.parent();
  98                  setTimeout( function(){
  99                      // Request the widget content.
 100                      p.load( ajaxurl + '?action=dashboard-widgets&widget=' + id + '&pagenow=' + pagenow, '', function() {
 101                          // Hide the parent and slide it out for visual fanciness.
 102                          p.hide().slideDown('normal', function(){
 103                              $(this).css('display', '');
 104                          });
 105                      });
 106                  }, i * 500 );
 107              }
 108          }
 109  
 110          // If we have received a specific element to fetch, check if it is valid.
 111          if ( el ) {
 112              el = el.toString();
 113              // If the element is available as Ajax widget, show it.
 114              if ( $.inArray(el, ajaxWidgets) !== -1 ) {
 115                  // Show element without any delay.
 116                  show(0, el);
 117              }
 118          } else {
 119              // Walk through all ajaxWidgets, loading them after each other.
 120              $.each( ajaxWidgets, show );
 121          }
 122      };
 123  
 124      // Initially populate ajax widgets.
 125      ajaxPopulateWidgets();
 126  
 127      // Register ajax widgets as postbox toggles.
 128      postboxes.add_postbox_toggles(pagenow, { pbshow: ajaxPopulateWidgets } );
 129  
 130      /**
 131       * Control the Quick Press (Quick Draft) widget.
 132       *
 133       * @since 2.7.0
 134       *
 135       * @global
 136       *
 137       * @return {void}
 138       */
 139      window.quickPressLoad = function() {
 140          var act = $('#quickpost-action'), t;
 141  
 142          // Enable the submit buttons.
 143          $( '#quick-press .submit input[type="submit"], #quick-press .submit input[type="reset"]' ).prop( 'disabled' , false );
 144  
 145          t = $('#quick-press').on( 'submit', function( e ) {
 146              e.preventDefault();
 147  
 148              // Show a spinner.
 149              $('#dashboard_quick_press #publishing-action .spinner').show();
 150  
 151              // Disable the submit button to prevent duplicate submissions.
 152              $('#quick-press .submit input[type="submit"], #quick-press .submit input[type="reset"]').prop('disabled', true);
 153  
 154              // Post the entered data to save it.
 155              $.post( t.attr( 'action' ), t.serializeArray(), function( data ) {
 156                  // Replace the form, and prepend the published post.
 157                  $('#dashboard_quick_press .inside').html( data );
 158                  $('#quick-press').removeClass('initial-form');
 159                  quickPressLoad();
 160                  highlightLatestPost();
 161  
 162                  // Focus the title to allow for quickly drafting another post.
 163                  $('#title').trigger( 'focus' );
 164              });
 165  
 166              /**
 167               * Highlights the latest post for one second.
 168               *
 169               * @return {void}
 170                */
 171  			function highlightLatestPost () {
 172                  var latestPost = $('.drafts ul li').first();
 173                  latestPost.css('background', '#fffbe5');
 174                  setTimeout(function () {
 175                      latestPost.css('background', 'none');
 176                  }, 1000);
 177              }
 178          } );
 179  
 180          // Change the QuickPost action to the publish value.
 181          $('#publish').on( 'click', function() { act.val( 'post-quickpress-publish' ); } );
 182  
 183          $('#quick-press').on( 'click focusin', function() {
 184              wpActiveEditor = 'content';
 185          });
 186  
 187          autoResizeTextarea();
 188      };
 189      window.quickPressLoad();
 190  
 191      // Enable the dragging functionality of the widgets.
 192      $( '.meta-box-sortables' ).sortable( 'option', 'containment', '#wpwrap' );
 193  
 194      /**
 195       * Adjust the height of the textarea based on the content.
 196       *
 197       * @since 3.6.0
 198       *
 199       * @return {void}
 200       */
 201  	function autoResizeTextarea() {
 202          // When IE8 or older is used to render this document, exit.
 203          if ( document.documentMode && document.documentMode < 9 ) {
 204              return;
 205          }
 206  
 207          // Add a hidden div. We'll copy over the text from the textarea to measure its height.
 208          $('body').append( '<div class="quick-draft-textarea-clone" style="display: none;"></div>' );
 209  
 210          var clone = $('.quick-draft-textarea-clone'),
 211              editor = $('#content'),
 212              editorHeight = editor.height(),
 213              /*
 214               * 100px roughly accounts for browser chrome and allows the
 215               * save draft button to show on-screen at the same time.
 216               */
 217              editorMaxHeight = $(window).height() - 100;
 218  
 219          /*
 220           * Match up textarea and clone div as much as possible.
 221           * Padding cannot be reliably retrieved using shorthand in all browsers.
 222           */
 223          clone.css({
 224              'font-family': editor.css('font-family'),
 225              'font-size':   editor.css('font-size'),
 226              'line-height': editor.css('line-height'),
 227              'padding-bottom': editor.css('paddingBottom'),
 228              'padding-left': editor.css('paddingLeft'),
 229              'padding-right': editor.css('paddingRight'),
 230              'padding-top': editor.css('paddingTop'),
 231              'white-space': 'pre-wrap',
 232              'word-wrap': 'break-word',
 233              'display': 'none'
 234          });
 235  
 236          // The 'propertychange' is used in IE < 9.
 237          editor.on('focus input propertychange', function() {
 238              var $this = $(this),
 239                  // Add a non-breaking space to ensure that the height of a trailing newline is
 240                  // included.
 241                  textareaContent = $this.val() + '&nbsp;',
 242                  // Add 2px to compensate for border-top & border-bottom.
 243                  cloneHeight = clone.css('width', $this.css('width')).text(textareaContent).outerHeight() + 2;
 244  
 245              // Default to show a vertical scrollbar, if needed.
 246              editor.css('overflow-y', 'auto');
 247  
 248              // Only change the height if it has changed and both heights are below the max.
 249              if ( cloneHeight === editorHeight || ( cloneHeight >= editorMaxHeight && editorHeight >= editorMaxHeight ) ) {
 250                  return;
 251              }
 252  
 253              /*
 254               * Don't allow editor to exceed the height of the window.
 255               * This is also bound in CSS to a max-height of 1300px to be extra safe.
 256               */
 257              if ( cloneHeight > editorMaxHeight ) {
 258                  editorHeight = editorMaxHeight;
 259              } else {
 260                  editorHeight = cloneHeight;
 261              }
 262  
 263              // Disable scrollbars because we adjust the height to the content.
 264              editor.css('overflow', 'hidden');
 265  
 266              $this.css('height', editorHeight + 'px');
 267          });
 268      }
 269  
 270  } );
 271  
 272  jQuery( function( $ ) {
 273      'use strict';
 274  
 275      var communityEventsData = window.communityEventsData,
 276          dateI18n = wp.date.dateI18n,
 277          format = wp.date.format,
 278          sprintf = wp.i18n.sprintf,
 279          __ = wp.i18n.__,
 280          _x = wp.i18n._x,
 281          app;
 282  
 283      /**
 284       * Global Community Events namespace.
 285       *
 286       * @since 4.8.0
 287       *
 288       * @memberOf wp
 289       * @namespace wp.communityEvents
 290       */
 291      app = window.wp.communityEvents = /** @lends wp.communityEvents */{
 292          initialized: false,
 293          model: null,
 294  
 295          /**
 296           * Initializes the wp.communityEvents object.
 297           *
 298           * @since 4.8.0
 299           *
 300           * @return {void}
 301           */
 302          init: function() {
 303              if ( app.initialized ) {
 304                  return;
 305              }
 306  
 307              var $container = $( '#community-events' );
 308  
 309              /*
 310               * When JavaScript is disabled, the errors container is shown, so
 311               * that "This widget requires JavaScript" message can be seen.
 312               *
 313               * When JS is enabled, the container is hidden at first, and then
 314               * revealed during the template rendering, if there actually are
 315               * errors to show.
 316               *
 317               * The display indicator switches from `hide-if-js` to `aria-hidden`
 318               * here in order to maintain consistency with all the other fields
 319               * that key off of `aria-hidden` to determine their visibility.
 320               * `aria-hidden` can't be used initially, because there would be no
 321               * way to set it to false when JavaScript is disabled, which would
 322               * prevent people from seeing the "This widget requires JavaScript"
 323               * message.
 324               */
 325              $( '.community-events-errors' )
 326                  .attr( 'aria-hidden', 'true' )
 327                  .removeClass( 'hide-if-js' );
 328  
 329              $container.on( 'click', '.community-events-toggle-location, .community-events-cancel', app.toggleLocationForm );
 330  
 331              /**
 332               * Filters events based on entered location.
 333               *
 334               * @return {void}
 335               */
 336              $container.on( 'submit', '.community-events-form', function( event ) {
 337                  var location = $( '#community-events-location' ).val().trim();
 338  
 339                  event.preventDefault();
 340  
 341                  /*
 342                   * Don't trigger a search if the search field is empty or the
 343                   * search term was made of only spaces before being trimmed.
 344                   */
 345                  if ( ! location ) {
 346                      return;
 347                  }
 348  
 349                  app.getEvents({
 350                      location: location
 351                  });
 352              });
 353  
 354              if ( communityEventsData && communityEventsData.cache && communityEventsData.cache.location && communityEventsData.cache.events ) {
 355                  app.renderEventsTemplate( communityEventsData.cache, 'app' );
 356              } else {
 357                  app.getEvents();
 358              }
 359  
 360              app.initialized = true;
 361          },
 362  
 363          /**
 364           * Toggles the visibility of the Edit Location form.
 365           *
 366           * @since 4.8.0
 367           *
 368           * @param {event|string} action 'show' or 'hide' to specify a state;
 369           *                              or an event object to flip between states.
 370           *
 371           * @return {void}
 372           */
 373          toggleLocationForm: function( action ) {
 374              var $toggleButton = $( '.community-events-toggle-location' ),
 375                  $cancelButton = $( '.community-events-cancel' ),
 376                  $form         = $( '.community-events-form' ),
 377                  $target       = $();
 378  
 379              if ( 'object' === typeof action ) {
 380                  // The action is the event object: get the clicked element.
 381                  $target = $( action.target );
 382                  /*
 383                   * Strict comparison doesn't work in this case because sometimes
 384                   * we explicitly pass a string as value of aria-expanded and
 385                   * sometimes a boolean as the result of an evaluation.
 386                   */
 387                  action = 'true' == $toggleButton.attr( 'aria-expanded' ) ? 'hide' : 'show';
 388              }
 389  
 390              if ( 'hide' === action ) {
 391                  $toggleButton.attr( 'aria-expanded', 'false' );
 392                  $cancelButton.attr( 'aria-expanded', 'false' );
 393                  $form.attr( 'aria-hidden', 'true' );
 394                  /*
 395                   * If the Cancel button has been clicked, bring the focus back
 396                   * to the toggle button so users relying on screen readers don't
 397                   * lose their place.
 398                   */
 399                  if ( $target.hasClass( 'community-events-cancel' ) ) {
 400                      $toggleButton.trigger( 'focus' );
 401                  }
 402              } else {
 403                  $toggleButton.attr( 'aria-expanded', 'true' );
 404                  $cancelButton.attr( 'aria-expanded', 'true' );
 405                  $form.attr( 'aria-hidden', 'false' );
 406              }
 407          },
 408  
 409          /**
 410           * Sends REST API requests to fetch events for the widget.
 411           *
 412           * @since 4.8.0
 413           *
 414           * @param {Object} requestParams REST API Request parameters object.
 415           *
 416           * @return {void}
 417           */
 418          getEvents: function( requestParams ) {
 419              var initiatedBy,
 420                  app = this,
 421                  $spinner = $( '.community-events-form' ).children( '.spinner' );
 422  
 423              requestParams          = requestParams || {};
 424              requestParams._wpnonce = communityEventsData.nonce;
 425              requestParams.timezone = window.Intl ? window.Intl.DateTimeFormat().resolvedOptions().timeZone : '';
 426  
 427              initiatedBy = requestParams.location ? 'user' : 'app';
 428  
 429              $spinner.addClass( 'is-active' );
 430  
 431              wp.ajax.post( 'get-community-events', requestParams )
 432                  .always( function() {
 433                      $spinner.removeClass( 'is-active' );
 434                  })
 435  
 436                  .done( function( response ) {
 437                      if ( 'no_location_available' === response.error ) {
 438                          if ( requestParams.location ) {
 439                              response.unknownCity = requestParams.location;
 440                          } else {
 441                              /*
 442                               * No location was passed, which means that this was an automatic query
 443                               * based on IP, locale, and timezone. Since the user didn't initiate it,
 444                               * it should fail silently. Otherwise, the error could confuse and/or
 445                               * annoy them.
 446                               */
 447                              delete response.error;
 448                          }
 449                      }
 450                      app.renderEventsTemplate( response, initiatedBy );
 451                  })
 452  
 453                  .fail( function() {
 454                      app.renderEventsTemplate({
 455                          'location' : false,
 456                          'events'   : [],
 457                          'error'    : true
 458                      }, initiatedBy );
 459                  });
 460          },
 461  
 462          /**
 463           * Renders the template for the Events section of the Events & News widget.
 464           *
 465           * @since 4.8.0
 466           *
 467           * @param {Object} templateParams The various parameters that will get passed to wp.template.
 468           * @param {string} initiatedBy    'user' to indicate that this was triggered manually by the user;
 469           *                                'app' to indicate it was triggered automatically by the app itself.
 470           *
 471           * @return {void}
 472           */
 473          renderEventsTemplate: function( templateParams, initiatedBy ) {
 474              var template,
 475                  elementVisibility,
 476                  $toggleButton    = $( '.community-events-toggle-location' ),
 477                  $locationMessage = $( '#community-events-location-message' ),
 478                  $results         = $( '.community-events-results' );
 479  
 480              templateParams.events = app.populateDynamicEventFields(
 481                  templateParams.events,
 482                  communityEventsData.time_format
 483              );
 484  
 485              /*
 486               * Hide all toggleable elements by default, to keep the logic simple.
 487               * Otherwise, each block below would have to turn hide everything that
 488               * could have been shown at an earlier point.
 489               *
 490               * The exception to that is that the .community-events container is hidden
 491               * when the page is first loaded, because the content isn't ready yet,
 492               * but once we've reached this point, it should always be shown.
 493               */
 494              elementVisibility = {
 495                  '.community-events'                  : true,
 496                  '.community-events-loading'          : false,
 497                  '.community-events-errors'           : false,
 498                  '.community-events-error-occurred'   : false,
 499                  '.community-events-could-not-locate' : false,
 500                  '#community-events-location-message' : false,
 501                  '.community-events-toggle-location'  : false,
 502                  '.community-events-results'          : false
 503              };
 504  
 505              /*
 506               * Determine which templates should be rendered and which elements
 507               * should be displayed.
 508               */
 509              if ( templateParams.location.ip ) {
 510                  /*
 511                   * If the API determined the location by geolocating an IP, it will
 512                   * provide events, but not a specific location.
 513                   */
 514                  $locationMessage.text( __( 'Attend an upcoming event near you.' ) );
 515  
 516                  if ( templateParams.events.length ) {
 517                      template = wp.template( 'community-events-event-list' );
 518                      $results.html( template( templateParams ) );
 519                  } else {
 520                      template = wp.template( 'community-events-no-upcoming-events' );
 521                      $results.html( template( templateParams ) );
 522                  }
 523  
 524                  elementVisibility['#community-events-location-message'] = true;
 525                  elementVisibility['.community-events-toggle-location']  = true;
 526                  elementVisibility['.community-events-results']          = true;
 527  
 528              } else if ( templateParams.location.description ) {
 529                  template = wp.template( 'community-events-attend-event-near' );
 530                  $locationMessage.html( template( templateParams ) );
 531  
 532                  if ( templateParams.events.length ) {
 533                      template = wp.template( 'community-events-event-list' );
 534                      $results.html( template( templateParams ) );
 535                  } else {
 536                      template = wp.template( 'community-events-no-upcoming-events' );
 537                      $results.html( template( templateParams ) );
 538                  }
 539  
 540                  if ( 'user' === initiatedBy ) {
 541                      wp.a11y.speak(
 542                          sprintf(
 543                              /* translators: %s: The name of a city. */
 544                              __( 'City updated. Listing events near %s.' ),
 545                              templateParams.location.description
 546                          ),
 547                          'assertive'
 548                      );
 549                  }
 550  
 551                  elementVisibility['#community-events-location-message'] = true;
 552                  elementVisibility['.community-events-toggle-location']  = true;
 553                  elementVisibility['.community-events-results']          = true;
 554  
 555              } else if ( templateParams.unknownCity ) {
 556                  template = wp.template( 'community-events-could-not-locate' );
 557                  $( '.community-events-could-not-locate' ).html( template( templateParams ) );
 558                  wp.a11y.speak(
 559                      sprintf(
 560                          /*
 561                           * These specific examples were chosen to highlight the fact that a
 562                           * state is not needed, even for cities whose name is not unique.
 563                           * It would be too cumbersome to include that in the instructions
 564                           * to the user, so it's left as an implication.
 565                           */
 566                          /*
 567                           * translators: %s is the name of the city we couldn't locate.
 568                           * Replace the examples with cities related to your locale. Test that
 569                           * they match the expected location and have upcoming events before
 570                           * including them. If no cities related to your locale have events,
 571                           * then use cities related to your locale that would be recognizable
 572                           * to most users. Use only the city name itself, without any region
 573                           * or country. Use the endonym (native locale name) instead of the
 574                           * English name if possible.
 575                           */
 576                          __( 'We couldn’t locate %s. Please try another nearby city. For example: Kansas City; Springfield; Portland.' ),
 577                          templateParams.unknownCity
 578                      )
 579                  );
 580  
 581                  elementVisibility['.community-events-errors']           = true;
 582                  elementVisibility['.community-events-could-not-locate'] = true;
 583  
 584              } else if ( templateParams.error && 'user' === initiatedBy ) {
 585                  /*
 586                   * Errors messages are only shown for requests that were initiated
 587                   * by the user, not for ones that were initiated by the app itself.
 588                   * Showing error messages for an event that user isn't aware of
 589                   * could be confusing or unnecessarily distracting.
 590                   */
 591                  wp.a11y.speak( __( 'An error occurred. Please try again.' ) );
 592  
 593                  elementVisibility['.community-events-errors']         = true;
 594                  elementVisibility['.community-events-error-occurred'] = true;
 595              } else {
 596                  $locationMessage.text( __( 'Enter your closest city to find nearby events.' ) );
 597  
 598                  elementVisibility['#community-events-location-message'] = true;
 599                  elementVisibility['.community-events-toggle-location']  = true;
 600              }
 601  
 602              // Set the visibility of toggleable elements.
 603              _.each( elementVisibility, function( isVisible, element ) {
 604                  $( element ).attr( 'aria-hidden', ! isVisible );
 605              });
 606  
 607              $toggleButton.attr( 'aria-expanded', elementVisibility['.community-events-toggle-location'] );
 608  
 609              if ( templateParams.location && ( templateParams.location.ip || templateParams.location.latitude ) ) {
 610                  // Hide the form when there's a valid location.
 611                  app.toggleLocationForm( 'hide' );
 612  
 613                  if ( 'user' === initiatedBy ) {
 614                      /*
 615                       * When the form is programmatically hidden after a user search,
 616                       * bring the focus back to the toggle button so users relying
 617                       * on screen readers don't lose their place.
 618                       */
 619                      $toggleButton.trigger( 'focus' );
 620                  }
 621              } else {
 622                  app.toggleLocationForm( 'show' );
 623              }
 624          },
 625  
 626          /**
 627           * Populate event fields that have to be calculated on the fly.
 628           *
 629           * These can't be stored in the database, because they're dependent on
 630           * the user's current time zone, locale, etc.
 631           *
 632           * @since 5.5.2
 633           *
 634           * @param {Array}  rawEvents  The events that should have dynamic fields added to them.
 635           * @param {string} timeFormat A time format acceptable by `wp.date.dateI18n()`.
 636           *
 637           * @returns {Array}
 638           */
 639          populateDynamicEventFields: function( rawEvents, timeFormat ) {
 640              // Clone the parameter to avoid mutating it, so that this can remain a pure function.
 641              var populatedEvents = JSON.parse( JSON.stringify( rawEvents ) );
 642  
 643              $.each( populatedEvents, function( index, event ) {
 644                  var timeZone = app.getTimeZone( event.start_unix_timestamp * 1000 );
 645  
 646                  event.user_formatted_date = app.getFormattedDate(
 647                      event.start_unix_timestamp * 1000,
 648                      event.end_unix_timestamp * 1000,
 649                      timeZone
 650                  );
 651  
 652                  event.user_formatted_time = dateI18n(
 653                      timeFormat,
 654                      event.start_unix_timestamp * 1000,
 655                      timeZone
 656                  );
 657  
 658                  event.timeZoneAbbreviation = app.getTimeZoneAbbreviation( event.start_unix_timestamp * 1000 );
 659              } );
 660  
 661              return populatedEvents;
 662          },
 663  
 664          /**
 665           * Returns the user's local/browser time zone, in a form suitable for `wp.date.i18n()`.
 666           *
 667           * @since 5.5.2
 668           *
 669           * @param startTimestamp
 670           *
 671           * @returns {string|number}
 672           */
 673          getTimeZone: function( startTimestamp ) {
 674              /*
 675               * Prefer a name like `Europe/Helsinki`, since that automatically tracks daylight savings. This
 676               * doesn't need to take `startTimestamp` into account for that reason.
 677               */
 678              var timeZone = Intl.DateTimeFormat().resolvedOptions().timeZone;
 679  
 680              /*
 681               * Fall back to an offset for IE11, which declares the property but doesn't assign a value.
 682               */
 683              if ( 'undefined' === typeof timeZone ) {
 684                  /*
 685                   * It's important to use the _event_ time, not the _current_
 686                   * time, so that daylight savings time is accounted for.
 687                   */
 688                  timeZone = app.getFlippedTimeZoneOffset( startTimestamp );
 689              }
 690  
 691              return timeZone;
 692          },
 693  
 694          /**
 695           * Get intuitive time zone offset.
 696           *
 697           * `Data.prototype.getTimezoneOffset()` returns a positive value for time zones
 698           * that are _behind_ UTC, and a _negative_ value for ones that are ahead.
 699           *
 700           * See https://stackoverflow.com/questions/21102435/why-does-javascript-date-gettimezoneoffset-consider-0500-as-a-positive-off.
 701           *
 702           * @since 5.5.2
 703           *
 704           * @param {number} startTimestamp
 705           *
 706           * @returns {number}
 707           */
 708          getFlippedTimeZoneOffset: function( startTimestamp ) {
 709              return new Date( startTimestamp ).getTimezoneOffset() * -1;
 710          },
 711  
 712          /**
 713           * Get a short time zone name, like `PST`.
 714           *
 715           * @since 5.5.2
 716           *
 717           * @param {number} startTimestamp
 718           *
 719           * @returns {string}
 720           */
 721          getTimeZoneAbbreviation: function( startTimestamp ) {
 722              var timeZoneAbbreviation,
 723                  eventDateTime = new Date( startTimestamp );
 724  
 725              /*
 726               * Leaving the `locales` argument undefined is important, so that the browser
 727               * displays the abbreviation that's most appropriate for the current locale. For
 728               * some that will be `UTC{+|-}{n}`, and for others it will be a code like `PST`.
 729               *
 730               * This doesn't need to take `startTimestamp` into account, because a name like
 731               * `America/Chicago` automatically tracks daylight savings.
 732               */
 733              var shortTimeStringParts = eventDateTime.toLocaleTimeString( undefined, { timeZoneName : 'short' } ).split( ' ' );
 734  
 735              if ( 3 === shortTimeStringParts.length ) {
 736                  timeZoneAbbreviation = shortTimeStringParts[2];
 737              }
 738  
 739              if ( 'undefined' === typeof timeZoneAbbreviation ) {
 740                  /*
 741                   * It's important to use the _event_ time, not the _current_
 742                   * time, so that daylight savings time is accounted for.
 743                   */
 744                  var timeZoneOffset = app.getFlippedTimeZoneOffset( startTimestamp ),
 745                      sign = -1 === Math.sign( timeZoneOffset ) ? '' : '+';
 746  
 747                  // translators: Used as part of a string like `GMT+5` in the Events Widget.
 748                  timeZoneAbbreviation = _x( 'GMT', 'Events widget offset prefix' ) + sign + ( timeZoneOffset / 60 );
 749              }
 750  
 751              return timeZoneAbbreviation;
 752          },
 753  
 754          /**
 755           * Format a start/end date in the user's local time zone and locale.
 756           *
 757           * @since 5.5.2
 758           *
 759           * @param {int}    startDate   The Unix timestamp in milliseconds when the the event starts.
 760           * @param {int}    endDate     The Unix timestamp in milliseconds when the the event ends.
 761           * @param {string} timeZone    A time zone string or offset which is parsable by `wp.date.i18n()`.
 762           *
 763           * @returns {string}
 764           */
 765          getFormattedDate: function( startDate, endDate, timeZone ) {
 766              var formattedDate;
 767  
 768              /*
 769               * The `date_format` option is not used because it's important
 770               * in this context to keep the day of the week in the displayed date,
 771               * so that users can tell at a glance if the event is on a day they
 772               * are available, without having to open the link.
 773               *
 774               * The case of crossing a year boundary is intentionally not handled.
 775               * It's so rare in practice that it's not worth the complexity
 776               * tradeoff. The _ending_ year should be passed to
 777               * `multiple_month_event`, though, just in case.
 778               */
 779              /* translators: Date format for upcoming events on the dashboard. Include the day of the week. See https://www.php.net/manual/datetime.format.php */
 780              var singleDayEvent = __( 'l, M j, Y' ),
 781                  /* translators: Date string for upcoming events. 1: Month, 2: Starting day, 3: Ending day, 4: Year. */
 782                  multipleDayEvent = __( '%1$s %2$d–%3$d, %4$d' ),
 783                  /* translators: Date string for upcoming events. 1: Starting month, 2: Starting day, 3: Ending month, 4: Ending day, 5: Ending year. */
 784                  multipleMonthEvent = __( '%1$s %2$d – %3$s %4$d, %5$d' );
 785  
 786              // Detect single-day events.
 787              if ( ! endDate || format( 'Y-m-d', startDate ) === format( 'Y-m-d', endDate ) ) {
 788                  formattedDate = dateI18n( singleDayEvent, startDate, timeZone );
 789  
 790              // Multiple day events.
 791              } else if ( format( 'Y-m', startDate ) === format( 'Y-m', endDate ) ) {
 792                  formattedDate = sprintf(
 793                      multipleDayEvent,
 794                      dateI18n( _x( 'F', 'upcoming events month format' ), startDate, timeZone ),
 795                      dateI18n( _x( 'j', 'upcoming events day format' ), startDate, timeZone ),
 796                      dateI18n( _x( 'j', 'upcoming events day format' ), endDate, timeZone ),
 797                      dateI18n( _x( 'Y', 'upcoming events year format' ), endDate, timeZone )
 798                  );
 799  
 800              // Multi-day events that cross a month boundary.
 801              } else {
 802                  formattedDate = sprintf(
 803                      multipleMonthEvent,
 804                      dateI18n( _x( 'F', 'upcoming events month format' ), startDate, timeZone ),
 805                      dateI18n( _x( 'j', 'upcoming events day format' ), startDate, timeZone ),
 806                      dateI18n( _x( 'F', 'upcoming events month format' ), endDate, timeZone ),
 807                      dateI18n( _x( 'j', 'upcoming events day format' ), endDate, timeZone ),
 808                      dateI18n( _x( 'Y', 'upcoming events year format' ), endDate, timeZone )
 809                  );
 810              }
 811  
 812              return formattedDate;
 813          }
 814      };
 815  
 816      if ( $( '#dashboard_primary' ).is( ':visible' ) ) {
 817          app.init();
 818      } else {
 819          $( document ).on( 'postbox-toggled', function( event, postbox ) {
 820              var $postbox = $( postbox );
 821  
 822              if ( 'dashboard_primary' === $postbox.attr( 'id' ) && $postbox.is( ':visible' ) ) {
 823                  app.init();
 824              }
 825          });
 826      }
 827  });
 828  
 829  /**
 830   * Removed in 5.6.0, needed for back-compatibility.
 831   *
 832   * @since 4.8.0
 833   * @deprecated 5.6.0
 834   *
 835   * @type {object}
 836  */
 837  window.communityEventsData.l10n = window.communityEventsData.l10n || {
 838      enter_closest_city: '',
 839      error_occurred_please_try_again: '',
 840      attend_event_near_generic: '',
 841      could_not_locate_city: '',
 842      city_updated: ''
 843  };
 844  
 845  window.communityEventsData.l10n = window.wp.deprecateL10nObject( 'communityEventsData.l10n', window.communityEventsData.l10n, '5.6.0' );