Convert the secondary toolbar to ES6 syntax

This commit is contained in:
Tim van der Meij 2017-05-07 21:43:50 +02:00
parent bc49524ac7
commit 67049602c5
No known key found for this signature in database
GPG Key ID: 8C3FD2925A5F2762

View File

@ -45,17 +45,13 @@ import { mozL10n, SCROLLBAR_PADDING } from './ui_utils';
* the document properties dialog. * the document properties dialog.
*/ */
/** class SecondaryToolbar {
* @class
*/
var SecondaryToolbar = (function SecondaryToolbarClosure() {
/** /**
* @constructs SecondaryToolbar
* @param {SecondaryToolbarOptions} options * @param {SecondaryToolbarOptions} options
* @param {HTMLDivElement} mainContainer * @param {HTMLDivElement} mainContainer
* @param {EventBus} eventBus * @param {EventBus} eventBus
*/ */
function SecondaryToolbar(options, mainContainer, eventBus) { constructor(options, mainContainer, eventBus) {
this.toolbar = options.toolbar; this.toolbar = options.toolbar;
this.toggleButton = options.toggleButton; this.toggleButton = options.toggleButton;
this.toolbarButtonContainer = options.toolbarButtonContainer; this.toolbarButtonContainer = options.toolbarButtonContainer;
@ -101,129 +97,124 @@ var SecondaryToolbar = (function SecondaryToolbarClosure() {
this.eventBus.on('resize', this._setMaxHeight.bind(this)); this.eventBus.on('resize', this._setMaxHeight.bind(this));
} }
SecondaryToolbar.prototype = { /**
/** * @return {boolean}
* @return {boolean} */
*/ get isOpen() {
get isOpen() { return this.opened;
return this.opened; }
},
setPageNumber: function SecondaryToolbar_setPageNumber(pageNumber) { setPageNumber(pageNumber) {
this.pageNumber = pageNumber; this.pageNumber = pageNumber;
this._updateUIState(); this._updateUIState();
}, }
setPagesCount: function SecondaryToolbar_setPagesCount(pagesCount) { setPagesCount(pagesCount) {
this.pagesCount = pagesCount; this.pagesCount = pagesCount;
this._updateUIState(); this._updateUIState();
}, }
reset: function SecondaryToolbar_reset() { reset() {
this.pageNumber = 0; this.pageNumber = 0;
this.pagesCount = 0; this.pagesCount = 0;
this._updateUIState(); this._updateUIState();
}, }
_updateUIState: function SecondaryToolbar_updateUIState() { _updateUIState() {
var items = this.items; 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); _bindClickListeners() {
items.lastPage.disabled = (this.pageNumber >= this.pagesCount); // Button to toggle the visibility of the secondary toolbar.
items.pageRotateCw.disabled = this.pagesCount === 0; this.toggleButton.addEventListener('click', this.toggle.bind(this));
items.pageRotateCcw.disabled = this.pagesCount === 0;
},
_bindClickListeners: function SecondaryToolbar_bindClickListeners() { // All items within the secondary toolbar.
// Button to toggle the visibility of the secondary toolbar. for (let button in this.buttons) {
this.toggleButton.addEventListener('click', this.toggle.bind(this)); let { element, eventName, close, } = this.buttons[button];
// All items within the secondary toolbar. element.addEventListener('click', (evt) => {
for (let button in this.buttons) { if (eventName !== null) {
let { element, eventName, close, } = this.buttons[button]; this.eventBus.dispatch(eventName, { source: this, });
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;
} }
isHandToolActive = e.isActive; if (close) {
if (isHandToolActive) { this.close();
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: 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 { export {
SecondaryToolbar, SecondaryToolbar,