how to embed youtube video using jwplayer without youtube page - youtube

i have problem with jwplayer
problem if i open video at my script from phone it show youtube video page
how to hide this page and show only my page
my code for jwplayer
<script type="text/javascript">
jwplayer("container").setup({
file:"{$file_url}",
image: "{$file_image}",
autostart: "false",
aboutlink:"http://elfnoon.com",
abouttext:"elfnoon.CoM Player",
allowscriptaccess:"always",
height: {$height},
width: {$width},
logo: {
file: '{$siteurl}/player/logo.png',
link: '{$siteurl}',
position: 'bottom.right',
hide: 'false',
margin: '-35',
linktarget: '_blank',
hide: 'false',
over: '10',
out: '0.75'
},
wmode:"opaque",
volume:"100",
icons:"true",
bufferlength:"900",
related: {
file: '{$siteurl}/jw6-related.xml',
onclick: 'link'
},
modes:[
{ type:'html5' }
]
});
</script>
test link
with open page from cumputer it show my script normaly
but if from phone it show youtube page
same friends tell me use api but the script for public videos so not know how to make api for my site to embed video using my player with my settings
i forget , how i test my player using html5 because it show only swf version :(
same help plz?

If you use JW6, this should work - http://support.jwplayer.com/customer/portal/articles/1406725-youtube-video-embed

Related

How to embed all the Youtube channel-videos into website..?

I work on a site, I want to embed all the Youtube-channel-videos into my site.
I found similar post like this code that acutally worked fine and loaded all videos as desired for some time, but yesterday I saw that the channel-video-list didnt load, displaying only one video. What have happend? Has Youtube made any updates lately so the channel-videos wont load?
<iframe src="http://www.youtube.com/embed/?listType=user_uploads&list=FeetMinistries" width="100%" height="800"></iframe>
Thanks for all the help I can get.
André
you could try
Embed a video
On a computer, go to the YouTube video you want to embed.
Under the video, click SHARE Share.
Click Embed.
From the box that appears, copy the HTML code.
Paste the code into your blog or website HTML.
Embed a playlist
Sign in to your YouTube account on a computer.
On the left side of the page, select the playlist you want to embed.
Copy the playlist ID from the URL.
Modify the embed code for an individual video by doing the following:
In the place of the video ID (after "embed/"), substitute
"videoseries?list=".
Then paste the playlist ID after the "=".
Paste the code into your blog or website HTML.
https://support.google.com/youtube/answer/171780?hl=en
Consider following JQuery code snippet I'm usually using to dynamically load channel by channel Id.
$.ajax({
url: "https://www.googleapis.com/youtube/v3/playlists",
type: 'get',
dataType: 'json',
data: {
part : 'snippet',
channelId: <channel_id>,
maxResults : 50,
key: '<API Key>',
},
success: function(data) {
}
});

dailymotion api mobile website issues

I am trying to play embed videos in my webpage, in desktop browser there is no problem, but in mobile version I have these issues:
Video wont start automaticaly
There is Dailymotion logo in right bottom corner
I am using DM object provided by file https://api.dmcdn.net/all.js.
Code:
<script src="https://api.dmcdn.net/all.js"></script>
<script>
DM.init({
apiKey: 'correct api key',
status: true, // check login status
cookie: true // enable cookies to allow the server to access the session
});
</script>
<div id="player{$img->getId()}" class="dailymotion tile"></div>
<script>
$(function () {
var player{$img->getId()} = DM.player(document.getElementById("player{$img->getId()}"), {
{var DMurl = explode("/", $img->getImgUrl())}
video: {$DMurl[count($DMurl) - 1]},
width: "100%",
height: "100%",
params: {
autoplay: true,
mute: true,
endscreen-enable: false,
ui-logo: true,
controls: false
}
});
player{$img->getId()}.play();
});
</script>
My problem might be caused by syntax error in params (endscreen-enable and ui-logo, phpstorm is showing syntax error because of '-' char)
Video wont start automatically
=> this is normal on mobile devices, it will be the same for any video you add, from any provider. The reason is that most mobile devices prevent videos from being played automatically, hence the play must be triggered by a user interaction. This is detailed on Dailymotion developer website at : https://developer.dailymotion.com/player/faq#player-faq-autoplay-does-not-work-on-mobile
There is Dailymotion logo in right bottom corner
=> you pass ui-logo: true so this is normal !

Retrieve YouTube live_stats concurrent viewers from channel instead of specific live event video

I know that it is possible to get the number of concurrent viewers for a specific live streaming YouTube event with this link: https://www.youtube.com/live_stats?v={videoid}
I was wondering if is it possible to get the live_stats for a channel or playlist instead of a specific live event.
I want to embed this data in a webpage that will have multiple different live events occurring weekly. Changing the video id for each event will be a burden. If this can't be done directly, is there a way to get the video id of a current live event from a channel and use java script or php to replace the id in the link? Please help me figure this out.
After some time, I figured this out myself...
I created a PHP script that retrieves the video id of the first video in a playlist and puts the id into the live stats link. I take the link of live events and put them into a playlist for easy use.
<?php
// Retrieves video info from Youtube playlist. Just update [PLAYLIST_ID] and [API_KEY]
$json_url = "https://www.googleapis.com/youtube/v3/playlistItems?part=snippet&maxResults=1&playlistId=[PLAYLIST_ID]&fields=items%2Fsnippet%2FresourceId%2FvideoId&key=[API_KEY]";
$json = file_get_contents($json_url);
$json=str_replace('},
]',"}
]",$json);
$data = json_decode($json, true);
$videoId = $data['items'][0]['snippet']['resourceId']['videoId'];
$viewers = file_get_contents("https://www.youtube.com/live_stats?v=$videoId");
echo $viewers;
?>
I then created an HTML page where the data is dynamically updated using jQuery.
<html>
<body>
<div id="status" style="color: #666; line-height: 24px; font-size: 19px; font-weight: normal; font: 19px Roboto,arial,sans-serif;"></div>
<script src="http://code.jquery.com/jquery-1.7.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
function update() {
$.ajax({
url: 'viewers.php',
dataType: 'text',
success: function(data) {
if (parseInt(data) == 0) {
$("#status").css({ display: "none" });
} else {
$("#status").text(parseInt(data) + ' watching now' );
}
}
})
}
update();
var statusIntervalId = window.setInterval(update, 5000);
</script>
</body>
</html>
This is how far I got. Now I am just wondering if there is a better way to combine these codes together to create less server requests. Each jQuery request happens every 5 seconds and is approximately 240 bytes is size. Even though the requests are small, they might still slow down a page.
If you can, please help me improve my solution. Thank you in advance.

