vttcue.js 7.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309
  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. (function(root, vttjs) {
  17. var autoKeyword = "auto";
  18. var directionSetting = {
  19. "": true,
  20. "lr": true,
  21. "rl": true
  22. };
  23. var alignSetting = {
  24. "start": true,
  25. "middle": true,
  26. "end": true,
  27. "left": true,
  28. "right": true
  29. };
  30. function findDirectionSetting(value) {
  31. if (typeof value !== "string") {
  32. return false;
  33. }
  34. var dir = directionSetting[value.toLowerCase()];
  35. return dir ? value.toLowerCase() : false;
  36. }
  37. function findAlignSetting(value) {
  38. if (typeof value !== "string") {
  39. return false;
  40. }
  41. var align = alignSetting[value.toLowerCase()];
  42. return align ? value.toLowerCase() : false;
  43. }
  44. function extend(obj) {
  45. var i = 1;
  46. for (; i < arguments.length; i++) {
  47. var cobj = arguments[i];
  48. for (var p in cobj) {
  49. obj[p] = cobj[p];
  50. }
  51. }
  52. return obj;
  53. }
  54. function VTTCue(startTime, endTime, text) {
  55. var cue = this;
  56. var isIE8 = (/MSIE\s8\.0/).test(navigator.userAgent);
  57. var baseObj = {};
  58. if (isIE8) {
  59. cue = document.createElement('custom');
  60. } else {
  61. baseObj.enumerable = true;
  62. }
  63. /**
  64. * Shim implementation specific properties. These properties are not in
  65. * the spec.
  66. */
  67. // Lets us know when the VTTCue's data has changed in such a way that we need
  68. // to recompute its display state. This lets us compute its display state
  69. // lazily.
  70. cue.hasBeenReset = false;
  71. /**
  72. * VTTCue and TextTrackCue properties
  73. * http://dev.w3.org/html5/webvtt/#vttcue-interface
  74. */
  75. var _id = "";
  76. var _pauseOnExit = false;
  77. var _startTime = startTime;
  78. var _endTime = endTime;
  79. var _text = text;
  80. var _region = null;
  81. var _vertical = "";
  82. var _snapToLines = true;
  83. var _line = "auto";
  84. var _lineAlign = "start";
  85. var _position = 50;
  86. var _positionAlign = "middle";
  87. var _size = 50;
  88. var _align = "middle";
  89. Object.defineProperty(cue,
  90. "id", extend({}, baseObj, {
  91. get: function() {
  92. return _id;
  93. },
  94. set: function(value) {
  95. _id = "" + value;
  96. }
  97. }));
  98. Object.defineProperty(cue,
  99. "pauseOnExit", extend({}, baseObj, {
  100. get: function() {
  101. return _pauseOnExit;
  102. },
  103. set: function(value) {
  104. _pauseOnExit = !!value;
  105. }
  106. }));
  107. Object.defineProperty(cue,
  108. "startTime", extend({}, baseObj, {
  109. get: function() {
  110. return _startTime;
  111. },
  112. set: function(value) {
  113. if (typeof value !== "number") {
  114. throw new TypeError("Start time must be set to a number.");
  115. }
  116. _startTime = value;
  117. this.hasBeenReset = true;
  118. }
  119. }));
  120. Object.defineProperty(cue,
  121. "endTime", extend({}, baseObj, {
  122. get: function() {
  123. return _endTime;
  124. },
  125. set: function(value) {
  126. if (typeof value !== "number") {
  127. throw new TypeError("End time must be set to a number.");
  128. }
  129. _endTime = value;
  130. this.hasBeenReset = true;
  131. }
  132. }));
  133. Object.defineProperty(cue,
  134. "text", extend({}, baseObj, {
  135. get: function() {
  136. return _text;
  137. },
  138. set: function(value) {
  139. _text = "" + value;
  140. this.hasBeenReset = true;
  141. }
  142. }));
  143. Object.defineProperty(cue,
  144. "region", extend({}, baseObj, {
  145. get: function() {
  146. return _region;
  147. },
  148. set: function(value) {
  149. _region = value;
  150. this.hasBeenReset = true;
  151. }
  152. }));
  153. Object.defineProperty(cue,
  154. "vertical", extend({}, baseObj, {
  155. get: function() {
  156. return _vertical;
  157. },
  158. set: function(value) {
  159. var setting = findDirectionSetting(value);
  160. // Have to check for false because the setting an be an empty string.
  161. if (setting === false) {
  162. throw new SyntaxError("An invalid or illegal string was specified.");
  163. }
  164. _vertical = setting;
  165. this.hasBeenReset = true;
  166. }
  167. }));
  168. Object.defineProperty(cue,
  169. "snapToLines", extend({}, baseObj, {
  170. get: function() {
  171. return _snapToLines;
  172. },
  173. set: function(value) {
  174. _snapToLines = !!value;
  175. this.hasBeenReset = true;
  176. }
  177. }));
  178. Object.defineProperty(cue,
  179. "line", extend({}, baseObj, {
  180. get: function() {
  181. return _line;
  182. },
  183. set: function(value) {
  184. if (typeof value !== "number" && value !== autoKeyword) {
  185. throw new SyntaxError("An invalid number or illegal string was specified.");
  186. }
  187. _line = value;
  188. this.hasBeenReset = true;
  189. }
  190. }));
  191. Object.defineProperty(cue,
  192. "lineAlign", extend({}, baseObj, {
  193. get: function() {
  194. return _lineAlign;
  195. },
  196. set: function(value) {
  197. var setting = findAlignSetting(value);
  198. if (!setting) {
  199. throw new SyntaxError("An invalid or illegal string was specified.");
  200. }
  201. _lineAlign = setting;
  202. this.hasBeenReset = true;
  203. }
  204. }));
  205. Object.defineProperty(cue,
  206. "position", extend({}, baseObj, {
  207. get: function() {
  208. return _position;
  209. },
  210. set: function(value) {
  211. if (value < 0 || value > 100) {
  212. throw new Error("Position must be between 0 and 100.");
  213. }
  214. _position = value;
  215. this.hasBeenReset = true;
  216. }
  217. }));
  218. Object.defineProperty(cue,
  219. "positionAlign", extend({}, baseObj, {
  220. get: function() {
  221. return _positionAlign;
  222. },
  223. set: function(value) {
  224. var setting = findAlignSetting(value);
  225. if (!setting) {
  226. throw new SyntaxError("An invalid or illegal string was specified.");
  227. }
  228. _positionAlign = setting;
  229. this.hasBeenReset = true;
  230. }
  231. }));
  232. Object.defineProperty(cue,
  233. "size", extend({}, baseObj, {
  234. get: function() {
  235. return _size;
  236. },
  237. set: function(value) {
  238. if (value < 0 || value > 100) {
  239. throw new Error("Size must be between 0 and 100.");
  240. }
  241. _size = value;
  242. this.hasBeenReset = true;
  243. }
  244. }));
  245. Object.defineProperty(cue,
  246. "align", extend({}, baseObj, {
  247. get: function() {
  248. return _align;
  249. },
  250. set: function(value) {
  251. var setting = findAlignSetting(value);
  252. if (!setting) {
  253. throw new SyntaxError("An invalid or illegal string was specified.");
  254. }
  255. _align = setting;
  256. this.hasBeenReset = true;
  257. }
  258. }));
  259. /**
  260. * Other <track> spec defined properties
  261. */
  262. // http://www.whatwg.org/specs/web-apps/current-work/multipage/the-video-element.html#text-track-cue-display-state
  263. cue.displayState = undefined;
  264. if (isIE8) {
  265. return cue;
  266. }
  267. }
  268. /**
  269. * VTTCue methods
  270. */
  271. VTTCue.prototype.getCueAsHTML = function() {
  272. // Assume WebVTT.convertCueToDOMTree is on the global.
  273. return WebVTT.convertCueToDOMTree(window, this.text);
  274. };
  275. root.VTTCue = root.VTTCue || VTTCue;
  276. vttjs.VTTCue = VTTCue;
  277. }(this, (this.vttjs || {})));