Video.js web object
Feb 22, 2013
Hi everyone,
I am trying to implement a solution to get around the "no full-screen" on videos limitation in SL.
Since it's not always feasible to use YouTube (for obvious reasons), I decided to use the videoJS script.
The process is fairly simple :
A) Create a single html file with HEAD and BODY tags as described in the site (check).
B) Put MP4 and OGV format videos inside the same folder as the html file (check).
C) Call the (local) webobject inside Storyline with the right dimensions (say 480x360) (check).
Once I publish this I can view the webobject in Firefox ONLY (no Chrome or IE), plus it has the following side effect. Full screen only fills the size of the webobject it self (in essence the video resizes at about 104% of the original )...
Has anybody toyed with this for any reason (or used a different script which played nice with SL)?
Thanx in advance,
Alex
Note : The actual html page plays fine in all browsers when viewed natively (i.e.outside Storyline).
13 Replies
And (as usual), after a little digging, (half) the answer is ridiculously simple...
A) Do not use the web object but Insert video from website instead.
B) Then go to : http://sandbox.thewikies.com/vfe-generator/ and play with any output/image options, dimensions etc.
C) Copy the generated code from the bottom of the screen.
D) Paste to the SL video from website textbox.
Voila. Real full screen functionality in a snap.
However, Chrome and IE still misbehave (i.e.show nothing at all). But why?
FYI : Just updated Chrome from 24.x to 25.x (latest)...
Video from Generator now works fine in Chrome and IE...
Another WTF moment in the wonderful world of web standardization...
Alex
Alexandros, do you have a sample storyline file to share? Maybe I'm not getting the full picture.
Certainly Michael,
I am attaching a sample story file with all the player configurations so far.
With any luck, I may find some time later to make a screencast out of it, as well.
Hope this helps,
Alex
Alexandros,
Thank you very much for mot only replying to my questions about video playback in Storyline, but for posting such thorough examples. I now understand a lot better what options I have to stream video through Storyline.
I promised I would post some of the results I had with regards to the two options mentioned above.
Here are the two methods that exist to stream video into Storyline:
Ultimately, we decided to use the Web Object option; and I wanted to discuss why, for other readers who may find our experience helpful.
OPTION 1: View Embed Code (Great tool: http://sandbox.thewikies.com/vfe-generator/ )
OPTION 2: Web Object
We are still having issues with IE and playback, but that is a JWPlayer issue. The other issue that we are still working around is that when the video renders in IE (inside Storyline) scroll bars appear. I understand that you should be able to place some CSS style on the page so that this doesn't happen, but every attempt to fix it has not worked. We remain resolute.
Hi, Alexandros
I published your example file in Storyline. However, the flashbox doesn't show the full screen for me. I am trying to do in a way using http://sandbox.thewikies.com/vfe-generator/ .
We currently don't have JWPlayer licenses purchased. That's why I am trying to work the way using embeding the code generated by the link above. Could you tell me what I did wrong?
Thanks,
Zhenyu
Hi Zhenyu,
Try to right-click and press Full-screen for any player that does not include the full screen icon in their controls.
Hope this helps,
Alex
Hi, Alex
This is very helpful, the right-click works for me!
I think I am going to try using the generator to help me get the source code. The only file I have is a MP4 video. Do I need to have a ogg and WebM version for the same video too? What kind of web space do you usually upload the movie?
We are using the videos just internally for employees. So I am not sure what kind of web space I should use to upload the training videos?
Any suggestion is appreciated.
Thanks,
Zhenyu
Hi Zhenyu,
It is always better if you convert to OGG and WebM as well. If you expect a lot of traffic with these courses, for performance reasons you would probably be better off hosting the videos via a cloud service provider.
Alex
Hello Alex,
Can you tell me if you found a way to get the full screen option to work in a web object. I am using jwplayer but when I click full screen it just fills the web object not the whole screen. Is there code I can put in my html that will force the full screen option.
Thanks
Chris
Thanks for the post, very helpful. I am using the web Object option but as I posted just recently to Alex, the full screen button in my player does not work. Do you know of any code that will make the full screen button work as it should?
Thank you!
Chris
Hi Chris,
I'm not sure that Alex or Kevin are still subscribed to this thread, so you may want to PM them as well.
This discussion is closed. You can start a new discussion or contact Articulate Support.