Order Now AdSolution Sign Up | Login » Bits on the Run Sign Up | Login »

Forums

/

SWFObject 2.0

97 replies [Last post]

Has anyone used SWFObject 2.0 ...Has anyone used SWFObject 2.0 (http://code.google.com/p/swfobject/) with the JW Media Player? I tried using it. I get no errors in IE but the player is not rendered.

Does anyone have an example for this?

Thank you

May be it's because this is only a RC3 release?
On the download link :
"SWFObject 2.0 rc3 (NOTE: this is a pre-release which may contain bugs and other defects, and may be unstable)"

Even RC3 is working fine. Reading the docs helped me out of this. The link is:
http://code.google.com/p/swfobject/wiki/SWFObject_2_0_documentation

@Bill
Can you post some code? I can get a player going, but I can't "load" any files.

I'm trying to get SWFObject 2.0 to work as well, but with no luck. JW could you post a tutorial on this please?

@ jpswain

I got it working finally (not sure what the problem was). There's a demo here (view source to see the code):

http://www.trljc.com/tony/movies/two/

The funny colors are so we can see what's going on.

The playlist looks (something) like

<track>
<creator>Testing</creator>
<location>belmondo.flv</location>
<image>belmondo.jpg</image>
<title>Belmondo (silent)</title>
</track>

(Note: this is not a tutorial on relative addressing.)

You should also look at this info:
<http://code.google.com/p/swfobject/wiki/SWFObject_2_0_documentation>

PS: I tested it in Windows XP Pro SP2, and the full-screen mode is broken in IE, but works in Opera and Firefox. I use a Mac myself, works everywhere (we don't have IE).

2.0 is not backwards compatible with 1.5 - PLEASE UPDATE YOUR WEB SITE JEROEN, because now most of the tutorials don't work.

I tried this also, replaced the swfobject.js file version 1.5 with swfobject.js version 2.0, uploaded it to my site, both the mediaplayer.swf and imagerotator.swf would not render. Replaced 2.0 with 1.5 and everything worked again. I'm going to try it with the SWFObject 2.0 HTML and JavaScript generator v1.1 found on this page:

http://www.swffix.org/swfobject/generator/

I uploaded swfobject.js v2.0 again and tried this code from the generator (previous post). My code looked like this...

...in the <head> tag

<script type="text/javascript" src="http://www.localdogrescue.com/videos/swfobject.js"></script>
<script type="text/javascript">
var flashvars = {};
flashvars.height = "300";
flashvars.width = "560";
flashvars.file = "http://www.localdogrescue.com/ximages/imglist.xml";
flashvars.rotatetime = "6";
flashvars.transition = "circles";
flashvars.repeat = "true";
var params = {};
params.allowscriptaccess = "always";
var attributes = {};
swfobject.embedSWF("xplayer.swf", "player", "560", "300", "9.0.0", "expressInstall.swf", flashvars, params, attributes);
</script>

...and in the <body>

<div id="player"><a href="http://www.adobe.com/go/getflashplayer">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" /></a>
</div>

... but I still couldn't get it to work, the player did not render in IE 6 or Firefox

@localdog,

Your code is good:

<!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>SWFObject v2.0 Dynamic Embed</title>

    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

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

    <script type="text/javascript">
      var flashvars = {};
          flashvars.width             = '560';
          flashvars.height            = '300';
          flashvars.file              = 'playlist_image.xml';
          flashvars.rotatetime        = '6';
          flashvars.transition        = 'circles';
          flashvars.repeat            = 'true';
          flashvars.overstretch       = 'true';
      var params = {};
          params.allowscriptaccess    = 'always';
      var attributes = {};
      swfobject.embedSWF('imagerotator-3.15.swf', 'player', '560', '300', '7.0.0', 'expressInstall.swf', flashvars, params, attributes);
    </script>

  </head>

  <body>

    <div id="player">
      <a href="http://www.adobe.com/go/getflashplayer">
      <img src="logo.jpg" alt="Get Adobe Flash player" /></a>
    </div>

  </body>

</html>

runs for me with a few minor changes to use my files. If you are going to use a full URI for the playlist, you MUST use a full URI for the player, so you don't run afoul of the Adobe Flash Player [i]EXACT SAME DOMAIN[/i] security restrictions. The Adobe Flash Player may actually be seeing the domain of your swf as something other than www.localdogrescue.com depending on your virtual hosting, etc.

@monty

You got it! I changed all to full URL's and its working perfect!

A couple of additonal questions...

With the script for swfobject.js 1.5, the flashvars were added using
so.addVariable('example-file','imglist.xml');

With swfobject.js 2.0 they are added using
flashvars.example-file  = 'imglist.xml';

This is the correct code for v2.0 I assume, or would it also work if you used the old coding?

Also, should we be upgrading to swfobject 2.0 now or is it really necessary? I don't understand the reasoning for the upgrade, its too technical for me.

And finally, what should the lowest flash version installed setting be? I see you have 7.0.0...

Thanks for your help.

Rather than give you a poor explanation, I'm going to refer you to their documentation page for a good explanation. [url=http://code.google.com/p/swfobject/wiki/SWFObject_2_0_documentation]SWFObject_2_0_documentation[/url]

You can use JavaScript dot notation, object notation or square bracket notation to add the flashvars to the objects. Google for all three for a better explanation. All work, so it becomes a matter of personal preference.

I would start migrating to v2 because it is more standards compliant and will continue to be updated and maintained.

For the lowest Flash version. If you are using h.264 or wmode and fullscreen (and a few other enhancements), you have to require 9.0.115. Earlier v9.x.x versions are buggy and don't have the full set of features. If you are only doing images, v8 is sufficient. For old OSs that can't update to v8, v7 will display jpg images, FLV without fullscreen, and MP3s. You do lose the JavaScript API also.

A tutorial would be nice

One thing to be aware of when using swfobject v2.0, is that it replaces the whole HTML element when it writes the player code. swfobject v1.5 only replaced the contents of the HTML element.

So you need to move the player id and class to the anchor element and give the div element a new id and class, especially if you are using CSS to position the player.

swfobject.embedSWF('mediaplayer-3.16.swf', 'player', '540', '669', '9.0.115', '', flashvars, params, attributes);

  div.playercontainer
  {
    position:           absolute;
    top:                   129px;
    left:                  100px;
    width:                 540px;
    height:                655px;
    z-index:                   0;
  }
  <div id="playercontainer" class="playercontainer">
    <a id="player" class="player" href="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash">Get the Flash Plugin to see this Flash Player.</a>
  </div>

@Jeroen,

Seems to be OK; even in the most complex implementations that I have.

One more gotcha. You have to specify the full, three groups of digits for the version.
Won't work:swfobject.embedSWF('mediaplayer-3.16.swf', 'player', '540', '669', <strong>'9'</strong>, false, flashvars, params, attributes);Will work:swfobject.embedSWF('mediaplayer-3.16.swf', 'player', '540', '669', <strong>'9.0.115'</strong>, false, flashvars, params, attributes);

@Jeroen: Apparently 2.0 is in release, and the website says that the 1.5 instructions are "obsolete." It seems to work extremely well. I haven't tried it with your API yet.

@monty: You seem to be able to set styles from the SWFObject 2.0 API, something like:

if (swfobject.hasFlashPlayerVersion("6.0.0")) {
  swfobject.createCSS("body", "margin:0; padding:0; text-align:center");
  swfobject.createCSS("#putHere", "margin: 5%");
}

I have a test page here: http://www.trljc.com/tony/movies/two/

Initially, I had used a "span" container for my player; nice inline element for that purpose, enclosed in a div that I could style any way I wanted. But the API works too.

@Tony,

Thanks for the info. I'll have to try that CSS stuff. I haven't had the time to work my way through the complete swfobject documentation yet, still converting some very complex applications and working through the gotchas.

Hello, I use SWFObject on my webpage. An example you can see here: http://atutu.host247.pl/?cmd=movie&var1=Roznosci/dzingiel.swf

<script type="text/javascript">
var flashvars = {};
flashvars.height = "480";
flashvars.width = "640";
flashvars.file = "dzingiel.swf";
flashvars.image = "movie.jpg";
flashvars.autostart = "true";
flashvars.showstop = "true";
flashvars.backcolor = "0xEEEEEE";
flashvars.frontcolor = "0x000066";
flashvars.lightcolor = "0xCCCCFF";
flashvars.screencolor = "0xCCCCCC";
flashvars.allowSciptAccess = "always";
flashvars.type = "swf";
var params = {};
params.play = "true";
params.loop = "false";
params.menu = "true";
params.quality = "best";
params.allowfullscreen = "true";
params.allowscriptaccess = "always";
params.allownetworking = "internal";
params.wmode = "transparent";
var attributes = {};
attributes.id = "player";
swfobject.embedSWF("mediaplayer.swf", "player", "640", "480", "9.0.0", "expressInstall.swf", flashvars, params, attributes);
</script>

OK - good to know. Willchange to SWFObject 2 with the 4.0 player (and update the tutorial).

Here's a real gotcha! If you are rewriting the player code to change settings, it won't work with swfobject v2.0.

Here's why:

swfobject v2.0 replaces the whole HTML element with the player code. So... when you go to write the player again, there is no element to overwrite.

So... before you write/rewrite the player, just write the content of the containing element. Might as well do it in the common createPlayer() function:

function createPlayer()
{
pL = document.getElementById('playercontainer');
pL.innerHTML = '<div id="player"></div>';

This is assuming that the containing element has an id of "playercontainer" and that you are writing the player to an element with an id of "player".

@Ajax - thanks!

@andersen,

I knew that you, "The Master of createPlayer()" would really need to know this.

It cost me a bit of hair to figure out. Once it dawned on me what was happening, it was SO OBVIOUS, it hurt!

@Tony Reed

Did you find a way to fix the fullscreen problem. I have the same problem?

I’ve searched high and low. Any idea how to implement a URLredirect with swfobject 2.0? Older swfobject was fairly simple…

so.setAttribute(’redirectUrl’, ‘http://www.yoursite.com’); // must be the absolute URL to your site

Can anyone set me straight with 2.0? Many thanks!

Steve

You could do it in your player initialization code:

var attributes =
{
  id:                 'mpl',
  redirectUrl:        'http://my.domain.com',
  name:               'mpl'
};

or any time later with any of the three notations.

Dot notation:attributes.redirectUrl = 'http://my.domain.com';
Square bracket notation:attributes['redirectUrl'] = 'http://my.domain.com';
Object notation:attributes = {redirectUrl:'http://my.domain.com'};

Hey Ajax,

Thanks for the speedy reply. I had already tried the dot notation without success, but I couldn't get any of your supplied methods to work either. Perhaps I'm not implementing it properly? I've posted my test file with the dot notation redirect. It should forward to Google in the absence of Player v10, but instead displays my static content. Any guidance is much appreciated!

http://www.sp-studio.com/test/

Steve

@Steve,

It kinda, sorta seems like you have to do it like this:

swfobject.embedSWF("testanim.swf", "testanim", "400", "400", "10.0.0", false, flashvars, params, attributes);
    if (!swfobject.hasFlashPlayerVersion("10.0.0"))
    {
      window.location = 'http://www.google.com';
    }

I've updated to swfobject 2 because it's already used elsewhere on the site. It works, but my Javascript controls that used to work with swfobject 1.5 don't work anymore.

// functions for the flv player
VideoGallery.prototype.thisMovie = function(movieName) {
if(navigator.appName.indexOf("Microsoft") != -1) {
return window[movieName];
} else {
return document[movieName];
}
};

VideoGallery.prototype.sendEvent = function(swf,typ,prm) {
this.thisMovie(swf).sendEvent(typ,prm);
};

VideoGallery.prototype.loadFile = function(swf,obj) {
this.thisMovie(swf).loadFile(obj);
};

Without seeing your code, I'm reduced to making wild guesses.

Here's the first one: In your swfobject attributes, did you set both id and name to the name of the player, same as the javascriptid, NOT the same as the id of the HTML element that the player code is overwritten to?

        var attributes =
        {
          id:                 'mpl',
          name:               'mpl'
        };

Hi Ajax,

Ha ha, "kinda, sorta seems like" sounds a little scary to me, but your conditional solution worked! Many thanks.

Steve

@Steve,

"kinda, sorta seems like" really means that I didn't test it with 2.0 before posting. When it didn't work and was conspicious by its absence on the swfobject 2.0 google code site, I realized that maybe there no longer was a redirectUrl. And their example of the conditional was the only hint about what to use instead.

AJAX,

Thanks for your reply. The id & name are OK.
Maybe you have an example of sending events to the player with Javascript like next, previous, play, playitem(playlistitem)?

@Spinner,

I don't have any examples of another JavaScript application calling the media player.

Have you tried calling the functions directly to make sure that the player's JavaScript API is working?

That would also confirm that you are getting a Movie object reference for 'mpl' or whatever you have named your player.

I have downloaded 2.0 from here: http://code.google.com/p/swfobject/

And got it working in both IE and Firefox with the 3.16 player. See this thread: http://www.jeroenwijering.com/?thread=7655.

But I have the full-screen problem. The full screen button no longer works.

Any ideas?

I have the Player working great with SWFObject2.0 but my only problem now is that I can't get the displayheight param working .

I used this with SWFObject1.5 to get the media player to appear/disappear on rollover... but this doesn't seem to work with SWFObject2.0 - anyone got any ideas on how to get the player to appear/disappear now?

Hello,

I have the same issue as Cola with regards to losing playlist appear / disappear mouseover functionality when changing from swfoject 1.5 to 2.

Demo using swfoject 1.5 - the playlist appears / disappears on mouseover of the player:
http://www.theinstamatics.com/test-jw-03.htm

Demo using swfoject 2 - the player works but the playlist does not appear / disappear on mouseover of the player:
http://www.theinstamatics.com/test-jw-03a.htm

Demo using swfoject 2 - with Ajax's suggested mod re createPlayer in this discussion - the player works but the playlist does not appear / disappear on mouseover of the player:
http://www.theinstamatics.com/test-jw-03b.htm

Any ideas on getting the playlist appear / disappear functionality working with swfobject 2?

Thank you so much.

@Nick F,

It's VERY important to note that one of the major differences between SWFObject v1.5 and swfobject v2.0 is that swfobject v2.0 REPLACES the entire HTML element rather than just it's contents, as SWFObject v1.5 did. See my post of 12.04.2008 above.

Therefore, your entire div with the mouse events gets wiped out.

<div id="wrapper">
<strike><div id="placeholder" onMouseOver="showlist(150)" onMouseOut="showlist(19)">
<a href="http://www.macromedia.com/go/getflashplayer">Get the Flash plugin</a> and enable Javascript to see the player.
</div></strike>
</div>

So, you have to move the mouse events to the <div id=wrapper> which is the container for the player because all of this code ceases to exist once swfobject v2.0 overwrites with the object/embed code for the player:

<div id="placeholder" onMouseOver="showlist(150)" onMouseOut="showlist(19)">
<a href="http://www.macromedia.com/go/getflashplayer">Get the Flash plugin</a> and enable Javascript to see the player.
</div>

An alternative is to move the id="placeholder" to the anchor element and include all of the text within the anchor element tags. If you do that, you no longer need the outer most wrapper div:

<div id="wrapper" onMouseOver="showlist(150)" onMouseOut="showlist(19)">
<a id="placeholder" href="http://www.macromedia.com/go/getflashplayer">Get the Flash plugin and enable Javascript to see the player.</a>
</div>

With this code, swfobject v2.0 will only overwrite the anchor element with the object/embed code. That's why you need to move all of the text inside the anchor element tags.

Hello Ajax,
That works perfectly. I've used the "alternative" method with the anchor method.
Thank you so much
You are an absolute wiz!!

What is the difference using static or dynamic publishing method? I see everyone here is using dynamic (swfobject.embedSWF), both work with the media player?

Thanks.

Dynamic publishng allows you to use JavaScript variables, conditionals, as well as the full range of JavaScript functions, methods, etc., to define your player at the moment it is published.

If you use dynamic publishing, you can also re-publish the player with changed flashvars, parameters, and attributes.

For instance, you could generate a unique userid with a JavaScript random number and append that userid to a file request or the callback (for statistics).

If you're using swfobject v2.0 with Opera 9, you may find that this code:return document[movieName];no longer returns the movie reference object.

Since this code seems to work in IE6, FF2, and Opera9, I'm using it with swfobject v2.0:

      function thisMovie(movieName)
      {
        return document.getElementsByName(movieName)[0];
      };

Maybe someone with IE7 could test it.

Hi all,
I'm pretty new to this player and I think its excellent, so firstly well done and many thanks for making it free to use for everyone's open support here in this forum.

I'm just adding video to a new website having previously used Flash Video to import and create the players. I've just discovered this topic after noticing that the SWFobject supplied with the
current JW FLV MEDIA PLAYER 3.16 is using v1.5 and that v2.0 has now been released as of March 14th over at:

http://code.google.com/p/swfobject/
http://code.google.com/p/swfobject/wiki/SWFObject_2_0_documentation

And so I have a few questions...

Am I correct in thinking media Player v3.16 doesn't currently support v2.0 of the object and that support will be coming? Also, is it recommended to wait for v2.0 support or go with what is available now with v1.5?

Will the example tutorials or set-up wizard be updated accordingly, or will they still work okay, given there seems to be lots of issues reported on this forum topic?

Lastly, the player code generated by the setup wizard contains the source in the first line as:
http://www.jeroenwijering.com/embed/swfobject.js
Should this be changed to http://www.mywebsite.com/embed/swfobject.js and does it matter if its stored in a different folder/path?

Some clarification would be much appreciated.

Thanks again.

Oops, just noticed "OK - good to know. Willchange to SWFObject 2 with the 4.0 player (and update the tutorial)." from earlier this month. That answers some of my questions!

@The Old Man,

The JW FLV Media Player and the Image Rotator work fine when using swfobject v2.0 to generate the player's object/embed code.

There are a few small differences between the implementation of SWFObject v1.5 and swfobject v2.0 that are noted in this thread.

You should host swfobject.js and mediaplayer.swf on your own server, especially if you want to use playlists and other data files ( in fact, it's mandatory because of Adobe Flash Player security restrictions ).

You can store the files wherever you want as long as the location is web-accessible. If you can't figure out the absolute or relative paths, you can always use a full URI ( the recommended way for beginners ) to request any file from your server.

Thanks Ajax much appreciated.

I wonder whether swfobject is still needed, after reading this.

http://blogs.msdn.com/ie/archive/2008/04/08/ie-automatic-component-activation-now-available.aspx

I tested it on my IE7 and a normal embed code was enough for the player to run.

No more "Click here to activate" stuff, so that should be good news.

Can someone tell me if they've been able to get fullscreen to work?
This doesn't seem to work:
var params = {quality: "best",menu: "false", allowfullscreen: "true"};
(note that wmode is not defined so that isn't the issue)

It works.

Check your Adobe Flash Player installation.

Maybe uninstall it and re-install it.

i use swfobject 2.0 with dynamic method
it works perfectly in FF but not in IE 6.
Sometimes the flash appear and sometimes not.
I need to refresh 3 or 5 times to make it appear.

heres my code

<script type="text/javascript">
swfobject.embedSWF("http://localhost/images/banners/sample_flash.swf", "myContent4", "600", "40", "7.0.0", "http://localhost/js/swfobjects/expressInstall.swf", {}, {menu:"false",wmode:"transparent"}, {id:"dynamicContentBtm4",name:"dynamicContentBtm4"});</script>
<script type="text/javascript">
swfobject.embedSWF("http://localhost/images/banners/sample_flash1.swf", "myContent6", "600", "40", "7.0.0", "http://localhost/js/swfobjects/expressInstall.swf", {}, {menu:"false",wmode:"transparent"}, {id:"dynamicContentBtm6",name:"dynamicContentBtm6"});</script>
<script type="text/javascript">
swfobject.embedSWF("http://localhost/images/banners/sample_flash2.swf", "side1", "600", "40", "7.0.0", "http://localhost/js/swfobjects/expressInstall.swf", {}, {menu:"false",wmode:"transparent"}, {id:"dynamicContentSide1",name:"dynamicContentSide1"});</script>

and i got this error

null is null or not an object

could someone tell me how to fix this?

@JOKERz - you need to set the flashvars width and height

from the "Supported Flashvars" page - http://www.jeroenwijering.com/?item=Supported_Flashvars

height (320): Sets the overall height of the player/rotator.
width (260): Sets the overall width of the player/rotator.

the error means that there is a problem with the names/id of something

you need to go about it in a systematic way to narrow down the cause -

start with a blank page and no script and only one player - test - if no error then add stuff - test - etc.

Hello all,

I have a simple stand alone sample of swfObject 2.0 and mediaplayer.swf 4 working correctly, but when I try to incorporate it into a 'real' page, with more flashvars set, it doesn't seem to work. The player renders in FF with the start up image, but then can't find the video to play so it just chugs. In IE (6 and 7), it only displays the alternative text.

Here is the HTML:

<div id="right_content" class="movie">
<div id="player_container">what the hell?</div>
</div>

and here is the script piece:

<script type="text/javascript">
   
    var flashvars = {};
flashvars.file = "flash/profiles/Puneet.flv";
flashvars.image = "img/videoImage_puneet.jpg";
flashvars.width = "249";
flashvars.height = "230";
flashvars.showicons = "false";
flashvars.usefullscreen = "false";
var params = {};
params.wmode = "transparent";
params.scale = "noscale";
params.menu = "false";
var attributes = {};
attributes.align = "top";
swfobject.embedSWF("flash/mediaplayer.swf", "player_container", "249", "230", "9.0.0", "expressInstall.swf", flashvars, params, attributes);
   
</script>

All of the necessary files are confirmed to be in the correct locations, and the relative paths inside the script block are correct, as well.

I have read a lot about these 2 tools working together (mediaplayer and swfObject), but can't seem to see why this isn't working. Any help is much appreciated!

Thanks.

OK - so found this on another post, which helps with the FF problem not finding the video:

Note that the Flash plugin checks for image and MP3 files relative from the HTML page and for FLV files relative from the SWF file!

So here it is again, in case someone else needs it who is reading this thread.

As it stands, this is now working perfectly in FF and not at all in IE 6 or 7.

@Greenberg - from - http://www.jeroenwijering.com/?item=Supported_Playlists

Common pitfalls
I'd like to point out two common pitfalls users encounter when using playlists. First, always try to use full URL's (including the http:// part) when referring to files, links or images in your playlists. It will save you a lot of troubles with unresponsive SWF's or "file not found" errors! Nine out of ten times this is because the relative-url setup isn't working. Note that the Flash plugin checks for image and MP3 files relative

also make sure the flash plugin is up to date in each browser:
adobe flash version test: http://www.adobe.com/go/tn_15507
adobe flash deinstall: http://www.adobe.com/go/tn_14157
adobe flash install: http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash

I upgraded swfobject 1.5 to 2.0 and it works fine in both FF and IE7 with an up-todate Flash player. But expressinstall.swf doesn't work. I am playing H.264 files, so I need Flash player version 9.0.98 or newer. On a computer with Flash player 9.0.16 I get this message in Firefox: "Express Install is not supported by this version of Flash". IE6 displays the text I have written in the Flash container. No expressinstall happening in either browser.

The 1.5 version is at www.ullerup.com/tenerife2008.html and the 2.0 version at /tenerife2008v2.html.

Has anybody managed to get expressinstall to work?

Some versions of the Adobe Flash Player on some OSs did not support Express Install. I never use it.

The following works fine for me (without expressInstall.swf though):

HTML:

<div id="player">
  <p>Custom content here.</p>
</div>

Javascript:

<script type="text/javascript">
      var flashvars = {};
      flashvars.file = "http://expamle.com/files/video.flv";
      flashvars.width = "480";
      flashvars.height = "360";
      flashvars.usefullscreen = "true";
      var params = {};
      var attributes = {};
      attributes.align = "top";
      swfobject.embedSWF("/mediaplayer/player.swf", "player", "480", "360", "9.0.0", "/swfobject/expressInstall.swf", flashvars, params, attributes);
</script>

I suggest using swfobject v2.1 and the expressinstall.swf that is packaged with it.

Just a tip regarding the Javascript API:

I was turning jap.. I mean, crazy with getting the Javascript interaction to work with SWFObject 2.1 with static publishing.

The trick is to use

swfobject.getObjectById(id)

to get the reference to the movie object. I'm embedding many movies in a Coda Slider, so the thing was tricky (using jQuery too). I tried to get the object reference with jQuery but I couldn't do it. So, long story short:

swfobject.getObjectById("myWonderfulVideoObjectId").sendEvent("STOP");

Will work, BUT ONLY FOR STATIC PUBLISHING, as per http://code.google.com/p/swfobject/wiki/api

If anyone wants to check how it worked out:

www.aftertheice.com , "video" section.

Hello every one,
I'm using swfobject 2.1 and jw 3 on my site : http://www.muziko.fr

What i'm trying to do now is : control the pop-up with javascript, so that the player doesn't reload on each page.

This is what they used on : www.jamendo.com

Any idea ? (i saw answers already with the search option but i didn't know if it was usable with swfobject)

My HTML CODE
<body onload="showVideo()">
<div id="myId">

<a href="http://www.adobe.com/go/getflashplayer">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
</a>
</div>
</body>

JAVASCRIPT code

function showVideo(){
var vid=document.getElementById("playVideo").value;

var flashvars = { file: vid, autostart: "true", displayclick: "none",controlbar: "false"};
var params = {};
var attributes = {};

swfobject.embedSWF("player.swf", "myId","500", "400", "9.0.0", "expressInstall.swf", flashvars, params, attributes);
}
</script>

The above code is working fine in Both IE and firefox .
But the issue is...
When I run the above code in IE.The IE give status bar message "Error On Page" because of "MyId" is undefined

My code is working correct but i just want to get rid of the unwanted msg on status bar.
plz help me

Move "myId" to the anchor element:

<div>
  <a id="myId" href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" /></a>
</div>

For my WordPress plugin wordTube , I updated now to swfobject 2.1 in combination with the JW Media player...

I build a small class for PHP to embedded the dynamic script : http://alexrabe.boelinger.com/2008/09/17/swfobject-21/

Hello

Link I posted Apr. 03, 2008 is out of date. I made new one:
http://atutu.host247.pl/?cmd=movie&var1=Roznosci/dzingiel.flv

I see in apaches' logs that someone still uses that link, so I decided to update this information here.

I'm using ceebox with JW player.

Ceebox uses swfobject ver 2.1 but JWP still uses 1.5, any idea how to go about getting JWP up to speed with ver 2.1??

Thanks

This is the code for the page, ceebox also uses jquery.

It works fine if i use a player from Adobe flash but not with JWP for FLV

Anyway

<script type="text/javascript" src="../../../../js/accordion/jquery-1.2.6.pack.js"></script>

<script type="text/javascript" src="../../../../js/cb/swfobject.js"></script>
<script type="text/javascript" src="../../../../js/cb/ceebox.js"></script>
<script type="text/javascript" src="../../../../js/cb/swfobject2.js"></script>
</head>

<body>

<script type="text/javascript">
function createPlayer1()
{
var s1 = new SWFObject("player.swf","ply","800","660","9","#FFFFFF");

s1.addParam("allowfullscreen","true");
s1.addParam("allowscriptaccess","always");
s1.addParam("flashvars","file=0001.flv&skin=stijl-source.swf");
//s1.write("container");
}
</script>

<a href="0001.flv&skin=stijl-source.swf" class="ceebox" onclick="javascript:createPlayer1(); return t;" >Load Player</a>

The above code was used in reference to

http://www.longtailvideo.com/support/forum/JavaScript-Interaction/9046/Lightbox-interaction#msg81090

The last post - Aug. 08, 2008

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

Is for JWP and

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

For cee box for the above problem i'm facing.

thanks

flvplayer is still "delivered" with swfobject 1.5 - is there a reason for that or will 2.0 be the defaukt version within short? Was wondering because the implementation changes are quite different and there seem to still be issues with 2.0

I would like that the code I write today is still useable when the next version comes. Any advice?

"and there seem to still be issues with 2.0 "

IMHO, everyone should be using swfobject v2.2 by now. Or at least load swfobject v2.1 from Google:

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.1/swfobject.js"></script>

I've never encountered any "issues".

"IMHO, everyone should be using swfobject v2.2 by now"
It still "ships" with 1.5, so I assume there is a reason?

"It still "ships" with 1.5, so I assume there is a reason?"

I've never seen any issues with swfobject v2.2 on hundreds of implementations up through the v4.4.139 player.

I also monitor the mailing list at the swfobject Google Code site. There haven't been any issues so far, with swfobject v2.x and JW players.

swfobject v2.x has quite a few improvements and enhancements and IMHO is much easier to use.

But SWFObject v1.5 works, so it's OK to use.

From the jist of Jeroen's last post on the subject, I surmise that he is planning to upgrade, it's just that there will be a lot of pages and the Wizard to update.

ok, thanks lefTy.
I am scratching my head trying to get pre-rolls to work, need to put short ads and/or trailers in front of the video. Thought it might have something to do with swfobject 2. I also have problems getting DRelated to work properly. Seems to work with normal files, but not when I use streamer/file setup. Seems playlists for streaming video is not very well documented: Maybe it is not very common?

@Stefan V,

Have you looked at this thread?

      http://www.longtailvideo.com/support/forum/Setup-Problems/15243/RTMP-folders-problem-and-different-r...

Or maybe that's not the nature of your problem???

dsfasdfas

I just can't get fullscreen to work in IE. Works fine in FF and Opera. I have uninstalled and reinstalled flash for IE, but no change.

Does anyone have an example of using SWF Object 2 + JW Player 4.3, where fullscreen works in all browsers?

fsdfds

I still cant get this to work in FF :(
it doesnt detect whatsoever, just so blank screen.
here's the code, please help asap

<script type="text/javascript" src="/player/swfobject_new.js"></script>
<div id="player"><i>Loading footage...</i></div>
<script type="text/javascript">
var flashvars = {};
flashvars.file = "/portals/0/flv/AWM_Daring Jap Raiders Sunk At_Sydney.flv";
flashvars.width = "350";
flashvars.height = "350";
flashvars.usefullscreen = "true";
var params = {};
var attributes = {};
attributes.align = "top";
swfobject.embedSWF("/player/player.swf", "player", "350", "350", "9.0.0", "/player/expressInstall.swf", flashvars, params, attributes);
</script>

Tested & Working:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html lang="en">

  <head>

    <title>TN - JWMP v4.4.198 - swfobject v2.2</title>

    <script src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>

    <script type="text/javascript">
      var flashvars =
      {
        'file':                 '/portals/0/flv/AWM_Daring Jap Raiders Sunk At_Sydney.flv',
        'image':                '/player/preview.jpg',
        'id':                   'playerID',
        'autostart':            'false'
      };

      var params =
      {
        'allowfullscreen':      'true',
        'allowscriptaccess':    'always',
        'bgcolor':              '#000000'
      };

      var attributes =
      {
        'align':                'top',
        'name':                 'playerID',
        'id':                   'playerID'
      };

      swfobject.embedSWF('/player/player.swf', 'player', '350', '350', '9.0.124', '/player/expressInstall.swf', flashvars, params, attributes);
    </script>

  </head>

  <body

    <div id="playercontainer" class="playercontainer"><a id="player" class="player" href="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash">Get the Adobe Flash Player to see this video.</a></div>

  </body>

</html>

2.0 works great. If you want to use the HD plugin then you need to note that you have to quote the flashvar

var flashvars = {
"hd.file": "$file_hd",
blah blah
}

othewise it doen'twork at all.

James

Is there anyone who can translate next code into SwfObejct 2-syntax?
Thx

<script type="text/javascript">
var s1 = new SWFObject("/09/mediaplayer.swf","mediaplayer","300","36","7");
s1.addVariable("width","300");
s1.addVariable("height","36");
s1.addVariable("displayheight","16");
s1.addVariable("showdigits","false");
s1.addVariable("backcolor","0x000000");
s1.addVariable("frontcolor","0xcecab7");
s1.addVariable("lightcolor","0xffe59f");
s1.addVariable("usefullscreen","false");
s1.addVariable("autostart","true");
s1.addVariable("file","/09/playlist.php");
s1.addVariable("shuffle","false");
s1.addVariable("repeat","list");
s1.addVariable("volume","80");
s1.addParam("wmode", "transparent");
s1.write("mediaplayer");
</script>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html lang="en">

  <head>

    <title>Jelle V - JWMP v4.6.x - swfobject v2.2</title>

    <script src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>

    <script type="text/javascript">
      var flashvars =
      {
        'file':                                  '/09/playlist.php',
        'width':                                 '300',
        'height':                                '36',
        'displayheight':                         '16',
        'showdigits':                            'false',
        'shuffle':                               'false',
        'repeat':                                'list',
        'volume':                                '80',
        'usefullscreen':                         'false',
        'frontcolor':                            '0xCECAB7',  // text & icons
        'backcolor':                             '0x000000',  // playlist background
        'lightcolor':                            '0xFFE59F',  // selected text/track highlight
        'autostart':                             'true'
      };

      var params =
      {
        'allowfullscreen':                       'true',
        'allowscriptaccess':                     'always',
        'wmode':                                 'transparent',
        'bgcolor':                               '#FFFFFF'
      };

      var attributes =
      {
        'id':                                    'playerID',
        'name':                                  'playerID'
      };

      swfobject.embedSWF('/09/mediaplayer.swf', 'player', '300', '36', '9.0.124', false, flashvars, params, attributes);
    </script>

  </head>

  <body>

    <div id="playercontainer" class="playercontainer"><a id="player" class="player" href="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash">Get the Adobe Flash Player to see this video.</a></div>

  </body>

</html>

Thanx

I'm getting there
but I still get an error that says:

uncaught exception: [Exception... "Node was not found" code: "8" nsresult: "0x80530008 (NS_ERROR_DOM_NOT_FOUND_ERR)" location: "http://www.palmfuif.be/swfobject/swfobject.js Line: 4"]

Here is the test website:
http://www.palmfuif.be/swfo_test.html

Ah... you've made quite a mess of things.

Your previous code was for a v3 player, which I left intact.

Now you've changed to a v4 player, which is a different beast.

Here's your code for a v4 player.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html lang="en">

  <head>

    <title>Jelle V - JWMP v4.6.x - swfobject v2.2</title>

    <script src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>

    <script type="text/javascript">
      var flashvars =
      {
        'file':                                  '/music/playlist.xml',
        'shuffle':                               'false',
        'repeat':                                'list',
        'volume':                                '80',
        'frontcolor':                            'CECAB7',  // text & icons
        'backcolor':                             '000000',  // playlist background
        'lightcolor':                            'FFE59F',  // selected text/track highlight
        'id':                                    'playerID',
        'autostart':                             'true'
      };

      var params =
      {
        'allowfullscreen':                       'true',
        'allowscriptaccess':                     'always',
      //'wmode':                                 'transparent',
        'bgcolor':                               '#FFFFFF'
      };

      var attributes =
      {
        'id':                                    'playerID',
        'name':                                  'playerID'
      };

      swfobject.embedSWF('/music/player.swf', 'player', '300', '36', '9.0.124', false, flashvars, params, attributes);
    </script>

  </head>

  <body>

    <div id="playercontainer" class="playercontainer"><a id="player" class="player" href="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash">Get the Adobe Flash Player to see this video.</a></div>

  </body>

</html>

Also, you should load swfobject.js from Google's CDN for these reasons.

The advantages of using swfobject v2.x loaded from Google's CDN:

    Loading from Google AJAX Libraries API:

        http://pipwerks.com/journal/2008/11/11/swfobjectjs-finds-a-home-on-google-servers/

    How & Why You Should Use Google CDN:

        http://webmuch.com/how-why-you-should-use-google-cdn/

Also, you should not use wmode=transparent unless you are absolutely sure that you need it, because it is buggy.
(The JW FLV Player doesn't have a transparent mode, so you don't need wmode=transparent.)
If you want to display HTML elements over the player, use wmode=opaque.

Also, be aware that swfobject v2 COMPLETELY REPLACES the HTML element that it writes the object element to, unlike SWFObject v1 which only replaced the contents of the HTML element.

thx

now it works fine...

And now I understand the problems I had... :P

Cheers

 
 
    Good Luck!

Thank you @lost !!
You've got me up and running inclusive IE8 fullscreen and everything. cheers.

    Sorry Ian, I really didn't mean to do that.    :D

I need help uploading my site every time I upload it, I open the html file and it just shows a flash download link. And on my desktop my index.html opens just fine and displays site just fine. I can upload some code if anyone can help.

Thanks in advance

Seems like an issue with your system or server. What is your OS and Flash version?

we need response display in jquery post method in a page. when ever doing a paging next video will be displayed using jquery post method.

please provide the solution for this.

@programmer:

I'm not sure what you're asking. Please rephrase your question so that we can assist you.

Hi,I have a problem with this SWFObject.My code is the next:

<bean:define id="urlObtenerFeed">http://<agrega:agregaProperties property="host"/><agrega:agregaProperties property="subdominio"/>/visualizadorcontenidos/AgregadorFeedsCU/FormularioAgregadorFeedsObtenerFeed.do?idFeed=${form.idRssGaleria}&feedNum=${form.numOdesGaleria}&idiomaNavegacion=${form.idiomaNavegacion}</bean:define>
<bean:define id="scrollerAgrega"><agrega:agregaProperties property="subdominio"/>/static/flash/scrollerAgrega/scrollerAgrega.swf</bean:define>

<c:if test="${form.idRssGaleria!='0.0'}">
<script type="text/javascript">
swfobject.embedSWF("${scrollerAgrega}", "el_flash", "660", "185", "9.0.0",false,false,{wmode:"transparent",base:".",allownetworking:"all",allowscriptaccess:"always",flashvars: "urlFeed=${urlObtenerFeed}"},false);

</script>

The problem is that urlObtenerFeed only load visualizadorcontenidos/AgregadorFeedsCU/FormularioAgregadorFeedsObtenerFeed.do?idFeed=${form.idRssGaleria}

feedNum and idiomaNavegacion disappears :S.Why???

@ Lost - Thank you. That helped me migrate from SWF1.5 to SWF2.2 as well. Seems to be working fine.

Can someone please tell me the notation for populating plugin attributes using an object oriented approach? Also, is there any kind of list of what is a flashvars, what is a params, and what is an attributes?

I tried:

var plugin_flow = new Object();
plugin_flow.position="bottom";
plugin_flow.showtext="true";
plugin_flow.coverheight="200";
plugin_flow.size="400";
plugin_flow.controlbaricon="true";
plugin_flow.onidle="show";
plugin_flow.onpaused="show";
plugin_flow.onplaying="hide";
plugin_flow.oncompleted="show";
plugin_flow.font="Trebuchet MS";
plugin_flow.fontsize="24";
plugin_flow.titleoffset="25";

var flashvars = new Object();
flashvars.controlbar="top";
flashvars.file="_jwplayer.xml";
flashvars.width="600";
flashvars.backcolor="000000";
flashvars.frontcolor="FFFFFF";
flashvars.stretching="uniform";
flashvars.autostart="false";
flashvars.playerready; "playerReadyCallback";
flashvars.plugins="flow-1";
flashvars.flow=plugin_flow;

var params = new Object();
params.allowscriptaccess="always";
params.allowfullscreen="true";
params.wmode="transparent";
params.flow=plugin_flow;

but neither way (via flashvars, nor params) populated the flow.____ attributes correctly.

Any help?
THANKS!
-Zac Morris

OK, figured it out...

var flashvars = new Object();
flashvars.controlbar="top";
flashvars.file="_jwplayer.xml";
flashvars.width="600";
flashvars.heigh="260";
flashvars.stretching="uniform";
flashvars.autostart="false";
flashvars.playerready; "playerReadyCallback";
//&flow.onidle=show&flow.onpaused=show&flow.oncompleted=show
flashvars.plugins="flow-1&flow.position=bottom&flow.showtext=true&flow.coverheight=200&flow.size=400&flow.controlbaricon=true&flow.onplayer=hide&flow.font=Trebucht%20MS&flow.fontsize=24&flow.titleoffset=25";

Not what I would call elegant from an object oriented standpoint, but it works! :)