Validating Flash

using Satay Method

[myrrh]

I'm trying to validate an XHTML 1.0 Transitional page with a Flash video on it. I found the Satay Method but I don't know how to put the URL of the video in the code.

Here is the Satay Method:

<object type="application/x-shockwave-flash
data="c.swf?path=movie.swf"
width="400" height="300">
<param name="movie"
value="c.swf?path=movie.swf" />
<img src="noflash.gif"
width="200" height="100" alt="" />
</object>

Is there a way to stick a URL in that code or should I use a different method?

Thanks.

[rocknbil]

You have larger issues than that, that will likely only work in IE. Try SWFObject. What you have is

<p id="flash-placeholder"><img src="some alternate image"></div>

Where the alternate content loads FIRST, and SWFObject overwrites the content of "flash-placeholder" with the flash output. It's really easy, should take you about five minutes. Satay was cool, but it's way outdated. :-)

[myrrh]

I tried SWFObject but could not get it to work.

Here is what I did:

In the head:

<script type="text/javascript" src="/js/swfobject.js"></script>

<script type="text/javascript">
swfobject.registerObject("amy_video", "9.0.115");
</script>

and in the body:

<object id="amy_video" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="486" height="412">
<param name="movie" value="http://example.com/services/player/bcpid1418565565?bctid=14883517001" />
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="http://example.com/services/player/bcpid1418565565?bctid=14883517001" width="486" height="412">
<!--<![endif]-->
<p>Alternative content</p>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>

The video does not play. I have uploaded the js file.

What did I do wrong?

[rocknbil]

bcpid1418565565?bctid=14883517001

Is the the name of your player? Doesn't make a lot of sense, I don't see a .swf.

From the doumentation [code.google.com], try the method under step #3. You'll have to work through this and understand what you're doing, it's not just a copy and paste. I'm presuming you have the latest version of swfobject.js.


<script type="text/javascript" src="/js/swfobject.js"></script>
<script type="text/javascript">
swfobject.embedSWF("myContent.swf", "myContent", "300", "120", "9.0.0");
</script>

Adjust the .swf file name, width, and height accordingly, the version is optional. In the body:

<div id="myContent">
<p>Alternative content</p>
</div>

Note how "myContent" are the same in the embedSWF call and the document. The paragraph in that div will get overwritten with the .swf content. Try that, if the Flash player shows up, good, but it won't play YET. You need to pass the video to it (I am guessing.)

"amy_video"

Is this in .flv format? It most likely needs to be, like "amy_video.flv". Most likely this will need to be passed to the Flash as a variable or a parameter.

<script type="text/javascript" src="/js/swfobject.js"></script> 
<script type="text/javascript"> 
var flashvars = { 
 videoname: amy_video.flv" 
}; 
var params = { 
 menu: "false", 
 wmode: "transparent" 
}; 
var attributes = {}; 
 swfobject.embedSWF("myContent.swf", "myContent", "300", "120", "9.0.0","expressInstall.swf", 
flashvars,params,attributes); 
// Put the previous on one line, broken here to avoid wide paging 
</script> 

Again, this is not copy and paste code. I've used "videoname" to assign your .flv to the player, but it may be something else. Hopefully this should get you along to a solution, though.
Returning to the original topic, once you get it all working, move your working Javascript into an external file, so you'll have

<script type="text/javascript" src="/js/swfobject.js"></script>
<script type="text/javascript" src="/js/my-video.js"></script>

Then you can use this to your advantage:

<div id="myContent">
<p>Alternative content</p>
</div>

That paragraph will be what the S.E's see, use it to describe the content in the video. Or use an image, so those with Javascript and/or Flash disabled will still access content in that area.

[myrrh]

bcpid1418565565?bctid=14883517001

Is the the name of your player? Doesn't make a lot of sense, I don't see a .swf.

There is no .swf because I do not have a copy of the file. The video is on someone else's server. Do I need to have the file on my server to make this work?

Is there a way I can download the file? I tried but could not do it.

Thanks for all your help.

[rocknbil]

OK then . . you will need to use the full url, like

swfobject.embedSWF("http://example.com/services/player/bcpid1418565565?bctid=14883517001",.. [etc]

Same for your video, however that links in. From your first example,

amy_video

What I don't know is, is this an identifier for your video uploaded to their server, or a video file on yours?

If you're using an external service, they should have documentation. Anywhere you see <object><embed><object>, it can be replaced with SWFobject methods, with few exceptions.

[myrrh]

amy_video

What I don't know is, is this an identifier for your video uploaded to their server, or a video file on yours?

I don't know what it is either - I just followed the example on the documentation page:

<script type="text/javascript">
swfobject.registerObject("myId", "9.0.115", "expressInstall.swf");
</script>

</head>
<body>
<div>

<object id="myId" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="780" height="420">

and replaced "myId" with "amy_video" to give it a meaningful reference. So if that answers your question, what value do I assign to "videoname" in the following (from your suggestion above)?

var flashvars = {
videoname: amy_video.flv"
};

[rocknbil]

Looking all this over and trying to make sense of it . . . . . I see this with "new eyes"

There is no .swf because I do not have a copy of the file. The video is on someone else's server.

Are you saying the entire video AND player is this?

http://example.com/services/player/bcpid1418565565?bctid=14883517001

If so, then just this should do it?

In the head:

<script type="text/javascript" src="/js/swfobject.js"></script>  
<script type="text/javascript">  
 swfobject.embedSWF("http://example.com/services/player/bcpid1418565565?bctid=14883517001 ", "myContent", "300", "120", "9.0.0");  
</script>  

in the page:

<div id="myContent">
<p>Alternative content</p>
</div>

If that's it, you can put that in an external file as a second javascript src line demonstrate in the previous post and call it a day.

[myrrh]

In the head:


<script type="text/javascript" src="/js/swfobject.js"></script>
<script type="text/javascript">
swfobject.embedSWF("http://example.com/services/player/bcpid1418565565?bctid=14883517001 ", "myContent", "300", "120", "9.0.0");
</script>

in the page:

<div id="myContent">
<p>Alternative content</p>
</div>

That makes sense except for one thing - what do I put in the style sheet?