[WebVR] How to 'autostart' WebVR with click event *SOLVED*

  • Hi,

    Someone already asked the same question in the krpano 1.19 pre-release thread and Tuur replied with adding webvr.toggleVR(); however this doesn't work on touch enabled devices, because of the need of a touch event.

    I was thinking of combining the Enter VR layer and Look here to start hotspot into one hotspot.

    Code
    <layer 	name="webvr_button" keep="true" vr="true"		 	url="%SWFPATH%/plugins/textfield.swf"			html="Enter VR"			backgroundcolor="0x000000"			roundedge="14"			alpha="0"			autoalpha="true"			css="color:#FFFFFF;font-size:28px;"			padding="12 16"			align="top" 		y="24"			onclick="webvr.toggleVR();"	 />


    Code
    <hotspot name="start" distorted="true"	         url="texts.png" crop="80|450|690|100"	         ath="0" atv="0"	         depth="4000"	         vr_timeout="2000"	         zorder="99"	         onclick="set(enabled,false); tween(ty|alpha, 8000|0.0, 2.5, easeInQuint, removehotspot(start)); delayedcall(2.0,start_vr());"	         alpha="0.0"	         onloaded="if(vr_start_done === true, removehotspot(start); start_vr(); , tween(alpha,1); );"	         />

    Is it just simply adding webvr.toggleVR(); to the onclick event of the start hotspot?

    Einmal editiert, zuletzt von Ibrendie (22. April 2015 um 22:46)

  • Hi,

    you need at least a click (or touch) to start - because that is required to switch to the fullscreen mode.

    If you want to start directly in VR mode do this:

    - make some kind of intro image or intro screen
    - and take the onclick on it and call the enterVR() action from the WebVR plugin there

    Best regards,
    Klaus

    Hi Klaus,

    Thanks for your reply! I tried the following code, but nothing happens :(

    Code
    <hotspot name="itsamemario" distorted="true"             url="mario.png"             ath="0" atv="0"	         depth="4000"	         vr_timeout="2000"	         zorder="99"             onclick="enterVR();"    />
  • It works perfectly, thank you very much!

    I've one remaining question. How did you achieve the fullscreen black background where you positioned the start_button.png on top of?

    With the fullscreen black background it hides the pano choices screen and really makes it like a splash screen.

    Thanks.

  • I've one remaining question. How did you achieve the fullscreen black background where you positioned the start_button.png on top of?


    Just use a container layer :

    Code
    <layer name="black_bg" type="container" bgcolor="0x000000" bgalpha="1" width="100%" height="100%" align="center"> put your button here </layer>

  • Just use a container layer :

    Code
    put your button here

    I already tried that, and also played with zorder, but the image button isn't shown, only the black background. This is my code:

    Code
    <layer name="black_bg" type="container" bgcolor="0x000000" bgalpha="1.0" width="100%" height="100%" align="center">        <layer name="mario" url="mario.png" align="center" />    </layer>

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!