Timed Events (Hotspots, Layers etc.) in 360 Video

  • Hi there,

    Firstly, I love krPano. The longer I spend on it, the more it impresses me at how much functionality is on offer!

    What I'm trying to do is have time based hotspots or layers, appear as a video is playing.

    Example:
    Let's say I have a 1 minute video playing.
    I might want 1 layer or hotspot to appear at 10 seconds, and a 2nd to appear at 30 seconds. See example code below:


    I've tried using

    Code
    delayedcall();

    however this will execute after the time passes regardless of whether or not the video is playing.
    I want the hotspots to be truly mapped to the video time. Example, If a user pauses the video, they will still not see the hotspots until they arrive at the triggers (10 seconds and 30 seconds as above).


    Code below for ref:

    Code
    <krpano version="1.18" bgcolor="0x000000">
    <layer name="trigger1" zorder="1" onclick="load_scene1" url="hotspot.png" x="50" y="50" visible="false" />
    <layer name="trigger2" zorder="1" onclick="load_scene2" url="hotspot.png" x="300" y="350" visible="false" />
    <plugin name="video"      url.flash="/viewer/plugins/videoplayer.swf"      url.html5="/viewer/plugins/videoplayer.js"      posterurl.ios=""      videourl.ios="/videos/test1.mp4"      posterurl.no-ios=""      videourl.no-ios="/videos/test1.mp4"      playbackrate="1"      pausedonstart="tue"      loop="true"      enabled="false"      zorder="0"      align="center" ox="0" oy="0"/></krpano>


    Any help would be awesome!
    Thanks
    Pete

  • You have to use the plugin read only attribute : plugin[video].time with send the current time

    You can also use the plugin[video].onvideocomplete which is an event to know when video is finished and launch an action (if no loop).

    So you can test the current time into a delayedcall (with identifier) and do some actions and kill the delayedcall when video is complete.

Participate now!

Don’t have an account yet? Register yourself now and be a part of our community!