InfoBoxViewModel.js 3.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118
  1. import defined from "../../Core/defined.js";
  2. import Event from "../../Core/Event.js";
  3. import knockout from "../../ThirdParty/knockout.js";
  4. const cameraEnabledPath =
  5. "M 13.84375 7.03125 C 11.412798 7.03125 9.46875 8.975298 9.46875 11.40625 L 9.46875 11.59375 L 2.53125 7.21875 L 2.53125 24.0625 L 9.46875 19.6875 C 9.4853444 22.104033 11.423165 24.0625 13.84375 24.0625 L 25.875 24.0625 C 28.305952 24.0625 30.28125 22.087202 30.28125 19.65625 L 30.28125 11.40625 C 30.28125 8.975298 28.305952 7.03125 25.875 7.03125 L 13.84375 7.03125 z";
  6. const cameraDisabledPath =
  7. "M 27.34375 1.65625 L 5.28125 27.9375 L 8.09375 30.3125 L 30.15625 4.03125 L 27.34375 1.65625 z M 13.84375 7.03125 C 11.412798 7.03125 9.46875 8.975298 9.46875 11.40625 L 9.46875 11.59375 L 2.53125 7.21875 L 2.53125 24.0625 L 9.46875 19.6875 C 9.4724893 20.232036 9.5676108 20.7379 9.75 21.21875 L 21.65625 7.03125 L 13.84375 7.03125 z M 28.21875 7.71875 L 14.53125 24.0625 L 25.875 24.0625 C 28.305952 24.0625 30.28125 22.087202 30.28125 19.65625 L 30.28125 11.40625 C 30.28125 9.8371439 29.456025 8.4902779 28.21875 7.71875 z";
  8. /**
  9. * The view model for {@link InfoBox}.
  10. * @alias InfoBoxViewModel
  11. * @constructor
  12. */
  13. function InfoBoxViewModel() {
  14. this._cameraClicked = new Event();
  15. this._closeClicked = new Event();
  16. /**
  17. * Gets or sets the maximum height of the info box in pixels. This property is observable.
  18. * @type {Number}
  19. */
  20. this.maxHeight = 500;
  21. /**
  22. * Gets or sets whether the camera tracking icon is enabled.
  23. * @type {Boolean}
  24. */
  25. this.enableCamera = false;
  26. /**
  27. * Gets or sets the status of current camera tracking of the selected object.
  28. * @type {Boolean}
  29. */
  30. this.isCameraTracking = false;
  31. /**
  32. * Gets or sets the visibility of the info box.
  33. * @type {Boolean}
  34. */
  35. this.showInfo = false;
  36. /**
  37. * Gets or sets the title text in the info box.
  38. * @type {String}
  39. */
  40. this.titleText = "";
  41. /**
  42. * Gets or sets the description HTML for the info box.
  43. * @type {String}
  44. */
  45. this.description = "";
  46. knockout.track(this, [
  47. "showInfo",
  48. "titleText",
  49. "description",
  50. "maxHeight",
  51. "enableCamera",
  52. "isCameraTracking",
  53. ]);
  54. this._loadingIndicatorHtml =
  55. '<div class="cesium-infoBox-loadingContainer"><span class="cesium-infoBox-loading"></span></div>';
  56. /**
  57. * Gets the SVG path of the camera icon, which can change to be "crossed out" or not.
  58. * @type {String}
  59. */
  60. this.cameraIconPath = undefined;
  61. knockout.defineProperty(this, "cameraIconPath", {
  62. get: function () {
  63. return !this.enableCamera || this.isCameraTracking
  64. ? cameraDisabledPath
  65. : cameraEnabledPath;
  66. },
  67. });
  68. knockout.defineProperty(this, "_bodyless", {
  69. get: function () {
  70. return !defined(this.description) || this.description.length === 0;
  71. },
  72. });
  73. }
  74. /**
  75. * Gets the maximum height of sections within the info box, minus an offset, in CSS-ready form.
  76. * @param {Number} offset The offset in pixels.
  77. * @returns {String}
  78. */
  79. InfoBoxViewModel.prototype.maxHeightOffset = function (offset) {
  80. return `${this.maxHeight - offset}px`;
  81. };
  82. Object.defineProperties(InfoBoxViewModel.prototype, {
  83. /**
  84. * Gets an {@link Event} that is fired when the user clicks the camera icon.
  85. * @memberof InfoBoxViewModel.prototype
  86. * @type {Event}
  87. */
  88. cameraClicked: {
  89. get: function () {
  90. return this._cameraClicked;
  91. },
  92. },
  93. /**
  94. * Gets an {@link Event} that is fired when the user closes the info box.
  95. * @memberof InfoBoxViewModel.prototype
  96. * @type {Event}
  97. */
  98. closeClicked: {
  99. get: function () {
  100. return this._closeClicked;
  101. },
  102. },
  103. });
  104. export default InfoBoxViewModel;