/files/blueimp-gallery/2.12.1/js/blueimp-gallery-vimeo.js

https://github.com/atmajs/jsdelivr · JavaScript · 212 lines · 167 code · 21 blank · 24 comment · 28 complexity · 99e69c04de0c7f782d75e7e692c1c8f3 MD5 · raw file

  1. /*
  2. * blueimp Gallery Vimeo Video Factory JS 1.1.0
  3. * https://github.com/blueimp/Gallery
  4. *
  5. * Copyright 2013, Sebastian Tschan
  6. * https://blueimp.net
  7. *
  8. * Licensed under the MIT license:
  9. * http://www.opensource.org/licenses/MIT
  10. */
  11. /*jslint regexp: true */
  12. /*global define, window, document, location, $f */
  13. (function (factory) {
  14. 'use strict';
  15. if (typeof define === 'function' && define.amd) {
  16. // Register as an anonymous AMD module:
  17. define([
  18. './blueimp-helper',
  19. './blueimp-gallery-video'
  20. ], factory);
  21. } else {
  22. // Browser globals:
  23. factory(
  24. window.blueimp.helper || window.jQuery,
  25. window.blueimp.Gallery
  26. );
  27. }
  28. }(function ($, Gallery) {
  29. 'use strict';
  30. if (!window.postMessage) {
  31. return Gallery;
  32. }
  33. $.extend(Gallery.prototype.options, {
  34. // The list object property (or data attribute) with the Vimeo video id:
  35. vimeoVideoIdProperty: 'vimeo',
  36. // The URL for the Vimeo video player, can be extended with custom parameters:
  37. // https://developer.vimeo.com/player/embedding
  38. vimeoPlayerUrl: '//player.vimeo.com/video/VIDEO_ID?api=1&player_id=PLAYER_ID',
  39. // The prefix for the Vimeo video player ID:
  40. vimeoPlayerIdPrefix: 'vimeo-player-',
  41. // Require a click on the native Vimeo player for the initial playback:
  42. vimeoClickToPlay: true
  43. });
  44. var textFactory = Gallery.prototype.textFactory || Gallery.prototype.imageFactory,
  45. VimeoPlayer = function (url, videoId, playerId, clickToPlay) {
  46. this.url = url;
  47. this.videoId = videoId;
  48. this.playerId = playerId;
  49. this.clickToPlay = clickToPlay;
  50. this.element = document.createElement('div');
  51. this.listeners = {};
  52. },
  53. counter = 0;
  54. $.extend(VimeoPlayer.prototype, {
  55. canPlayType: function () {
  56. return true;
  57. },
  58. on: function (type, func) {
  59. this.listeners[type] = func;
  60. return this;
  61. },
  62. loadAPI: function () {
  63. var that = this,
  64. apiUrl = '//' + (location.protocol === 'https' ? 'secure-' : '') +
  65. 'a.vimeocdn.com/js/froogaloop2.min.js',
  66. scriptTags = document.getElementsByTagName('script'),
  67. i = scriptTags.length,
  68. scriptTag,
  69. called,
  70. callback = function () {
  71. if (!called && that.playOnReady) {
  72. that.play();
  73. }
  74. called = true;
  75. };
  76. while (i) {
  77. i -= 1;
  78. if (scriptTags[i].src === apiUrl) {
  79. scriptTag = scriptTags[i];
  80. break;
  81. }
  82. }
  83. if (!scriptTag) {
  84. scriptTag = document.createElement('script');
  85. scriptTag.src = apiUrl;
  86. }
  87. $(scriptTag).on('load', callback);
  88. scriptTags[0].parentNode.insertBefore(scriptTag, scriptTags[0]);
  89. // Fix for cached scripts on IE 8:
  90. if (/loaded|complete/.test(scriptTag.readyState)) {
  91. callback();
  92. }
  93. },
  94. onReady: function () {
  95. var that = this;
  96. this.ready = true;
  97. this.player.addEvent('play', function () {
  98. that.hasPlayed = true;
  99. that.onPlaying();
  100. });
  101. this.player.addEvent('pause', function () {
  102. that.onPause();
  103. });
  104. this.player.addEvent('finish', function () {
  105. that.onPause();
  106. });
  107. if (this.playOnReady) {
  108. this.play();
  109. }
  110. },
  111. onPlaying: function () {
  112. if (this.playStatus < 2) {
  113. this.listeners.playing();
  114. this.playStatus = 2;
  115. }
  116. },
  117. onPause: function () {
  118. this.listeners.pause();
  119. delete this.playStatus;
  120. },
  121. insertIframe: function () {
  122. var iframe = document.createElement('iframe');
  123. iframe.src = this.url
  124. .replace('VIDEO_ID', this.videoId)
  125. .replace('PLAYER_ID', this.playerId);
  126. iframe.id = this.playerId;
  127. this.element.parentNode.replaceChild(iframe, this.element);
  128. this.element = iframe;
  129. },
  130. play: function () {
  131. var that = this;
  132. if (!this.playStatus) {
  133. this.listeners.play();
  134. this.playStatus = 1;
  135. }
  136. if (this.ready) {
  137. if (!this.hasPlayed && (this.clickToPlay || (window.navigator &&
  138. /iP(hone|od|ad)/.test(window.navigator.platform)))) {
  139. // Manually trigger the playing callback if clickToPlay
  140. // is enabled and to workaround a limitation in iOS,
  141. // which requires synchronous user interaction to start
  142. // the video playback:
  143. this.onPlaying();
  144. } else {
  145. this.player.api('play');
  146. }
  147. } else {
  148. this.playOnReady = true;
  149. if (!window.$f) {
  150. this.loadAPI();
  151. } else if (!this.player) {
  152. this.insertIframe();
  153. this.player = $f(this.element);
  154. this.player.addEvent('ready', function () {
  155. that.onReady();
  156. });
  157. }
  158. }
  159. },
  160. pause: function () {
  161. if (this.ready) {
  162. this.player.api('pause');
  163. } else if (this.playStatus) {
  164. delete this.playOnReady;
  165. this.listeners.pause();
  166. delete this.playStatus;
  167. }
  168. }
  169. });
  170. $.extend(Gallery.prototype, {
  171. VimeoPlayer: VimeoPlayer,
  172. textFactory: function (obj, callback) {
  173. var videoId = this.getItemProperty(obj, this.options.vimeoVideoIdProperty);
  174. if (videoId) {
  175. counter += 1;
  176. return this.videoFactory(
  177. obj,
  178. callback,
  179. new VimeoPlayer(
  180. this.options.vimeoPlayerUrl,
  181. videoId,
  182. this.options.vimeoPlayerIdPrefix + counter,
  183. this.options.vimeoClickToPlay
  184. )
  185. );
  186. }
  187. return textFactory.call(this, obj, callback);
  188. }
  189. });
  190. return Gallery;
  191. }));