Convert the secondary toolbar to ES6 syntax

web/secondary_toolbar.js

@@ -45,17 +45,13 @@ import { mozL10n, SCROLLBAR_PADDING } from './ui_utils';
  *   the document properties dialog.
  */
 
+class SecondaryToolbar {
   /**
- * @class
- */
-var SecondaryToolbar = (function SecondaryToolbarClosure() {
-  /**
-   * @constructs SecondaryToolbar
    * @param {SecondaryToolbarOptions} options
    * @param {HTMLDivElement} mainContainer
    * @param {EventBus} eventBus
    */
-  function SecondaryToolbar(options, mainContainer, eventBus) {
+  constructor(options, mainContainer, eventBus) {
     this.toolbar = options.toolbar;
     this.toggleButton = options.toggleButton;
     this.toolbarButtonContainer = options.toolbarButtonContainer;
@@ -101,40 +97,37 @@ var SecondaryToolbar = (function SecondaryToolbarClosure() {
     this.eventBus.on('resize', this._setMaxHeight.bind(this));
   }
 
-  SecondaryToolbar.prototype = {
   /**
    * @return {boolean}
    */
   get isOpen() {
     return this.opened;
-    },
+  }
 
-    setPageNumber: function SecondaryToolbar_setPageNumber(pageNumber) {
+  setPageNumber(pageNumber) {
     this.pageNumber = pageNumber;
     this._updateUIState();
-    },
+  }
 
-    setPagesCount: function SecondaryToolbar_setPagesCount(pagesCount) {
+  setPagesCount(pagesCount) {
     this.pagesCount = pagesCount;
     this._updateUIState();
-    },
+  }
 
-    reset: function SecondaryToolbar_reset() {
+  reset() {
     this.pageNumber = 0;
     this.pagesCount = 0;
     this._updateUIState();
-    },
+  }
 
-    _updateUIState: function SecondaryToolbar_updateUIState() {
-      var items = this.items;
+  _updateUIState() {
+    this.items.firstPage.disabled = (this.pageNumber <= 1);
+    this.items.lastPage.disabled = (this.pageNumber >= this.pagesCount);
+    this.items.pageRotateCw.disabled = this.pagesCount === 0;
+    this.items.pageRotateCcw.disabled = this.pagesCount === 0;
+  }
 
-      items.firstPage.disabled = (this.pageNumber <= 1);
-      items.lastPage.disabled = (this.pageNumber >= this.pagesCount);
-      items.pageRotateCw.disabled = this.pagesCount === 0;
-      items.pageRotateCcw.disabled = this.pagesCount === 0;
-    },
-
-    _bindClickListeners: function SecondaryToolbar_bindClickListeners() {
+  _bindClickListeners() {
     // Button to toggle the visibility of the secondary toolbar.
     this.toggleButton.addEventListener('click', this.toggle.bind(this));
 
@@ -151,16 +144,17 @@ var SecondaryToolbar = (function SecondaryToolbarClosure() {
         }
       });
     }
-    },
+  }
 
-    _bindHandToolListener:
-        function SecondaryToolbar_bindHandToolListener(toggleHandToolButton) {
-      var isHandToolActive = false;
-      this.eventBus.on('handtoolchanged', function (e) {
-        if (isHandToolActive === e.isActive) {
+  _bindHandToolListener(toggleHandToolButton) {
+    let isHandToolActive = false;
+
+    this.eventBus.on('handtoolchanged', function(evt) {
+      if (isHandToolActive === evt.isActive) {
         return;
       }
-        isHandToolActive = e.isActive;
+      isHandToolActive = evt.isActive;
+
       if (isHandToolActive) {
         toggleHandToolButton.title =
           mozL10n.get('hand_tool_disable.title', null, 'Disable hand tool');
@@ -173,9 +167,9 @@ var SecondaryToolbar = (function SecondaryToolbarClosure() {
           mozL10n.get('hand_tool_enable_label', null, 'Enable hand tool');
       }
     });
-    },
+  }
 
-    open: function SecondaryToolbar_open() {
+  open() {
     if (this.opened) {
       return;
     }
@@ -184,29 +178,29 @@ var SecondaryToolbar = (function SecondaryToolbarClosure() {
 
     this.toggleButton.classList.add('toggled');
     this.toolbar.classList.remove('hidden');
-    },
+  }
 
-    close: function SecondaryToolbar_close() {
+  close() {
     if (!this.opened) {
       return;
     }
     this.opened = false;
     this.toolbar.classList.add('hidden');
     this.toggleButton.classList.remove('toggled');
-    },
+  }
 
-    toggle: function SecondaryToolbar_toggle() {
+  toggle() {
     if (this.opened) {
       this.close();
     } else {
       this.open();
     }
-    },
+  }
 
   /**
    * @private
    */
-    _setMaxHeight: function SecondaryToolbar_setMaxHeight() {
+  _setMaxHeight() {
     if (!this.opened) {
       return; // Only adjust the 'max-height' if the toolbar is visible.
     }
@@ -220,10 +214,7 @@ var SecondaryToolbar = (function SecondaryToolbarClosure() {
 
     this.previousContainerHeight = this.containerHeight;
   }
-  };
-
-  return SecondaryToolbar;
-})();
+}
 
 export {
   SecondaryToolbar,