spriteinfo.js 6.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214
  1. // Copyright 2008 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 SpriteInfo implementation. This is a simple wrapper class to
  16. * hold CSS metadata needed for sprited emoji.
  17. *
  18. * @see ../demos/popupemojipicker.html or emojipicker_test.html for examples
  19. * of how to use this class.
  20. *
  21. */
  22. goog.provide('goog.ui.emoji.SpriteInfo');
  23. /**
  24. * Creates a SpriteInfo object with the specified properties. If the image is
  25. * sprited via CSS, then only the first parameter needs a value. If the image
  26. * is sprited via metadata, then the first parameter should be left null.
  27. *
  28. * @param {?string} cssClass CSS class to properly display the sprited image.
  29. * @param {string=} opt_url Url of the sprite image.
  30. * @param {number=} opt_width Width of the image being sprited.
  31. * @param {number=} opt_height Height of the image being sprited.
  32. * @param {number=} opt_xOffset Positive x offset of the image being sprited
  33. * within the sprite.
  34. * @param {number=} opt_yOffset Positive y offset of the image being sprited
  35. * within the sprite.
  36. * @param {boolean=} opt_animated Whether the sprite is animated.
  37. * @constructor
  38. * @final
  39. */
  40. goog.ui.emoji.SpriteInfo = function(
  41. cssClass, opt_url, opt_width, opt_height, opt_xOffset, opt_yOffset,
  42. opt_animated) {
  43. if (cssClass != null) {
  44. this.cssClass_ = cssClass;
  45. } else {
  46. if (opt_url == undefined || opt_width === undefined ||
  47. opt_height === undefined || opt_xOffset == undefined ||
  48. opt_yOffset === undefined) {
  49. throw Error('Sprite info is not fully specified');
  50. }
  51. this.url_ = opt_url;
  52. this.width_ = opt_width;
  53. this.height_ = opt_height;
  54. this.xOffset_ = opt_xOffset;
  55. this.yOffset_ = opt_yOffset;
  56. }
  57. this.animated_ = !!opt_animated;
  58. };
  59. /**
  60. * Name of the CSS class to properly display the sprited image.
  61. * @type {string}
  62. * @private
  63. */
  64. goog.ui.emoji.SpriteInfo.prototype.cssClass_;
  65. /**
  66. * Url of the sprite image.
  67. * @type {string|undefined}
  68. * @private
  69. */
  70. goog.ui.emoji.SpriteInfo.prototype.url_;
  71. /**
  72. * Width of the image being sprited.
  73. * @type {number|undefined}
  74. * @private
  75. */
  76. goog.ui.emoji.SpriteInfo.prototype.width_;
  77. /**
  78. * Height of the image being sprited.
  79. * @type {number|undefined}
  80. * @private
  81. */
  82. goog.ui.emoji.SpriteInfo.prototype.height_;
  83. /**
  84. * Positive x offset of the image being sprited within the sprite.
  85. * @type {number|undefined}
  86. * @private
  87. */
  88. goog.ui.emoji.SpriteInfo.prototype.xOffset_;
  89. /**
  90. * Positive y offset of the image being sprited within the sprite.
  91. * @type {number|undefined}
  92. * @private
  93. */
  94. goog.ui.emoji.SpriteInfo.prototype.yOffset_;
  95. /**
  96. * Whether the emoji specified by the sprite is animated.
  97. * @type {boolean}
  98. * @private
  99. */
  100. goog.ui.emoji.SpriteInfo.prototype.animated_;
  101. /**
  102. * Returns the css class of the sprited image.
  103. * @return {?string} Name of the CSS class to properly display the sprited
  104. * image.
  105. */
  106. goog.ui.emoji.SpriteInfo.prototype.getCssClass = function() {
  107. return this.cssClass_ || null;
  108. };
  109. /**
  110. * Returns the url of the sprite image.
  111. * @return {?string} Url of the sprite image.
  112. */
  113. goog.ui.emoji.SpriteInfo.prototype.getUrl = function() {
  114. return this.url_ || null;
  115. };
  116. /**
  117. * Returns whether the emoji specified by this sprite is animated.
  118. * @return {boolean} Whether the emoji is animated.
  119. */
  120. goog.ui.emoji.SpriteInfo.prototype.isAnimated = function() {
  121. return this.animated_;
  122. };
  123. /**
  124. * Returns the width of the image being sprited, appropriate for a CSS value.
  125. * @return {string} The width of the image being sprited.
  126. */
  127. goog.ui.emoji.SpriteInfo.prototype.getWidthCssValue = function() {
  128. return goog.ui.emoji.SpriteInfo.getCssPixelValue_(this.width_);
  129. };
  130. /**
  131. * Returns the height of the image being sprited, appropriate for a CSS value.
  132. * @return {string} The height of the image being sprited.
  133. */
  134. goog.ui.emoji.SpriteInfo.prototype.getHeightCssValue = function() {
  135. return goog.ui.emoji.SpriteInfo.getCssPixelValue_(this.height_);
  136. };
  137. /**
  138. * Returns the x offset of the image being sprited within the sprite,
  139. * appropriate for a CSS value.
  140. * @return {string} The x offset of the image being sprited within the sprite.
  141. */
  142. goog.ui.emoji.SpriteInfo.prototype.getXOffsetCssValue = function() {
  143. return goog.ui.emoji.SpriteInfo.getOffsetCssValue_(this.xOffset_);
  144. };
  145. /**
  146. * Returns the positive y offset of the image being sprited within the sprite,
  147. * appropriate for a CSS value.
  148. * @return {string} The y offset of the image being sprited within the sprite.
  149. */
  150. goog.ui.emoji.SpriteInfo.prototype.getYOffsetCssValue = function() {
  151. return goog.ui.emoji.SpriteInfo.getOffsetCssValue_(this.yOffset_);
  152. };
  153. /**
  154. * Returns a string appropriate for use as a CSS value. If the value is zero,
  155. * then there is no unit appended.
  156. *
  157. * @param {number|undefined} value A number to be turned into a
  158. * CSS size/location value.
  159. * @return {string} A string appropriate for use as a CSS value.
  160. * @private
  161. */
  162. goog.ui.emoji.SpriteInfo.getCssPixelValue_ = function(value) {
  163. return !value ? '0' : value + 'px';
  164. };
  165. /**
  166. * Returns a string appropriate for use as a CSS value for a position offset,
  167. * such as the position argument for sprites.
  168. *
  169. * @param {number|undefined} posOffset A positive offset for a position.
  170. * @return {string} A string appropriate for use as a CSS value.
  171. * @private
  172. */
  173. goog.ui.emoji.SpriteInfo.getOffsetCssValue_ = function(posOffset) {
  174. var offset = goog.ui.emoji.SpriteInfo.getCssPixelValue_(posOffset);
  175. return offset == '0' ? offset : '-' + offset;
  176. };