Changing from Flowplayer to Jwplayer - Could not connect to server

I'm trying to change over from flowplayer (current code below)
flowplayer("player", "http://churchwebsite.com/flowplayer-3.1.5.swf", {
clip: {
url: 'livestream',
live: 'true',
provider: 'influxis'
},
// streaming plugins are configured under the plugins node
plugins: {
influxis: {
url: 'http://churchwebsite.com/flowplayer.rtmp-3.1.3.swf',
netConnectionUrl:
'rtmp://stream.s22.cpanelservices.com/somethinglive'
This is what I'm switching to
jwplayer("myElement").setup({
file: "rtmp://stream.s22.cpanelservices.com/somethinglive",
autostart: true,
controls: true,
height: 600,
width: 800,
Here's the information I have, not sure what to put in where.
rtmp://stream.s22.cpanelservices.com/somethinglive
rtmp://churchwebsite.com/live
I'm using Adobe flash media encoder to stream, and through there it shows
FMS URL: rtmp://stream.s22.cpanelservices.com/somethinglive
Stream: livestream
A simple example of RTMP streaming:
In the <head> section:
<script type="text/javascript" src="jwplayer.js"</script>
In the <body> section:
<div id="#myElement">Loading the player...</div>
<script>
jwplayer("myElement").setup({
file: "rtmp://example.com/application/mp4:myVideo.mp4",
image: "/assets/myVideo.jpg",
height: 360,
width: 640
});
</script>
This assumes that the three JW Player script files (jwplayer.js. jwplayer.html5.js, and jwplayer.flash.swf) are in the same directory as your index.html. Otherwise, your src attribute needs to point to where you've actually stashed them. All three files need to be together, in any event.
The file attribute for the stream depends upon what, exactly, you're providing. See the JW Player configuration guide: http://support.jwplayer.com/customer/portal/articles/1430358-using-rtmp-streaming

Fancybox youtube

I am trying to get a fancybox YouTube video to start about 12 minutes into a video. Can someone help me with achieving this? No matter what I have tried, since I am a novice, I cannot get the video to start where I want it to.
I assume that you have already managed to display the video in fancybox and you just you want to select the start time at 12 minutes, don't you?
If so, in the URL of the youtube video just add at the end #t=12m00s (time in minutes and seconds) like
http://www.youtube.com/watch?v=JaFVr_cJJIY#t=12m00s
you could also use this format
http://www.youtube.com/v/JaFVr_cJJIY&autoplay=1#t=12m00s
If you're using the latest version of Fancybox (2+), YouTube and Vimeo are now recognized and handled quite well.
However, it took some digging around to find this out since most documentation is on Fancybox 1.
Fancybox strips your YouTube URL and adds some default parameters:
autoplay=1 (videos will autoplay)
autohide=1 (control will hide once video is playing)
fs=1 (fullscreen is enabled)
rel=0 (related videos are hidden)
hd=1 (HD playback is enabled)
wmode=opaque (fixes z-index with YouTube and lightboxes)
enablejsapi=1 (enables Javascript API)
What this means that normally you could pass those parameters in your URL and have them apply, but Fancybox 2 ignores those and falls back on the preset values.
Don't dismay! You can override those in your script. Several ways.
Normal media embed:
$(".fancybox").fancybox({
helpers : {
media: true
}
});
Custom URL parameters method 1:
$(".fancybox").fancybox({
helpers : {
media: {
youtube : {
params : {
autoplay : 0
}
}
}
}
});
Custom URL parameters method 2:
$(".fancybox").fancybox({,
helpers : {
media: true
},
youtube : {
autoplay: 0
}
});
For your issue, you want to pass in this parameter:
$(".fancybox").fancybox({,
helpers : {
media: true
},
youtube : {
start: 720
}
});

Resources