www/plugins-dist/medias/lib/mejs/renderers/twitch.js

   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
  14 var TwitchApi = {
  15
  16         promise: null,
  17
  18         load: function load(settings) {
  19                 if (typeof Twitch !== 'undefined') {
  20                         TwitchApi.promise = new Promise(function (resolve) {
  21                                 resolve();
  22                         }).then(function () {
  23                                 TwitchApi._createPlayer(settings);
  24                         });
  25                 } else {
  26                         TwitchApi.promise = TwitchApi.promise || mejs.Utils.loadScript('https://player.twitch.tv/js/embed/v1.js');
  27                         TwitchApi.promise.then(function () {
  28                                 TwitchApi._createPlayer(settings);
  29                         });
  30                 }
  31         },
  32
  33         _createPlayer: function _createPlayer(settings) {
  34                 var player = new Twitch.Player(settings.id, settings);
  35                 window['__ready__' + settings.id](player);
  36         },
  37
  38         getTwitchId: function getTwitchId(url) {
  39                 var twitchId = '';
  40
  41                 if (url.indexOf('?') > 0) {
  42                         twitchId = TwitchApi.getTwitchIdFromParam(url);
  43                         if (twitchId === '') {
  44                                 twitchId = TwitchApi.getTwitchIdFromUrl(url);
  45                         }
  46                 } else {
  47                         twitchId = TwitchApi.getTwitchIdFromUrl(url);
  48                 }
  49
  50                 return twitchId;
  51         },
  52
  53         getTwitchIdFromParam: function getTwitchIdFromParam(url) {
  54                 if (url === undefined || url === null || !url.trim().length) {
  55                         return null;
  56                 }
  57
  58                 var parts = url.split('?'),
  59                     parameters = parts[1].split('&');
  60
  61                 var twitchId = '';
  62
  63                 for (var i = 0, total = parameters.length; i < total; i++) {
  64                         var paramParts = parameters[i].split('=');
  65                         if (~paramParts[0].indexOf('channel=')) {
  66                                 twitchId = paramParts[1];
  67                                 break;
  68                         } else if (~paramParts[0].indexOf('video=')) {
  69                                 twitchId = 'v' + paramParts[1];
  70                                 break;
  71                         }
  72                 }
  73
  74                 return twitchId;
  75         },
  76
  77         getTwitchIdFromUrl: function getTwitchIdFromUrl(url) {
  78                 if (url === undefined || url === null || !url.trim().length) {
  79                         return null;
  80                 }
  81
  82                 var parts = url.split('?');
  83                 url = parts[0];
  84                 var id = url.substring(url.lastIndexOf('/') + 1);
  85                 return (/^\d+$/i.test(id) !== null ? 'v' + id : id
  86                 );
  87         },
  88
  89         getTwitchType: function getTwitchType(id) {
  90                 return (/^v\d+/i.test(id) !== null ? 'video' : 'channel'
  91                 );
  92         }
  93 };
  94
  95 var TwitchIframeRenderer = {
  96         name: 'twitch_iframe',
  97         options: {
  98                 prefix: 'twitch_iframe'
  99         },
 100
 101         canPlayType: function canPlayType(type) {
 102                 return ~['video/twitch', 'video/x-twitch'].indexOf(type.toLowerCase());
 103         },
 104
 105         create: function create(mediaElement, options, mediaFiles) {
 106                 var twitch = {},
 107                     apiStack = [],
 108                     readyState = 4,
 109                     twitchId = TwitchApi.getTwitchId(mediaFiles[0].src);
 110
 111                 var twitchPlayer = null,
 112                     paused = true,
 113                     ended = false,
 114                     hasStartedPlaying = false,
 115                     volume = 1,
 116                     duration = Infinity,
 117                     time = 0;
 118
 119                 twitch.options = options;
 120                 twitch.id = mediaElement.id + '_' + options.prefix;
 121                 twitch.mediaElement = mediaElement;
 122
 123                 var props = mejs.html5media.properties,
 124                     assignGettersSetters = function assignGettersSetters(propName) {
 125                         var capName = '' + propName.substring(0, 1).toUpperCase() + propName.substring(1);
 126
 127                         twitch['get' + capName] = function () {
 128                                 if (twitchPlayer !== null) {
 129                                         var value = null;
 130
 131                                         switch (propName) {
 132                                                 case 'currentTime':
 133                                                         time = twitchPlayer.getCurrentTime();
 134                                                         return time;
 135                                                 case 'duration':
 136                                                         duration = twitchPlayer.getDuration();
 137                                                         return duration;
 138                                                 case 'volume':
 139                                                         volume = twitchPlayer.getVolume();
 140                                                         return volume;
 141                                                 case 'paused':
 142                                                         paused = twitchPlayer.isPaused();
 143                                                         return paused;
 144                                                 case 'ended':
 145                                                         ended = twitchPlayer.getEnded();
 146                                                         return ended;
 147                                                 case 'muted':
 148                                                         return twitchPlayer.getMuted();
 149                                                 case 'buffered':
 150                                                         return {
 151                                                                 start: function start() {
 152                                                                         return 0;
 153                                                                 },
 154                                                                 end: function end() {
 155                                                                         return 0;
 156                                                                 },
 157                                                                 length: 1
 158                                                         };
 159                                                 case 'src':
 160                                                         return TwitchApi.getTwitchType(twitchId) === 'channel' ? twitchPlayer.getChannel() : twitchPlayer.getVideo();
 161                                                 case 'readyState':
 162                                                         return readyState;
 163                                         }
 164
 165                                         return value;
 166                                 } else {
 167                                         return null;
 168                                 }
 169                         };
 170
 171                         twitch['set' + capName] = function (value) {
 172                                 if (twitchPlayer !== null) {
 173                                         switch (propName) {
 174                                                 case 'src':
 175                                                         var url = typeof value === 'string' ? value : value[0].src,
 176                                                             videoId = TwitchApi.getTwitchId(url);
 177
 178                                                         if (TwitchApi.getTwitchType(twitchId) === 'channel') {
 179                                                                 twitchPlayer.setChannel(videoId);
 180                                                         } else {
 181                                                                 twitchPlayer.setVideo(videoId);
 182                                                         }
 183                                                         break;
 184                                                 case 'currentTime':
 185                                                         twitchPlayer.seek(value);
 186                                                         setTimeout(function () {
 187                                                                 var event = mejs.Utils.createEvent('timeupdate', twitch);
 188                                                                 mediaElement.dispatchEvent(event);
 189                                                         }, 50);
 190                                                         break;
 191                                                 case 'muted':
 192                                                         twitchPlayer.setMuted(value);
 193                                                         setTimeout(function () {
 194                                                                 var event = mejs.Utils.createEvent('volumechange', twitch);
 195                                                                 mediaElement.dispatchEvent(event);
 196                                                         }, 50);
 197                                                         break;
 198                                                 case 'volume':
 199                                                         volume = value;
 200                                                         twitchPlayer.setVolume(value);
 201                                                         setTimeout(function () {
 202                                                                 var event = mejs.Utils.createEvent('volumechange', twitch);
 203                                                                 mediaElement.dispatchEvent(event);
 204                                                         }, 50);
 205                                                         break;
 206                                                 case 'readyState':
 207                                                         var event = mejs.Utils.createEvent('canplay', twitch);
 208                                                         mediaElement.dispatchEvent(event);
 209                                                         break;
 210                                                 default:
 211
 212                                                         break;
 213                                         }
 214                                 } else {
 215                                         apiStack.push({ type: 'set', propName: propName, value: value });
 216                                 }
 217                         };
 218                 };
 219
 220                 for (var i = 0, total = props.length; i < total; i++) {
 221                         assignGettersSetters(props[i]);
 222                 }
 223
 224                 var methods = mejs.html5media.methods,
 225                     assignMethods = function assignMethods(methodName) {
 226                         twitch[methodName] = function () {
 227                                 if (twitchPlayer !== null) {
 228                                         switch (methodName) {
 229                                                 case 'play':
 230                                                         paused = false;
 231                                                         return twitchPlayer.play();
 232                                                 case 'pause':
 233                                                         paused = true;
 234                                                         return twitchPlayer.pause();
 235                                                 case 'load':
 236                                                         return null;
 237                                         }
 238                                 } else {
 239                                         apiStack.push({ type: 'call', methodName: methodName });
 240                                 }
 241                         };
 242                 };
 243
 244                 for (var _i = 0, _total = methods.length; _i < _total; _i++) {
 245                         assignMethods(methods[_i]);
 246                 }
 247
 248                 function sendEvents(events) {
 249                         for (var _i2 = 0, _total2 = events.length; _i2 < _total2; _i2++) {
 250                                 var event = mejs.Utils.createEvent(events[_i2], twitch);
 251                                 mediaElement.dispatchEvent(event);
 252                         }
 253                 }
 254
 255                 window['__ready__' + twitch.id] = function (_twitchPlayer) {
 256                         mediaElement.twitchPlayer = twitchPlayer = _twitchPlayer;
 257
 258                         if (apiStack.length) {
 259                                 for (var _i3 = 0, _total3 = apiStack.length; _i3 < _total3; _i3++) {
 260                                         var stackItem = apiStack[_i3];
 261
 262                                         if (stackItem.type === 'set') {
 263                                                 var propName = stackItem.propName,
 264                                                     capName = '' + propName.substring(0, 1).toUpperCase() + propName.substring(1);
 265
 266                                                 twitch['set' + capName](stackItem.value);
 267                                         } else if (stackItem.type === 'call') {
 268                                                 twitch[stackItem.methodName]();
 269                                         }
 270                                 }
 271                         }
 272
 273                         var twitchIframe = document.getElementById(twitch.id).firstChild;
 274                         twitchIframe.style.width = '100%';
 275                         twitchIframe.style.height = '100%';
 276
 277                         var events = ['mouseover', 'mouseout'],
 278                             assignEvents = function assignEvents(e) {
 279                                 var event = createEvent(e.type, twitch);
 280                                 mediaElement.dispatchEvent(event);
 281                         };
 282
 283                         for (var _i4 = 0, _total4 = events.length; _i4 < _total4; _i4++) {
 284                                 twitchIframe.addEventListener(events[_i4], assignEvents, false);
 285                         }
 286
 287                         var timer = void 0;
 288
 289                         twitchPlayer.addEventListener('ready', function () {
 290                                 paused = false;
 291                                 ended = false;
 292                                 sendEvents(['rendererready', 'loadedmetadata', 'loadeddata', 'canplay']);
 293                         });
 294                         twitchPlayer.addEventListener('play', function () {
 295                                 if (!hasStartedPlaying) {
 296                                         hasStartedPlaying = true;
 297                                 }
 298                                 paused = false;
 299                                 ended = false;
 300                                 sendEvents(['play', 'playing', 'progress']);
 301
 302                                 timer = setInterval(function () {
 303                                         twitchPlayer.getCurrentTime();
 304                                         sendEvents(['timeupdate']);
 305                                 }, 250);
 306                         });
 307                         twitchPlayer.addEventListener('pause', function () {
 308                                 paused = true;
 309                                 ended = false;
 310                                 if (!twitchPlayer.getEnded()) {
 311                                         sendEvents(['pause']);
 312                                 }
 313                         });
 314                         twitchPlayer.addEventListener('ended', function () {
 315                                 paused = true;
 316                                 ended = true;
 317                                 sendEvents(['ended']);
 318                                 clearInterval(timer);
 319                                 hasStartedPlaying = false;
 320                                 timer = null;
 321                         });
 322                 };
 323
 324                 var height = mediaElement.originalNode.height,
 325                     width = mediaElement.originalNode.width,
 326                     twitchContainer = document.createElement('div'),
 327                     type = TwitchApi.getTwitchType(twitchId),
 328                     twitchSettings = {
 329                         id: twitch.id,
 330                         width: width,
 331                         height: height,
 332                         playsinline: false,
 333                         autoplay: mediaElement.originalNode.autoplay,
 334                         muted: mediaElement.originalNode.muted
 335                 };
 336
 337                 twitchSettings[type] = twitchId;
 338                 twitchContainer.id = twitch.id;
 339                 twitchContainer.style.width = '100%';
 340                 twitchContainer.style.height = '100%';
 341
 342                 mediaElement.originalNode.parentNode.insertBefore(twitchContainer, mediaElement.originalNode);
 343                 mediaElement.originalNode.style.display = 'none';
 344                 mediaElement.originalNode.autoplay = false;
 345
 346                 twitch.setSize = function (width, height) {
 347                         if (TwitchApi !== null && !isNaN(width) && !isNaN(height)) {
 348                                 twitchContainer.setAttribute('width', width);
 349                                 twitchContainer.setAttribute('height', height);
 350                         }
 351                 };
 352                 twitch.hide = function () {
 353                         twitch.pause();
 354                         twitchContainer.style.display = 'none';
 355                 };
 356                 twitch.show = function () {
 357                         twitchContainer.style.display = '';
 358                 };
 359                 twitch.destroy = function () {};
 360
 361                 TwitchApi.load(twitchSettings);
 362
 363                 return twitch;
 364         }
 365 };
 366
 367 mejs.Utils.typeChecks.push(function (url) {
 368         return (/\/\/(www|player).twitch.tv/i.test(url) ? 'video/x-twitch' : null
 369         );
 370 });
 371
 372 mejs.Renderers.add(TwitchIframeRenderer);
 373
 374 },{}]},{},[1]);