facebook.js 9.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347
  1. /*!
  2. * MediaElement.js
  3. * http://www.mediaelementjs.com/
  4. *
  5. * Wrapper that mimics native HTML5 MediaElement (audio and video)
  6. * using a variety of technologies (pure JavaScript, Flash, iframe)
  7. *
  8. * Copyright 2010-2017, John Dyer (http://j.hn/)
  9. * License: MIT
  10. *
  11. */(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(_dereq_,module,exports){
  12. 'use strict';
  13. var FacebookRenderer = {
  14. name: 'facebook',
  15. options: {
  16. prefix: 'facebook',
  17. facebook: {
  18. appId: '',
  19. xfbml: true,
  20. version: 'v2.10'
  21. }
  22. },
  23. canPlayType: function canPlayType(type) {
  24. return ~['video/facebook', 'video/x-facebook'].indexOf(type.toLowerCase());
  25. },
  26. create: function create(mediaElement, options, mediaFiles) {
  27. var fbWrapper = {},
  28. apiStack = [],
  29. eventHandler = {},
  30. readyState = 4,
  31. autoplay = mediaElement.originalNode.autoplay;
  32. var poster = '',
  33. src = '',
  34. paused = true,
  35. ended = false,
  36. hasStartedPlaying = false,
  37. fbApi = null,
  38. fbDiv = null;
  39. if (mejs.Features.isiPhone && mediaElement.originalNode.getAttribute('poster')) {
  40. poster = mediaElement.originalNode.getAttribute('poster');
  41. mediaElement.originalNode.removeAttribute('poster');
  42. }
  43. options = Object.assign(options, mediaElement.options);
  44. fbWrapper.options = options;
  45. fbWrapper.id = mediaElement.id + '_' + options.prefix;
  46. fbWrapper.mediaElement = mediaElement;
  47. var props = mejs.html5media.properties,
  48. assignGettersSetters = function assignGettersSetters(propName) {
  49. var capName = '' + propName.substring(0, 1).toUpperCase() + propName.substring(1);
  50. fbWrapper['get' + capName] = function () {
  51. if (fbApi !== null) {
  52. var value = null;
  53. switch (propName) {
  54. case 'currentTime':
  55. return fbApi.getCurrentPosition();
  56. case 'duration':
  57. return fbApi.getDuration();
  58. case 'volume':
  59. return fbApi.getVolume();
  60. case 'paused':
  61. return paused;
  62. case 'ended':
  63. return ended;
  64. case 'muted':
  65. return fbApi.isMuted();
  66. case 'buffered':
  67. return {
  68. start: function start() {
  69. return 0;
  70. },
  71. end: function end() {
  72. return 0;
  73. },
  74. length: 1
  75. };
  76. case 'src':
  77. return src;
  78. case 'readyState':
  79. return readyState;
  80. }
  81. return value;
  82. } else {
  83. return null;
  84. }
  85. };
  86. fbWrapper['set' + capName] = function (value) {
  87. if (fbApi !== null) {
  88. switch (propName) {
  89. case 'src':
  90. var url = typeof value === 'string' ? value : value[0].src;
  91. fbDiv.remove();
  92. createFacebookEmbed(url, options.facebook);
  93. FB.XFBML.parse();
  94. if (autoplay) {
  95. fbApi.play();
  96. }
  97. break;
  98. case 'currentTime':
  99. fbApi.seek(value);
  100. break;
  101. case 'muted':
  102. if (value) {
  103. fbApi.mute();
  104. } else {
  105. fbApi.unmute();
  106. }
  107. setTimeout(function () {
  108. var event = mejs.Utils.createEvent('volumechange', fbWrapper);
  109. mediaElement.dispatchEvent(event);
  110. }, 50);
  111. break;
  112. case 'volume':
  113. fbApi.setVolume(value);
  114. setTimeout(function () {
  115. var event = mejs.Utils.createEvent('volumechange', fbWrapper);
  116. mediaElement.dispatchEvent(event);
  117. }, 50);
  118. break;
  119. case 'readyState':
  120. var event = mejs.Utils.createEvent('canplay', fbWrapper);
  121. mediaElement.dispatchEvent(event);
  122. break;
  123. default:
  124. break;
  125. }
  126. } else {
  127. apiStack.push({ type: 'set', propName: propName, value: value });
  128. }
  129. };
  130. };
  131. for (var i = 0, total = props.length; i < total; i++) {
  132. assignGettersSetters(props[i]);
  133. }
  134. var methods = mejs.html5media.methods,
  135. assignMethods = function assignMethods(methodName) {
  136. fbWrapper[methodName] = function () {
  137. if (fbApi !== null) {
  138. switch (methodName) {
  139. case 'play':
  140. return fbApi.play();
  141. case 'pause':
  142. return fbApi.pause();
  143. case 'load':
  144. return null;
  145. }
  146. } else {
  147. apiStack.push({ type: 'call', methodName: methodName });
  148. }
  149. };
  150. };
  151. for (var _i = 0, _total = methods.length; _i < _total; _i++) {
  152. assignMethods(methods[_i]);
  153. }
  154. function sendEvents(events) {
  155. for (var _i2 = 0, _total2 = events.length; _i2 < _total2; _i2++) {
  156. var event = mejs.Utils.createEvent(events[_i2], fbWrapper);
  157. mediaElement.dispatchEvent(event);
  158. }
  159. }
  160. function createFacebookEmbed(url, config) {
  161. src = url;
  162. fbDiv = document.createElement('div');
  163. fbDiv.id = fbWrapper.id;
  164. fbDiv.className = "fb-video";
  165. fbDiv.setAttribute("data-href", url);
  166. fbDiv.setAttribute("data-allowfullscreen", "true");
  167. fbDiv.setAttribute("data-controls", "false");
  168. mediaElement.originalNode.parentNode.insertBefore(fbDiv, mediaElement.originalNode);
  169. mediaElement.originalNode.style.display = 'none';
  170. window.fbAsyncInit = function () {
  171. FB.init(config);
  172. FB.Event.subscribe('xfbml.ready', function (msg) {
  173. if (msg.type === 'video') {
  174. fbApi = msg.instance;
  175. var fbIframe = fbDiv.getElementsByTagName('iframe')[0],
  176. width = fbIframe.offsetWidth,
  177. height = fbIframe.offsetHeight,
  178. events = ['mouseover', 'mouseout'],
  179. assignEvents = function assignEvents(e) {
  180. var event = mejs.Utils.createEvent(e.type, fbWrapper);
  181. mediaElement.dispatchEvent(event);
  182. };
  183. fbWrapper.setSize(width, height);
  184. if (autoplay) {
  185. fbApi.play();
  186. }
  187. for (var _i3 = 0, _total3 = events.length; _i3 < _total3; _i3++) {
  188. fbIframe.addEventListener(events[_i3], assignEvents, false);
  189. }
  190. var fbEvents = ['startedPlaying', 'paused', 'finishedPlaying', 'startedBuffering', 'finishedBuffering'];
  191. for (var _i4 = 0, _total4 = fbEvents.length; _i4 < _total4; _i4++) {
  192. var event = fbEvents[_i4],
  193. handler = eventHandler[event];
  194. if (handler !== undefined && handler !== null && !mejs.Utils.isObjectEmpty(handler) && typeof handler.removeListener === 'function') {
  195. handler.removeListener(event);
  196. }
  197. }
  198. if (apiStack.length) {
  199. for (var _i5 = 0, _total5 = apiStack.length; _i5 < _total5; _i5++) {
  200. var stackItem = apiStack[_i5];
  201. if (stackItem.type === 'set') {
  202. var propName = stackItem.propName,
  203. capName = '' + propName.substring(0, 1).toUpperCase() + propName.substring(1);
  204. fbWrapper['set' + capName](stackItem.value);
  205. } else if (stackItem.type === 'call') {
  206. fbWrapper[stackItem.methodName]();
  207. }
  208. }
  209. }
  210. sendEvents(['rendererready', 'loadeddata', 'canplay', 'progress', 'loadedmetadata', 'timeupdate']);
  211. var timer = void 0;
  212. eventHandler.startedPlaying = fbApi.subscribe('startedPlaying', function () {
  213. if (!hasStartedPlaying) {
  214. hasStartedPlaying = true;
  215. }
  216. paused = false;
  217. ended = false;
  218. sendEvents(['play', 'playing', 'timeupdate']);
  219. timer = setInterval(function () {
  220. fbApi.getCurrentPosition();
  221. sendEvents(['timeupdate']);
  222. }, 250);
  223. });
  224. eventHandler.paused = fbApi.subscribe('paused', function () {
  225. paused = true;
  226. ended = false;
  227. sendEvents(['pause']);
  228. });
  229. eventHandler.finishedPlaying = fbApi.subscribe('finishedPlaying', function () {
  230. paused = true;
  231. ended = true;
  232. sendEvents(['ended']);
  233. clearInterval(timer);
  234. timer = null;
  235. });
  236. eventHandler.startedBuffering = fbApi.subscribe('startedBuffering', function () {
  237. sendEvents(['progress', 'timeupdate']);
  238. });
  239. eventHandler.finishedBuffering = fbApi.subscribe('finishedBuffering', function () {
  240. sendEvents(['progress', 'timeupdate']);
  241. });
  242. }
  243. });
  244. };
  245. mejs.Utils.loadScript('https://connect.facebook.net/en_US/sdk.js');
  246. }
  247. if (mediaFiles.length > 0) {
  248. createFacebookEmbed(mediaFiles[0].src, fbWrapper.options.facebook);
  249. }
  250. fbWrapper.hide = function () {
  251. fbWrapper.stopInterval();
  252. fbWrapper.pause();
  253. if (fbDiv) {
  254. fbDiv.style.display = 'none';
  255. }
  256. };
  257. fbWrapper.show = function () {
  258. if (fbDiv) {
  259. fbDiv.style.display = '';
  260. }
  261. };
  262. fbWrapper.setSize = function (width) {
  263. if (fbApi !== null && !isNaN(width)) {
  264. fbDiv.style.width = width;
  265. }
  266. };
  267. fbWrapper.destroy = function () {
  268. if (poster) {
  269. mediaElement.originalNode.setAttribute('poster', poster);
  270. }
  271. };
  272. fbWrapper.interval = null;
  273. fbWrapper.startInterval = function () {
  274. fbWrapper.interval = setInterval(function () {
  275. var event = mejs.Utils.createEvent('timeupdate', fbWrapper);
  276. mediaElement.dispatchEvent(event);
  277. }, 250);
  278. };
  279. fbWrapper.stopInterval = function () {
  280. if (fbWrapper.interval) {
  281. clearInterval(fbWrapper.interval);
  282. }
  283. };
  284. return fbWrapper;
  285. }
  286. };
  287. mejs.Utils.typeChecks.push(function (url) {
  288. return ~url.toLowerCase().indexOf('//www.facebook') ? 'video/x-facebook' : null;
  289. });
  290. mejs.Renderers.add(FacebookRenderer);
  291. },{}]},{},[1]);