Page 1 of 1

iframe seen from Ipad

PostPosted: Thu Apr 17, 2014 6:39 am
by aircamera
Hi !
I have embed a tour with an Iframe. It works fine on PC and Mac :
http://www.aircamera.fr/essais/

But on Ipad it doesn't enter full screen...
I used this code :

<iframe width="800" height="600" src="http://www.aircamera.fr/visite_virtuelle/golf_les_gets/360.html" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true"></iframe>

Fullscreen icon is not even visible.
What can I do ?
Thank you for your help.
Cyril

Re: iframe seen from Ipad

PostPosted: Thu Apr 17, 2014 7:11 am
by Destiny
Hi..

This might help you... Basically you are putting the iFrame inside a wrapper and providing % size to that..

"I'm assuming there is a bug in iOS safari in how it treats iframes with defined width / height. Without width / height being defined it tries to scale them automatically to fit their content without any scrolling needed.

The best workaround I've found is to not scroll the iframe at all, but rather to scroll a wrapper div inside the framed-in page.

Here's an example:

<iframe id="stupid-iframe" width="600" height="200" src="a-file.html"></iframe>
a-file.html:

<html>
<body>
<div id="wrapper" style="width: 100%; height: 100%; overflow: auto; -webkit-overflow-scrolling: touch;">
...all my normal content...
</div>
</body>
</html>"

Re: iframe seen from Ipad

PostPosted: Thu Apr 17, 2014 8:59 am
by mediavets
aircamera wrote:Hi !
I have embed a tour with an Iframe. It works fine on PC and Mac :
http://www.aircamera.fr/essais/

But on Ipad it doesn't enter full screen...
I used this code :

<iframe width="800" height="600" src="http://www.aircamera.fr/visite_virtuelle/golf_les_gets/360.html" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true"></iframe>

Fullscreen icon is not even visible.
What can I do ?
Thank you for your help.
Cyril

webkitallowfullscreen and mozallowfullscreen params are deprecated:
https://developer.mozilla.org/en-US/doc ... ent/iframe

I may be mistaken but I believe that the krpano HTMKL5 Panorama Viewer fullscreen behaviour is at present inconsistent on mobile platform browsers and hence I seem to recall that fullscreen is not currently supported in tours created with PTP 2.x - hence the control icon is missing on iDevice.

Re: iframe seen from Ipad

PostPosted: Thu Apr 17, 2014 12:54 pm
by aircamera
Thank you for your help !

I've installed google chrome app on my Ipad to give a try, and the result is the same. So I'm not sure the problem comes from safari...

Re: iframe seen from Ipad

PostPosted: Thu Apr 17, 2014 1:16 pm
by mediavets
aircamera wrote:Thank you for your help !

I've installed google chrome app on my Ipad to give a try, and the result is the same. So I'm not sure the problem comes from safari...


See: viewtopic.php?f=91&t=21831&hilit=fullscreen+ipad

Re: iframe seen from Ipad

PostPosted: Fri Apr 18, 2014 3:10 pm
by aircamera
Thank you for this link.

benji33 wrote:Into theme2.tmpl file remove the red lines below (see this post viewtopic.php?f=64&t=20589&p=132050#p131608):

line 45
if (device.fullscreensupport,
set(layer[{{plugname}}btn_openfs ].{%ifequal p.position.orientationString "horizontal"%}x{%else%}y{%endifequal%}, get({{plugname}}button_pos));
set(layer[{{plugname}}btn_closefs].{%ifequal p.position.orientationString "horizontal"%}x{%else%}y{%endifequal%}, get({{plugname}}button_pos));
inc({{plugname}}button_pos, {{button_offset}});
);

line 585
<layer name="{{plugname}}btn_openfs"
url="%FIRSTXML%/{{pluginDirectory}}/btn_enter_fs.png"
onclick="{%include 'enterfullscreencall.tmpl'%}"
style="{{plugname}}_btn_style"
devices="fullscreensupport"
visible="false"
line 595
<layer name="{{plugname}}btn_closefs"
url="%FIRSTXML%/{{pluginDirectory}}/btn_close_fs.png"
onclick="{%include 'exitfullscreencall.tmpl'%}"
style="{{plugname}}_btn_style"
visible="false"
devices="fullscreensupport"

line 1233
<action name="{{plugname}}ShowFullscreenButtons">
if (device.fullscreensupport,
if(tour_fullscreen,
set(layer[{{plugname}}btn_openfs].visible , false);
set(layer[{{plugname}}btn_closefs].visible, true);
,
set(layer[{{plugname}}btn_openfs].visible ,true);
set(layer[{{plugname}}btn_closefs].visible,false);
);
,
{{plugname}}HideFullscreenButtons();
);
</action>

Then into the generated XML code YOUR_TOUR_skin.xml
Remove devices="fullscreensupport" of actions : exitFullScreen, enterFullScreen, exitFullScreenChangeEvent, enterFullScreenChangeEvent

PS : double click for fullscreen should work after this.

If I'm using Docked Thumbnails Control Bar, I presume that I shall edit "theme1.tmpl" ?
I tried to remove "fullscreensupport" strings into theme1.tmpl...
I also deleted the 4 entries devices="fullscreensupport" into skin.xml but no changes.

I can't make my tour work correctly on Ipads...