secondary_toolbar.js 8.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335
  1. /**
  2. * @licstart The following is the entire license notice for the
  3. * Javascript code in this page
  4. *
  5. * Copyright 2021 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.js");
  28. var _pdf_cursor_tools = require("./pdf_cursor_tools.js");
  29. var _pdf_single_page_viewer = require("./pdf_single_page_viewer.js");
  30. class SecondaryToolbar {
  31. constructor(options, mainContainer, eventBus) {
  32. this.toolbar = options.toolbar;
  33. this.toggleButton = options.toggleButton;
  34. this.toolbarButtonContainer = options.toolbarButtonContainer;
  35. this.buttons = [{
  36. element: options.presentationModeButton,
  37. eventName: "presentationmode",
  38. close: true
  39. }, {
  40. element: options.openFileButton,
  41. eventName: "openfile",
  42. close: true
  43. }, {
  44. element: options.printButton,
  45. eventName: "print",
  46. close: true
  47. }, {
  48. element: options.downloadButton,
  49. eventName: "download",
  50. close: true
  51. }, {
  52. element: options.viewBookmarkButton,
  53. eventName: null,
  54. close: true
  55. }, {
  56. element: options.firstPageButton,
  57. eventName: "firstpage",
  58. close: true
  59. }, {
  60. element: options.lastPageButton,
  61. eventName: "lastpage",
  62. close: true
  63. }, {
  64. element: options.pageRotateCwButton,
  65. eventName: "rotatecw",
  66. close: false
  67. }, {
  68. element: options.pageRotateCcwButton,
  69. eventName: "rotateccw",
  70. close: false
  71. }, {
  72. element: options.cursorSelectToolButton,
  73. eventName: "switchcursortool",
  74. eventDetails: {
  75. tool: _pdf_cursor_tools.CursorTool.SELECT
  76. },
  77. close: true
  78. }, {
  79. element: options.cursorHandToolButton,
  80. eventName: "switchcursortool",
  81. eventDetails: {
  82. tool: _pdf_cursor_tools.CursorTool.HAND
  83. },
  84. close: true
  85. }, {
  86. element: options.scrollVerticalButton,
  87. eventName: "switchscrollmode",
  88. eventDetails: {
  89. mode: _ui_utils.ScrollMode.VERTICAL
  90. },
  91. close: true
  92. }, {
  93. element: options.scrollHorizontalButton,
  94. eventName: "switchscrollmode",
  95. eventDetails: {
  96. mode: _ui_utils.ScrollMode.HORIZONTAL
  97. },
  98. close: true
  99. }, {
  100. element: options.scrollWrappedButton,
  101. eventName: "switchscrollmode",
  102. eventDetails: {
  103. mode: _ui_utils.ScrollMode.WRAPPED
  104. },
  105. close: true
  106. }, {
  107. element: options.spreadNoneButton,
  108. eventName: "switchspreadmode",
  109. eventDetails: {
  110. mode: _ui_utils.SpreadMode.NONE
  111. },
  112. close: true
  113. }, {
  114. element: options.spreadOddButton,
  115. eventName: "switchspreadmode",
  116. eventDetails: {
  117. mode: _ui_utils.SpreadMode.ODD
  118. },
  119. close: true
  120. }, {
  121. element: options.spreadEvenButton,
  122. eventName: "switchspreadmode",
  123. eventDetails: {
  124. mode: _ui_utils.SpreadMode.EVEN
  125. },
  126. close: true
  127. }, {
  128. element: options.documentPropertiesButton,
  129. eventName: "documentproperties",
  130. close: true
  131. }];
  132. this.items = {
  133. firstPage: options.firstPageButton,
  134. lastPage: options.lastPageButton,
  135. pageRotateCw: options.pageRotateCwButton,
  136. pageRotateCcw: options.pageRotateCcwButton
  137. };
  138. this.mainContainer = mainContainer;
  139. this.eventBus = eventBus;
  140. this.opened = false;
  141. this.containerHeight = null;
  142. this.previousContainerHeight = null;
  143. this.reset();
  144. this._bindClickListeners();
  145. this._bindCursorToolsListener(options);
  146. this._bindScrollModeListener(options);
  147. this._bindSpreadModeListener(options);
  148. this.eventBus._on("resize", this._setMaxHeight.bind(this));
  149. this.eventBus._on("baseviewerinit", evt => {
  150. if (evt.source instanceof _pdf_single_page_viewer.PDFSinglePageViewer) {
  151. this.toolbarButtonContainer.classList.add("hiddenScrollModeButtons", "hiddenSpreadModeButtons");
  152. } else {
  153. this.toolbarButtonContainer.classList.remove("hiddenScrollModeButtons", "hiddenSpreadModeButtons");
  154. }
  155. });
  156. }
  157. get isOpen() {
  158. return this.opened;
  159. }
  160. setPageNumber(pageNumber) {
  161. this.pageNumber = pageNumber;
  162. this._updateUIState();
  163. }
  164. setPagesCount(pagesCount) {
  165. this.pagesCount = pagesCount;
  166. this._updateUIState();
  167. }
  168. reset() {
  169. this.pageNumber = 0;
  170. this.pagesCount = 0;
  171. this._updateUIState();
  172. this.eventBus.dispatch("secondarytoolbarreset", {
  173. source: this
  174. });
  175. }
  176. _updateUIState() {
  177. this.items.firstPage.disabled = this.pageNumber <= 1;
  178. this.items.lastPage.disabled = this.pageNumber >= this.pagesCount;
  179. this.items.pageRotateCw.disabled = this.pagesCount === 0;
  180. this.items.pageRotateCcw.disabled = this.pagesCount === 0;
  181. }
  182. _bindClickListeners() {
  183. this.toggleButton.addEventListener("click", this.toggle.bind(this));
  184. for (const {
  185. element,
  186. eventName,
  187. close,
  188. eventDetails
  189. } of this.buttons) {
  190. element.addEventListener("click", evt => {
  191. if (eventName !== null) {
  192. const details = {
  193. source: this
  194. };
  195. for (const property in eventDetails) {
  196. details[property] = eventDetails[property];
  197. }
  198. this.eventBus.dispatch(eventName, details);
  199. }
  200. if (close) {
  201. this.close();
  202. }
  203. });
  204. }
  205. }
  206. _bindCursorToolsListener(buttons) {
  207. this.eventBus._on("cursortoolchanged", function ({
  208. tool
  209. }) {
  210. buttons.cursorSelectToolButton.classList.toggle("toggled", tool === _pdf_cursor_tools.CursorTool.SELECT);
  211. buttons.cursorHandToolButton.classList.toggle("toggled", tool === _pdf_cursor_tools.CursorTool.HAND);
  212. });
  213. }
  214. _bindScrollModeListener(buttons) {
  215. function scrollModeChanged({
  216. mode
  217. }) {
  218. buttons.scrollVerticalButton.classList.toggle("toggled", mode === _ui_utils.ScrollMode.VERTICAL);
  219. buttons.scrollHorizontalButton.classList.toggle("toggled", mode === _ui_utils.ScrollMode.HORIZONTAL);
  220. buttons.scrollWrappedButton.classList.toggle("toggled", mode === _ui_utils.ScrollMode.WRAPPED);
  221. const isScrollModeHorizontal = mode === _ui_utils.ScrollMode.HORIZONTAL;
  222. buttons.spreadNoneButton.disabled = isScrollModeHorizontal;
  223. buttons.spreadOddButton.disabled = isScrollModeHorizontal;
  224. buttons.spreadEvenButton.disabled = isScrollModeHorizontal;
  225. }
  226. this.eventBus._on("scrollmodechanged", scrollModeChanged);
  227. this.eventBus._on("secondarytoolbarreset", evt => {
  228. if (evt.source === this) {
  229. scrollModeChanged({
  230. mode: _ui_utils.ScrollMode.VERTICAL
  231. });
  232. }
  233. });
  234. }
  235. _bindSpreadModeListener(buttons) {
  236. function spreadModeChanged({
  237. mode
  238. }) {
  239. buttons.spreadNoneButton.classList.toggle("toggled", mode === _ui_utils.SpreadMode.NONE);
  240. buttons.spreadOddButton.classList.toggle("toggled", mode === _ui_utils.SpreadMode.ODD);
  241. buttons.spreadEvenButton.classList.toggle("toggled", mode === _ui_utils.SpreadMode.EVEN);
  242. }
  243. this.eventBus._on("spreadmodechanged", spreadModeChanged);
  244. this.eventBus._on("secondarytoolbarreset", evt => {
  245. if (evt.source === this) {
  246. spreadModeChanged({
  247. mode: _ui_utils.SpreadMode.NONE
  248. });
  249. }
  250. });
  251. }
  252. open() {
  253. if (this.opened) {
  254. return;
  255. }
  256. this.opened = true;
  257. this._setMaxHeight();
  258. this.toggleButton.classList.add("toggled");
  259. this.toggleButton.setAttribute("aria-expanded", "true");
  260. this.toolbar.classList.remove("hidden");
  261. }
  262. close() {
  263. if (!this.opened) {
  264. return;
  265. }
  266. this.opened = false;
  267. this.toolbar.classList.add("hidden");
  268. this.toggleButton.classList.remove("toggled");
  269. this.toggleButton.setAttribute("aria-expanded", "false");
  270. }
  271. toggle() {
  272. if (this.opened) {
  273. this.close();
  274. } else {
  275. this.open();
  276. }
  277. }
  278. _setMaxHeight() {
  279. if (!this.opened) {
  280. return;
  281. }
  282. this.containerHeight = this.mainContainer.clientHeight;
  283. if (this.containerHeight === this.previousContainerHeight) {
  284. return;
  285. }
  286. this.toolbarButtonContainer.style.maxHeight = `${this.containerHeight - _ui_utils.SCROLLBAR_PADDING}px`;
  287. this.previousContainerHeight = this.containerHeight;
  288. }
  289. }
  290. exports.SecondaryToolbar = SecondaryToolbar;