diff --git a/web/hand_tool.js b/web/hand_tool.js index fa0ffd9cb..48e0c4ca0 100644 --- a/web/hand_tool.js +++ b/web/hand_tool.js @@ -20,20 +20,17 @@ import { localized } from './ui_utils'; * @typedef {Object} HandToolOptions * @property {HTMLDivElement} container - The document container. * @property {EventBus} eventBus - The application event bus. + * @property {BasePreferences} preferences - Object for reading/writing + * persistent settings. */ -/** - * @class - */ -var HandTool = (function HandToolClosure() { +class HandTool { /** - * @constructs HandTool * @param {HandToolOptions} options */ - function HandTool(options) { - this.container = options.container; - this.eventBus = options.eventBus; - var preferences = options.preferences; + constructor({ container, eventBus, preferences, }) { + this.container = container; + this.eventBus = eventBus; this.wasActive = false; @@ -46,12 +43,12 @@ var HandTool = (function HandToolClosure() { this.eventBus.on('togglehandtool', this.toggle.bind(this)); - Promise.all([localized, - preferences.get('enableHandToolOnLoad')]).then((values) => { + let enableOnLoad = preferences.get('enableHandToolOnLoad'); + Promise.all([localized, enableOnLoad]).then((values) => { if (values[1] === true) { this.handTool.activate(); } - }).catch(function rejected(reason) { }); + }).catch(function(reason) {}); this.eventBus.on('presentationmodechanged', (evt) => { if (evt.switchInProgress) { @@ -65,35 +62,31 @@ var HandTool = (function HandToolClosure() { }); } - HandTool.prototype = { - /** - * @return {boolean} - */ - get isActive() { - return !!this.handTool.active; - }, + /** + * @return {boolean} + */ + get isActive() { + return !!this.handTool.active; + } - toggle: function HandTool_toggle() { - this.handTool.toggle(); - }, + toggle() { + this.handTool.toggle(); + } - enterPresentationMode: function HandTool_enterPresentationMode() { - if (this.isActive) { - this.wasActive = true; - this.handTool.deactivate(); - } - }, - - exitPresentationMode: function HandTool_exitPresentationMode() { - if (this.wasActive) { - this.wasActive = false; - this.handTool.activate(); - } + enterPresentationMode() { + if (this.isActive) { + this.wasActive = true; + this.handTool.deactivate(); } - }; + } - return HandTool; -})(); + exitPresentationMode() { + if (this.wasActive) { + this.wasActive = false; + this.handTool.activate(); + } + } +} export { HandTool, diff --git a/web/interfaces.js b/web/interfaces.js index 39fa8706d..fe01288c7 100644 --- a/web/interfaces.js +++ b/web/interfaces.js @@ -19,82 +19,87 @@ /** * @interface */ -function IPDFLinkService() {} -IPDFLinkService.prototype = { +class IPDFLinkService { /** * @returns {number} */ - get page() {}, + get page() {} + /** * @param {number} value */ - set page(value) {}, + set page(value) {} + /** * @param dest - The PDF destination object. */ - navigateTo(dest) {}, + navigateTo(dest) {} + /** * @param dest - The PDF destination object. * @returns {string} The hyperlink to the PDF object. */ - getDestinationHash(dest) {}, + getDestinationHash(dest) {} + /** * @param hash - The PDF parameters/hash. * @returns {string} The hyperlink to the PDF object. */ - getAnchorUrl(hash) {}, + getAnchorUrl(hash) {} + /** * @param {string} hash */ - setHash(hash) {}, + setHash(hash) {} + /** * @param {string} action */ - executeNamedAction(action) {}, + executeNamedAction(action) {} /** * @param {number} pageNum - page number. * @param {Object} pageRef - reference to the page. */ - cachePageRef(pageNum, pageRef) {}, -}; + cachePageRef(pageNum, pageRef) {} +} /** * @interface */ -function IPDFHistory() {} -IPDFHistory.prototype = { - forward() {}, - back() {}, - push(params) {}, - updateNextHashParam(hash) {}, -}; +class IPDFHistory { + forward() {} + back() {} + push(params) {} + updateNextHashParam(hash) {} +} /** * @interface */ -function IRenderableView() {} -IRenderableView.prototype = { +class IRenderableView { /** * @returns {string} - Unique ID for rendering queue. */ - get renderingId() {}, + get renderingId() {} + /** * @returns {RenderingStates} */ - get renderingState() {}, + get renderingState() {} + /** * @returns {Promise} Resolved on draw completion. */ - draw() {}, - resume() {}, -}; + draw() {} + + resume() {} +} /** * @interface */ -function IPDFTextLayerFactory() {} -IPDFTextLayerFactory.prototype = { +class IPDFTextLayerFactory { /** * @param {HTMLDivElement} textLayerDiv * @param {number} pageIndex @@ -104,7 +109,7 @@ IPDFTextLayerFactory.prototype = { */ createTextLayerBuilder(textLayerDiv, pageIndex, viewport, enhanceTextSelection = false) {} -}; +} /** * @interface diff --git a/web/secondary_toolbar.js b/web/secondary_toolbar.js index 0a7b512a8..c86e073d6 100644 --- a/web/secondary_toolbar.js +++ b/web/secondary_toolbar.js @@ -45,17 +45,13 @@ import { mozL10n, SCROLLBAR_PADDING } from './ui_utils'; * the document properties dialog. */ -/** - * @class - */ -var SecondaryToolbar = (function SecondaryToolbarClosure() { +class SecondaryToolbar { /** - * @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,129 +97,124 @@ var SecondaryToolbar = (function SecondaryToolbarClosure() { this.eventBus.on('resize', this._setMaxHeight.bind(this)); } - SecondaryToolbar.prototype = { - /** - * @return {boolean} - */ - get isOpen() { - return this.opened; - }, + /** + * @return {boolean} + */ + get isOpen() { + return this.opened; + } - setPageNumber: function SecondaryToolbar_setPageNumber(pageNumber) { - this.pageNumber = pageNumber; - this._updateUIState(); - }, + setPageNumber(pageNumber) { + this.pageNumber = pageNumber; + this._updateUIState(); + } - setPagesCount: function SecondaryToolbar_setPagesCount(pagesCount) { - this.pagesCount = pagesCount; - this._updateUIState(); - }, + setPagesCount(pagesCount) { + this.pagesCount = pagesCount; + this._updateUIState(); + } - reset: function SecondaryToolbar_reset() { - this.pageNumber = 0; - this.pagesCount = 0; - this._updateUIState(); - }, + 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() { + // Button to toggle the visibility of the secondary toolbar. + this.toggleButton.addEventListener('click', this.toggle.bind(this)); - _bindClickListeners: function SecondaryToolbar_bindClickListeners() { - // Button to toggle the visibility of the secondary toolbar. - this.toggleButton.addEventListener('click', this.toggle.bind(this)); + // All items within the secondary toolbar. + for (let button in this.buttons) { + let { element, eventName, close, } = this.buttons[button]; - // All items within the secondary toolbar. - for (let button in this.buttons) { - let { element, eventName, close, } = this.buttons[button]; - - element.addEventListener('click', (evt) => { - if (eventName !== null) { - this.eventBus.dispatch(eventName, { source: this, }); - } - if (close) { - this.close(); - } - }); - } - }, - - _bindHandToolListener: - function SecondaryToolbar_bindHandToolListener(toggleHandToolButton) { - var isHandToolActive = false; - this.eventBus.on('handtoolchanged', function (e) { - if (isHandToolActive === e.isActive) { - return; + element.addEventListener('click', (evt) => { + if (eventName !== null) { + this.eventBus.dispatch(eventName, { source: this, }); } - isHandToolActive = e.isActive; - if (isHandToolActive) { - toggleHandToolButton.title = - mozL10n.get('hand_tool_disable.title', null, 'Disable hand tool'); - toggleHandToolButton.firstElementChild.textContent = - mozL10n.get('hand_tool_disable_label', null, 'Disable hand tool'); - } else { - toggleHandToolButton.title = - mozL10n.get('hand_tool_enable.title', null, 'Enable hand tool'); - toggleHandToolButton.firstElementChild.textContent = - mozL10n.get('hand_tool_enable_label', null, 'Enable hand tool'); + if (close) { + this.close(); } }); - }, - - open: function SecondaryToolbar_open() { - if (this.opened) { - return; - } - this.opened = true; - this._setMaxHeight(); - - this.toggleButton.classList.add('toggled'); - this.toolbar.classList.remove('hidden'); - }, - - close: function SecondaryToolbar_close() { - if (!this.opened) { - return; - } - this.opened = false; - this.toolbar.classList.add('hidden'); - this.toggleButton.classList.remove('toggled'); - }, - - toggle: function SecondaryToolbar_toggle() { - if (this.opened) { - this.close(); - } else { - this.open(); - } - }, - - /** - * @private - */ - _setMaxHeight: function SecondaryToolbar_setMaxHeight() { - if (!this.opened) { - return; // Only adjust the 'max-height' if the toolbar is visible. - } - this.containerHeight = this.mainContainer.clientHeight; - - if (this.containerHeight === this.previousContainerHeight) { - return; - } - this.toolbarButtonContainer.setAttribute('style', - 'max-height: ' + (this.containerHeight - SCROLLBAR_PADDING) + 'px;'); - - this.previousContainerHeight = this.containerHeight; } - }; + } - return SecondaryToolbar; -})(); + _bindHandToolListener(toggleHandToolButton) { + let isHandToolActive = false; + + this.eventBus.on('handtoolchanged', function(evt) { + if (isHandToolActive === evt.isActive) { + return; + } + isHandToolActive = evt.isActive; + + if (isHandToolActive) { + toggleHandToolButton.title = + mozL10n.get('hand_tool_disable.title', null, 'Disable hand tool'); + toggleHandToolButton.firstElementChild.textContent = + mozL10n.get('hand_tool_disable_label', null, 'Disable hand tool'); + } else { + toggleHandToolButton.title = + mozL10n.get('hand_tool_enable.title', null, 'Enable hand tool'); + toggleHandToolButton.firstElementChild.textContent = + mozL10n.get('hand_tool_enable_label', null, 'Enable hand tool'); + } + }); + } + + open() { + if (this.opened) { + return; + } + this.opened = true; + this._setMaxHeight(); + + this.toggleButton.classList.add('toggled'); + this.toolbar.classList.remove('hidden'); + } + + close() { + if (!this.opened) { + return; + } + this.opened = false; + this.toolbar.classList.add('hidden'); + this.toggleButton.classList.remove('toggled'); + } + + toggle() { + if (this.opened) { + this.close(); + } else { + this.open(); + } + } + + /** + * @private + */ + _setMaxHeight() { + if (!this.opened) { + return; // Only adjust the 'max-height' if the toolbar is visible. + } + this.containerHeight = this.mainContainer.clientHeight; + + if (this.containerHeight === this.previousContainerHeight) { + return; + } + this.toolbarButtonContainer.setAttribute('style', + 'max-height: ' + (this.containerHeight - SCROLLBAR_PADDING) + 'px;'); + + this.previousContainerHeight = this.containerHeight; + } +} export { SecondaryToolbar,