vttcue.js 6.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286
  1. /**
  2. * Copyright 2013 vtt.js Contributors
  3. *
  4. * Licensed under the Apache License, Version 2.0 (the "License");
  5. * you may not use this file except in compliance with the License.
  6. * You may obtain a copy of the License at
  7. *
  8. * http://www.apache.org/licenses/LICENSE-2.0
  9. *
  10. * Unless required by applicable law or agreed to in writing, software
  11. * distributed under the License is distributed on an "AS IS" BASIS,
  12. * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  13. * See the License for the specific language governing permissions and
  14. * limitations under the License.
  15. */
  16. var autoKeyword = "auto";
  17. var directionSetting = {
  18. "": 1,
  19. "lr": 1,
  20. "rl": 1
  21. };
  22. var alignSetting = {
  23. "start": 1,
  24. "center": 1,
  25. "end": 1,
  26. "left": 1,
  27. "right": 1,
  28. "auto": 1,
  29. "line-left": 1,
  30. "line-right": 1
  31. };
  32. function findDirectionSetting(value) {
  33. if (typeof value !== "string") {
  34. return false;
  35. }
  36. var dir = directionSetting[value.toLowerCase()];
  37. return dir ? value.toLowerCase() : false;
  38. }
  39. function findAlignSetting(value) {
  40. if (typeof value !== "string") {
  41. return false;
  42. }
  43. var align = alignSetting[value.toLowerCase()];
  44. return align ? value.toLowerCase() : false;
  45. }
  46. function VTTCue(startTime, endTime, text) {
  47. /**
  48. * Shim implementation specific properties. These properties are not in
  49. * the spec.
  50. */
  51. // Lets us know when the VTTCue's data has changed in such a way that we need
  52. // to recompute its display state. This lets us compute its display state
  53. // lazily.
  54. this.hasBeenReset = false;
  55. /**
  56. * VTTCue and TextTrackCue properties
  57. * http://dev.w3.org/html5/webvtt/#vttcue-interface
  58. */
  59. var _id = "";
  60. var _pauseOnExit = false;
  61. var _startTime = startTime;
  62. var _endTime = endTime;
  63. var _text = text;
  64. var _region = null;
  65. var _vertical = "";
  66. var _snapToLines = true;
  67. var _line = "auto";
  68. var _lineAlign = "start";
  69. var _position = "auto";
  70. var _positionAlign = "auto";
  71. var _size = 100;
  72. var _align = "center";
  73. Object.defineProperties(this, {
  74. "id": {
  75. enumerable: true,
  76. get: function() {
  77. return _id;
  78. },
  79. set: function(value) {
  80. _id = "" + value;
  81. }
  82. },
  83. "pauseOnExit": {
  84. enumerable: true,
  85. get: function() {
  86. return _pauseOnExit;
  87. },
  88. set: function(value) {
  89. _pauseOnExit = !!value;
  90. }
  91. },
  92. "startTime": {
  93. enumerable: true,
  94. get: function() {
  95. return _startTime;
  96. },
  97. set: function(value) {
  98. if (typeof value !== "number") {
  99. throw new TypeError("Start time must be set to a number.");
  100. }
  101. _startTime = value;
  102. this.hasBeenReset = true;
  103. }
  104. },
  105. "endTime": {
  106. enumerable: true,
  107. get: function() {
  108. return _endTime;
  109. },
  110. set: function(value) {
  111. if (typeof value !== "number") {
  112. throw new TypeError("End time must be set to a number.");
  113. }
  114. _endTime = value;
  115. this.hasBeenReset = true;
  116. }
  117. },
  118. "text": {
  119. enumerable: true,
  120. get: function() {
  121. return _text;
  122. },
  123. set: function(value) {
  124. _text = "" + value;
  125. this.hasBeenReset = true;
  126. }
  127. },
  128. "region": {
  129. enumerable: true,
  130. get: function() {
  131. return _region;
  132. },
  133. set: function(value) {
  134. _region = value;
  135. this.hasBeenReset = true;
  136. }
  137. },
  138. "vertical": {
  139. enumerable: true,
  140. get: function() {
  141. return _vertical;
  142. },
  143. set: function(value) {
  144. var setting = findDirectionSetting(value);
  145. // Have to check for false because the setting an be an empty string.
  146. if (setting === false) {
  147. throw new SyntaxError("Vertical: an invalid or illegal direction string was specified.");
  148. }
  149. _vertical = setting;
  150. this.hasBeenReset = true;
  151. }
  152. },
  153. "snapToLines": {
  154. enumerable: true,
  155. get: function() {
  156. return _snapToLines;
  157. },
  158. set: function(value) {
  159. _snapToLines = !!value;
  160. this.hasBeenReset = true;
  161. }
  162. },
  163. "line": {
  164. enumerable: true,
  165. get: function() {
  166. return _line;
  167. },
  168. set: function(value) {
  169. if (typeof value !== "number" && value !== autoKeyword) {
  170. throw new SyntaxError("Line: an invalid number or illegal string was specified.");
  171. }
  172. _line = value;
  173. this.hasBeenReset = true;
  174. }
  175. },
  176. "lineAlign": {
  177. enumerable: true,
  178. get: function() {
  179. return _lineAlign;
  180. },
  181. set: function(value) {
  182. var setting = findAlignSetting(value);
  183. if (!setting) {
  184. console.warn("lineAlign: an invalid or illegal string was specified.");
  185. } else {
  186. _lineAlign = setting;
  187. this.hasBeenReset = true;
  188. }
  189. }
  190. },
  191. "position": {
  192. enumerable: true,
  193. get: function() {
  194. return _position;
  195. },
  196. set: function(value) {
  197. if (value < 0 || value > 100) {
  198. throw new Error("Position must be between 0 and 100.");
  199. }
  200. _position = value;
  201. this.hasBeenReset = true;
  202. }
  203. },
  204. "positionAlign": {
  205. enumerable: true,
  206. get: function() {
  207. return _positionAlign;
  208. },
  209. set: function(value) {
  210. var setting = findAlignSetting(value);
  211. if (!setting) {
  212. console.warn("positionAlign: an invalid or illegal string was specified.");
  213. } else {
  214. _positionAlign = setting;
  215. this.hasBeenReset = true;
  216. }
  217. }
  218. },
  219. "size": {
  220. enumerable: true,
  221. get: function() {
  222. return _size;
  223. },
  224. set: function(value) {
  225. if (value < 0 || value > 100) {
  226. throw new Error("Size must be between 0 and 100.");
  227. }
  228. _size = value;
  229. this.hasBeenReset = true;
  230. }
  231. },
  232. "align": {
  233. enumerable: true,
  234. get: function() {
  235. return _align;
  236. },
  237. set: function(value) {
  238. var setting = findAlignSetting(value);
  239. if (!setting) {
  240. throw new SyntaxError("align: an invalid or illegal alignment string was specified.");
  241. }
  242. _align = setting;
  243. this.hasBeenReset = true;
  244. }
  245. }
  246. });
  247. /**
  248. * Other <track> spec defined properties
  249. */
  250. // http://www.whatwg.org/specs/web-apps/current-work/multipage/the-video-element.html#text-track-cue-display-state
  251. this.displayState = undefined;
  252. }
  253. /**
  254. * VTTCue methods
  255. */
  256. VTTCue.prototype.getCueAsHTML = function() {
  257. // Assume WebVTT.convertCueToDOMTree is on the global.
  258. return WebVTT.convertCueToDOMTree(window, this.text);
  259. };
  260. module.exports = VTTCue;