JSFiddle - React, Tailwind, and code Playground

by zimm

HTML

<script type="text/javascript"
        src="http://admin.brightcove.com/js/BrightcoveExperiences.js">
</script> 
<object id="flashObj" width="300" height="200" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,47,0">
        <param name="movie" value="http://c.brightcove.com/services/viewer/federated_f9?isVid=1&isUI=1" />
        <param name="bgcolor" value="#FFFFFF" />
        <param name="flashVars" value="@videoPlayer=1459251762&playerID=1832710877001&playerKey=AQ~~,AAAAADpyy_0~,C2Qw3jjStqNA6hMRq_ZLMKUA7c7p4glC&domain=embed&dynamicStreaming=true" />
        <param name="base" value="http://admin.brightcove.com" />
        <param name="seamlesstabbing" value="false" />
        <param name="allowFullScreen" value="true" />
        <param name="swLiveConnect" value="true" />
        <param name="allowScriptAccess" value="always" />
        <param name="wmode" value="opaque" />
        <embed src="http://c.brightcove.com/services/viewer/federated_f9?isVid=1&isUI=1" bgcolor="#FFFFFF" flashVars="@videoPlayer=1459251762&playerID=1832710877001&playerKey=AQ~~,AAAAADpyy_0~,C2Qw3jjStqNA6hMRq_ZLMKUA7c7p4glC&domain=embed&dynamicStreaming=true" base="http://admin.brightcove.com" name="flashObj" width="719" height="400" seamlesstabbing="false" type="application/x-shockwave-flash" allowFullScreen="true" allowScriptAccess="always" swLiveConnect="true" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" wmode="opaque"></embed>
    </object>

CSS

object#flashObj {
    border: 10px solid #0099cc;
}

JavaScript

var player;
var modVP;
var modExp;
var modCon;
var previousVideoID=0;
var currentVideo;
var videosToSwap=new Array(1116939829001,1116920512001);


function myTemplateLoaded(experienceID) {
player = brightcove.api.getExperience(experienceID);
    modVP = player.getModule(brightcove.api.modules.APIModules.VIDEO_PLAYER);
    modExp = player.getModule(brightcove.api.modules.APIModules.EXPERIENCE);
    modCon = player.getModule(brightcove.api.modules.APIModules.CONTENT);
    modExp.addEventListener(brightcove.api.events.ExperienceEvent.TEMPLATE_READY, onTemplateReady);
}
 

function onTemplateReady(evt) {
    modVP.addEventListener(brightcove.api.events.MediaEvent.BEGIN, onMediaEventFired);
    modVP.addEventListener(brightcove.api.events.MediaEvent.CHANGE, onMediaEventFired);
    modVP.addEventListener(brightcove.api.events.MediaEvent.COMPLETE, onMediaEventFired);
    modVP.addEventListener(brightcove.api.events.MediaEvent.ERROR, onMediaEventFired);
    modVP.addEventListener(brightcove.api.events.MediaEvent.PLAY, onMediaEventFired);
    modVP.addEventListener(brightcove.api.events.MediaEvent.PROGRESS, onMediaProgressFired);
    modVP.addEventListener(brightcove.api.events.MediaEvent.STOP, onMediaEventFired);
}

function onMediaEventFired(evt) {
   document.getElementById("eventLog").innerHTML += "MEDIA EVENT: " + evt.type + " fired at position: " + evt.position + "<BR>";
}
function onMediaProgressFired(evt) {
   document.getElementById("positionLog").innerHTML = "CURRENT POSITION: " + evt.position;
}

function changeVideo(){
  modVP.getCurrentVideo(currentVideoCallback);
}