Video embed/script codes!

I was “commissioned” to investigate the best solution for embedding videos, i.e. the script/html that should be used to embed the video.

One could (stupidly) thing that this would be rather easy, but we knew beforehand that it wouldn’t be. Work from the ASSET project, and work done by Guy through his support role at CDoTL had proven that especially doing this in IE would most certainly through up bugs, resulting in a bad user experience, especially when modification of the BB content was needed.

So I decided to start out using IE (version 8) in the hope that a solution for this browser might result in a solution that would work for all.

My starting point was this piece for script:

<script type=”text/javascript” src=”http://streaming.reading.ac.uk/flash/swfobject.js”></script><div id=”Spear_LSBU_Lecture_03Nov09-part-1″>This text will be replaced</div>

<script type=”text/javascript”>

var so = new SWFObject

(“http://streaming.reading.ac.uk/flash/player.swf”,”mpl”,”640″,”390″,”9″)

so.addParam(“allowscriptaccess”,”always”)

so.addParam(“allowfullscreen”,”true”)

so.addParam(“flashvars”,

“&file=http://www.reading.ac.uk/media/general/Karsten%20-%20shorter%20version-a9pysZEwQ6h4KFwu-H264_Widescreen_320x180.mp4&image=”)

so.write(“Spear_LSBU_Lecture_03Nov09-part-1”);

</script>

Unfortunately this approach didn’t work at all! IE (unlike other browsers) in combination with BB insert the word “defer” inside all <script> tags resulting in <script defer>, which means the code won’t work.

The next method I considered, taken from the ASSET project (and very similar to the Youtube embeds) used this script:

<object width=”320″ height=”204″ id=”flvPlayer”>

<param name=”allowFullScreen” value=”true” />

<param name=”movie” value=”http://streaming.reading.ac.uk/flash/player.swf?file=http://www.reading.ac.uk/media/general/Karsten%20-%20shorter%20version-a9pysZEwQ6h4KFwu-H264_Widescreen_320x180.mp4&image=” />

<embed src=”http://streaming.reading.ac.uk/flash/player.swf?file=http://www.reading.ac.uk/media/general/Karsten%20-%20shorter%20version-a9pysZEwQ6h4KFwu-H264_Widescreen_320x180.mp4&image=” width=”320″ height=”204″ allowFullScreen=”true” type=”application/x-shockwave-flash”></embed>

</object>

After inserting this I got into problems, as IE would inset <div> tags which would mess up stuff, so I surrounded the object with divs manually, which sorted out this problem. But the code still wouldn’t work as the actual embed part would be removed! I thought this was odd, and as this methodology is common, I thought that google might have a solution to this problem. After quite some searching I found a bug report at TWU (Texas Women’s University – http://goo.gl/I1n83) were this exact problem was reported, the reported solution was to use this embed script in the usual way, but before saving it *ALWAYS* to go away from the HTML view into the normal view of the text editor and the save, after which everything should work! I tested this, and it works!! Therefore, always save content in normal view and you’ll be fine…

Except, I thought I’d try this with the first script, and that is not advisable, as that crashed IE completely!!

I am now confident that we have a solution that works (I’ve also tested it in FF, Chrome and Opera), and that we won’t be able to find a solution that will work for IE without this expectation of the user.

Why am I confident?

Well, if scripts get removed no matter what we do and if the only way to keep embeds is to go to normal view before saving, and there really aren’t any other solution to showing video in html4, then we have to do it this way! We’d need html5 or a better BB text editor before a better solution with less user interaction/expectation could be made.

This entry was posted in Video. Bookmark the permalink.

3 Responses to Video embed/script codes!

  1. karlund says:

    Found out that it actually works without the movie param, so I’ve removed that in the final version.

  2. Guy Pursey says:

    My quick tests seem to indicate this works. What a simple solution! Now we just have to hope the users follow all the steps we outline!

    Also, I did some testing of my own before you looked at this, as you know. I found that the “defer” tag wasn’t actually a problem, so long as the script didn’t feature statements like “document.write()”. It’s fine with changing the innerHTML or nodeValue of a div for example. I think “defer” stops the script from being executed until the whole page has loaded, hence the reason that lines like “document.write()” don’t work….

  3. karlund says:

    which is a leap of an assumption to make by BB of scripts…

Leave a Reply

Your email address will not be published. Required fields are marked *