secondary_toolbar.js 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365
  1. /**
  2. * @licstart The following is the entire license notice for the
  3. * Javascript code in this page
  4. *
  5. * Copyright 2019 Mozilla Foundation
  6. *
  7. * Licensed under the Apache License, Version 2.0 (the "License");
  8. * you may not use this file except in compliance with the License.
  9. * You may obtain a copy of the License at
  10. *
  11. * http://www.apache.org/licenses/LICENSE-2.0
  12. *
  13. * Unless required by applicable law or agreed to in writing, software
  14. * distributed under the License is distributed on an "AS IS" BASIS,
  15. * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  16. * See the License for the specific language governing permissions and
  17. * limitations under the License.
  18. *
  19. * @licend The above is the entire license notice for the
  20. * Javascript code in this page
  21. */
  22. "use strict";
  23. Object.defineProperty(exports, "__esModule", {
  24. value: true
  25. });
  26. exports.SecondaryToolbar = void 0;
  27. var _ui_utils = require("./ui_utils");
  28. var _pdf_cursor_tools = require("./pdf_cursor_tools");
  29. var _pdf_single_page_viewer = require("./pdf_single_page_viewer");
  30. function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
  31. function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
  32. function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
  33. var SecondaryToolbar =
  34. /*#__PURE__*/
  35. function () {
  36. function SecondaryToolbar(options, mainContainer, eventBus) {
  37. var _this = this;
  38. _classCallCheck(this, SecondaryToolbar);
  39. this.toolbar = options.toolbar;
  40. this.toggleButton = options.toggleButton;
  41. this.toolbarButtonContainer = options.toolbarButtonContainer;
  42. this.buttons = [{
  43. element: options.presentationModeButton,
  44. eventName: 'presentationmode',
  45. close: true
  46. }, {
  47. element: options.openFileButton,
  48. eventName: 'openfile',
  49. close: true
  50. }, {
  51. element: options.printButton,
  52. eventName: 'print',
  53. close: true
  54. }, {
  55. element: options.downloadButton,
  56. eventName: 'download',
  57. close: true
  58. }, {
  59. element: options.viewBookmarkButton,
  60. eventName: null,
  61. close: true
  62. }, {
  63. element: options.firstPageButton,
  64. eventName: 'firstpage',
  65. close: true
  66. }, {
  67. element: options.lastPageButton,
  68. eventName: 'lastpage',
  69. close: true
  70. }, {
  71. element: options.pageRotateCwButton,
  72. eventName: 'rotatecw',
  73. close: false
  74. }, {
  75. element: options.pageRotateCcwButton,
  76. eventName: 'rotateccw',
  77. close: false
  78. }, {
  79. element: options.cursorSelectToolButton,
  80. eventName: 'switchcursortool',
  81. eventDetails: {
  82. tool: _pdf_cursor_tools.CursorTool.SELECT
  83. },
  84. close: true
  85. }, {
  86. element: options.cursorHandToolButton,
  87. eventName: 'switchcursortool',
  88. eventDetails: {
  89. tool: _pdf_cursor_tools.CursorTool.HAND
  90. },
  91. close: true
  92. }, {
  93. element: options.scrollVerticalButton,
  94. eventName: 'switchscrollmode',
  95. eventDetails: {
  96. mode: _ui_utils.ScrollMode.VERTICAL
  97. },
  98. close: true
  99. }, {
  100. element: options.scrollHorizontalButton,
  101. eventName: 'switchscrollmode',
  102. eventDetails: {
  103. mode: _ui_utils.ScrollMode.HORIZONTAL
  104. },
  105. close: true
  106. }, {
  107. element: options.scrollWrappedButton,
  108. eventName: 'switchscrollmode',
  109. eventDetails: {
  110. mode: _ui_utils.ScrollMode.WRAPPED
  111. },
  112. close: true
  113. }, {
  114. element: options.spreadNoneButton,
  115. eventName: 'switchspreadmode',
  116. eventDetails: {
  117. mode: _ui_utils.SpreadMode.NONE
  118. },
  119. close: true
  120. }, {
  121. element: options.spreadOddButton,
  122. eventName: 'switchspreadmode',
  123. eventDetails: {
  124. mode: _ui_utils.SpreadMode.ODD
  125. },
  126. close: true
  127. }, {
  128. element: options.spreadEvenButton,
  129. eventName: 'switchspreadmode',
  130. eventDetails: {
  131. mode: _ui_utils.SpreadMode.EVEN
  132. },
  133. close: true
  134. }, {
  135. element: options.documentPropertiesButton,
  136. eventName: 'documentproperties',
  137. close: true
  138. }];
  139. this.items = {
  140. firstPage: options.firstPageButton,
  141. lastPage: options.lastPageButton,
  142. pageRotateCw: options.pageRotateCwButton,
  143. pageRotateCcw: options.pageRotateCcwButton
  144. };
  145. this.mainContainer = mainContainer;
  146. this.eventBus = eventBus;
  147. this.opened = false;
  148. this.containerHeight = null;
  149. this.previousContainerHeight = null;
  150. this.reset();
  151. this._bindClickListeners();
  152. this._bindCursorToolsListener(options);
  153. this._bindScrollModeListener(options);
  154. this._bindSpreadModeListener(options);
  155. this.eventBus.on('resize', this._setMaxHeight.bind(this));
  156. this.eventBus.on('baseviewerinit', function (evt) {
  157. if (evt.source instanceof _pdf_single_page_viewer.PDFSinglePageViewer) {
  158. _this.toolbarButtonContainer.classList.add('hiddenScrollModeButtons', 'hiddenSpreadModeButtons');
  159. } else {
  160. _this.toolbarButtonContainer.classList.remove('hiddenScrollModeButtons', 'hiddenSpreadModeButtons');
  161. }
  162. });
  163. }
  164. _createClass(SecondaryToolbar, [{
  165. key: "setPageNumber",
  166. value: function setPageNumber(pageNumber) {
  167. this.pageNumber = pageNumber;
  168. this._updateUIState();
  169. }
  170. }, {
  171. key: "setPagesCount",
  172. value: function setPagesCount(pagesCount) {
  173. this.pagesCount = pagesCount;
  174. this._updateUIState();
  175. }
  176. }, {
  177. key: "reset",
  178. value: function reset() {
  179. this.pageNumber = 0;
  180. this.pagesCount = 0;
  181. this._updateUIState();
  182. this.eventBus.dispatch('secondarytoolbarreset', {
  183. source: this
  184. });
  185. }
  186. }, {
  187. key: "_updateUIState",
  188. value: function _updateUIState() {
  189. this.items.firstPage.disabled = this.pageNumber <= 1;
  190. this.items.lastPage.disabled = this.pageNumber >= this.pagesCount;
  191. this.items.pageRotateCw.disabled = this.pagesCount === 0;
  192. this.items.pageRotateCcw.disabled = this.pagesCount === 0;
  193. }
  194. }, {
  195. key: "_bindClickListeners",
  196. value: function _bindClickListeners() {
  197. var _this2 = this;
  198. this.toggleButton.addEventListener('click', this.toggle.bind(this));
  199. var _loop = function _loop(button) {
  200. var _this2$buttons$button = _this2.buttons[button],
  201. element = _this2$buttons$button.element,
  202. eventName = _this2$buttons$button.eventName,
  203. close = _this2$buttons$button.close,
  204. eventDetails = _this2$buttons$button.eventDetails;
  205. element.addEventListener('click', function (evt) {
  206. if (eventName !== null) {
  207. var details = {
  208. source: _this2
  209. };
  210. for (var property in eventDetails) {
  211. details[property] = eventDetails[property];
  212. }
  213. _this2.eventBus.dispatch(eventName, details);
  214. }
  215. if (close) {
  216. _this2.close();
  217. }
  218. });
  219. };
  220. for (var button in this.buttons) {
  221. _loop(button);
  222. }
  223. }
  224. }, {
  225. key: "_bindCursorToolsListener",
  226. value: function _bindCursorToolsListener(buttons) {
  227. this.eventBus.on('cursortoolchanged', function (_ref) {
  228. var tool = _ref.tool;
  229. buttons.cursorSelectToolButton.classList.toggle('toggled', tool === _pdf_cursor_tools.CursorTool.SELECT);
  230. buttons.cursorHandToolButton.classList.toggle('toggled', tool === _pdf_cursor_tools.CursorTool.HAND);
  231. });
  232. }
  233. }, {
  234. key: "_bindScrollModeListener",
  235. value: function _bindScrollModeListener(buttons) {
  236. var _this3 = this;
  237. function scrollModeChanged(_ref2) {
  238. var mode = _ref2.mode;
  239. buttons.scrollVerticalButton.classList.toggle('toggled', mode === _ui_utils.ScrollMode.VERTICAL);
  240. buttons.scrollHorizontalButton.classList.toggle('toggled', mode === _ui_utils.ScrollMode.HORIZONTAL);
  241. buttons.scrollWrappedButton.classList.toggle('toggled', mode === _ui_utils.ScrollMode.WRAPPED);
  242. var isScrollModeHorizontal = mode === _ui_utils.ScrollMode.HORIZONTAL;
  243. buttons.spreadNoneButton.disabled = isScrollModeHorizontal;
  244. buttons.spreadOddButton.disabled = isScrollModeHorizontal;
  245. buttons.spreadEvenButton.disabled = isScrollModeHorizontal;
  246. }
  247. this.eventBus.on('scrollmodechanged', scrollModeChanged);
  248. this.eventBus.on('secondarytoolbarreset', function (evt) {
  249. if (evt.source === _this3) {
  250. scrollModeChanged({
  251. mode: _ui_utils.ScrollMode.VERTICAL
  252. });
  253. }
  254. });
  255. }
  256. }, {
  257. key: "_bindSpreadModeListener",
  258. value: function _bindSpreadModeListener(buttons) {
  259. var _this4 = this;
  260. function spreadModeChanged(_ref3) {
  261. var mode = _ref3.mode;
  262. buttons.spreadNoneButton.classList.toggle('toggled', mode === _ui_utils.SpreadMode.NONE);
  263. buttons.spreadOddButton.classList.toggle('toggled', mode === _ui_utils.SpreadMode.ODD);
  264. buttons.spreadEvenButton.classList.toggle('toggled', mode === _ui_utils.SpreadMode.EVEN);
  265. }
  266. this.eventBus.on('spreadmodechanged', spreadModeChanged);
  267. this.eventBus.on('secondarytoolbarreset', function (evt) {
  268. if (evt.source === _this4) {
  269. spreadModeChanged({
  270. mode: _ui_utils.SpreadMode.NONE
  271. });
  272. }
  273. });
  274. }
  275. }, {
  276. key: "open",
  277. value: function open() {
  278. if (this.opened) {
  279. return;
  280. }
  281. this.opened = true;
  282. this._setMaxHeight();
  283. this.toggleButton.classList.add('toggled');
  284. this.toolbar.classList.remove('hidden');
  285. }
  286. }, {
  287. key: "close",
  288. value: function close() {
  289. if (!this.opened) {
  290. return;
  291. }
  292. this.opened = false;
  293. this.toolbar.classList.add('hidden');
  294. this.toggleButton.classList.remove('toggled');
  295. }
  296. }, {
  297. key: "toggle",
  298. value: function toggle() {
  299. if (this.opened) {
  300. this.close();
  301. } else {
  302. this.open();
  303. }
  304. }
  305. }, {
  306. key: "_setMaxHeight",
  307. value: function _setMaxHeight() {
  308. if (!this.opened) {
  309. return;
  310. }
  311. this.containerHeight = this.mainContainer.clientHeight;
  312. if (this.containerHeight === this.previousContainerHeight) {
  313. return;
  314. }
  315. this.toolbarButtonContainer.setAttribute('style', 'max-height: ' + (this.containerHeight - _ui_utils.SCROLLBAR_PADDING) + 'px;');
  316. this.previousContainerHeight = this.containerHeight;
  317. }
  318. }, {
  319. key: "isOpen",
  320. get: function get() {
  321. return this.opened;
  322. }
  323. }]);
  324. return SecondaryToolbar;
  325. }();
  326. exports.SecondaryToolbar = SecondaryToolbar;