FullscreenButton.js 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102
  1. import defined from '../../Core/defined.js';
  2. import defineProperties from '../../Core/defineProperties.js';
  3. import destroyObject from '../../Core/destroyObject.js';
  4. import DeveloperError from '../../Core/DeveloperError.js';
  5. import knockout from '../../ThirdParty/knockout.js';
  6. import getElement from '../getElement.js';
  7. import FullscreenButtonViewModel from './FullscreenButtonViewModel.js';
  8. var enterFullScreenPath = 'M 83.96875 17.5625 L 83.96875 17.59375 L 76.65625 24.875 L 97.09375 24.96875 L 76.09375 45.96875 L 81.9375 51.8125 L 102.78125 30.9375 L 102.875 51.15625 L 110.15625 43.875 L 110.1875 17.59375 L 83.96875 17.5625 z M 44.125 17.59375 L 17.90625 17.625 L 17.9375 43.90625 L 25.21875 51.1875 L 25.3125 30.96875 L 46.15625 51.8125 L 52 45.96875 L 31 25 L 51.4375 24.90625 L 44.125 17.59375 z M 46.0625 76.03125 L 25.1875 96.875 L 25.09375 76.65625 L 17.8125 83.9375 L 17.8125 110.21875 L 44 110.25 L 51.3125 102.9375 L 30.90625 102.84375 L 51.875 81.875 L 46.0625 76.03125 z M 82 76.15625 L 76.15625 82 L 97.15625 103 L 76.71875 103.0625 L 84.03125 110.375 L 110.25 110.34375 L 110.21875 84.0625 L 102.9375 76.8125 L 102.84375 97 L 82 76.15625 z';
  9. var exitFullScreenPath = 'M 104.34375 17.5625 L 83.5 38.4375 L 83.40625 18.21875 L 76.125 25.5 L 76.09375 51.78125 L 102.3125 51.8125 L 102.3125 51.78125 L 109.625 44.5 L 89.1875 44.40625 L 110.1875 23.40625 L 104.34375 17.5625 z M 23.75 17.59375 L 17.90625 23.4375 L 38.90625 44.4375 L 18.5 44.53125 L 25.78125 51.8125 L 52 51.78125 L 51.96875 25.53125 L 44.6875 18.25 L 44.625 38.46875 L 23.75 17.59375 z M 25.6875 76.03125 L 18.375 83.3125 L 38.78125 83.40625 L 17.8125 104.40625 L 23.625 110.25 L 44.5 89.375 L 44.59375 109.59375 L 51.875 102.3125 L 51.875 76.0625 L 25.6875 76.03125 z M 102.375 76.15625 L 76.15625 76.1875 L 76.1875 102.4375 L 83.46875 109.71875 L 83.5625 89.53125 L 104.40625 110.375 L 110.25 104.53125 L 89.25 83.53125 L 109.6875 83.46875 L 102.375 76.15625 z';
  10. /**
  11. * A single button widget for toggling fullscreen mode.
  12. *
  13. * @alias FullscreenButton
  14. * @constructor
  15. *
  16. * @param {Element|String} container The DOM element or ID that will contain the widget.
  17. * @param {Element|String} [fullscreenElement=document.body] The element or id to be placed into fullscreen mode.
  18. *
  19. * @exception {DeveloperError} Element with id "container" does not exist in the document.
  20. *
  21. * @see Fullscreen
  22. */
  23. function FullscreenButton(container, fullscreenElement) {
  24. //>>includeStart('debug', pragmas.debug);
  25. if (!defined(container)) {
  26. throw new DeveloperError('container is required.');
  27. }
  28. //>>includeEnd('debug');
  29. container = getElement(container);
  30. var viewModel = new FullscreenButtonViewModel(fullscreenElement);
  31. viewModel._exitFullScreenPath = exitFullScreenPath;
  32. viewModel._enterFullScreenPath = enterFullScreenPath;
  33. var element = document.createElement('button');
  34. element.type = 'button';
  35. element.className = 'cesium-button cesium-fullscreenButton';
  36. element.setAttribute('data-bind', '\
  37. attr: { title: tooltip },\
  38. click: command,\
  39. enable: isFullscreenEnabled,\
  40. cesiumSvgPath: { path: isFullscreen ? _exitFullScreenPath : _enterFullScreenPath, width: 128, height: 128 }');
  41. container.appendChild(element);
  42. knockout.applyBindings(viewModel, element);
  43. this._container = container;
  44. this._viewModel = viewModel;
  45. this._element = element;
  46. }
  47. defineProperties(FullscreenButton.prototype, {
  48. /**
  49. * Gets the parent container.
  50. * @memberof FullscreenButton.prototype
  51. *
  52. * @type {Element}
  53. */
  54. container : {
  55. get : function() {
  56. return this._container;
  57. }
  58. },
  59. /**
  60. * Gets the view model.
  61. * @memberof FullscreenButton.prototype
  62. *
  63. * @type {FullscreenButtonViewModel}
  64. */
  65. viewModel : {
  66. get : function() {
  67. return this._viewModel;
  68. }
  69. }
  70. });
  71. /**
  72. * @returns {Boolean} true if the object has been destroyed, false otherwise.
  73. */
  74. FullscreenButton.prototype.isDestroyed = function() {
  75. return false;
  76. };
  77. /**
  78. * Destroys the widget. Should be called if permanently
  79. * removing the widget from layout.
  80. */
  81. FullscreenButton.prototype.destroy = function() {
  82. this._viewModel.destroy();
  83. knockout.cleanNode(this._element);
  84. this._container.removeChild(this._element);
  85. return destroyObject(this);
  86. };
  87. export default FullscreenButton;