Json

{"version": "2.
0","name": "Elite Video Player","subline": "jQuery

plugin","username": "_zac_","created": "08/01/2014","website":
"http://codecanyon.net/user/_zac_","update": "08/29/2016","update_today":
true,"email": "","description": "","intro": "Thank you for purchasing my item. If
you have any questions that are beyond the scope of this help file, please feel
free to email me via my user page contact form on CodeCanyon. Thanks so
much!","button_1_text": "Email me","button_2_text": "CodeCanyon
portfolio","button_3_text": "ActiveDen portfolio","button_1_url":
"http://codecanyon.net/user/_zac_#contact","button_2_url":
"http://codecanyon.net/user/_zac_/portfolio","button_3_url":
"http://activeden.net/user/_zac_/portfolio","sections": [{"title": "Elite Video
Player main features","id": "elite_video_player_main_features","content":
"<p>\tThis is HTML5 ready video player that plays videos from YouTube, Vimeo and
self hosted videos (mp4) with optional pre-roll, mid-roll, post-roll and pop-
up advertising system for each video you create.</p>\n<p>\tPlayer supports gallery
(with unlimited videos) which can be on right side or turned
off. </p>\n<p>\tYou can add videos to playlist manually or automatically (from
youtube playlist or youtube user channel).</p>\n"},{"title": "Directory and files
explanation","id": "directory_and_files_explanation","content": "<p>\tInside the
download zip from CodeCanyon you'll find the following
structure:<br>\n\t<br>\n\t<img alt=\"\"
src=\"http://creativeinteractivemedia.com/player/CC/documentation_Elite_Video_Playe
r/explanation.jpg\" style=\"width: 339px; height:
126px;\"><br>\n\t<br>\n\t<strong>deploy</strong> - containes "minified"
versions of all scripts (js/css). This means the scripts/css files have been
compressed so they load faster.<br>\n\t<br>\n\t<strong>documentation</strong> -
containes documentation files<br>\n\t<br>\n\t<strong>source</strong> - containes
original versions of all scripts (js/css).Identical to "deploy" folder
except nothing is minified. If you wish to change css and javascript files use this
folder. After making changes, for faster loading you can minify the CSS/JS files by
using the following tools:<br>\n\t<br>\n\tJS: http://closure-
compiler.appspot.com/home<br>\n\tCSS: http://www.refresh-
sf.com/yui/</p>\n<p>\t </p>\n"},{"title": "How to use / player options","id":
"how_to_use_player_options","content": "<p>\tOpen <strong>index.html</strong> file
from the "<strong>deploy</strong>" folder.</p>\n<p>\tVideo player only
needs few lines of code to get started:</p>\n<pre class=\"html\">\n$
(document).ready(function($)\n {\n videoPlayer = $
("#Elite_video_player").Video();\n });</pre>\n<p>\tBut you can also
override the default settings by passing the arguments.</p>\n<p>\tBelow is example
of calling the plugin with explanation of arguments (all plugin options) and added
1 video to the playlist:</p>\n<pre class=\"html\">\n$(document).ready(function($)\n
{\n videoPlayer = $("#Elite_video_player").Video({ //ALL PLUGIN
OPTIONS\n instanceName:"player1", //name
of the player instance\n
autohideControls:3, //autohide HTML5 player controls\n
hideControlsOnMouseOut:"No", //hide HTML5 player controls
on mouse out of the player: "Yes","No"\n
playerLayout: "fixedSize", //Select player layout:
"fitToContainer", "fixedSize", "fitToBrowser"\n
videoPlayerWidth:1006, //fixed total player width\n
videoPlayerHeight:420, //fixed total player height\n
lightBox:true, //lightbox mode :true/false\n
lightBoxAutoplay: false, //autoplay video when lightbox opens:
true/false\n
lightBoxThumbnail:"images/preview_images/poster.jpg", //lightbox
thumbnail image\n lightBoxThumbnailWidth: 400,
//lightbox thumbnail image width\n lightBoxThumbnailHeight: 220,
//lightbox thumbnail image height\n lightBoxCloseOnOutsideClick: true,
//close lightbox when clicked outside of player area\n responsive:false,
//this option will overwrite above videoPlayerWidth/videoPlayerHeight and set
player to fit your div (parent) container: true/false\n
playlist:"Right playlist", //choose playlist type:
"Right playlist", "Off"\n
playlistScrollType:"light", //choose scrollbar type:
"light","minimal","light-2","light-
3","light-thick","light-
thin","inset","inset-2","inset-
3","rounded","rounded-dots","3d"\n
playlistBehaviourOnPageload:"opened",<span class=\"Apple-tab-span\"
style=\"white-space:pre\"> </span> //choose playlist behaviour when webpage
loads: "closed", "opened" (not apply to Vimeo player)\n
autoplay:false, //autoplay when webpage loads:
true/false\n colorAccent:"#cc181e",
//plugin colors accent (hexadecimal or RGB value - http://www.colorpicker.com/)\n
vimeoColor:"00adef", //set "hexadecimal
value", default vimeo color is "00adef"\n
youtubeControls:"custom controls",<span class=\"Apple-tab-span\"
style=\"white-space:pre\"> </span> //choose youtube player controls:
"custom controls", "default controls"\n
youtubeSkin:"dark", //youtube theme:
light,dark\n youtubeColor:"red",
//youtube color: red, white\n youtubeQuality:"default",
//choose youtube quality: "small", "medium", "large",
"hd720", "hd1080", "highres", "default"\n
youtubeShowRelatedVideos:"Yes",<span class=\"Apple-tab-span\"
style=\"white-space:pre\"> </span> //choose to show youtube related
videos when video finish\n videoPlayerShadow:"effect1",
//choose player shadow: "effect1" , "effect2",
"effect3", "effect4", "effect5", "effect6",
"off"\n loadRandomVideoOnStart:"No",
//choose to load random video when webpage loads: "Yes", "No"\n
shuffle:"No", //choose to shuffle videos
when playing one after another: "Yes", "No" (shuffle button
enabled/disabled on start)\n
posterImg:"images/preview_images/poster.jpg",//player poster image\n
onFinish:"Play next video", //"Play next
video","Restart video", "Stop video",\n
nowPlayingText:"Yes", //enable disable now playing
title: "Yes","No"\n fullscreen:"Fullscreen
native", //choose fullscreen type: "Fullscreen
native","Fullscreen browser"\n rightClickMenu:true,
//enable/disable right click over player: true/false\n
hideVideoSource:false,<span class=\"Apple-tab-span\" style=\"white-space:pre\">
</span> //option to hide self hosted video sources (to prevent
users from download/steal your videos): true/false\n
showAllControls:true,<span class=\"Apple-tab-span\" style=\"white-space:pre\">
</span> //enable/disable all HTML5 player controls:
true/false\n allowSkipAd:true,
//enable/disable "Skip advertisement" option: true/false\n
infoShow:"Yes", //enable/disable info
option: "Yes","No"\n shareShow:"Yes",
//enable/disable all share options: "Yes","No"\n
facebookShow:"Yes", //enable/disable facebook
option individually: "Yes","No"\n
twitterShow:"Yes", //enable/disable twitter
mailShow:"Yes", //enable/disable mail option
individually: "Yes","No"\n
facebookShareName:"Elite video player", //first parametar of
facebook share in facebook feed dialog is title\n
facebookShareLink:"http://codecanyon.net/item/elite-video-player-wordpress-
plugin/10496434", //second parametar of facebook share in facebook feed
dialog is link below title\n facebookShareDescription:"Elite Video
Player is stunning, modern, responsive, fully customisable high-end video player
for WordPress that support advertising and the most popular video platforms like
YouTube, Vimeo or self-hosting videos (mp4).", //third parametar of facebook
share in facebook feed dialog is description below link\n
facebookSharePicture:"https://0.s3.envato.com/files/123866118/preview.jpg&quot
;, //fourth parametar in facebook feed dialog is picture on left side\n
twitterText:"Elite video player",<span class=\"Apple-tab-span\"
style=\"white-space:pre\"> </span> //first parametar of twitter share in
twitter feed dialog is text\n
twitterLink:"http://codecanyon.net/item/elite-video-player-wordpress-
plugin/10496434", //second parametar of twitter share in twitter feed dialog
is link\n twitterHashtags:"wordpressvideoplayer",<span
class=\"Apple-tab-span\" style=\"white-space:pre\"> </span> //third parametar
of twitter share in twitter feed dialog is hashtag\n
twitterVia:"Creative media",<span class=\"Apple-tab-span\" style=\"white-
space:pre\"> </span> //fourth parametar of twitter share in twitter
feed dialog is via (@)\n
googlePlus:"http://codecanyon.net/item/elite-video-player-wordpress-
plugin/10496434", //share link over Google +\n
logoShow:"Yes",
//"Yes","No"\n logoClickable:"Yes",
//"Yes","No"\n
logoPath:"images/logo/logo.png", //path to logo image\n
logoGoToLink:"http://codecanyon.net/", //redirect to page when logo
clicked\n logoPosition:"bottom-left",
//choose logo position: "bottom-right","bottom-left"\n
embedShow:"Yes", //enable/disable embed
option: "Yes","No"\n
embedCodeSrc:"www.yourwebsite.com/videoplayer/index.html", //path to your
video player on server\n embedCodeW:"746",
//embed player code width\n embedCodeH:"420",
//embed player code height\n
embedShareLink:"www.yourwebsite.com/videoplayer/index.html", //direct
link to your site (or any other URL) you want to be "shared"\n
youtubePlaylistID:"", //automatic youtube playlist
ID (leave blank "" if you want to use manual playlist). For example: for
this URL https://www.youtube.com/playlist?list=LL4qbSRobYCjvwo4FCQFrJ4g
youtubePlaylistID is "LL4qbSRobYCjvwo4FCQFrJ4g"\n
youtubeChannelID:"", //automatic youtube channel
ID (leave blank "" if you want to use manual playlist). For example: for
this URL https://www.youtube.com/channel/UCHqaLr9a9M7g9QN6xem9HcQ youtubeChannelID
is "UCHqaLr9a9M7g9QN6xem9HcQ"\n\n //manual playlist\n
videos:[\n {\n videoType:"youtube",
//choose video type: "HTML5", "youtube", "vimeo"\n
title:"Youtube video", //video
title showing in playlist\n youtubeID:"LfTLc5JGFPc",
//if you use single youtube videos youtube ID is for example
"LfTLc5JGFPc" from URL https://www.youtube.com/watch?v=LfTLc5JGFPc\n
vimeoID:"32707724", //vimeo ID
is for example 32707724 for URL http://vimeo.com/32707724\n
mp4:"http://player.pageflip.com.hr/videos/Pieces.mp4", //URL to
self-hosted video (mp4) on your server\n
imageUrl:"images/preview_images/poster2.jpg", //display
image instead of playing video\n prerollAD:"no",
//show pre-roll "yes","no"\n
prerollGotoLink:"http://codecanyon.net/", //pre-roll
goto link\n
preroll_mp4:"http://player.pageflip.com.hr/videos/Short_Elegant_Logo_Reveal.mp
4", //URL to self-hosted pre-roll video (mp4) on your server\n
prerollSkipTimer:5, //seconds when to
show skip advertisement button\n midrollAD:"yes",
//show mid-roll "yes","no"\n
midrollAD_displayTime:"00:10", //show mid-
roll at any custom time in format "minutes:seconds" ("00:00")\n
midrollGotoLink:"http://codecanyon.net/", //mid-roll
goto link\n
midroll_mp4:"http://creativeinteractivemedia.com/player/videos/Logo_Explode.mp
4", //mid-roll video mp4 format\n midrollSkipTimer:5,<span
class=\"Apple-tab-span\" style=\"white-space: pre;\"> </span>\n
postrollAD:"yes", //show
post-roll "yes","no"\n
postrollGotoLink:"http://codecanyon.net/", //post-roll
goto link\n
postroll_mp4:"http://creativeinteractivemedia.com/player/videos/Logo_Light.mp4
", //post-roll video mp4 format\n postrollSkipTimer:5,\n
popupImg:"images/preview_images/popup.jpg", //popup
image URL\n popupAdShow:"yes",
//enable/disable popup image: "yes","no"\n
popupAdStartTime:"00:03", //time to
show popup ad during playback\n
popupAdEndTime:"00:07", //time to
hide popup ad during playback\n
popupAdGoToLink:"http://codecanyon.net/", //re-direct
to URL when popup ad clicked\n description:"Video
description goes here.", //video description showing in
playlist\n
thumbImg:"images/thumbnail_images/pic1.jpg", //path to
playlist thumbnail image\n info:"Video info goes
here.<br>This text can be <i>HTML formatted</i>, <a
href='http://codecanyon.net/user/_zac_' target='_blank'><font
color='008BFF'>find out more</font></a>.<br>You can
disable this info window in player options. <br><br>Lorem ipsum dolor
sit amet, eu pri dolores theophrastus. Posidonium vituperatoribus cu mel, cum
feugiat nostrum sapientem ne. Vis ea summo persius, unum velit erant in eos, pri ut
suas iriure euripidis. Ad augue expetendis sea. Ne usu saperet appetere honestatis,
ne qui nulla debitis sententiae." //video info for self hosted videos (if you
use HTML5
videoType)\n }\n ]\n });\n });</pre>\n<div>\n\t
</div>\n"},{"title": "Adding video player to your webpage","id":
"adding_video_player_to_your_webpage","content": "<ul>\t<li>\t\tCopy all from the
<strong>deploy</strong> folder to server</li>\n\t<li>\t\tInsert following code in
between <strong><head>......</head></strong> of your web document
(<strong>code from index.html file</strong>)</li>\n</ul>\n<pre class=\"html\">\n
<meta http-equiv="Content-Type" content="text/html; charset=utf-
8">\n <meta name="description" content="Video
Player"/>\n <meta property="og:title" content="Video
Player by _zac_"/>\n <meta property="og:image"
content="http://player.pageflip.com.hr/imgFB/preview3.png"/>\n
<link rel="stylesheet" href="css/elite.css"
type="text/css" media="screen"/>\n <link
rel="stylesheet" href="css/elite-font-awesome.css"
type="text/css">\n <link rel="stylesheet"
href="css/jquery.mCustomScrollbar.css" type="text/css">\n
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"&g
t;</script>\n <script src="js/froogaloop.js"
type="text/javascript"></script>\n <script
src="js/jquery.mCustomScrollbar.js"
src="js/THREEx.FullScreen.js"></script>\n <script
src="js/videoPlayer.js"
src="js/Playlist.js"
type="text/javascript"
src="js/ZeroClipboard.js"></script>\n <script
type="text/javascript" charset="utf-8">\n $
("#Elite_video_player").Video({ //ALL PLUGIN OPTIONS\n
instanceName:"player1", //name of the player
instance\n autohideControls:3, //autohide HTML5
player controls\n hideControlsOnMouseOut:"No",
//hide HTML5 player controls on mouse out of the player:
"Yes","No"\n playerLayout: "fixedSize",
//Select player layout: "fitToContainer", "fixedSize",
"fitToBrowser"\n
videoPlayerWidth:1006, //fixed total player width\n
videoPlayerHeight:420, //fixed total player height\n
lightBox:true, //lightbox mode :true/false\n
lightBoxAutoplay: false, //autoplay video
when lightbox opens: true/false\n
lightBoxThumbnail:"images/preview_images/poster.jpg", //lightbox
thumbnail image\n lightBoxThumbnailWidth: 400,
//lightbox thumbnail image width\n lightBoxThumbnailHeight: 220,
//lightbox thumbnail image height\n lightBoxCloseOnOutsideClick: true,
//close lightbox when clicked outside of player area\n
playlist:"Right playlist", //choose playlist type:
"Right playlist", "Off"\n
playlistScrollType:"light", //choose scrollbar type:
"light","minimal","light-2","light-
3","light-thick","light-
3","rounded","rounded-dots","3d"\n
playlistBehaviourOnPageload:"opened",<span class=\"Apple-tab-span\"
style=\"white-space:pre\"> </span> //choose playlist behaviour when webpage
loads: "closed", "opened" (not apply to Vimeo player)\n
autoplay:false, //autoplay when webpage loads:
true/false\n colorAccent:"#cc181e",
//plugin colors accent (hexadecimal or RGB value - http://www.colorpicker.com/)\n
vimeoColor:"00adef", //set "hexadecimal
value", default vimeo color is "00adef"\n
youtubeControls:"custom controls",<span class=\"Apple-tab-span\"
style=\"white-space:pre\"> </span> //choose youtube player controls:
"custom controls", "default controls"\n
youtubeSkin:"dark", //youtube theme:
light,dark\n youtubeColor:"red",
//youtube color: red, white\n youtubeQuality:"default",
//choose youtube quality: "small", "medium", "large",
"hd720", "hd1080", "highres", "default"\n
youtubeShowRelatedVideos:"Yes",<span class=\"Apple-tab-span\"
style=\"white-space:pre\"> </span> //choose to show youtube related
videos when video finish\n videoPlayerShadow:"effect1",
//choose player shadow: "effect1" , "effect2",
"effect3", "effect4", "effect5", "effect6",
"off"\n loadRandomVideoOnStart:"No",
//choose to load random video when webpage loads: "Yes", "No"\n
shuffle:"No", //choose to shuffle videos
when playing one after another: "Yes", "No" (shuffle button
enabled/disabled on start)\n
posterImg:"images/preview_images/poster.jpg", //player poster image\n
onFinish:"Play next video", //"Play next
video","Restart video", "Stop video",\n
nowPlayingText:"Yes", //enable disable now playing
title: "Yes","No"\n fullscreen:"Fullscreen
native", //choose fullscreen type: "Fullscreen
native","Fullscreen browser"\n rightClickMenu:true,
//enable/disable right click over player: true/false\n
hideVideoSource:false,<span class=\"Apple-tab-span\" style=\"white-space:pre\">
</span> //option to hide self hosted video sources (to prevent
users from download/steal your videos): true/false\n
showAllControls:true,<span class=\"Apple-tab-span\" style=\"white-space:pre\">
</span> //enable/disable all HTML5 player controls:
true/false\n allowSkipAd:true,
//enable/disable "Skip advertisement" option: true/false\n
infoShow:"Yes", //enable/disable info
option: "Yes","No"\n shareShow:"Yes",
//enable/disable all share options: "Yes","No"\n
facebookShow:"Yes", //enable/disable facebook
twitterShow:"Yes", //enable/disable twitter
mailShow:"Yes", //enable/disable mail option
individually: "Yes","No"\n
facebookShareName:"Elite video player", //first parametar of
facebook share in facebook feed dialog is title\n
facebookShareLink:"http://codecanyon.net/item/elite-video-player-wordpress-
plugin/10496434", //second parametar of facebook share in facebook feed
dialog is link below title\n facebookShareDescription:"Elite Video
Player is stunning, modern, responsive, fully customisable high-end video player
for WordPress that support advertising and the most popular video platforms like
YouTube, Vimeo or self-hosting videos (mp4).", //third parametar of facebook
share in facebook feed dialog is description below link\n
facebookSharePicture:"https://0.s3.envato.com/files/123866118/preview.jpg&quot
;, //fourth parametar in facebook feed dialog is picture on left side\n
twitterText:"Elite video player",<span class=\"Apple-tab-span\"
style=\"white-space:pre\"> </span> //first parametar of twitter share in
twitter feed dialog is text\n
twitterLink:"http://codecanyon.net/item/elite-video-player-wordpress-
plugin/10496434", //second parametar of twitter share in twitter feed dialog
is link\n twitterHashtags:"wordpressvideoplayer",<span
class=\"Apple-tab-span\" style=\"white-space:pre\"> </span> //third parametar
of twitter share in twitter feed dialog is hashtag\n
twitterVia:"Creative media",<span class=\"Apple-tab-span\" style=\"white-
space:pre\"> </span> //fourth parametar of twitter share in twitter
feed dialog is via (@)\n
googlePlus:"http://codecanyon.net/item/elite-video-player-wordpress-
plugin/10496434", //share link over Google +\n
logoShow:"Yes",
//"Yes","No"\n logoClickable:"Yes",
//"Yes","No"\n
logoPath:"images/logo/logo.png", //path to logo image\n
logoGoToLink:"http://codecanyon.net/", //redirect to page when logo
clicked\n logoPosition:"bottom-left",
//choose logo position: "bottom-right","bottom-left"\n
embedShow:"Yes", //enable/disable embed
option: "Yes","No"\n
embedCodeSrc:"www.yourwebsite.com/videoplayer/index.html", //path to your
video player on server\n embedCodeW:"746",
//embed player code width\n embedCodeH:"420",
//embed player code height\n
embedShareLink:"www.yourwebsite.com/videoplayer/index.html", //direct
link to your site (or any other URL) you want to be "shared"\n
youtubePlaylistID:"", //automatic youtube playlist
ID (leave blank "" if you want to use manual playlist)
LL4qbSRobYCjvwo4FCQFrJ4g\n youtubeChannelID:"",
//automatic youtube channel ID (leave blank "" if you want to use manual
playlist)\n\n//manual playlist\n videos:[\n {\n
videoType:"youtube",
//choose video type: "HTML5", "youtube", "vimeo"\n
title:"Youtube video",
//video title\n youtubeID:"LfTLc5JGFPc",
//last part if the URL https://www.youtube.com/watch?v=LfTLc5JGFPc\n
vimeoID:"32707724",
//last part of the URL http://vimeo.com/32707724\n
mp4:"http://player.pageflip.com.hr/videos/Pieces.mp4",
//HTML5 video mp4 url\n
imageUrl:"images/preview_images/poster2.jpg",
//display image instead of playing video\n
prerollAD:"no",
//show pre-roll "yes","no"\n
prerollGotoLink:"http://codecanyon.net/",
//pre-roll goto link\n
4",//pre-roll video mp4 format\n prerollSkipTimer:5,
//seconds when to show skip advertisement button\n
midrollAD:"yes",
//show mid-roll "yes","no"\n
midrollAD_displayTime:"00:10",
//show mid-roll at any custom time in format "minutes:seconds"
("00:00")\n
midrollGotoLink:"http://codecanyon.net/",
//mid-roll goto link\n
4", //mid-roll video mp4 format\n midrollSkipTimer:5,\n
postrollAD:"yes",
//show post-roll "yes","no"\n
postrollGotoLink:"http://codecanyon.net/",
//post-roll goto link\n
", //post-roll video mp4 format\n postrollSkipTimer:5,\n
popupImg:"images/preview_images/popup.jpg",
//popup image URL\n popupAdShow:"yes",
//enable/disable popup image: "yes","no"\n
popupAdStartTime:"00:03",
//time to show popup ad during playback\n
popupAdEndTime:"00:07",
//time to hide popup ad during playback\n
popupAdGoToLink:"http://codecanyon.net/",
//re-direct to URL when popup ad clicked\n
description:"Video description goes here.",
//video description\n
thumbImg:"images/thumbnail_images/pic1.jpg",
//path to playlist thumbnail image\n info:"Video info goes
here.<br>This text can be <i>HTML formatted</i>, <a
ne qui nulla debitis sententiae." //video info\n },\n
{\n videoType:"vimeo",\n
title:"Vimeo video",\n
youtubeID:"LfTLc5JGFPc",\n
vimeoID:"32707724",\n
mp4:"http://player.pageflip.com.hr/videos/Pieces.mp4",\n
imageUrl:"images/preview_images/poster2.jpg", \n
prerollAD:"no",\n
prerollGotoLink:"http://codecanyon.net/",\n
4",\n prerollSkipTimer:5,\n
midrollAD:"yes", \n
midrollAD_displayTime:"00:10", \n
midrollGotoLink:"http://codecanyon.net/", \n
4",\n midrollSkipTimer:5,\n
postrollAD:"yes", \n
postrollGotoLink:"http://codecanyon.net/", \n
", \n postrollSkipTimer:5,\n
popupImg:"images/preview_images/popup.jpg", \n
popupAdShow:"yes", \n
popupAdStartTime:"00:03", \n
popupAdEndTime:"00:07", \n
popupAdGoToLink:"http://codecanyon.net/", \n
description:"Video description goes here.",\n
thumbImg:"images/thumbnail_images/pic1.jpg",\n
info:"Video info goes here.<br>This text can be <i>HTML
formatted</i>, <a href='http://codecanyon.net/user/_zac_'
target='_blank'><font color='008BFF'>find out
more</font></a>.<br>You can disable this info window in player
options. <br><br>Lorem ipsum dolor sit amet, eu pri dolores
theophrastus. Posidonium vituperatoribus cu mel, cum feugiat nostrum sapientem ne.
Vis ea summo persius, unum velit erant in eos, pri ut suas iriure euripidis. Ad
augue expetendis sea. Ne usu saperet appetere honestatis, ne qui nulla debitis
sententiae."\n },\n {\n
videoType:"HTML5",\n title:"Video title",\n
vimeoID:"32707724",\n
imageUrl:"images/preview_images/poster2.jpg", \n
prerollAD:"no",\n
midrollAD:"yes", \n
vimeoID:"32707724",\n
imageUrl:"images/preview_images/poster2.jpg",\n
prerollAD:"no",\n
midrollAD:"yes", \n
info:"Video info
goes here.<br>This text can be <i>HTML formatted</i>, <a
ne qui nulla debitis sententiae."\n },\n {\n
vimeoID:"32707724",\n
prerollAD:"no",\n
midrollAD:"yes", \n
vimeoID:"32707724",\n
prerollAD:"no",\n
midrollAD:"yes", \n
sententiae."\n\n ]\n });\n });\n</script></pre>\n<u
l>\t<li>\t\tNext step, in your web document, insert the following line of code
where you want to video player appear in between
<strong><body>......</strong> <strong><body></strong></li>\n</ul>\n<pre
class=\"html\">\n<span style=\"line-height: 19px;\"><div
id="Elite_video_player"></div></span></pre>\n<p>\t<em>A webpage
should only load one instance of jQuery. Loading more then one instance of the
jQuery library can cause conflicts. </em></p>\n<p>\t </p>\n"},{"title":
"YouTube playlist","id": "youtube_playlist","content": "<div>\n\tTo add videos from
youtube playlist find
option <strong><em>youtubePlaylistD</em></strong></div>\n<div>\n\t </div>
\n<div>\n\t<div>\n\t\tand insert youtube playlist ID from youtube URL, for
example:</div>\n\t<div>\n\t\t </div>\n\t<div>\n\t\tURL: <a
href=\"https://www.youtube.com/watch?
v=avwA2KPUHWc&list=LL4qbSRobYCjvwo4FCQFrJ4g\">https://www.youtube.com/watch?
v=avwA2KPUHWc&list=LL4qbSRobYCjvwo4FCQFrJ4g</a></div>\n\t<div>\n\t\t </div
>\n</div>\n<pre class=\"html\">\nyoutubePlaylistID:
"<strong>LL4qbSRobYCjvwo4FCQFrJ4g </strong>"
</pre>\n<div>\n\t </div>\n"},{"title": "YouTube user channel","id":
"youtube_user_channel","content": "<div>\n\tTo add videos from youtube user channel
find
option <strong><em>youtubeChannelID</em></strong></div>\n<div>\n\t </div>
\n<div>\n\tand insert channel ID from youtube URL, for
example:</div>\n<div>\n\t </div>\n<div>\n\tURL: <a
href=\"https://www.youtube.com/channel/UCHqaLr9a9M7g9QN6xem9HcQ\">https://www.youtu
be.com/channel/UCHqaLr9a9M7g9QN6xem9HcQ</a></div>\n<div>\n\t </div>\n<pre
class=\"html\">\nyoutubeChannelID:
"<strong>UCHqaLr9a9M7g9QN6xem9HcQ</strong>"
</pre>\n<div>\n\t </div>\n<div>\n\tor</div>\n<div>\n\t </div>\n<div>\n\tU
RL: <a
href=\"https://www.youtube.com/user/djolepiv\">https://www.youtube.com/user/djolepi
v</a></div>\n<div>\n\t </div>\n<pre class=\"html\">\nyoutubeChannelID:
"<strong>djolepiv</strong>"
</pre>\n<div>\n\t </div>\n<div>\n\t </div>\n<div>\n\t </div>\n<div>\
n\tVideos will be added by published date so first video in your player will be
latest video uploaded on your channel.</div>\n<div>\n\t </div>\n"},{"title":
"Adding videos to playlist (manually)","id":
"adding_videos_to_playlist_manually","content": "<div>\n\tYou can add videos
manually one by one to your playlist.</div>\n<div>\n\t </div>\n<div>\n\tYou
will need to set videoType for each video you
add.</div>\n<div>\n\t </div>\n<div>\n\tfor self-hosted video:</div>\n<pre
class=\"html\">\nvideoType:"HTML5"</pre>\n<pre
class=\"html\">\nmp4:"http://player.pageflip.com.hr/videos/Pieces.mp4"</p
re>\n<div>\n\t </div>\n<div>\n\tfor youtube
video:</div>\n<div>\n\t </div>\n<div>\n\tURL: https://www.youtube.com/watch?
v=LfTLc5JGFPc</div>\n<pre
class=\"html\">\nvideoType:"youtube"</pre>\n<pre
class=\"html\">\nyoutubeID:"LfTLc5JGFPc"</pre>\n<div>\n\t </div>\n<d
iv>\n\tfor vimeo video:</div>\n<div>\n\t </div>\n<div>\n\tURL:
http://vimeo.com/32707724</div>\n<pre
class=\"html\">\nvideoType:"vimeo"</pre>\n<pre
class=\"html\">\nvimeoID:"32707724"</pre>\n<div>\n\t </div>\n<div>\n
\tfor displaying image (instead of video):</div>\n<div>\n\t<pre
class=\"html\">\nvideoType:"image"</pre>\n\t<pre
class=\"html\">\nimageUrl:"images/preview_images/poster2.jpg"</pre>\n</di
v>\n<div>\n\t<pre class=\"html\">\nimageTimer:
4</pre>\n</div>\n<div>\n\t </div>\n<div>\n\tTo add more videos just write
" , " and duplicate all between curly brackets like
this:</div>\n<div>\n\t </div>\n<div>\n\t<pre class=\"html\">\n,\n{\n
videoType:"vimeo",\n
title:"Vimeo video",\n
vimeoID:"32707724",\n
prerollAD:"no",\n
sententiae."\n} </pre>\n</div>\n<div>\n\t </div>\n<div>\n\tand you have
succesfully added another video to the playlist. You can have unlimited videos in
the playlist.</div>\n"},{"title": "Self-hosted video formats (mp4)","id":
"self_hosted_video_formats_mp4","content": "<p>\tIf you use self-hosted videos
(videoType:"HTML5"), you will need to provide only mp4 format to
make player work cross-browsers on all platforms (desktop and mobile
phones/tablets).</p>\n<p>\tTo convert your video to <strong>mp4 </strong>you
can use this online <strong><a href=\"http://video.online-convert.com/convert-to-
webm\">converter</a>, </strong>or any other similar
software.</p>\n<p>\t </p>\n<p>\t<img alt=\"\"
r/converter.jpg\" style=\"width: 554px; height: 575px;\"></p>\n"},{"title": "Pre-
roll advertising","id": "pre_roll_advertising","content": "<p>\tTo use pre-roll
videos as advertising simply enable pre-roll option for particular video and enter
URL to your ad video from your server:</p>\n<pre
class=\"html\">\nprerollAD:"yes"\n\npreroll_mp4:"http://player.pagef
lip.com.hr/videos/Short_Elegant_Logo_Reveal.mp4"</pre>\n<div>\n\t
{</div>\n<div>\n\t

videoType:"HTML5",</div>\n<div>\n\t
title:"Video
title",</div>\n<div>\n\t
youtubeID:"LfTLc5JGFPc",</div>\n<div>\n\t

vimeoID:"32707724",</div>\n<div>\n\t

mp4:"http://player.pageflip.com.hr/videos/Pieces.mp4",</div>\n<div>\n\t<s
trong>
prerollAD:"yes",</strong></div>\n<div>\n\t<strong>

prerollGotoLink:"http://codecanyon.net/",</strong></div>\n<div>\n\t<stron
g>
4",</strong></div>\n<div>\n\t<strong>
prerollSkipTimer:5,</strong></div>\n<div>\n\t

description:"Video description goes here.",</div>\n<div>\n\t

thumbImg:"images/thumbnail_images/pic1.jpg",</div>\n<div>\n\t
info:"Video
info goes here.."</div>\n<div>\n\t
}</div>\n<div>\n\tYou can set to redirect URL when advertisement is
clicked:</div>\n<pre
class=\"html\">\nprerollGotoLink:"http://codecanyon.net/"</pre>\n<p>\tAls
o you can have timer when to show "skip advertisement"
option,</p>\n<p>\twhich can be set to any time you want (seconds):</p>\n<pre
class=\"html\">\nprerollSkipTimer:5</pre>\n"},{"title": "Mid-roll
advertising","id": "mid_roll_advertising","content": "<p>\tTo use mid-roll
advertising simply enable mid-roll option for particular video and enter URL to
your ad video from your server:</p>\n<pre
class=\"html\">\nmidrollAD:"yes"\n\nmidroll_mp4:"http://player.pagef
lip.com.hr/videos/Short_Elegant_Logo_Reveal.mp4"</pre>\n<div>\n\t
{</div>\n<div>\n\t

title:"Video


trong>
  midrollAD:"yes",</strong></div>\n<div>\n\t<strong>

midrollAD_displayTime: 00:10</strong></div>\n<div>\n\t<strong>

  midrollGotoLink:"http://codecanyon.net/",</strong></div>\n<di
v>\n\t<strong>
  midroll_mp4:"http://player.pageflip.com.hr/videos/Short_Elegant_Lo
go_Reveal.mp4",</strong></div>\n<div>\n\t<strong>

  midrollSkipTimer:5,</strong></div>\n<div>\n\t
description:"Video
description goes here.",</div>\n<div>\n\t

info:"Video
}</div>\n<div>\n\t </div>\n<div>\n\tYou can set to redirect URL
when advertisement is clicked:</div>\n<pre
class=\"html\">\nmidrollGotoLink:"http://codecanyon.net/"</pre>\n<div>\n\
tYou can set when to show mid-roll video advertisement (in format
<em>minutes:seconds</em>) :</div>\n<pre
class=\"html\">\nmidrollAD_displayTime:"00:10", </pre>\n<p>\tAlso
you can have timer when to show "skip advertisement"
class=\"html\">\nmidrollSkipTimer:5</pre>\n"},{"title": "Post-Roll
advertising","id": "post_roll_advertising","content": "<p>\tTo use post-roll
advertising simply enable post-roll option for particular video and enter URL to
your ad video from your server:</p>\n<pre
class=\"html\">\npostrollAD:"yes"\n\npostroll_mp4:"http://player.pag
eflip.com.hr/videos/Short_Elegant_Logo_Reveal.mp4"</pre>\n<div>\n\t
{</div>\n<div>\n\t

title:"Video


trong>
postrollAD:"yes",</strong></div>\n<div>\n\t<strong>

  </strong><strong>post</strong><strong>rollGotoLink:"http://codecan
yon.net/",</strong></div>\n<div>\n\t<strong>

  </strong><strong>post</strong><strong>roll_mp4:"http://player.page
flip.com.hr/videos/Short_Elegant_Logo_Reveal.mp4",</strong></div>\n<div>\n\t<s
trong>
  </strong><strong>post</strong><strong>rollSkipTimer:5,</strong></div>\n
<div>\n\t

info:"Video
}</div>\n<div>\n\t </div>\n<div>\n\tPost-roll advertisement will
show at the end of the video.</div>\n<div>\n\t </div>\n<div>\n\tYou
can set to redirect URL when advertisement is clicked:</div>\n<pre
class=\"html\">\npostrollGotoLink:"http://codecanyon.net/"</pre>\n<p>\tAl
so you can have timer when to show "skip advertisement"
class=\"html\">\npostrollSkipTimer:5</pre>\n"},{"title": "Pop-Up advertising","id":
"pop_up_advertising","content": "<p>\tTo use pop-up advertising simply enable pop-
up option for particular video and enter URL to your image ad from your
server:</p>\n<pre
class=\"html\">\npopupAdShow:"yes"\n\npopupImg:"images/preview_image
s/popup.jpg"</pre>\n<div>\n\t
{</div>\n<div>\n\t
title:"Video


trong>
  popupImg:"images/preview_images/popup.jpg",
<span
class=\"Apple-tab-span\" style=\"white-space: pre;\">
</span></strong></div>\n<div>\n\t<strong>
popupAdShow:"yes",

</strong></div>\n<div>\n\t<strong>

popupAdStartTime:"00:03",

popupAdEndTime:"00:07",


popupAdGoToLink:"http://codecanyon.net/",</strong></div>\n<div>\n\t


info:"Video
}</div>\n<div>\n\t </div>\n<div>\n\tYou can set to redirect URL
when pop-up is clicked:</div>\n<pre
class=\"html\">\npopupAdGoToLink:"http://codecanyon.net/",</pre>\n<div>\n
\tYou can set when to show and hide pop-up image ad (in
format <em>minutes:seconds</em>) :</div>\n<div>\n\t<pre class=\"html\">\n
popupAdStartTime:"00:03"
\n popupAdEndTime:"00:07" </pre>\n</div>\n<p>\t </p>\n"},
{"title": "Customize look","id": "customize_look","content": "<p>\tYou can
customize look of your player by inserting any color as "color accent"
option. </p>\n<p>\tColor accent can be hexadecimal value (#cc181e) or rbg
value ( rgb(204,24,30)).</p>\n<pre
class=\"html\">\ncolorAccent:"#cc181e"</pre>\n<p>\tis equvalent
to:</p>\n<pre class=\"html\">\ncolorAccent:"rgb(204, 24,
30)"</pre>\n<p>\tTo choose color accent for your player you can use one of
these online color pickers:</p>\n<p>\t<a
href=\"http://www.colorpicker.com/\">http://www.colorpicker.com/ </a></p>\n<p>
\t<a
href=\"http://www.w3schools.com/tags/ref_colorpicker.asp\">http://www.w3schools.com
/tags/ref_colorpicker.asp</a></p>\n<p>\t<a
href=\"http://www.rapidtables.com/web/color/color-
picker.htm\">http://www.rapidtables.com/web/color/color-
picker.htm</a></p>\n<p>\tThis tool can be useful if you want to match your website
colors <a
href=\"http://www.imagecolorpicker.com/\">http://www.imagecolorpicker.com/</a></p>\
n<p>\t </p>\n<p>\t<img alt=\"\"
r/color_accent.png\" style=\"width: 623px; height:
345px;\"></p>\n<p>\t </p>\n<p>\tPopular pre-built colors you can
use:</p>\n<p>\t<img alt=\"\"
r/popular_colors.png\" style=\"width: 438px; height:
550px;\"></p>\n<p>\t </p>\n<p>\tTo customize vimeo and youtube players
separately use this options:</p>\n<pre
class=\"html\">\nvimeoColor:"00adef", //set
"hexadecimal value", default vimeo color is
"00adef"\n\nyoutubeSkin:"dark",
//youtube theme: light,dark\n\nyoutubeColor:"red",
//youtube color: red, white</pre>\n<p>\t </p>\n<p>\tTo customize playlist
scrollbar set one of the pre-built scrollbar themes:</p>\n<pre
class=\"html\">\nplaylistScrollType:"light",
</pre>\n<p>\tavailable scrollbar themes:
</p>\n<p>\t"light","minimal","light-
2","light-3","light-thick","light-
3","rounded","rounded-dots","3d"</p>\n<p>\t<img
alt=\"\"
r/scrollbar_types.jpg\" style=\"width: 680px; height: 400px;\"></p>\n"},{"title":
"Multiple instances of player","id": "multiple_instances_of_player","content":
"<p>\tYou can have multiple players per page. Every player can have it's own
settings. Add the following in your HTML document:</p>\n<p>\tExample how to show 2
players in one page:</p>\n<pre class=\"html\">\n<script
type="text/javascript" charset="utf-8">\n $
("#Elite_video_player1").Video({\n });\n //add this for player 2\n
videoPlayer = $("#Elite_video_player2").Video({\n });\n });\n\n
</script>\n\n<body>\n <div
id="Elite_video_player1"></div>\n //add this for player 2:\n
<div
id="Elite_video_player2"></div>\n</body></pre>\n<p>\tFor
each instance of the player you need to change option
<em><strong>instanceName</strong></em>, for example:</p>\n<p>\tfirst instance of
the
player:</p>\n<p>\t<strong>instanceName:"player1"</strong></p>\n<p>\tsecon
d instance of the
player:</p>\n<p>\t<strong>instanceName:"player2"</strong></p>\n<p>\tDone!
Now you should be able to see 2 player in your HTML page.</p>\n"},{"title":
"Special notes","id": "special_notes","content": "<div>\n\t<div>\n\t\t<strong>Self-
hosting video usage:</strong></div>\n\t<div>\n\t\t </div>\n\t<div>\n\t\tSome
servers don't have support for HTML5 video by
default.</div>\n\t<div>\n\t\t </div>\n\t<div>\n\t\tAlthough it may seems like
the video player is refusing to play the video with your browsers. This is usually
caused by the web server’s inability to recognize these video formats and it
has nothing to do with the HTML5 video
player.</div>\n\t<div>\n\t\t </div>\n\t<div>\n\t\tThe solution to these
problems can be fixed by adding video MIME types to server. You need to edit the
.htaccess file and add the following line to your .htaccess
file:</div>\n\t<div>\n\t\t </div>\n\t<pre class=\"html\">\nAddType
video/mp4 .mp4</pre>\n</div>\n<div>\n\tURL's to your self-hosted videos needs
to be an absolute
URL:</div>\n<div>\n\t </div>\n<div>\n\tExample:</div>\n<div>\n\thttp://server/
video.mp4</div>\n<div>\n\t </div>\n<p>\t<strong>Vimeo
usage:</strong></p>\n<p>\tIf you use vimeo player, you’ll need to be running
on a web server instead of opening the file directly in your browser. Flash and JS
security restrictions will prevent the API from working when run locally.</p>\n"},
{"title": "Rate the item","id": "rate_the_item","content": "<p>\tIf you like this
product please give a rating on CodeCaynon:</p>\n<p>\t<img alt=\"\"
r/rate_file.png\" style=\"width: 1020px; height: 558px;\"></p>\n"},{"title": "More
works by zac","id": "more_works_by_zac","content": "<p>\tHTML5 Video Player &
Advertising - WordPress plugin</p>\n<div>\n\t<a
href=\"http://codecanyon.net/item/html5-video-player-advertising-for-
wordpress/7851635\"><img alt=\"\"
src=\"http://player.pageflip.com.hr/CC/portfolio_images/html5_video_player_advertis
ing_wordpress_plugin.png\" style=\"width: 602px; height:
313px;\"></a></div>\n<div>\n\tHTML5 Video Player with Youtube, Vimeo - Wordpress
plugin</div>\n<div>\n\t<a href=\"http://codecanyon.net/item/html5-video-player-
gallery-wordpress-plugin/7316469\"><img alt=\"\"
src=\"http://player.pageflip.com.hr/CC/portfolio_images/html5_video_player_gallery_
wordpress_plugin.png\" style=\"width: 602px; height:
313px;\"></a></div>\n<div>\n\t </div>\n<div>\n\tResponsive
Video Gallery Youtube HTML5 & Subtitles</div>\n<div>\n\t<a
href=\"http://codecanyon.net/item/html5-youtube-video-gallery-with-
subtitles/6247972\"><img alt=\"\"
src=\"http://player.pageflip.com.hr/CC/portfolio_images/responsive_video_gallery_yo
utube_html5_subtitles.png\" style=\"width: 594px; height:
307px;\"></a></div>\n<div>\n\t </div>\n<div>\n\tElegant - YouTube | HTML5
Responsive Video Player</div>\n<div>\n\t<a
href=\"http://codecanyon.net/item/elegant-youtube-html5-responsive-video-
player/5951886\"><img alt=\"\"
src=\"http://player.pageflip.com.hr/CC/portfolio_images/elegant_youtube_html5_video
_gallery.png\"></a></div>\n<div>\n\t </div>\n<div>\n\tResponsive HTML5 Video
Player & Gallery</div>\n<div>\n\t<img alt=\"\"
src=\"http://player.pageflip.com.hr/CC/portfolio_images/responsive_html5_video_play
er_gallery.png\"></div>\n<div>\n\t </div>\n<div>\n\tHTML5 Responsive Video
Player & Advertising</div>\n<div>\n\t<a
href=\"http://codecanyon.net/item/html5-responsive-video-player-
advertising/4282278\"><img alt=\"\"
src=\"http://player.pageflip.com.hr/CC/portfolio_images/html5_responsive_video_play
er_advertising.png\" style=\"width: 594px; height:
307px;\"></a></div>\n<div>\n\t </div>\n<div>\n\t3 in 1 - Video players pack
Youtube / Vimeo / Flv / Mp3 / Image / Advertising</div>\n<div>\n\t<a
href=\"http://activeden.net/item/3-in-1-video-players-
youtubevimeoflvmp3ads/4135058\"><img alt=\"\"
src=\"http://player.pageflip.com.hr/CC/portfolio_images/3_in_1_video_players_pack.p
ng\"></a></div>\n<div>\n\t </div>\n<div>\n\tFully customisable
youtube/vimeo/flv/mp3/images video player & gallery v2</div>\n<div>\n\t<a
href=\"http://activeden.net/item/customisable-youtubevimeoflvmp3image-
gallery/3296737\"><img alt=\"\"
src=\"http://player.pageflip.com.hr/CC/portfolio_images/customisable_video_gallery_
bottom.png\"></a></div>\n<div>\n\t </div>\n<div>\n\tFully customisable
youtube/vimeo/flv/mp3/images video player & gallery v1</div>\n<div>\n\t<a
href=\"http://activeden.net/item/customisable-vimeo-youtube-flv-video-
gallery/2168573\"><img alt=\"\"
src=\"http://player.pageflip.com.hr/CC/portfolio_images/customisable_video_gallery_
right_side.png\"></a></div>\n<div>\n\t </div>\n<div>\n\tVIMEO / YOUTUBE / FLV
VIDEO PLAYER WITH PLAYLIST</div>\n<div>\n\t<a href=\"http://activeden.net/item/as3-
vimeoyoutubeflv-video-player-with-playlist/1322612\"><img alt=\"\"
src=\"http://player.pageflip.com.hr/CC/portfolio_images/vimeo_youtube_flv_video_gal
lery.png\"></a></div>\n<p>\t </p>\n"}],"use_sub": true,"logo": "","favicon":
"","customcss": "","easing": "swing","easingduration": "500","bgimage":
"http://player.pageflip.com.hr/CC/documentation_Elite_Video_Player/dark_matter.png"
,"bgrepeat": "repeat","bgattachment": "scroll","bgcolor": "222222","textcolor":
"666666","linkcolor": "BBBBBB","hrcolor1": "111111","hrcolor2":
"333333","btncolor": "FFFFFF","btncolor1": "444444","btncolor2":
"111111","sidebarbgimage":
"http://player.pageflip.com.hr/CC/documentation_Elite_Video_Player/dark_matter.png"
,"sidebarbgrepeat": "repeat","sidebarbgcolor": "111111","sidebartextcolor":
"222222","sidebarlinkcolor": "BBBBBB","sidebaractivecolor":
"BBBBBB","sidebaractivetextcolor": "222222","sidebarhrcolor1":
"000000","sidebarhrcolor2": "222222","cufon": "","documentationttype":
"default","itemURL": "","sendJSON": "","sendZIP": "","sendPWD": ""}

Json

Caricato da

Informazioni sul documento

Titolo originale

Copyright

Formati disponibili

Condividi questo documento

Condividi o incorpora il documento

Opzioni di condivisione

Hai trovato utile questo documento?

Questo contenuto è inappropriato?

Copyright:

Formati disponibili

Json

Caricato da

Copyright:

Formati disponibili

{"version": "2.

0","name": "Elite Video Player","subline": "jQuery

Potrebbero piacerti anche