Sie sind nicht angemeldet.

html iframe embed directly from tour xml

Sudarchikov Andrey

Profi

  • »Sudarchikov Andrey« ist der Autor dieses Themas

Beiträge: 1 082

Wohnort: Russia, Kaliningrad

  • Nachricht senden

1

Dienstag, 4. April 2017, 14:41

html iframe embed directly from tour xml

Hi!
just want to share simple action code to embed iframe html with any src to your tour:

Quellcode

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

<action name="iframe_embed">
    removelayer(%1);
    addlayer(%1);
    set(layer[%1].parent, %2);
    set(layer[%1].align, lefttop);
    set(layer[%1].width, 100%);
    set(layer[%1].height, 100%);

    if(device.html5,
        txtadd(iframecode, '[iframe  id="krpano_iframe_',%1,'" width="100%" height="100%" src="',%3,'" frameborder="0" allow-same-origin allowfullscreen][/iframe]');
        copy(layer[%1].html, iframecode);
        set(layer[%1].padding, 0);
        set(layer[%1].url, 'textfield.swf');
        set(layer[%1].interactivecontent, true);
        set(layer[%1].onloaded, iframe_resize(%1); );
    ,
        showlog();
        trace(error,'Iframe is not working in flash mode!');
    );
</action>

<action name="iframe_resize" type="Javascript" devices="html5"><![CDATA[
    document.querySelector("#krpano_iframe_"+args[1]).parentNode.style.height="100%";
]]></action>



Usage:

iframe_embed(IFRAME_LAYER_NAME, TARGET_LAYER_NAME, IFRAME_SRC_URL );

action will add regular krpano layer with name IFRAME_LAYER_NAME as a child to parent layer TARGET_LAYER_NAME
Working in HTML5 only (no flash) the size of iframe will be same as a parent layer, it's possible to set size in %
iframe element has 100% width and height attributes so you can change parent layer size normally

Enjoy *thumbup*

Andrey
VRAP - desktop VR content player based on krpano.
Common tasks in one place in one click! Discussion thread
DOWNLOAD for MAC
DOWNLOAD for WIN

Sergey74

Fortgeschrittener

Beiträge: 193

Wohnort: Russia, Chelyabinsk

Beruf: professional noob

  • Nachricht senden

2

Samstag, 8. April 2017, 15:22

Excellent solution! *thumbup*
translation difficulties *huh*

andrew22222

Fortgeschrittener

Beiträge: 397

Wohnort: Australia

  • Nachricht senden

3

Freitag, 21. April 2017, 06:24

Hi Andrey.

Does this iframe code you created allow for the contents to be scrolled up and down on an iPad / iPhone? If you have a version online I can test it ;-)

Sudarchikov Andrey

Profi

  • »Sudarchikov Andrey« ist der Autor dieses Themas

Beiträge: 1 082

Wohnort: Russia, Kaliningrad

  • Nachricht senden

4

Dienstag, 25. April 2017, 03:13

Hi!
sure it should work.
But i didn't tested it on device.
i have tested it on desktop browser only with window size changing.

Andrey *thumbup*
VRAP - desktop VR content player based on krpano.
Common tasks in one place in one click! Discussion thread
DOWNLOAD for MAC
DOWNLOAD for WIN

HansP

Anfänger

Beiträge: 5

  • Nachricht senden

5

Donnerstag, 4. Mai 2017, 12:00

Zitat von »andrew22222«

Does this iframe code you created allow for the contents to be scrolled up and down on an iPad / iPhone? If you have a version online I can test it

Zitat von »Sudarchikov Andrey«

sure it should work.

No, unfortunately it doesn't. I've tested it.

So there is still no solution for this issue? any kind? *sad*
maybe in the html of the iframe content?

Ruben

HansP

Anfänger

Beiträge: 5

  • Nachricht senden

6

Donnerstag, 4. Mai 2017, 14:40

I got the solution:


<action name="iframe_embed">

removelayer(%1);
addlayer(%1);
set(layer[%1].parent, %2);
set(layer[%1].align, lefttop);
set(layer[%1].width, 100%);
set(layer[%1].height, 100%);

if(device.html5,
txtadd(iframecode, '[div style="position:absolute; right:0; bottom:0; left:0; top:0; overflow-y: scroll; -webkit-overflow-scrolling:touch;"] [iframe id="krpano_iframe_',%1,'" width="100%" height="100%" src="',%3,'" frameborder="0" scrolling="yes" allow-same-origin allowfullscreen][/iframe][/div]');
copy(layer[%1].html, iframecode);
set(layer[%1].padding, 0);
set(layer[%1].url, '%SWFPATH%/plugins/textfield.swf');
set(layer[%1].interactivecontent, true);
set(layer[%1].onloaded, iframe_resize(%1); );
,
showlog();
trace(error,'Iframe is not working in flash mode!');
);

</action>

<action name="iframe_resize" type="Javascript" devices="html5">
<![CDATA[
document.querySelector("#krpano_iframe_"+args[1]).parentNode.style.height="100%";
]]>
</action>

Just add the div to the iframecode and you are good to go and scroll on iOs. :)

Best regards

sblack

Schüler

Beiträge: 56

  • Nachricht senden

8

Mittwoch, 5. Juli 2017, 16:45

done
background="false" for layer
allowtransparency="true" for <iframe>
body { background: none transparent; } for iframe page
GArrows plugin
Walk-through transition effect for krpano
GPS based navigation for krpano
Deeplinking for krpano
Robostitcher and stitching service

mnel

Anfänger

Beiträge: 3

  • Nachricht senden

9

Mittwoch, 30. August 2017, 02:46

Great code, but is there any way to close/open this iframe?

I can close it with the below code

set(layer[%1].visible, false);

set(layer[%2].visible, false);


But when I try to re-open it in the iframe_embed action with the below code it wont open.

<action name="iframe_embed">

set(layer[%1].visible, true);
set(layer[%2].visible, true);

mnel

Anfänger

Beiträge: 3

  • Nachricht senden

10

Mittwoch, 30. August 2017, 02:49

I got it. only make visible true/false for %1. Do not touch parent and it works fine. *smile*

San7

Profi

Beiträge: 626

Beruf: coding in krpano

  • Nachricht senden

11

Donnerstag, 7. September 2017, 09:49

Perfect solution! Thank you!
*thumbsup* *thumbsup* *thumbsup*
https://novosibpano.ru/Plugins/


publicitarios360

Fortgeschrittener

Beiträge: 330

Wohnort: Habana, Cuba

Beruf: Architect, Photographer.

  • Nachricht senden

12

Freitag, 16. März 2018, 13:25

how to send code from iframe to parent?

Hi Andrey, thanks for you code is perfect!!! I need to known how to send code from iframe to parent. This solution allow a html visual menu.

Best Regards,

Fernando.

Ähnliche Themen