Forum Discussion
full screen video button?
My previous idea won't work because of cross-domain issues.
But the real fix, unsanctioned by Articulate I'm sure, is to add the last 3 lines below to the story.js file around line 640:
// Create the iframe
var oIFrame = document.createElement('iframe');
oIFrame.frameBorder = "0";
oIFrame.id = "div" + strId;
oIFrame.style.border = "0";
oIFrame.style.width = "100%";
oIFrame.style.height = "100%";
oIFrame.allowtransparency = "true";
oIFrame.setAttribute('allowfullscreen', "");
oIFrame.setAttribute('webkitallowfullscreen', "");
oIFrame.setAttribute('mozallowfullscreen', "");
Hi George,
Good find!
I did look into something like that also, but because I have to share my method with other team members, I worked out the method which only involves editing one HTML file. It doenst involve editing storyline files before or after publishing.
I tried to do the same as you, but I tried to do this in the player.js file, so you only have to do this once and not everytime after publishing.
Program Files (x86)\Articulate\Articulate Storyline 2\Content\player.js (same code also around line 640)
I believe a had no luck doing this, but I'm not sure actually. You can give it a go if this is the best solution for you!
Thanks for your input!Hi George,
thank you for sharing your solution. Unfortunately it didn't work for me. I tried to figure out there the problem is and it seems to me that the story.js won’t be used if I play the story_html5.html file. file? Instead the player_compiled.js is used. Is this fix supposed to work with story_html5.html. Any ideas? Any help would be appreciated!
I also tried to replace the player.js file like Paul Wijnen did it. But I failed too.
Hi Alexandra,
Try my solution with the Web Object / HTML file and the video (MP4) file.
Just copy and paste the code which I gave in this thread.Thank you Paul! Very helpful. I got it to work. Great solution!
I'm so glad Paul's solution works, because the alternative is not pretty. Yeah Paul!
You were right about html5 using the player_compiled.js file instead of story.js/player.js. I looked at a recent project and the minified player_compiled.js file was 935kb! That's a huge js file and finding the right thing to change in the right place would be pretty daunting.
Hi George,
Pauls solution works for me, because I am working with local videos. From my understanding your solution has the benefit for the cross-domains problem. Here it is important that the outer files gives the iframe the permission to play in fullscreen.
In the player_compiled it is probably around line 304:
Element.prototype.open_webobject=function(a){if(this.webobject)this.webobject.remove(),this.webobject=null;var b=this.parent;"Slide"==this.innerType&&(b=this);this.webobject=$("<iframe class='item webobject'></iframe>");this.webobject.attr("src",$(a).attr("url"));this.webobject.attr("width",$(a).attr("width"));this.webobject.attr("height",$(a).attr("height"));this.webobject.css("left",$(a).attr("xpos")+"px");this.webobject.css("top",$(a).attr("ypos")+"px");this.webobject.css("z-index",this.depth);Here we would have to add the fullscreen options – something like …
this.webobject.attr("allowfullscreen","true");this.webobject.attr("webkitallowfullscreen","true");this.webobject.attr("mozallowfullscreen","true");
Maybe someone with better knowledge than me want’s to give it a shot.
Hi George
I've just had this problem and your solution has saved the day. Brilliant!
Thanks
Gavin
