FullWindowZoomHelper.js 3.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283
  1. /**
  2. * Copyright (C) 2014 KO GmbH <copyright@kogmbh.com>
  3. *
  4. * @licstart
  5. * This file is part of WebODF.
  6. *
  7. * WebODF is free software: you can redistribute it and/or modify it
  8. * under the terms of the GNU Affero General Public License (GNU AGPL)
  9. * as published by the Free Software Foundation, either version 3 of
  10. * the License, or (at your option) any later version.
  11. *
  12. * WebODF is distributed in the hope that it will be useful, but
  13. * WITHOUT ANY WARRANTY; without even the implied warranty of
  14. * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
  15. * GNU Affero General Public License for more details.
  16. *
  17. * You should have received a copy of the GNU Affero General Public License
  18. * along with WebODF. If not, see <http://www.gnu.org/licenses/>.
  19. * @licend
  20. *
  21. * @source: http://www.webodf.org/
  22. * @source: https://github.com/kogmbh/WebODF/
  23. */
  24. /*global define, document, window */
  25. define("webodf/editor/FullWindowZoomHelper", [], function () {
  26. "use strict";
  27. // fullscreen pinch-zoom adaption
  28. var FullWindowZoomHelper = function FullWindowZoomHelper(toolbarContainerElement, canvasContainerElement) {
  29. function translateToolbar() {
  30. var y = document.body.scrollTop;
  31. toolbarContainerElement.style.WebkitTransformOrigin = "center top";
  32. toolbarContainerElement.style.WebkitTransform = 'translateY(' + y + 'px)';
  33. }
  34. function repositionContainer() {
  35. canvasContainerElement.style.top = toolbarContainerElement.getBoundingClientRect().height + 'px';
  36. }
  37. this.destroy = function (callback) {
  38. window.removeEventListener('scroll', translateToolbar);
  39. window.removeEventListener('focusout', translateToolbar);
  40. window.removeEventListener('touchmove', translateToolbar);
  41. window.removeEventListener('resize', repositionContainer);
  42. callback();
  43. };
  44. function init() {
  45. var metaElement, toolbarStyle;
  46. // prevent any zooming on the window TODO: do not overwrite any other existing content of viewport metadata
  47. metaElement = document.createElement("meta");
  48. metaElement.setAttribute("name", "viewport");
  49. metaElement.setAttribute("content", "width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0");
  50. document.head.appendChild(metaElement);
  51. // set the toolbar absolute and fixed to top
  52. toolbarStyle = toolbarContainerElement.style;
  53. toolbarStyle.top = 0;
  54. toolbarStyle.left = 0;
  55. toolbarStyle.right = 0;
  56. toolbarStyle.position = "absolute";
  57. toolbarStyle.zIndex = 5;
  58. toolbarStyle.boxShadow = "0 1px 5px rgba(0, 0, 0, 0.25)";
  59. repositionContainer();
  60. window.addEventListener('scroll', translateToolbar);
  61. window.addEventListener('focusout', translateToolbar);
  62. window.addEventListener('touchmove', translateToolbar);
  63. window.addEventListener('resize', repositionContainer);
  64. }
  65. init();
  66. };
  67. return FullWindowZoomHelper;
  68. });