Re-factor the EventBus to allow servicing of "external" event listeners *after* the viewer components have updated

Since the goal has always been, essentially since the `EventBus` abstraction was added, to remove all dispatching of DOM events[1] from the viewer components this patch tries to address one thing that came up when updating the examples:
The DOM events are always dispatched last, and it's thus guaranteed that all internal event listeners have been invoked first.
However, there's no such guarantees with the general `EventBus` functionality and the order in which event listeners are invoked is *not* specified. With the promotion of the `EventBus` in the examples, over DOM events, it seems like a good idea to at least *try* to keep this ordering invariant[2] intact.

Obviously this won't prevent anyone from manually calling the new *internal* viewer component methods on the `EventBus`, but hopefully that won't be too common since any existing third-party code would obviously use the `on`/`off` methods and that all of the examples shows the *correct* usage (which should be similarily documented on the "Third party viewer usage" Wiki-page).

---
[1] Looking at the various Firefox-tests, I'm not sure that it'll be possible to (easily) re-write all of them to not rely on DOM events (since getting access to `PDFViewerApplication` might be generally difficult/messy depending on scopes).
In any case, even if technically feasible, it would most likely add *a lot* of complication that may not be desireable in the various Firefox-tests. All-in-all, I'd be fine with keeping the DOM events only for the `MOZCENTRAL` target and gated on `Cu.isInAutomation` (or similar) rather than a preference.

[2] I wouldn't expect any *real* bugs in a custom implementation, simply based on event ordering, but it nonetheless seem like a good idea if any "external" events are still handled last.

web/ui_utils.js

@@ -766,22 +766,20 @@ class EventBus {
     this._dispatchToDOM = dispatchToDOM === true;
   }
 
+  /**
+   * @param {string} eventName
+   * @param {function} listener
+   */
   on(eventName, listener) {
-    let eventListeners = this._listeners[eventName];
-    if (!eventListeners) {
-      eventListeners = [];
-      this._listeners[eventName] = eventListeners;
-    }
-    eventListeners.push(listener);
+    this._on(eventName, listener, { external: true });
   }
 
+  /**
+   * @param {string} eventName
+   * @param {function} listener
+   */
   off(eventName, listener) {
-    const eventListeners = this._listeners[eventName];
-    let i;
-    if (!eventListeners || (i = eventListeners.indexOf(listener)) < 0) {
-      return;
-    }
-    eventListeners.splice(i, 1);
+    this._off(eventName, listener, { external: true });
   }
 
   dispatch(eventName) {
@@ -795,16 +793,62 @@ class EventBus {
     }
     // Passing all arguments after the eventName to the listeners.
     const args = Array.prototype.slice.call(arguments, 1);
+    let externalListeners;
     // Making copy of the listeners array in case if it will be modified
     // during dispatch.
-    eventListeners.slice(0).forEach(function(listener) {
+    eventListeners.slice(0).forEach(function({ listener, external }) {
+      if (external) {
+        if (!externalListeners) {
+          externalListeners = [];
+        }
+        externalListeners.push(listener);
+        return;
+      }
       listener.apply(null, args);
     });
+    // Dispatch any "external" listeners *after* the internal ones, to give the
+    // viewer components time to handle events and update their state first.
+    if (externalListeners) {
+      externalListeners.forEach(function(listener) {
+        listener.apply(null, args);
+      });
+      externalListeners = null;
+    }
     if (this._dispatchToDOM) {
       this._dispatchDOMEvent(eventName, args);
     }
   }
 
+  /**
+   * @ignore
+   */
+  _on(eventName, listener, options = null) {
+    let eventListeners = this._listeners[eventName];
+    if (!eventListeners) {
+      this._listeners[eventName] = eventListeners = [];
+    }
+    eventListeners.push({
+      listener,
+      external: options ? options.external : false,
+    });
+  }
+
+  /**
+   * @ignore
+   */
+  _off(eventName, listener, options = null) {
+    const eventListeners = this._listeners[eventName];
+    if (!eventListeners) {
+      return;
+    }
+    for (let i = 0, ii = eventListeners.length; i < ii; i++) {
+      if (eventListeners[i].listener === listener) {
+        eventListeners.splice(i, 1);
+        return;
+      }
+    }
+  }
+
   /**
    * @private
    */