javascript video player
<script type="text/javascript">
FWDEVPUtils.onReady(function(){
FWDEVPlayer.videoStartBehaviour = "pause";
new FWDEVPlayer({
//main settings
instanceName:"player1",
parentId:"topVideo",
mainFolderPath:"content",
initializeOnlyWhenVisible:"no",
skinPath:"minimal_skin_white",
displayType:"responsive",
fillEntireVideoScreen:"no",
playsinline:"yes",
autoScale:"yes",
openDownloadLinkOnMobile:"no",
useVectorIcons:"no",
useResumeOnPlay:"no",
goFullScreenOnButtonPlay:"no",
useHEXColorsForSkin:"no",
normalHEXButtonsColor:"#FF0000",
selectedHEXButtonsColor:"#FFFFFF",
privateVideoPassword:"428c841430ea18a70f7b06525d4b748a",
startAtTime:"",
stopAtTime:"",
startAtVideoSource:2,
videoSource:[
{source:"content/videos/robin_sd.mp4", label:"small version"},
{source:"content/videos/robin_hd.mp4", label:"hd720"},
{source:"content/videos/robin_full_hd.mp4", label:"hd1080"}
],
posterPath:"content/posters/robin-poster.png",
showErrorInfo:"yes",
fillEntireScreenWithPoster:"yes",
disableDoubleClickFullscreen:"no",
addKeyboardSupport:"yes",
useChromeless:"no",
showPreloader:"yes",
preloaderColors:["#999999", "#FFFFFF"],
autoPlay:"no",
enableAutoplayOnMobile:"no",
loop:"no",
scrubAtTimeAtFirstPlay:"00:00:00",
maxWidth:980,
maxHeight:552,
volume:.8,
//logo settings
showLogo:"yes",
hideLogoWithController:"yes",
logoPosition:"topRight",
logoLink:"https://code.tutsplus.com/",
logoMargins:5,
//controller settings
showController:"yes",
showDefaultControllerForVimeo:"no",
showScrubberWhenControllerIsHidden:"yes",
showControllerWhenVideoIsStopped:"yes",
showVolumeScrubber:"yes",
showVolumeButton:"yes",
showTime:"yes",
showRewindButton:"yes",
showQualityButton:"yes",
showSubtitleButton:"yes",
showShareButton:"yes",
showDownloadButton:"yes",
showMainScrubberToolTipLabel:"yes",
showChromecastButton:"no",
showFullScreenButton:"yes",
repeatBackground:"yes",
controllerHeight:41,
controllerHideDelay:3,
startSpaceBetweenButtons:7,
spaceBetweenButtons:9,
mainScrubberOffestTop:14,
scrubbersOffsetWidth:4,
timeOffsetLeftWidth:5,
timeOffsetRightWidth:3,
volumeScrubberWidth:80,
volumeScrubberOffsetRightWidth:0,
timeColor:"#777777",
youtubeQualityButtonNormalColor:"#777777",
youtubeQualityButtonSelectedColor:"#FFFFFF",
scrubbersToolTipLabelBackgroundColor:"#FFFFFF",
scrubbersToolTipLabelFontColor:"#5a5a5a",
//redirect at video end
redirectURL:"",
redirectTarget:"_blank",
//playback rate / speed
showPlaybackRateButton:"yes",
defaultPlaybackRate:"1", //0.25, 0.5, 1, 1.25, 1.5, 2
//embed window
embedWindowCloseButtonMargins:0,
borderColor:"#333333",
mainLabelsColor:"#FFFFFF",
secondaryLabelsColor:"#a1a1a1",
shareAndEmbedTextColor:"#5a5a5a",
inputBackgroundColor:"#000000",
inputColor:"#FFFFFF",
//thumbnails preview
thumbnailsPreview:"",
thumbnailsPreviewWidth:196,
thumbnailsPreviewHeight:110,
thumbnailsPreviewBackgroundColor:"#000000",
thumbnailsPreviewBorderColor:"#666",
thumbnailsPreviewLabelBackgroundColor:"#666",
thumbnailsPreviewLabelFontColor:"#FFF",
// context menu
showContextmenu:'yes',
showScriptDeveloper:"yes",
contextMenuBackgroundColor:"#1f1f1f",
contextMenuBorderColor:"#1f1f1f",
contextMenuSpacerColor:"#333",
contextMenuItemNormalColor:"#888888",
contextMenuItemSelectedColor:"#FFFFFF",
contextMenuItemDisabledColor:"#444"
});
});
</script>
<!DOCTYPE html>
<html lang="en">
<head>
<title> Easy Video Player - TutsPlus Example </title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="content/global.css">
<script type="text/javascript" src="java/FWDEVPlayer.js"></script>
</head>
<body>
<!-- WE WILL ADD OUR VIDEO PLAYER HERE -->
</body>
</html>
