videohotspots exclude from mobiles
Posted: Mon Dec 18, 2017 12:58 pm
is it possible to tag the videohotspots (the thing that is placed from the tour browser) to hide on mobiles?
If it looks like this it's a pinned video.how can I tel which is which.
You can use the same detect technique as we discussed in viewtopic.php?f=6&t=12496 but with Android included in the list of devices to detect. As the pinned hotspots don't require specific skin elements all you have to do is to copy the pano.xml, rename it to pano-novideo.xml, remove the 'media' tag from each 'panorama id' and then use the detect code to select it when it detects a mobile device. All mobile devices (within the scope of the detection) will not show the videos, desktops will.is it possible to tag the videohotspots to hide on mobiles?
Code: Select all
<!-- - - - - - - 8<- - - - - - cut here - - - - - 8<- - - - - - - -->
<script type="text/javascript" src="pano2vr_player.js">
</script>
<script type="text/javascript" src="skin.js">
</script>
<div id="container" style="width:100%;height:100%;overflow:hidden;">
<br>Loading...<br><br>
This content requires HTML5 with CSS3 3D Transforms or WebGL.
</div>
<script type="text/javascript">
// create the panorama player with the container
pano=new pano2vrPlayer("container");
// add the skin object
skin=new pano2vrSkin(pano);
// load the configuration
window.addEventListener("load", function() {
pano.readConfigUrlAsync("pano.xml");
});
</script>
<script type="text/javascript">
var detect = (function detect() {
function isiPhone() {
return navigator.userAgent.match(/iPhone/i) != null;
}
function isiPad() {
return navigator.userAgent.match(/iPad/i) != null;
}
return {
isiPhone: isiPhone(),
isiPad: isiPad()
};
})();
var deferredLoad = (function deferredLoad() {
function javascript(file, cb) {
var scr = document.createElement("script");
scr.setAttribute("type", "text/javascript");
scr.setAttribute("src", file);
scr.onload = cb;
document.head.appendChild(scr);
}
return {
javascript: javascript
};
})();
if (ggHasHtml5Css3D() || ggHasWebGL()) { // check for CSS3 3D transformations and WebGL
var loadPano = (function () {
// create the panorama player with the container
pano=new pano2vrPlayer("container");
// add the skin object
skin=new pano2vrSkin(pano);
// load the configuration
window.addEventListener("load", function() {
pano.readConfigUrlAsync("pano.xml",function() { gyro=new pano2vrGyro(pano,"container"); gyro.disable();});
});
// Deliver the correct skin and images
if (detect.isiPhone) {
pano=new pano2vrPlayer("container");
skin=new pano2vrSkin(pano);
pano.readConfigUrl("pano_iphone.xml");
} else if (detect.isiPad) {
pano=new pano2vrPlayer("container");
skin=new pano2vrSkin(pano);
pano.readConfigUrl("pano.xml");
} else {
pano=new pano2vrPlayer("container");
skin=new pano2vrSkin(pano);
pano.readConfigUrl("pano_iphone.xml");
}
hideUrlBar();
});
if (detect.isiPhone)
deferredLoad.javascript("skin_iphone.js", loadPano);
else if (detect.isiPad)
deferredLoad.javascript("skin_iphone.js", loadPano);
else
deferredLoad.javascript("skin.js", loadPano);
} else {
// no html5 support..
document
.getElementById("container").innerHTML = "Your web browser does not support HTML5.";
}
</script>
<noscript>
<p><b>Please enable Javascript!</b></p>
</noscript>
<!-- - - - - - - 8<- - - - - - cut here - - - - - 8<- - - - - - - -->
Code: Select all
<!-- - - - - - - 8<- - - - - - cut here - - - - - 8<- - - - - - - -->
<script type="text/javascript" src="pano2vr_player.js"></script>
<script type="text/javascript" src="pano2vrgyro.js"></script>
<div id="container" style="width:100%;height:100%;overflow:hidden;">
</div>
<script type="text/javascript">
var detect = (function detect() {
function isiPhone() {
return navigator.userAgent.match(/iPhone/i) != null;
}
function isiPad() {
return navigator.userAgent.match(/iPad/i) != null;
}
return {
isiPhone: isiPhone(),
isiPad: isiPad()
};
})();
var deferredLoad = (function deferredLoad() {
function javascript(file, cb) {
var scr = document.createElement("script");
scr.setAttribute("type", "text/javascript");
scr.setAttribute("src", file);
scr.onload = cb;
document.head.appendChild(scr);
}
return {
javascript: javascript
};
})();
if (ggHasHtml5Css3D() || ggHasWebGL()) { // check for CSS3 3D transformations and WebGL
var loadPano = (function () {
// create the panorama player with the container
pano=new pano2vrPlayer("container");
// add the skin object
skin=new pano2vrSkin(pano);
// Deliver the correct skin and images
if (detect.isiPhone) {
pano=new pano2vrPlayer("container");
skin=new pano2vrSkin(pano);
pano.readConfigUrl("ios.xml");
} else if (detect.isiPad) {
pano=new pano2vrPlayer("container");
skin=new pano2vrSkin(pano);
pano.readConfigUrl("ios.xml");
} else {
pano=new pano2vrPlayer("container");
skin=new pano2vrSkin(pano);
pano.readConfigUrl("pano.xml");
}
hideUrlBar();
});
if (detect.isiPhone)
deferredLoad.javascript("ios_skin.js", loadPano);
else if (detect.isiPad)
deferredLoad.javascript("ios_skin.js", loadPano);
else
deferredLoad.javascript("skin.js", loadPano);
} else {
// no html5 support..
document
.getElementById("container").innerHTML = "Your web browser does not support HTML5.";
}
</script>
<noscript>
<p><b>Please enable Javascript!</b></p>
</noscript>
<!-- - - - - - - 8<- - - - - - cut here - - - - - 8<- - - - - - - -->
Great news!PUH, GOT iT. Santa, I'm coming!
Anytime mate, glad I could help.And thanks again, Tony, I owe you quite a couple of beers.
Every successful person travels a painful journey. Suffering is an integral and essential part of any real pursuit of successWell, to be honest, my life would have been less painful if the code in the sample you had given me initially would have been correct
Glad it worked for you, wasn't aware you were under a deadlineAs you mentioned earlier it contains a few lines that don't belong there. I even could narrow it down to the culprit, but as I have no idea about java script I wasn't able to fix it myself. Luckily I received your correction in time
The code example in the other thread viewtopic.php?f=6&t=12496 works perfectly for that project, there is nothing wrong with the code if you use the same .xml structure. It's only when you use the default pano.xml do you need to change it. That said I have updated the project to avoid confusion.But maybe you want to fix the source also for other if they stumble upon it from the other thread.