secondary_toolbar.js 6.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180
  1. /* Copyright 2017 Mozilla Foundation
  2. *
  3. * Licensed under the Apache License, Version 2.0 (the "License");
  4. * you may not use this file except in compliance with the License.
  5. * You may obtain a copy of the License at
  6. *
  7. * http://www.apache.org/licenses/LICENSE-2.0
  8. *
  9. * Unless required by applicable law or agreed to in writing, software
  10. * distributed under the License is distributed on an "AS IS" BASIS,
  11. * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  12. * See the License for the specific language governing permissions and
  13. * limitations under the License.
  14. */
  15. 'use strict';
  16. var uiUtils = require('./ui_utils.js');
  17. var SCROLLBAR_PADDING = uiUtils.SCROLLBAR_PADDING;
  18. var mozL10n = uiUtils.mozL10n;
  19. var SecondaryToolbar = function SecondaryToolbarClosure() {
  20. function SecondaryToolbar(options, mainContainer, eventBus) {
  21. this.toolbar = options.toolbar;
  22. this.toggleButton = options.toggleButton;
  23. this.toolbarButtonContainer = options.toolbarButtonContainer;
  24. this.buttons = [{
  25. element: options.presentationModeButton,
  26. eventName: 'presentationmode',
  27. close: true
  28. }, {
  29. element: options.openFileButton,
  30. eventName: 'openfile',
  31. close: true
  32. }, {
  33. element: options.printButton,
  34. eventName: 'print',
  35. close: true
  36. }, {
  37. element: options.downloadButton,
  38. eventName: 'download',
  39. close: true
  40. }, {
  41. element: options.viewBookmarkButton,
  42. eventName: null,
  43. close: true
  44. }, {
  45. element: options.firstPageButton,
  46. eventName: 'firstpage',
  47. close: true
  48. }, {
  49. element: options.lastPageButton,
  50. eventName: 'lastpage',
  51. close: true
  52. }, {
  53. element: options.pageRotateCwButton,
  54. eventName: 'rotatecw',
  55. close: false
  56. }, {
  57. element: options.pageRotateCcwButton,
  58. eventName: 'rotateccw',
  59. close: false
  60. }, {
  61. element: options.toggleHandToolButton,
  62. eventName: 'togglehandtool',
  63. close: true
  64. }, {
  65. element: options.documentPropertiesButton,
  66. eventName: 'documentproperties',
  67. close: true
  68. }];
  69. this.items = {
  70. firstPage: options.firstPageButton,
  71. lastPage: options.lastPageButton,
  72. pageRotateCw: options.pageRotateCwButton,
  73. pageRotateCcw: options.pageRotateCcwButton
  74. };
  75. this.mainContainer = mainContainer;
  76. this.eventBus = eventBus;
  77. this.opened = false;
  78. this.containerHeight = null;
  79. this.previousContainerHeight = null;
  80. this.reset();
  81. this._bindClickListeners();
  82. this._bindHandToolListener(options.toggleHandToolButton);
  83. this.eventBus.on('resize', this._setMaxHeight.bind(this));
  84. }
  85. SecondaryToolbar.prototype = {
  86. get isOpen() {
  87. return this.opened;
  88. },
  89. setPageNumber: function SecondaryToolbar_setPageNumber(pageNumber) {
  90. this.pageNumber = pageNumber;
  91. this._updateUIState();
  92. },
  93. setPagesCount: function SecondaryToolbar_setPagesCount(pagesCount) {
  94. this.pagesCount = pagesCount;
  95. this._updateUIState();
  96. },
  97. reset: function SecondaryToolbar_reset() {
  98. this.pageNumber = 0;
  99. this.pagesCount = 0;
  100. this._updateUIState();
  101. },
  102. _updateUIState: function SecondaryToolbar_updateUIState() {
  103. var items = this.items;
  104. items.firstPage.disabled = this.pageNumber <= 1;
  105. items.lastPage.disabled = this.pageNumber >= this.pagesCount;
  106. items.pageRotateCw.disabled = this.pagesCount === 0;
  107. items.pageRotateCcw.disabled = this.pagesCount === 0;
  108. },
  109. _bindClickListeners: function SecondaryToolbar_bindClickListeners() {
  110. this.toggleButton.addEventListener('click', this.toggle.bind(this));
  111. for (var button in this.buttons) {
  112. var element = this.buttons[button].element;
  113. var eventName = this.buttons[button].eventName;
  114. var close = this.buttons[button].close;
  115. element.addEventListener('click', function (eventName, close) {
  116. if (eventName !== null) {
  117. this.eventBus.dispatch(eventName, { source: this });
  118. }
  119. if (close) {
  120. this.close();
  121. }
  122. }.bind(this, eventName, close));
  123. }
  124. },
  125. _bindHandToolListener: function SecondaryToolbar_bindHandToolListener(toggleHandToolButton) {
  126. var isHandToolActive = false;
  127. this.eventBus.on('handtoolchanged', function (e) {
  128. if (isHandToolActive === e.isActive) {
  129. return;
  130. }
  131. isHandToolActive = e.isActive;
  132. if (isHandToolActive) {
  133. toggleHandToolButton.title = mozL10n.get('hand_tool_disable.title', null, 'Disable hand tool');
  134. toggleHandToolButton.firstElementChild.textContent = mozL10n.get('hand_tool_disable_label', null, 'Disable hand tool');
  135. } else {
  136. toggleHandToolButton.title = mozL10n.get('hand_tool_enable.title', null, 'Enable hand tool');
  137. toggleHandToolButton.firstElementChild.textContent = mozL10n.get('hand_tool_enable_label', null, 'Enable hand tool');
  138. }
  139. });
  140. },
  141. open: function SecondaryToolbar_open() {
  142. if (this.opened) {
  143. return;
  144. }
  145. this.opened = true;
  146. this._setMaxHeight();
  147. this.toggleButton.classList.add('toggled');
  148. this.toolbar.classList.remove('hidden');
  149. },
  150. close: function SecondaryToolbar_close() {
  151. if (!this.opened) {
  152. return;
  153. }
  154. this.opened = false;
  155. this.toolbar.classList.add('hidden');
  156. this.toggleButton.classList.remove('toggled');
  157. },
  158. toggle: function SecondaryToolbar_toggle() {
  159. if (this.opened) {
  160. this.close();
  161. } else {
  162. this.open();
  163. }
  164. },
  165. _setMaxHeight: function SecondaryToolbar_setMaxHeight() {
  166. if (!this.opened) {
  167. return;
  168. }
  169. this.containerHeight = this.mainContainer.clientHeight;
  170. if (this.containerHeight === this.previousContainerHeight) {
  171. return;
  172. }
  173. this.toolbarButtonContainer.setAttribute('style', 'max-height: ' + (this.containerHeight - SCROLLBAR_PADDING) + 'px;');
  174. this.previousContainerHeight = this.containerHeight;
  175. }
  176. };
  177. return SecondaryToolbar;
  178. }();
  179. exports.SecondaryToolbar = SecondaryToolbar;