Embedded blip.tv videos do not work fullscreen

Posted Sunday 29.06.08

This post is intended to assist those who like me have struggled (read: “didn’t manage to complete within 2 minutes”) to successfully embed blip.tv hosted videos into a web page and play them in full-screen mode, simply by copying and pasting the blip.tv provided embed HTML obtained from the built-in ’share’ feature of a video on blip’s site.

However, this post contains two possible solutions, the second one of which may apply to you even if your full screen issues are not specifically with blip.tv, but are perhaps with YouTube, Vimeo, Veoh or other Flash based video sites.

I’d just like to say I like blip.tv and what they are doing. This post has been written to mainly help users of blip.tv get their embedding sorted so they can continue to enjoy what blip.tv has to offer. Their customer support has left something to be desired though, which has left me a little digruntled. For the record I have made mention of this below.

Skip down to the solutions [unless you want to read the whole story]

The problem

About two weeks ago I was asked by the owner of a site I manage to embed a couple of blip.tv hosted videos into the site. He provided the URLs to the blip.tv pages where the videos could be found. Within all blip.tv video players there is an ‘email or embed this video’ option. Selecting this, I clicked on the ‘embed’ tab. This displayed a textbox with the HTML apparently necessary to embed into your own pages. I copied and pasted this code exactly as it appeared into the relevant HTML documents using my usual text editor - not a WYSIWYG or a CMS, a plain old text editor.

After uploading the modified files I checked out the website and played the videos. Everything seemed fine. The next day I was asked if I could amend what I had done to allow full-screen mode. I revisited the videos and indeed, even though the embedded videos played fine in their default embedded size, when clicking the full-screen icon in Firefox, the screen went blank although audio continued as normal. I fired up Internet Explorer 7 thinking it may be a FIrefox only issue, but with IE I found that absolutely nothing happened, clicking the full-screen button didn’t even result in a black screen.

I jumped back over to the blip.tv website to play the videos. I found even on their own site the full-screen mode did not work, with exactly the same results as the video pages I had created.

During the following hour I created the simplest of simple HTML pages and embedded the provided HTML once again. I checked, double-checked and even triple-checked everything. Nothing changed. I was not going to deal with blip.tv support directly, that was something the site owner wished to do, so I let him know that I couldn’t work out the issue and waited to hear back.

The response received from the support desk was:

Typically when there’s an issue with the full screen button it’s because you haven’t embedded your video correctly. Please make sure to grab your embed code from your video’s episode page.

It appears that your embed code has been escaped incorrectly. This means that your method of publishing takes our embed code and reformats it. Please make sure to publish the code while using the “HTML mode” within your method of publishing.

I fully understood the response. Once again I spent an hour or so copying, pasting and refreshing trying to get the full-screen toggle to work. I drew a blank and updated the site owner, providing full details on how I had used a plain text editor, no WYSIWYG such as Dreamweaver and also asking if they could provide further details on the supposed escaping of their code.

The following response was received from blip.tv around 7 days later - copied and pasted directly here - that I have read (perhaps incorrectly) as one of pure arrogance:

Hi there,

I apologize for the delay in responding.

You should relay to youur webdesigner that the code isn’t working correctly  because it seems to have been escaped by some 3rd party tool like a content management system.

Thanks!

- Begin rant -

After 7 days, that is one very unhelpful reply. I don’t know whether they simply did not read my reply that was forwarded on to them, or if they just could not be bothered to provide assistance. As I said above, included in my reply was a request for details on how the embedded code I was using was apparently escaped differently to their provide code, but as you can see that went an unanswered question.

One thing I have always done when I receive an enquiry relating to any kind of request for support, or report of a bug, is provide full details on how I have investigated the issue in question and what results I have obtained, that goes a long way to proving that I took the enquiry seriously. I believe based on this response that they simply don’t care.

- End rant -

A little hot under the collar at this point I proceeded to produce a proof of issue page, including screen capture, to illustrate my problem. The page can be found here if you are interested. It was whilst getting this page together I discovered something on their site that turned out to be the solution I was after…

The Solutions

There are two, it might be the case that both apply to you, it depends on what problems you are experiencing and what browser you use.

Solution 1

Like me, you may have been trying to embed the code blip.tv provide from within one of their videos using the share button. This code would appear to be the escaped code they have said is incorrect and can cause full screen issues. To get embed code that works, you need to look outside the box, quite literally.

Located to the right of the blip.tv hosted video, you will see the following:

Selecting the ‘Share’ option reveals:

I think you can see where this is going…

Embedding the code produced here, the full-screen issues in IE should become a thing of the past. At the time I did this, I still had issues with Firefox that I suspected were going to come down to problems with my set-up / install of Flash player (on Windows Vista Premium). Further probing led me on to solution 2.

Solution 2

With IE now working fine, not only were blip.tv videos not playing full screen in Firefox, but also YouTube and others were failing to work correctly as well. Mozilla have detailed a quick-fix that worked for me. It essentially comes down to a hardware acceleration problem by the looks of it.

Out of interest I went back to the blip.tv blog that uses the embedded players I had been struggling to view full screen. Subsequent to following the Mozilla quick-fix, there was now no issue in Firefox, however IE full screen mode still failed miserably. Perhaps this is another issue to do with my machine?

If the Mozilla solution doesn’t work out for you, they have a link on the page I have linked to that allows you to start a new support thread.

To conclude

Embedding blip.tv videos is a piece of cake when you know where to look and get the code from. Using “the right code” you should find videos play perfectly in both Firefox and Internet Explorer.

It is a shame blip.tv’s support people couldn’t have been a bit more informative or investigated the issue a bit more thoroughly themselves, after all it is their brand, product and reputation at stake. I appreciate that to find a solution you sometimes need to be able to recreate the problem, but simply repeating an original suggestion - albeit using different words - simply isn’t good enough in my opinion. Ask questions, read and answer questions provided by the customer and above all, don’t take nearly a week to reply. That is what good support is about and what can define a good company.

One thing I can’t understand though: am I the only person to have come across this issue? I am hardly a pioneer when it comes to discovering problems with this kind of thing, but searching on the web for reports by others who have experienced this issue returned very little - at least not with regards to the embed code problem - to show me the errors of my ways. Hopefully this post will go some way to helping any others who are experiencing the same issues. Please feel free to comment below if you have anything to add to what I have written.