Skip to content
Find file
Fetching contributors…
Cannot retrieve contributors at this time
137 lines (127 sloc) 6.56 KB
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Video Player Demo</title>
<link rel="stylesheet" type="text/css" href="../lib/infusion/framework/fss/css/fss-layout.css" />
<link rel="stylesheet" type="text/css" href="../lib/infusion/framework/fss/css/fss-text.css" />
<link rel="stylesheet" type="text/css" href="../lib/infusion/components/uiOptions/css/fss/fss-theme-bw-uio.css" />
<link rel="stylesheet" type="text/css" href="../lib/infusion/components/uiOptions/css/fss/fss-theme-wb-uio.css" />
<link rel="stylesheet" type="text/css" href="../lib/infusion/components/uiOptions/css/fss/fss-theme-by-uio.css" />
<link rel="stylesheet" type="text/css" href="../lib/infusion/components/uiOptions/css/fss/fss-theme-yb-uio.css" />
<link rel="stylesheet" type="text/css" href="../lib/infusion/components/uiOptions/css/fss/fss-text-uio.css" />
<link rel="stylesheet" type="text/css" href="../lib/infusion/components/uiOptions/css/FatPanelUIOptions.css" />
<link type="text/css" href="../lib/jquery-ui/css/ui-lightness/jquery-ui-1.8.14.custom.css" rel="stylesheet" />
<link type="text/css" href="../css/VideoPlayer.css" rel="stylesheet" />
<link type="text/css" href="../lib/captionator/css/captions.css" rel="stylesheet" />
<!--[if lt IE 9]>
<link type="text/css" href="../css/ltie9.css" rel="stylesheet" />
<![endif]-->
<!-- Fluid and jQuery Dependencies -->
<script type="text/javascript" src="../lib/infusion/MyInfusion.js"></script>
<!-- Utils -->
<script type="text/javascript" src="../lib/jquery-ui/js/jquery.ui.button.js"></script>
<script type="text/javascript" src="../lib/captionator/js/captionator.js"></script>
<script type="text/javascript" src="../lib/mediaelement/js/mediaelement.js"></script>
<!--[if lt IE 9]>
<script type="text/javascript" src="../lib/html5shiv/js/html5shiv.js"></script>
<![endif]-->
<!-- VideoPlayer dependencies -->
<script type="text/javascript" src="../js/VideoPlayer_framework.js"></script>
<script type="text/javascript" src="../js/VideoPlayer.js"></script>
<script type="text/javascript" src="../js/VideoPlayer_html5Captionator.js"></script>
<script type="text/javascript" src="../js/VideoPlayer_controllers.js"></script>
<script type="text/javascript" src="../js/ToggleButton.js"></script>
<script type="text/javascript" src="../js/MenuButton.js"></script>
<script type="text/javascript" src="../js/VideoPlayer_media.js"></script>
<script type="text/javascript" src="../js/VideoPlayer_transcript.js"></script>
<script type="text/javascript" src="../js/VideoPlayer_intervalEventsConductor.js"></script>
<script type="text/javascript" src="../js/VideoPlayer_uiOptions.js"></script>
</head>
<body>
<script>
fluid.pageEnhancer({
tocTemplate: "../lib/infusion/components/tableOfContents/html/TableOfContents.html"
});
</script>
<div class="flc-uiOptions fl-uiOptions-fatPanel">
<div class="flc-slidingPanel-panel flc-uiOptions-iframe"></div>
<div class="fl-panelBar">
<button class="flc-slidingPanel-toggleButton fl-toggleButton">Show/Hide</button>
</div>
</div>
<div class="flc-toc-tocContainer"> </div>
<h1>Infusion HTML 5 Video Player</h1>
<div class="videoPlayer fl-videoPlayer">
</div>
<script>
var uiOptions = fluid.uiOptions.fatPanel.withMediaPanel(".flc-uiOptions", {
prefix: "../lib/infusion/components/uiOptions/html/",
components: {
relay: {
type: "fluid.videoPlayer.relay"
}
},
templateLoader: {
options: {
templates: {
mediaControls: "../html/UIOptionsTemplate-media.html"
}
}
}
});
var videoOptions = {container: ".videoPlayer", options: {
video: {
sources: [
{
src: "videos/ReorganizeFuture/ReorganizeFuture.mp4",
type: "video/mp4"
},
{
src: "videos/ReorganizeFuture/ReorganizeFuture.webm",
type: "video/webm"
},
{
src: "http://www.youtube.com/v/_VxQEPw1x9E",
type: "video/youtube"
}
],
captions: [
{
src: "http://www.youtube.com/watch?v=_VxQEPw1x9E&language=en",
type: "text/amarajson",
srclang: "en",
label: "English"
},
{
src: "videos/ReorganizeFuture/ReorganizeFuture.fr.vtt",
type: "text/vtt",
srclang: "fr",
label: "French"
}
],
transcripts: [
{
// TO TEST the transcript processing of Universal Subtitles files for transcripts,
// substititute the following two lines
src: "http://www.youtube.com/watch?v=_VxQEPw1x9E&language=en",
type: "text/amarajson",
//src: "videos/ReorganizeFuture/ReorganizeFuture.transcripts.en.json",
//type: "JSONcc",
srclang: "en",
label: "English"
},
{
src: "videos/ReorganizeFuture/ReorganizeFuture.transcripts.fr.json",
type: "JSONcc",
srclang: "fr",
label: "French"
}
]
},
videoTitle: "A chance to reorganize our future?"
}};
fluid.videoPlayer.makeEnhancedInstances(videoOptions, uiOptions.relay);
</script>
</body>
</html>
Jump to Line
Something went wrong with that request. Please try again.