Help with getting innerHTML to working for embedding stream?

They have: 2 posts

Joined: Feb 2011

I'm trying to detect if a user stream is live on ustream and if they are, embed the flash player at the top of my vBulletin forums.

To do this, I am using this script which I found online:

The script works and it detects if a player stream is online or not, but I want to embed the player if they are online and auto-play it. This is what I'm trying:

<!--Place this code where you want the status to appear. -->
    <font color='red'><span id="status">status</span></font>
    <!--Place this code anywhere in the page. -->
    <script type="text/javascript">
    function set_status(status)
    if (status == "offline")
    {   <!-- replace the img html with any html that you need -->
    document.getElementById("status").innerHTML = "<font color=Red><b>Offline!</b></font></br>";
    else if (status == "live")
    {   <!-- replace the img html with any html that you need -->
    document.getElementById("status").innerHTML = "<font color=Red><b>En vivo!</b></font></br>";
    <!-- This is where all goes to hell -->
    document.getElementById("status").innerHTML += "<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="480" height="296" id="utv597657"><param name="flashvars" value="autoplay=true&amp;brand=embed&amp;cid=6849791&amp;v3=1"/><param name="allowfullscreen" value="true"/><param name="allowscriptaccess" value="always"/><param name="movie" value=""/><embed flashvars="autoplay=true&amp;brand=embed&amp;cid=6849791&amp;v3=1" width="480" height="296" allowfullscreen="true" allowscriptaccess="always" id="utv597657" name="utv_n_833936" src="" type="application/x-shockwave-flash" /></object><br /><a href="" style="padding: 2px 0px 4px; width: 400px; background: #ffffff; display: block; color: #000000; font-weight: normal; font-size: 10px; text-decoration: underline; text-align: center;" target="_blank">Free video chat by Ustream</a>";
    document.getElementById("status").innerHTML += "<object width="100%" height="300" id="obj_1297019226277"><param name="movie" value=""/><param name="wmode" value="transparent"/><param name="AllowScriptAccess" VALUE="always"/><param name="AllowNetworking" VALUE="all"/><param name="AllowFullScreen" VALUE="true"/><param name="flashvars" value="cid=1297019226277&a=CCCCCC&b=51&f=43&i=87&k=999999&l=FFFFFF&m=FFFFFF&o=30&r=100&s=1"/><embed id="emb_1297019226277" src="" width="100%" height="300" wmode="transparent" allowScriptAccess="always" allowNetworking="all" type="application/x-shockwave-flash" allowFullScreen="true" flashvars="cid=1297019226277&a=CCCCCC&b=51&f=43&i=87&k=999999&l=FFFFFF&m=FFFFFF&o=30&r=100&s=1"></embed></object><br>[ <a href="">Copy this</a> | <a href="">Start New</a> | <a href="">Full Size</a> ]</br>";
    {   <!-- Let's do this just in case the service is down or something. You could show an error image as well -->
    document.getElementById("status").innerHTML  = "Error getting stream status!";
    <!--Make sure to replace the channel name and API key. -->
    <script type="text/javascript" src="****&callback=set_status">

It seems like everytime I try to use innerHTML to add more than a few lines, nothing shows up. Or perhaps it is making a fuss about the object tags? I have no idea. The thing works fine until I add the object code, and after I do that, it just doesn't display anything.

The first innerHTML is just adding a title to go above the flash player.
The second innerHTML adds the code for the flash player (embedding code copy/pasted from ustream).
The third innerHTML adds the code for a generic chat.

Help is much appreciated!

Edit: If it matters, here is the website I'm trying to implement this feature on:

They have: 2 posts

Joined: Feb 2011

Nevermind. Close the topic. The problem was unescaped quotation marks. Instead of " I typed \" and it worked. I'm an idiot.

Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.