toolbar.js 8.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278
  1. /**
  2. * @licstart The following is the entire license notice for the
  3. * Javascript code in this page
  4. *
  5. * Copyright 2018 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.Toolbar = void 0;
  27. var _ui_utils = require("./ui_utils");
  28. function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
  29. 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); } }
  30. function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
  31. var PAGE_NUMBER_LOADING_INDICATOR = 'visiblePageIsLoading';
  32. var SCALE_SELECT_CONTAINER_PADDING = 8;
  33. var SCALE_SELECT_PADDING = 22;
  34. var Toolbar =
  35. /*#__PURE__*/
  36. function () {
  37. function Toolbar(options, eventBus) {
  38. var l10n = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : _ui_utils.NullL10n;
  39. _classCallCheck(this, Toolbar);
  40. this.toolbar = options.container;
  41. this.eventBus = eventBus;
  42. this.l10n = l10n;
  43. this.items = options;
  44. this._wasLocalized = false;
  45. this.reset();
  46. this._bindListeners();
  47. }
  48. _createClass(Toolbar, [{
  49. key: "setPageNumber",
  50. value: function setPageNumber(pageNumber, pageLabel) {
  51. this.pageNumber = pageNumber;
  52. this.pageLabel = pageLabel;
  53. this._updateUIState(false);
  54. }
  55. }, {
  56. key: "setPagesCount",
  57. value: function setPagesCount(pagesCount, hasPageLabels) {
  58. this.pagesCount = pagesCount;
  59. this.hasPageLabels = hasPageLabels;
  60. this._updateUIState(true);
  61. }
  62. }, {
  63. key: "setPageScale",
  64. value: function setPageScale(pageScaleValue, pageScale) {
  65. this.pageScaleValue = (pageScaleValue || pageScale).toString();
  66. this.pageScale = pageScale;
  67. this._updateUIState(false);
  68. }
  69. }, {
  70. key: "reset",
  71. value: function reset() {
  72. this.pageNumber = 0;
  73. this.pageLabel = null;
  74. this.hasPageLabels = false;
  75. this.pagesCount = 0;
  76. this.pageScaleValue = _ui_utils.DEFAULT_SCALE_VALUE;
  77. this.pageScale = _ui_utils.DEFAULT_SCALE;
  78. this._updateUIState(true);
  79. }
  80. }, {
  81. key: "_bindListeners",
  82. value: function _bindListeners() {
  83. var _this = this;
  84. var eventBus = this.eventBus,
  85. items = this.items;
  86. var self = this;
  87. items.previous.addEventListener('click', function () {
  88. eventBus.dispatch('previouspage', {
  89. source: self
  90. });
  91. });
  92. items.next.addEventListener('click', function () {
  93. eventBus.dispatch('nextpage', {
  94. source: self
  95. });
  96. });
  97. items.zoomIn.addEventListener('click', function () {
  98. eventBus.dispatch('zoomin', {
  99. source: self
  100. });
  101. });
  102. items.zoomOut.addEventListener('click', function () {
  103. eventBus.dispatch('zoomout', {
  104. source: self
  105. });
  106. });
  107. items.pageNumber.addEventListener('click', function () {
  108. this.select();
  109. });
  110. items.pageNumber.addEventListener('change', function () {
  111. eventBus.dispatch('pagenumberchanged', {
  112. source: self,
  113. value: this.value
  114. });
  115. });
  116. items.scaleSelect.addEventListener('change', function () {
  117. if (this.value === 'custom') {
  118. return;
  119. }
  120. eventBus.dispatch('scalechanged', {
  121. source: self,
  122. value: this.value
  123. });
  124. });
  125. items.presentationModeButton.addEventListener('click', function () {
  126. eventBus.dispatch('presentationmode', {
  127. source: self
  128. });
  129. });
  130. items.openFile.addEventListener('click', function () {
  131. eventBus.dispatch('openfile', {
  132. source: self
  133. });
  134. });
  135. items.print.addEventListener('click', function () {
  136. eventBus.dispatch('print', {
  137. source: self
  138. });
  139. });
  140. items.download.addEventListener('click', function () {
  141. eventBus.dispatch('download', {
  142. source: self
  143. });
  144. });
  145. items.scaleSelect.oncontextmenu = _ui_utils.noContextMenuHandler;
  146. eventBus.on('localized', function () {
  147. _this._localized();
  148. });
  149. }
  150. }, {
  151. key: "_localized",
  152. value: function _localized() {
  153. this._wasLocalized = true;
  154. this._adjustScaleWidth();
  155. this._updateUIState(true);
  156. }
  157. }, {
  158. key: "_updateUIState",
  159. value: function _updateUIState() {
  160. var resetNumPages = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
  161. if (!this._wasLocalized) {
  162. return;
  163. }
  164. var pageNumber = this.pageNumber,
  165. pagesCount = this.pagesCount,
  166. pageScaleValue = this.pageScaleValue,
  167. pageScale = this.pageScale,
  168. items = this.items;
  169. if (resetNumPages) {
  170. if (this.hasPageLabels) {
  171. items.pageNumber.type = 'text';
  172. } else {
  173. items.pageNumber.type = 'number';
  174. this.l10n.get('of_pages', {
  175. pagesCount: pagesCount
  176. }, 'of {{pagesCount}}').then(function (msg) {
  177. items.numPages.textContent = msg;
  178. });
  179. }
  180. items.pageNumber.max = pagesCount;
  181. }
  182. if (this.hasPageLabels) {
  183. items.pageNumber.value = this.pageLabel;
  184. this.l10n.get('page_of_pages', {
  185. pageNumber: pageNumber,
  186. pagesCount: pagesCount
  187. }, '({{pageNumber}} of {{pagesCount}})').then(function (msg) {
  188. items.numPages.textContent = msg;
  189. });
  190. } else {
  191. items.pageNumber.value = pageNumber;
  192. }
  193. items.previous.disabled = pageNumber <= 1;
  194. items.next.disabled = pageNumber >= pagesCount;
  195. items.zoomOut.disabled = pageScale <= _ui_utils.MIN_SCALE;
  196. items.zoomIn.disabled = pageScale >= _ui_utils.MAX_SCALE;
  197. var customScale = Math.round(pageScale * 10000) / 100;
  198. this.l10n.get('page_scale_percent', {
  199. scale: customScale
  200. }, '{{scale}}%').then(function (msg) {
  201. var options = items.scaleSelect.options;
  202. var predefinedValueFound = false;
  203. for (var i = 0, ii = options.length; i < ii; i++) {
  204. var option = options[i];
  205. if (option.value !== pageScaleValue) {
  206. option.selected = false;
  207. continue;
  208. }
  209. option.selected = true;
  210. predefinedValueFound = true;
  211. }
  212. if (!predefinedValueFound) {
  213. items.customScaleOption.textContent = msg;
  214. items.customScaleOption.selected = true;
  215. }
  216. });
  217. }
  218. }, {
  219. key: "updateLoadingIndicatorState",
  220. value: function updateLoadingIndicatorState() {
  221. var loading = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
  222. var pageNumberInput = this.items.pageNumber;
  223. pageNumberInput.classList.toggle(PAGE_NUMBER_LOADING_INDICATOR, loading);
  224. }
  225. }, {
  226. key: "_adjustScaleWidth",
  227. value: function _adjustScaleWidth() {
  228. var container = this.items.scaleSelectContainer;
  229. var select = this.items.scaleSelect;
  230. _ui_utils.animationStarted.then(function () {
  231. if (container.clientWidth === 0) {
  232. container.setAttribute('style', 'display: inherit;');
  233. }
  234. if (container.clientWidth > 0) {
  235. select.setAttribute('style', 'min-width: inherit;');
  236. var width = select.clientWidth + SCALE_SELECT_CONTAINER_PADDING;
  237. select.setAttribute('style', 'min-width: ' + (width + SCALE_SELECT_PADDING) + 'px;');
  238. container.setAttribute('style', 'min-width: ' + width + 'px; ' + 'max-width: ' + width + 'px;');
  239. }
  240. });
  241. }
  242. }]);
  243. return Toolbar;
  244. }();
  245. exports.Toolbar = Toolbar;