We recently upgraded to JWPlayer version 4.6 and are now getting an occasional error (95%+ of our viewers are getting no problem) where the rtmp player is not found. The error is
"Server Not Found: rtmp://www.vega.org.uk/oflaDemo"
Does anyone know what sorts of issues cause this?
We are assuming this is a network issue but are stuck with what to do about it as we cannot replicate the issue.
Is there a timeout somewhere in jwplayer that is firing off and then displaying this error, or does it mean that the search for the server genuinely returned an error.
If there is a timeout, is there anyway to set it much longer?
Our settings for creating the player are // player is jwplayer from www.longtailvideo.com var s1 = new SWFObject("http://www.vega.org.uk/flash/player.swf","single","480","380","9"); s1.addVariable("type", "rtmp"); s1.addParam("allowfullscreen","true"); s1.addVariable("image","http://www.vega.org.uk/flash/preview.jpg"); s1.addVariable("streamer","rtmp://www.vega.org.uk/oflaDemo"); s1.addVariable("file","{$flash_file}"); s1.addVariable("showdigits","total"); s1.write("player1");
Sometimes corporate firewalls block port 1935 (used for RTMP). Does your RTMP server have fallback to port 80?
There are mistakes in your HTML document, such as wrapping the JavaScript code in the division element, that the object element for embedding the Flash content, will be written to by SWFObject.
SWFObject v1.5 is considered to be obsolete and is no longer supported by its developers.
I would suggest moving to swfobject v2.2, loaded from Google's CDN.
Place this code in the head element of your HTML document:bc.. <scriptsrc="http://www.google.com/jsapi"></script>
> Regarding the blocked port - with advice, I've now changed it to rtmpt://draco.streamingwizard.com:80
As I can't replicate the error I'll wait and see if someone else complains.
> As for the code - in my defence, I bought the licence, and I used the wizard on this site to generate the code. The developers obviously need to update it.
Someone on this forum then improved it earlier this year.
As a video editor rather than a programmer I just take the next bit of advice given!
So, as you're offering help today, can you help a little further? My site has hundreds of pages, with a common header. So I don't want to put the unique video names in the header each time.
Also I need the videos to be different sizes on different pages, so again would want to specify this figure in the body.
Third point - how would I deal with a number of videos on a page, for instance here?
1) SWFObject v1.5 vs. swfobject v2.x: a) I don't know why Longtail Video hasn't updated to swfobject v2.x, b) swfobject v2.x has quite a few improvements and is actively being developed, c) as explained in the links that I posted, loading swfobject v2.x from Google's CDN has advantages (faster load, less traffic) for everyone, d) ultimately, it's about keeping up to date with improvements in browsers, Flash, players, video encoding, and utilities.
2) The swfobject developers highly recommend that the code be put in the head element of your HTML document, but in cases where this is impossible, you can put the code in the body element.
3) For the possibly blocked ports: Fallback from RTMP on port 1935 to RTMPT on port 80 is internal to the Flash player; no configuration is needed in your player code however, your server has to support RTMPT on port 80.
4) Multiple videos: a) when it's 2 or 3 videos that are all visible without scrolling, just duplicate the player code with unique attribute names/ids for the player and the containing element the user can pause/stop a running video before starting another or leave both running, b) when it's many videos, like your CorporateVideoExamplesMarketing.htm, you should use a different technique where a clickable element, usually an image or a screen capture of the player, is placed where each video player will appear. When the user clicks on the image, a player is instantiated and plays the video. When the user clicks on another image, the running player is replaced with the image and another player is instantiated for the next video. This allows for hundreds of players without slowing the browser to a crawl and initial page load is very fast, because no players are instantiated on initial page load. You can see an example here: *http://www.editorschoicemusic.com/index.php/music/cd/ecm001_drama_one* c) if you would like to use that technique with swfobject v2.2 and the v4.6 JW FLV Player, I can setup a Test Page for you, based upon your CorporateVideoExamplesMarketing.htm page, with a few "video players". Once you see how easy it is to code a link with an image and a file to be played, you can probably do the rest. A sample from the Editors Choice site:bc.. <td class="mp3_player"> <div id="CD1-player7o" class="player" style="text-align:center"> <img id="CD1-player7" src="http://www.editorschoicemusic.com/photos/btn_play.gif" alt="" width="25" height="20" style="cursor:pointer;" *onClick="loadPlayer('http://www.editorschoicemusic.com/index.php?ACT=37&url=1&linklocker=NzYuMTE5LjQuMjI5MC4zNjQ4MjgwMCAxMjM5NDA0MDQ0', 'CD1-player7')* /> </div> </td>
The code in bold instantiates a player when the play button image is clicked. There is some extra "garbage" in the URI, because of the CMS and the linklocker, that you can ignore.
The essential point is that a click instantiates a player with a particular media file.
If you need different sizes for the videos, the width & height can be included along with the URI for the media file.
I changed the player embedding method in *CorporateVideoExamplesMarketing.htm* to the multiple players method as explained in my post above.
A few notes:
1) only the JW Player videos,
2) something is wrong with the serving of the first video because it shows a #2095 error; check your source,
3) I didn't bother to load your images or CSS, just concentrate on the players, not the appearance of the page,
4) several things were repeated in the head element of your page, you might want to check what you are specifying like styles, the image preloader, you're loading *AC_RunActiveContent.js* twice and you don't need it at all; look at the page source, you can see where I marked the repeated elements, fix that "stuff" and your page will load faster & better,
5) for the image placeholder, you can choose an image (see Glasgow) or a screenshot of the player (see AIG),
6) let a video run to the end and you will see how the player is replaced by the placeholder image; this behavior is optional; you can choose to have the player sit there showing the preview image until the user chooses another video,
7) the JavaScript code for the player and the player's API is all in the body element,
8) all of the code needed is in that page, look at the individual video embedding division elements to see how it is done.
bc.. How should I have known to do this? That's an easy one *ask*.
Putting a player on a page is relatively easy, for more complex setups, most of it has already been figured out and is available to those who ask.
For example, the EditorsChoice site came about when Forrest was having trouble with 104 players all instantiated on one page. The site took forever and 14 days to load, was sluggish, and didn't work in Firefox, which has a limit of 16 Flash objects.
So he asked if there was a better way and I showed him how to do it. Since he is using a CMS (the "linklocker" thing), it was a bit of a terror to sort it all out, but as you can see, it works well now.
One of the most important points, is that there is *_not even ONE single player_* instantiated when the page loads, ...nada, ...zip. so the page loads fast and is very responsive.
Here's another page I just sorted out for Christos, using the JWBox for multiple players, if you're into Shadow/Lightbox "stuff".
Going back to the basics of putting just one video on a page, bearing in mind that I can't put specific stuff in the header, have I got the code on this page right:
http://www.rossiterandco.com/writenew_video.aspx
Also, should I be putting some of it in the header (the common stuff, like the streamer and the gapro bits?
I would put the code to load swfobject v2.x in the head, since it's always going to be the same.bc.. <script src="http://www.google.com/jsapi"></script>
The JS for embedding your Flash content can go in the body since it has values, like the files and images, that will be changing. You could break it up, but the crucial line, which begins with "swfobject.embedSWF(..." would still have to be in the body, after you finished defining your file & image flashvars, so you might as well leave it together in the body.
When it's put in the body, the JS for the Flash content must be after the "container" division element, so it is available for swfobject to write the object element into it. swfobject v2.x monitors the DOM loading (essentially the page loading into the browser) and will write the object element into the "container" division at the appropriate time. This is why the developers of swfobject v2.x recomment putting the JS in the head you want swfobject running as early as possible during page load.
So move your "container" div up above the JS code.bc.. *<divid="playercontainer1"class="playercontainer"><aid="player1"class="player"href="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash">GettheAdobeFlashPlayertoseethisvideo.</a></div>*
Question - in the container I want the name of the video (for spidering purposes).
So I'd like it to appear so that if the video didn't play, it it said
Rossiter & Co testimonial video Get the flash player to see this video (link)
I can't figure where to put the "Rossiter & Co testimonial video" within this - before the <a it goes to the top, within it, it's part of the link.
<div id="playercontainer1" class="playercontainer"><a id="player1" 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>
You can put other HTML elements inside the "container" div.
Like a span or another div. You can style them with CSS if desired.
So something like:bc.. <div id="playercontainer1" class="playercontainer">*<span>Rossiter & Co testimonial video</span>*<a id="player1" 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>
swfobject will replace the entire HTML element with an id of "player1" with the object element that is used for embedding your Flash content. bc.. <div id="playercontainer1" class="playercontainer"><span *id="player1" class="player"*>Rossiter & Co testimonial video<a href="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash">Get the Adobe Flash Player to see this video.</a></span></div>
id & class moved to the span element.
I don't know if you're allowed to wrap an anchor element in a span element might be a big booboo then again, it might be OK (Google says OK, but what do they know?).
The flashvars, params, and attributes are arrays of name:value pairs with the comma as the separator character.bc.. var flashvars = {'name':'value', 'name':'value', 'name':'value'};
There should not be a comma as the separator character after the last name:value pair. Chrome & Firefox ignore it, Internet Explorer correctly interprets it as an invalid array.
So just remove the comma after:bc.. 'autostart': 'false' and all will be well.
Ok, I've now got a single player running happily (I think) for instance here: http://www.rossiterandco.com/VideoProductionIntro.htm
I've put the code to load swfobject v2.x in the head throughout the site.
I'm now working on getting the pages with more than one video to run correctly.
I've cut it down to 2 videos here: http://www.rossiterandco.com/CorporateVideoExamplesMarketing_new.htm
The gist of it is right, but I have a query...
> These's no play button and mouse over on the original images, so no one would know it was a video. I appreciate that I could put an arrow on the video, but is there a way of getting the play arrow to show so I don't have to adjust all the images?
You are still loading SWFObjet v1.5. Won't really huurt anything, just wasted.bc.. <script type="text/javascript" src="videoplayer/swfobject.js"></script>[/code
You are also loading the very old JavaScript for embedding Flash:<code><script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
You still have two instances of the MM_ functions. You only need one. The second block of MM_ JavaScript is missing the opening tag.bc.. <script language="JavaScript" type="text/JavaScript">
You have a mistake in the image element. At the end, playerid01 shuld be playerid1 (no zero).
You need to uncomment (remove the double forward slashes - "//") the URL for your player here:bc.. //swfobject.embedSWF('videoplayer/player.swf', playerid, width, height, '9.0.124', false, flashvars, params, attributes);
And comment out or delete the entire swfobject.embedSWF() line for my test player here:bc.. swfobject.embedSWF('player-4.6.526.swf', playerid, width, height, '9.0.124', false, flashvars, params, attributes);
This is exactly what your JW FLV Player code should look like:
Your help is invaluable... I do really appreciate your time.
I've made the changes here: http://www.rossiterandco.com/CorporateVideoExamplesMarketing_new.htm
> I'll get rid of the v1.5 code in the header once I get all the pages running on the new code (I'll have 30 pages to fix once I'm happy what I'm doing is right)
> I don't know what the old AC_RunActiveContent code is doing - so I'll leave that for stage 2 as I don't want to break something else.
> I fixed the other comments.
I took your play button code from http://willswonders.myip.org:8074/Rossiter-4.html.
I put the style into my stylesheet.
I notice that, while it looks perfect in ie, the play button is on the left in Chrome.
Before I start duplicating this code everywhere, could you
I don't have Chrome available for testing, but I'll try to install it on some remote system so I can check the horizontal centering. Luckily, horizontal centering is *_MUCH_* easier than vertical centering, especially with overlaid images.
WOW! What a black art worse than Flash. Just one line in the CSS:bc.. img.play { position:absolute; top:50%; margin-top:-30px;/*1/2image+10pxforcontrolbar*/ margin-left:-20px;/*1/2image*/ *left:50%;* z-index:100; }
<div id="playercontainer1" 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>
Also, I have the following embed code working, but it has two problems: a) the preview image doesn't display, b) the player is blocking the navigation.