bufferedviewportsizemonitor.js 5.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191
  1. // Copyright 2012 The Closure Library Authors. All Rights Reserved.
  2. //
  3. // Licensed under the Apache License, Version 2.0 (the "License");
  4. // you may not use this file except in compliance with the License.
  5. // You may obtain a copy of the License at
  6. //
  7. // http://www.apache.org/licenses/LICENSE-2.0
  8. //
  9. // Unless required by applicable law or agreed to in writing, software
  10. // distributed under the License is distributed on an "AS-IS" BASIS,
  11. // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  12. // See the License for the specific language governing permissions and
  13. // limitations under the License.
  14. /**
  15. * @fileoverview A viewport size monitor that buffers RESIZE events until the
  16. * window size has stopped changing, within a specified period of time. For
  17. * every RESIZE event dispatched, this will dispatch up to two *additional*
  18. * events:
  19. * - {@link #EventType.RESIZE_WIDTH} if the viewport's width has changed since
  20. * the last buffered dispatch.
  21. * - {@link #EventType.RESIZE_HEIGHT} if the viewport's height has changed since
  22. * the last buffered dispatch.
  23. * You likely only need to listen to one of the three events. But if you need
  24. * more, just be cautious of duplicating effort.
  25. *
  26. */
  27. goog.provide('goog.dom.BufferedViewportSizeMonitor');
  28. goog.require('goog.asserts');
  29. goog.require('goog.async.Delay');
  30. goog.require('goog.events');
  31. goog.require('goog.events.EventTarget');
  32. goog.require('goog.events.EventType');
  33. /**
  34. * Creates a new BufferedViewportSizeMonitor.
  35. * @param {!goog.dom.ViewportSizeMonitor} viewportSizeMonitor The
  36. * underlying viewport size monitor.
  37. * @param {number=} opt_bufferMs The buffer time, in ms. If not specified, this
  38. * value defaults to {@link #RESIZE_EVENT_DELAY_MS_}.
  39. * @constructor
  40. * @extends {goog.events.EventTarget}
  41. * @final
  42. */
  43. goog.dom.BufferedViewportSizeMonitor = function(
  44. viewportSizeMonitor, opt_bufferMs) {
  45. goog.dom.BufferedViewportSizeMonitor.base(this, 'constructor');
  46. /**
  47. * Delay for the resize event.
  48. * @private {goog.async.Delay}
  49. */
  50. this.resizeDelay_;
  51. /**
  52. * The underlying viewport size monitor.
  53. * @type {goog.dom.ViewportSizeMonitor}
  54. * @private
  55. */
  56. this.viewportSizeMonitor_ = viewportSizeMonitor;
  57. /**
  58. * The current size of the viewport.
  59. * @type {goog.math.Size}
  60. * @private
  61. */
  62. this.currentSize_ = this.viewportSizeMonitor_.getSize();
  63. /**
  64. * The resize buffer time in ms.
  65. * @type {number}
  66. * @private
  67. */
  68. this.resizeBufferMs_ = opt_bufferMs ||
  69. goog.dom.BufferedViewportSizeMonitor.RESIZE_EVENT_DELAY_MS_;
  70. /**
  71. * Listener key for the viewport size monitor.
  72. * @type {goog.events.Key}
  73. * @private
  74. */
  75. this.listenerKey_ = goog.events.listen(
  76. viewportSizeMonitor, goog.events.EventType.RESIZE, this.handleResize_,
  77. false, this);
  78. };
  79. goog.inherits(goog.dom.BufferedViewportSizeMonitor, goog.events.EventTarget);
  80. /**
  81. * Additional events to dispatch.
  82. * @enum {string}
  83. */
  84. goog.dom.BufferedViewportSizeMonitor.EventType = {
  85. RESIZE_HEIGHT: goog.events.getUniqueId('resizeheight'),
  86. RESIZE_WIDTH: goog.events.getUniqueId('resizewidth')
  87. };
  88. /**
  89. * Default number of milliseconds to wait after a resize event to relayout the
  90. * page.
  91. * @type {number}
  92. * @const
  93. * @private
  94. */
  95. goog.dom.BufferedViewportSizeMonitor.RESIZE_EVENT_DELAY_MS_ = 100;
  96. /** @override */
  97. goog.dom.BufferedViewportSizeMonitor.prototype.disposeInternal = function() {
  98. goog.events.unlistenByKey(this.listenerKey_);
  99. goog.dom.BufferedViewportSizeMonitor.base(this, 'disposeInternal');
  100. };
  101. /**
  102. * Handles resize events on the underlying ViewportMonitor.
  103. * @private
  104. */
  105. goog.dom.BufferedViewportSizeMonitor.prototype.handleResize_ = function() {
  106. // Lazily create when needed.
  107. if (!this.resizeDelay_) {
  108. this.resizeDelay_ =
  109. new goog.async.Delay(this.onWindowResize_, this.resizeBufferMs_, this);
  110. this.registerDisposable(this.resizeDelay_);
  111. }
  112. this.resizeDelay_.start();
  113. };
  114. /**
  115. * Window resize callback that determines whether to reflow the view contents.
  116. * @private
  117. */
  118. goog.dom.BufferedViewportSizeMonitor.prototype.onWindowResize_ = function() {
  119. if (this.viewportSizeMonitor_.isDisposed()) {
  120. return;
  121. }
  122. var previousSize = this.currentSize_;
  123. var currentSize = this.viewportSizeMonitor_.getSize();
  124. goog.asserts.assert(currentSize, 'Viewport size should be set at this point');
  125. this.currentSize_ = currentSize;
  126. if (previousSize) {
  127. var resized = false;
  128. // Width has changed
  129. if (previousSize.width != currentSize.width) {
  130. this.dispatchEvent(
  131. goog.dom.BufferedViewportSizeMonitor.EventType.RESIZE_WIDTH);
  132. resized = true;
  133. }
  134. // Height has changed
  135. if (previousSize.height != currentSize.height) {
  136. this.dispatchEvent(
  137. goog.dom.BufferedViewportSizeMonitor.EventType.RESIZE_HEIGHT);
  138. resized = true;
  139. }
  140. // If either has changed, this is a resize event.
  141. if (resized) {
  142. this.dispatchEvent(goog.events.EventType.RESIZE);
  143. }
  144. } else {
  145. // If we didn't have a previous size, we consider all events to have
  146. // changed.
  147. this.dispatchEvent(
  148. goog.dom.BufferedViewportSizeMonitor.EventType.RESIZE_HEIGHT);
  149. this.dispatchEvent(
  150. goog.dom.BufferedViewportSizeMonitor.EventType.RESIZE_WIDTH);
  151. this.dispatchEvent(goog.events.EventType.RESIZE);
  152. }
  153. };
  154. /**
  155. * Returns the current size of the viewport.
  156. * @return {goog.math.Size?} The current viewport size.
  157. */
  158. goog.dom.BufferedViewportSizeMonitor.prototype.getSize = function() {
  159. return this.currentSize_ ? this.currentSize_.clone() : null;
  160. };