Enjoy an ad free experience by logging in. Not a member yet?
Register .
05-05-2012, 02:56 AM
PM User |
#1
New to the CF scene
Join Date: May 2012
Location: St. Louis, Mo
Posts: 2
Thanks: 1
Thanked 0 Times in 0 Posts
YouTube JavaScript Api Player with playlist
please be aware that there is explicit content on the site listed . . .
Hello. I am currently having a little trouble with a site im taking over (
slickchixradio.com )
There is a player embedded into the page that is supposed to go through a playlist of youtube videos that I added into the code. The problem I'm having is that the first video in the playlist (/*SC Teaser*/) starts and finishes but it doesn't continue to the next video. I am not very versed in JavaScript so I am not entirely sure where I am having the issue in the code, so just to be safe I copied and pasted the entire code. Please believe me when I say that I have done my homework, but since I really dont know anything about JavaScript it all kinda looks like a foreign language to me. I recently ran the code through firefox and it came back with 2 errors . . .
SyntaxError: missing = in XML attribute
identifier starts immediately after numeric literal
If anyone can find the problem and provide a solution i would be eternally grateful!
Code:
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>Slick Chix Radio.com</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" href="http://www.slickchixradio.com/style.css" type="text/css" media="screen" />
<script type="text/javascript" src="http://www.slickchixradio.com/swfobject.js"></script>
<script type="text/javascript">
swfobject.registerObject("flashcontent", "9.0.0");
function onYouTubePlayerReady(playerId) {
var o = document.getElementById( 'ytplayer_object' );
if ( o ) {
o.addEventListener( "onStateChange", "ytplayer_statechange" );
o.addEventListener( "onError", "ytplayer_error" );
}
ytplayer_playlazy( 1000 );
}
function getPlayerState() {
var o = document.getElementById( 'ytplayer_object' );
if (o) {
return o.getPlayerState();
}
}
function mute() {
var o = document.getElementById( 'ytplayer_object' );
if (o.isMuted()) {
o.unMute();
}
else {
o.mute();
}
}
function play() {
var state = getPlayerState();
var o = document.getElementById( 'ytplayer_object' );
if (o) {
if (state = 2) {
o.playVideo();
}
else if (state = 0) {
o.playVideo();
}
}
}
function stop() {
var state = getPlayerState();
var o = document.getElementById( 'ytplayer_object' );
if (o) {
if (state = 1) {
o.stopVideo();
}
else if (state = 2) {
o.stopVideo();
}
}
}
function getVolume() {
var o = document.getElementById( 'ytplayer_object' );
if (o) {
return o.getVolume();
}
}
function setVolume(newVolume) {
var o = document.getElementById( 'ytplayer_object' );
if (o) {
o.setVolume(newVolume);
}
}
function clamp(value, bottom, top) { return (value < bottom) ? bottom : (value > top) ? top : value; }
function changeVolume(adjustment) { setVolume(clamp(getVolume() + adjustment, 0, 100)); }
function setVolumeUp() { changeVolume(25); }
function setVolumeDown() { changeVolume(-25); }
function onYouTubePlayerReady(playerId) {
var o = document.getElementById( 'ytplayer_object' );
if ( o ) {
o.addEventListener( "onStateChange", "ytplayer_statechange" );
o.addEventListener( "onError", "ytplayer_error" );
}
ytplayer_playlazy( 1000 );
}
var ytplayer_playlist = [ ];
var ytplayer_playitem = 0;
swfobject.addLoadEvent( ytplayer_render_player );
function ytplayer_render_player( ) {
swfobject.embedSWF (
'http://www.youtube.com/apiplayer?enablejsapi=1',
'ytapiplayer',
'650',
'367',
'8',
null,
null,
{
allowScriptAccess: 'always',
allowFullScreen: 'true'
},
{
id: 'ytplayer_object'
}
);
}
function ytplayer_playlazy( delay ) {
if ( typeof ytplayer_playlazy.timeoutid != 'undefined' ) {
window.clearTimeout( ytplayer_playlazy.timeoutid );
}
ytplayer_playlazy.timeoutid = window.setTimeout( ytplayer_play, delay );
}
function ytplayer_play( ) {
var o = document.getElementById( 'ytplayer_object' );
if ( o ) {
o.loadVideoById( ytplayer_playlist[ ytplayer_playitem ] );
}
}
function ytplayer_statechange( state ) {
if ( state == 0 ) {
ytplayer_playitem += 1;
ytplayer_playitem %= ytplayer_playlist.length;
ytplayer_playlazy( 5000 );
}
}
function ytplayer_error( error ) {
if ( error ) {
ytplayer_playitem += 1;
ytplayer_playitem %= ytplayer_playlist.length;
ytplayer_playlazy( 5000 );
}
}
ytplayer_playlist.push( 'pb1v_J1Le1E' ); /* SC Teaser */
ytplayer_playlist.push( 'y5wSPEDCITc' ); /* American Beauty */
ytplayer_playlist.push( 'NknSQdPEQtQ' ); /* Animal */
ytplayer_playlist.push( 'iERcUOhv3B8' ); /* Toxic Montage */
ytplayer_playlist.push( 'G5D_T_EHiIM' ); /* Kinetic Batteries */
ytplayer_playlist.push( 'WXxV9g7lsFE' );
ytplayer_playlist.push( 'FEC7YnUV6_8' );
ytplayer_playlist.push( 'NiIMqSqabGs' );
ytplayer_playlist.push( 'NXST3POixNI' ); /* Rockstar */
ytplayer_playlist.push( 'UFtMoGjjiGA' ); /* Kinetic Batteries */
ytplayer_playlist.push( 'l8TYFP3lU10' );
ytplayer_playlist.push( 'Sep27sMmG-0' );
ytplayer_playlist.push( 'qP-ZfBbMvFc' );
ytplayer_playlist.push( '8jzqvrMoB0g' ); /* McGrubber Movie */
ytplayer_playlist.push( 'UFtMoGjjiGA' ); /* Kinetic Batteries */
ytplayer_playlist.push( 'kRJA2YrA6qI' );
ytplayer_playlist.push( 'iP6XpLQM2Cs' );
ytplayer_playlist.push( '_tqc4hajPCQ' );
ytplayer_playlist.push( 'fjlbBtvpvAE' ); /* Miller Lite */
ytplayer_playlist.push( 'UFtMoGjjiGA' ); /* Kinetic Batteries */
ytplayer_playlist.push( 'I-na93N-Yfw' );
ytplayer_playlist.push( 'P0LkMrPMMhw' ); /* Repo Men Movie */
ytplayer_playlist.push( 'ajV-39VV2dI' ); /* Rockstar */
ytplayer_playlist.push( 'oO-gtb_YLe8' );
ytplayer_playlist.push( 'Rj9tOKlcUu8' );
ytplayer_playlist.push( 'T_lljLl7ftQ' ); /* Rockstar */
ytplayer_playlist.push( '81DT8j7akdc' ); /* BK */
ytplayer_playlist.push( 'nU1VfYYKMDk' );
ytplayer_playlist.push( 'j1aE4nW4EG8' ); /* Apple */
ytplayer_playlist.push( '3910814453' ); /* Google */
</script>
<style type="text/css">
.style1 {
text-align: center;
}
</style>
</head>
<body>
<script language=JavaScript>
<!--
//Disable right mouse click Script
//By Maximus (maximus@nsimail.com) w/ mods by DynamicDrive
//For full source code, visit http://www.dynamicdrive.com
var message="Function Disabled!";
///////////////////////////////////
function clickIE4(){
if (event.button==2){
alert(message);
return false;
}
}
function clickNS4(e){
if (document.layers||document.getElementById&&!document.all){
if (e.which==2||e.which==3){
alert(message);
return false;
}
}
}
if (document.layers){
document.captureEvents(Event.MOUSEDOWN);
document.onmousedown=clickNS4;
}
else if (document.all&&!document.getElementById){
document.onmousedown=clickIE4;
}
document.oncontextmenu=new Function("alert(message);return false")
// -->
</script>
<div id="header" class="style1" style="left: 0px; top: 0px; height: 258px">
<img alt="" src="images/aboutMasthead.jpg" width="960" height="185" style="left: 25px; top: 0px"><div class="style1">
</div>
<br>
<map name="FPMap0" id="FPMap0">
<area target="_blank" href="about.htm" shape="rect" coords="286, 8, 355, 31" />
<area target="_blank" coords="688, 9, 802, 30" shape="rect" href="contact.htm" />
<area target="_blank" href="hosts.htm" shape="rect" coords="556, 10, 628, 30" />
<area href="shows.htm" shape="rect" coords="417, 10, 494, 29" />
</map>
<img alt="" src="images/aboutNavBar.jpg" width="960" height="40" style="left: 25px; top: 186px" usemap="#FPMap0" border="0"/></div>
<div id="wrapper" style="left: 0px; top: -29px">
<img src="images/headunit.gif" style="border: none;" usemap="#buttons" width="1020" height="479">
<map name="buttons">
<area shape="rect" coords="68, 32, 142, 79" href="javascript :void(0);" onclick="play();" alt="Play" title="Play">
<area shape="rect" coords="70, 87, 141, 132" href="javascript :void(0);" onclick="stop();" alt="Stop" title="Stop">
<area shape="rect" coords="65, 142, 136, 187" href="javascript :void(0);" onclick="mute();" alt="Mute" title="Mute">
<area shape="rect" coords="70, 193, 141, 238" href="javascript :void(0);" onclick="setVolumeUp();" alt="Volume Up" title="Volume Up">
<area shape="rect" coords="69, 248, 140, 293" href="javascript :void(0);" onclick="setVolumeDown();" alt="Volume Down" title="Volume Down">
<area shape="rect" coords="866, 31, 944, 79" href="http://www.myspace.com/slickchixradio" target="_blank" alt="Myspace" title="Myspace">
<area shape="rect" coords="868, 83, 944, 119" href="http://twitter.com/SlickChixRadio" target="_blank" alt="Twitter" title="Twitter">
<area shape="rect" coords="869, 150, 907, 214" href="http://www.facebook.com/" target="_blank" alt="Facebook" title="Facebook">
<area shape="rect" coords="871, 245, 945, 294" href="http://www.slickchix.com/" target="_blank" alt="SlickChix.com" title="SlickChix.com">
<area shape="rect" coords="416, 418, 597, 459" href="http://www.soundstream.com/" target="_blank" alt="Soundstream.com" title="Soundstream.com">
</map>
<div id="video">
<script type="text/javascript" src="http://www.slickchixradio.com/swfobject.js"></script>
<div id="ytapiplayer">
You need Flash player 8+ and JavaScript enabled to view this video.
</div>
</div>
<br>
<center>
<div id="footer">
For requests email: <a href="mailto:requests@slickchixradio.com">requests@slickchixradio.com</a><br>
©2011 Slick Entertainment LLC <br />
<a href="mailto:webmaster@slickchixradio.com?subject=Radio Website">
Webmaster</a></div>
</center>
</div>
</body>
</html>
Last edited by jq92buu; 05-05-2012 at 05:47 AM ..
05-07-2012, 04:57 PM
PM User |
#2
Regular Coder
Join Date: Apr 2012
Posts: 165
Thanks: 1
Thanked 39 Times in 39 Posts
Not sure if anyone sent you corrected code or not, but here you go. Let me know if this still doesn't work for you. (By the way, my husband really enjoyed watching me test this) LOL
All I did was get this working so it auto-plays for you (and cleaned up a few redundant areas of code) but I left in much of what you already had. That being said, the "Disable Right Click" function is pointless. Anyone can get around that. I left it in, but you can/should delete it.
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>Slick Chix Radio.com</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" href="http://www.slickchixradio.com/style.css" type="text/css" media="screen" />
<style type="text/css">
.style1 {
text-align: center;
}
</style>
</head>
<body>
<script language=JavaScript>
<!--
//Disable right mouse click Script
//By Maximus (maximus@nsimail.com) w/ mods by DynamicDrive
//For full source code, visit http://www.dynamicdrive.com
var message="Function Disabled!";
///////////////////////////////////
function clickIE4(){
if (event.button==2){
alert(message);
return false;
}
}
function clickNS4(e){
if (document.layers||document.getElementById&&!document.all){
if (e.which==2||e.which==3){
alert(message);
return false;
}
}
}
if (document.layers){
document.captureEvents(Event.MOUSEDOWN);
document.onmousedown=clickNS4;
}
else if (document.all&&!document.getElementById){
document.onmousedown=clickIE4;
}
document.oncontextmenu=new Function("alert(message);return false")
// -->
</script>
<div id="header" class="style1" style="left: 0px; top: 0px; height: 258px">
<img alt="" src="http://www.slickchixradio.com/images/aboutMasthead.jpg" width="960" height="185" style="left: 25px; top: 0px"><div class="style1">
</div>
<br>
<map name="FPMap0" id="FPMap0">
<area target="_blank" href="about.htm" shape="rect" coords="286, 8, 355, 31" />
<area target="_blank" coords="688, 9, 802, 30" shape="rect" href="contact.htm" />
<area target="_blank" href="hosts.htm" shape="rect" coords="556, 10, 628, 30" />
<area href="shows.htm" shape="rect" coords="417, 10, 494, 29" />
</map>
<img alt="" src="http://www.slickchixradio.com/images/aboutNavBar.jpg" width="960" height="40" style="left: 25px; top: 186px" usemap="#FPMap0" border="0"/></div>
<div id="wrapper" style="left: 0px; top: -29px">
<img src="http://www.slickchixradio.com/images/headunit.gif" style="border: none;" usemap="#buttons" width="1020" height="479">
<map name="buttons">
<area shape="rect" coords="68, 32, 142, 79" href="javascript :void(0);" onclick="play();" alt="Play" title="Play">
<area shape="rect" coords="70, 87, 141, 132" href="javascript :void(0);" onclick="stop();" alt="Stop" title="Stop">
<area shape="rect" coords="65, 142, 136, 187" href="javascript :void(0);" onclick="mute();" alt="Mute" title="Mute">
<area shape="rect" coords="70, 193, 141, 238" href="javascript :void(0);" onclick="setVolumeUp();" alt="Volume Up" title="Volume Up">
<area shape="rect" coords="69, 248, 140, 293" href="javascript :void(0);" onclick="setVolumeDown();" alt="Volume Down" title="Volume Down">
<area shape="rect" coords="866, 31, 944, 79" href="http://www.myspace.com/slickchixradio" target="_blank" alt="Myspace" title="Myspace">
<area shape="rect" coords="868, 83, 944, 119" href="http://twitter.com/SlickChixRadio" target="_blank" alt="Twitter" title="Twitter">
<area shape="rect" coords="869, 150, 907, 214" href="http://www.facebook.com/" target="_blank" alt="Facebook" title="Facebook">
<area shape="rect" coords="871, 245, 945, 294" href="http://www.slickchix.com/" target="_blank" alt="SlickChix.com" title="SlickChix.com">
<area shape="rect" coords="416, 418, 597, 459" href="http://www.soundstream.com/" target="_blank" alt="Soundstream.com" title="Soundstream.com">
</map>
<div id="video"> <script type="text/javascript" src="http://www.slickchixradio.com/swfobject.js"></script>
<div id="ytapiplayer">You need Flash player 8+ and JavaScript enabled to view this video.</div>
</div>
<script type="text/javascript">
swfobject.registerObject("flashcontent", "9.0.0");
function onYouTubePlayerReady(playerId) {
var o = document.getElementById( 'ytplayer_object' );
if ( o ) {
o.addEventListener( "onStateChange", "ytplayer_statechange" );
o.addEventListener( "onError", "ytplayer_error" );
}
ytplayer_playlazy( 1000 );
}
function getPlayerState() {
var o = document.getElementById( 'ytplayer_object' );
if (o) {
return o.getPlayerState();
}
}
function mute() {
var o = document.getElementById( 'ytplayer_object' );
if (o.isMuted()) {
o.unMute();
}
else {
o.mute();
}
}
function play() {
var state = getPlayerState();
var o = document.getElementById( 'ytplayer_object' );
if (o) {
if (state = 2) {
o.playVideo();
}
else if (state = 0) {
o.playVideo();
}
}
}
function stop() {
var state = getPlayerState();
var o = document.getElementById( 'ytplayer_object' );
if (o) {
if (state = 1) {
o.stopVideo();
}
else if (state = 2) {
o.stopVideo();
}
}
}
function getVolume() {
var o = document.getElementById( 'ytplayer_object' );
if (o) {
return o.getVolume();
}
}
function setVolume(newVolume) {
var o = document.getElementById( 'ytplayer_object' );
if (o) {
o.setVolume(newVolume);
}
}
function clamp(value, bottom, top) { return (value < bottom) ? bottom : (value > top) ? top : value; }
function changeVolume(adjustment) { setVolume(clamp(getVolume() + adjustment, 0, 100)); }
function setVolumeUp() { changeVolume(25); }
function setVolumeDown() { changeVolume(-25); }
var ytplayer_playlist = [ ];
var ytplayer_playitem = 0;
swfobject.addLoadEvent( ytplayer_render_player );
function ytplayer_render_player( ) {
swfobject.embedSWF (
'http://www.youtube.com/apiplayer?enablejsapi=1&version=3',
'ytapiplayer',
'650',
'367',
'8',
null,
null,
{
allowScriptAccess: 'always',
allowFullScreen: 'true'
},
{
id: 'ytplayer_object'
}
);
}
function ytplayer_playlazy( delay ) {
if ( typeof ytplayer_playlazy.timeoutid != 'undefined' ) {
window.clearTimeout( ytplayer_playlazy.timeoutid );
}
ytplayer_playlazy.timeoutid = window.setTimeout( ytplayer_play, delay );
}
function ytplayer_play( ) {
var o = document.getElementById( 'ytplayer_object' );
if ( o ) {
o.loadVideoById( ytplayer_playlist[ ytplayer_playitem ] );
}
}
function ytplayer_statechange( state ) {
if ( state == 0 ) {
ytplayer_playitem += 1;
ytplayer_playitem %= ytplayer_playlist.length;
ytplayer_playlazy( 5000 );
}
}
function ytplayer_error( error ) {
if ( error ) {
ytplayer_playitem += 1;
ytplayer_playitem %= ytplayer_playlist.length;
ytplayer_playlazy( 5000 );
}
}
ytplayer_playlist.push( 'pb1v_J1Le1E' ); /* SC Teaser */
ytplayer_playlist.push( 'y5wSPEDCITc' ); /* American Beauty */
ytplayer_playlist.push( 'NknSQdPEQtQ' ); /* Animal */
ytplayer_playlist.push( 'iERcUOhv3B8' ); /* Toxic Montage */
ytplayer_playlist.push( 'G5D_T_EHiIM' ); /* Kinetic Batteries */
ytplayer_playlist.push( 'WXxV9g7lsFE' );
ytplayer_playlist.push( 'FEC7YnUV6_8' );
ytplayer_playlist.push( 'NiIMqSqabGs' );
ytplayer_playlist.push( 'NXST3POixNI' ); /* Rockstar */
ytplayer_playlist.push( 'UFtMoGjjiGA' ); /* Kinetic Batteries */
ytplayer_playlist.push( 'l8TYFP3lU10' );
ytplayer_playlist.push( 'Sep27sMmG-0' );
ytplayer_playlist.push( 'qP-ZfBbMvFc' );
ytplayer_playlist.push( '8jzqvrMoB0g' ); /* McGrubber Movie */
ytplayer_playlist.push( 'UFtMoGjjiGA' ); /* Kinetic Batteries */
ytplayer_playlist.push( 'kRJA2YrA6qI' );
ytplayer_playlist.push( 'iP6XpLQM2Cs' );
ytplayer_playlist.push( '_tqc4hajPCQ' );
ytplayer_playlist.push( 'fjlbBtvpvAE' ); /* Miller Lite */
ytplayer_playlist.push( 'UFtMoGjjiGA' ); /* Kinetic Batteries */
ytplayer_playlist.push( 'I-na93N-Yfw' );
ytplayer_playlist.push( 'P0LkMrPMMhw' ); /* Repo Men Movie */
ytplayer_playlist.push( 'ajV-39VV2dI' ); /* Rockstar */
ytplayer_playlist.push( 'oO-gtb_YLe8' );
ytplayer_playlist.push( 'Rj9tOKlcUu8' );
ytplayer_playlist.push( 'T_lljLl7ftQ' ); /* Rockstar */
ytplayer_playlist.push( '81DT8j7akdc' ); /* BK */
ytplayer_playlist.push( 'nU1VfYYKMDk' );
ytplayer_playlist.push( 'j1aE4nW4EG8' ); /* Apple */
ytplayer_playlist.push( '3910814453' ); /* Google */
</script>
<br>
<center>
<div id="footer">
For requests email: <a href="mailto:requests@slickchixradio.com">requests@slickchixradio.com</a><br>
©2011 Slick Entertainment LLC <br />
<a href="mailto:webmaster@slickchixradio.com?subject=Radio Website">
Webmaster</a></div>
</center>
</div>
</body>
</html>
Last edited by EpicWebDesign; 05-07-2012 at 05:01 PM ..
Users who have thanked EpicWebDesign for this post:
05-07-2012, 06:58 PM
PM User |
#3
New to the CF scene
Join Date: May 2012
Location: St. Louis, Mo
Posts: 2
Thanks: 1
Thanked 0 Times in 0 Posts
thank you very much for your response. You're corrections to the code worked! the videos are auto playing! i can not tell you how much you made my day! and im very glad your husband enjoyed it too! We will have new videos daily and even a show coming up soon. tell him to check us out at
http://www.facebook.com/slick.chix.1
Our website (slickchix.com) is preparing for a whole new revamp!
Thank you again for your help, i really appreciate it
05-07-2012, 07:02 PM
PM User |
#4
Regular Coder
Join Date: Apr 2012
Posts: 165
Thanks: 1
Thanked 39 Times in 39 Posts
You're quite welcome. Be sure to mark this thread as Resolved.
Jump To Top of Thread
Thread Tools
Rate This Thread
Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
HTML code is Off
All times are GMT +1. The time now is 06:13 AM .
Advertisement
Log in to turn off these ads.