PerformanceWatchdog.js 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108
  1. import {
  2. defined,
  3. destroyObject,
  4. DeveloperError,
  5. getElement,
  6. } from "@cesium/engine";
  7. import knockout from "../ThirdParty/knockout.js";
  8. import PerformanceWatchdogViewModel from "./PerformanceWatchdogViewModel.js";
  9. /**
  10. * Monitors performance of the application and displays a message if poor performance is detected.
  11. *
  12. * @alias PerformanceWatchdog
  13. * @constructor
  14. *
  15. * @param {object} [options] Object with the following properties:
  16. * @param {Element|string} options.container The DOM element or ID that will contain the widget.
  17. * @param {Scene} options.scene The {@link Scene} for which to monitor performance.
  18. * @param {string} [options.lowFrameRateMessage='This application appears to be performing poorly on your system. Please try using a different web browser or updating your video drivers.'] The
  19. * message to display when a low frame rate is detected. The message is interpeted as HTML, so make sure
  20. * it comes from a trusted source so that your application is not vulnerable to cross-site scripting attacks.
  21. */
  22. function PerformanceWatchdog(options) {
  23. //>>includeStart('debug', pragmas.debug);
  24. if (!defined(options) || !defined(options.container)) {
  25. throw new DeveloperError("options.container is required.");
  26. }
  27. if (!defined(options.scene)) {
  28. throw new DeveloperError("options.scene is required.");
  29. }
  30. //>>includeEnd('debug');
  31. const container = getElement(options.container);
  32. const viewModel = new PerformanceWatchdogViewModel(options);
  33. const element = document.createElement("div");
  34. element.className = "cesium-performance-watchdog-message-area";
  35. element.setAttribute("data-bind", "visible: showingLowFrameRateMessage");
  36. const dismissButton = document.createElement("button");
  37. dismissButton.setAttribute("type", "button");
  38. dismissButton.className = "cesium-performance-watchdog-message-dismiss";
  39. dismissButton.innerHTML = "×";
  40. dismissButton.setAttribute("data-bind", "click: dismissMessage");
  41. element.appendChild(dismissButton);
  42. const message = document.createElement("div");
  43. message.className = "cesium-performance-watchdog-message";
  44. message.setAttribute("data-bind", "html: lowFrameRateMessage");
  45. element.appendChild(message);
  46. container.appendChild(element);
  47. knockout.applyBindings(viewModel, element);
  48. this._container = container;
  49. this._viewModel = viewModel;
  50. this._element = element;
  51. }
  52. Object.defineProperties(PerformanceWatchdog.prototype, {
  53. /**
  54. * Gets the parent container.
  55. * @memberof PerformanceWatchdog.prototype
  56. *
  57. * @type {Element}
  58. */
  59. container: {
  60. get: function () {
  61. return this._container;
  62. },
  63. },
  64. /**
  65. * Gets the view model.
  66. * @memberof PerformanceWatchdog.prototype
  67. *
  68. * @type {PerformanceWatchdogViewModel}
  69. */
  70. viewModel: {
  71. get: function () {
  72. return this._viewModel;
  73. },
  74. },
  75. });
  76. /**
  77. * @memberof PerformanceWatchdog
  78. * @returns {boolean} true if the object has been destroyed, false otherwise.
  79. */
  80. PerformanceWatchdog.prototype.isDestroyed = function () {
  81. return false;
  82. };
  83. /**
  84. * Destroys the widget. Should be called if permanently
  85. * removing the widget from layout.
  86. * @memberof PerformanceWatchdog
  87. */
  88. PerformanceWatchdog.prototype.destroy = function () {
  89. this._viewModel.destroy();
  90. knockout.cleanNode(this._element);
  91. this._container.removeChild(this._element);
  92. return destroyObject(this);
  93. };
  94. export default PerformanceWatchdog;