Beiträge von oscar.vanderleij

Solved it by using a plugin for iOS devices and a plugin for non-iOS devices.

<!-- a button to pause/play the sound (iOS devices) -->
<plugin devices="ios" name="snd" url="soundonoff.png" align="leftbottom" x="10" y="10" alpha="0.5" scale="0.5" onover="tween(alpha,1);" onout="tween(alpha,0.5);"
crop="0|50|50|50"
onclick="pausesoundtoggle(bgsnd); switch(crop, 0|50|50|50, 0|0|50|50);"
/>


<!-- a button to pause/play the sound (non iOS devices) -->
<plugin devices="!ios" name="snd" url="soundonoff.png" align="leftbottom" x="10" y="10" alpha="0.5" scale="0.5" onover="tween(alpha,1);" onout="tween(alpha,0.5);"
crop="0|0|50|50"
onclick="pausesoundtoggle(bgsnd); switch(crop, 0|0|50|50, 0|50|50|50);"
/>

The background sound example also shows the same behavior on iOS:
https://krpano.com/examples/119/k…groundsound.xml

The sound icon is 'on' when the sound is initially not playing and the sound icon is 'off' when the sound starts playing on the first user interaction.

I'm using the soundinterface to play a sound.

<events name="currentpano"
onnewpano="playsound(bgsnd, 'assets/sound.mp3|assets/sound.ogg', 0);"
onremovepano="stopsound(bgsnd);"
/>


<plugin name="snd" url="soundonoff.png" align="leftbottom" x="10" y="10" alpha="0.5" scale="0.5" onover="tween(alpha,1);" onout="tween(alpha,0.5);"
crop="0|0|50|50"
onclick="pausesoundtoggle(bgsnd); switch(crop, 0|0|50|50, 0|50|50|50);"
/>

From the HTML5 and iOS (iPhone / iPad) Notes I read:
A sound can't start to play automatically! An user interaction is needed to start playing the sound, e.g. a touch on the screen by the user. The krpano soundinterface plugin automatically detects that situations and when the playing is not possible it automatically queues the playsound() command and waits for the next user interaction to start the sound automatically (e.g. when the user touches the screen to pan the pano or to click a button).

This results on iOS that when there is no sound the "sound on" icon is visible and when the user taps the sound icon the sounds starts playing but the "sound off" icon is displayed. This is the opposite of what I want and how it works on other devices.

How can I invert the crop state on iOS devices or even better make it depend on whether the sound is playing or not?

Issues seems to fix again when self explaining them

Just needed to add an id to the embedpano and use the same for removepano.

embedpano({swf: 'vendors/krpano/video.swf', xml: 'vendors/krpano/video.xml', target: 'pano', mobilescale: 1.0, passQueryParameters: true, id: 'my_video'})

removepano('my_video')

I'm playing a video using the video plugin without sound to be able to directly play the video in iOS. For the sound I'm using the soundinterface plugin.

The problem is the sound does not stop when I'm calling removepano('pano') and using in the XML file:

<events name="currentpano" onnewpano="playsound(bgsnd, 'assets/sound.mp3', 0);" onremovepano="stopsound(bgsnd);"/>

The full xml file content:

<krpano>


<plugin name="gyro" devices="html5"
url="plugins/gyro2.js"
enabled="true"
camroll="true"
friction="0.0"
touch_mode="full"
sensor_mode="1"
softstart="0.5"
autocalibration="false"
onavailable=""
onunavailable=""
onenable=""
ondisable=""
mute="true"
/>


<plugin name="soundinterface"
url.flash="plugins/soundinterface.swf"
url.html5="plugins/soundinterface.js"
preload="true"
rootpath=""
volume="1.0"
/>


	<!-- start playing the sound -->
	<events name="currentpano"
onnewpano="playsound(bgsnd, 'assets/sound.mp3', 0);"
onremovepano="stopsound(bgsnd);"
/>


	<!-- a button to pause/play the sound -->
	<plugin name="snd" url="soundonoff.png" align="leftbottom" x="10" y="10" alpha="0.5" scale="0.5" onover="tween(alpha,1);" onout="tween(alpha,0.5);"
crop="0|0|50|50"
onclick="pausesoundtoggle(bgsnd); switch(crop, 0|0|50|50, 0|50|50|50);"
/>


<!-- pano -->
<!-- include the videoplayer plugin -->
<plugin name="video"
url.flash="plugins/videoplayer.swf"
url.html5="plugins/videoplayer.js"
videourl="assets/video.m4v|assets/video.webm"
panovideo="true"
loop="true"
/>


<!-- define the pano image and refer to the videoplayer plugin -->
<image>
<sphere url="plugin:video" />
</image>


<!-- view/fov settings -->
<view hlookat="0" vlookat="0" fovtype="VFOV" fov="90" fovmin="30" fovmax="150" />


</krpano>

I've updated to krpano 1.19-pr14 (build 2017-12-01), krpano 1.19-pr14 Sound Interface Plugin (build 2017-12-01) and krpano 1.19-pr14 Videoplayer Plugin (build 2017-12-01).

I have it working in React by having the krpano container outside the React app container.

<div id="app"></div><div id="pano"></div>

When calling the embedpano method it loads the 360 video / photo.

I only have an issue with my single page application. When I route to the next page having the 360 video it gives a "FATAL ERROR: LICENSE ERROR - WRONG DOMAIN". When I refresh the page it does work without error.

Trying a quick and dirty workaround by reloading the page once, but a more solid solution is appreciated