This example demonstrates controlling the rotation of the video with api controls.
This is an auto rotation which uses the same friction setting as the key board controls using keyDamping
function app() {
return {
init() {
//do init stuff here
},
moveLeft() {
player.moveLeft();
},
moveRight() {
player.moveRight();
},
moveUp() {
player.moveUp();
},
moveDown() {
player.moveDown();
},
toggleVR() {
player.toggleVR();
},
getOrientationAngles(e) {
console.log(player.getOrientationAngles());
}
}
}
<div class="flex flex-col w-full">
<div id="api" class=""></div>
</div>
<script type="text/javascript">
var player = flowplayer("#api", {
"src": [
{
"src": "//videos.electroteque.org/360/ultra_light_flight_720p.webm",
"type": "video/webm"
},
{
"src": "//videos.electroteque.org/360/ultra_light_flight_720p.mp4",
"type": "video/mp4"
},
{
"src": "//videos.electroteque.org/360/ultra_light_flight_720p.ogv",
"type": "video/ogg"
}
],
"token": "eyJraWQiOiIyeHRpc0Q5NHZzTjIiLCJ0eXAiOiJKV1QiLCJhbGciOiJFUzI1NiJ9.eyJjIjoie1wiYWNsXCI6NixcImlkXCI6XCIyeHRpc0Q5NHZzTjJcIixcImRvbWFpblwiOltcImVsZWN0cm90ZXF1ZS5vcmdcIl19IiwiaXNzIjoiRmxvd3BsYXllciJ9.WLUkZHpDNoaXWDaFO2V5UfXm7SnDvE1pFAM0e7ppnFovOSyCCZM-b8gQNBSElB5yirTP__x76Qyo8pMWh6lVrw",
"vrvideo": {}
});
</script>
