Skip to content
This repository was archived by the owner on Dec 6, 2018. It is now read-only.

Support of VR180 #326

Open
niveuseverto wants to merge 2 commits into
base: master
Choose a base branch
from
Open

Support of VR180 #326

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
0d2a1aa
SideBySide and VR180 Support
niveuseverto Oct 2, 2018
f7fb812
Update README
niveuseverto Oct 2, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,8 @@ Name | Type | Parameter description
`height` | String | String value for the iframe's height attribute.
`preview` | String | (Optional) URL to a preview image for a 360° image file.
`is_stereo` | Boolean | (Optional) Indicates whether the content at the image or video URL is stereo or not.
`is_sbs` | Boolean | (Optional) Indicates whether the content at image or video URL is Side-By-Side or Over-Under. Defaults to Over-Under (false).
`is_180` | Boolean | (Optional) Indicates whether the content at image or video URL is VR180 or VR360. Defaults to VR360 (false).
`is_debug` | Boolean | (Optional) When true, turns on debug features like rendering hotspots ad showing the FPS meter.
`is_vr_off` | Boolean | (Optional) When true, disables the VR mode button.
`is_autopan_off` | Boolean | (Optional) When true, disables the autopan introduction on desktop.
Expand Down
6 changes: 5 additions & 1 deletion src/embed/scene-info.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,9 @@ var CAMEL_TO_UNDERSCORE = {
isDebug: 'is_debug',
isVROff: 'is_vr_off',
isAutopanOff: 'is_autopan_off',
hideFullscreenButton: 'hide_fullscreen_button'
hideFullscreenButton: 'hide_fullscreen_button',
isSideBySide: 'is_sbs',
is180: 'is_180'
};

/**
Expand All @@ -48,6 +50,8 @@ function SceneInfo(opt_params) {
this.defaultYaw = THREE.Math.degToRad(params.defaultYaw || 0);

this.isStereo = Util.parseBoolean(params.isStereo);
this.isSideBySide = Util.parseBoolean(params.isSideBySide);
this.is180 = Util.parseBoolean(params.is180);
this.isYawOnly = Util.parseBoolean(params.isYawOnly);
this.isDebug = Util.parseBoolean(params.isDebug);
this.isVROff = Util.parseBoolean(params.isVROff);
Expand Down
22 changes: 15 additions & 7 deletions src/embed/sphere-renderer.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,8 @@ SphereRenderer.prototype.setPhotosphere = function(src, opt_params) {
var params = opt_params || {};

this.isStereo = !!params.isStereo;
this.isSideBySide = !!params.isSideBySide;
this.is180 = !!params.is180;
this.src = src;

// Load texture.
Expand All @@ -52,14 +54,16 @@ SphereRenderer.prototype.setPhotosphere = function(src, opt_params) {
/**
* @return {Promise} Yeah.
*/
SphereRenderer.prototype.set360Video = function (videoElement, videoType, opt_params) {
SphereRenderer.prototype.setVideo = function (videoElement, videoType, opt_params) {
return new Promise(function(resolve, reject) {
this.resolve = resolve;
this.reject = reject;

var params = opt_params || {};

this.isStereo = !!params.isStereo;
this.isSideBySide = !!params.isSideBySide;
this.is180 = !!params.is180;

// Load the video texture.
var videoTexture = new THREE.VideoTexture(videoElement);
Expand Down Expand Up @@ -110,8 +114,13 @@ SphereRenderer.prototype.onTextureLoaded_ = function(texture) {
var sphereLeft;
var sphereRight;
if (this.isStereo) {
sphereLeft = this.createPhotosphere_(texture, {offsetY: 0.5, scaleY: 0.5});
sphereRight = this.createPhotosphere_(texture, {offsetY: 0, scaleY: 0.5});
if (this.isSideBySide) {
sphereLeft = this.createPhotosphere_(texture, {offsetX: 0.5, scaleX: 0.5});
sphereRight = this.createPhotosphere_(texture, {offsetX: 0, scaleX: 0.5});
} else {
sphereLeft = this.createPhotosphere_(texture, {offsetY: 0.5, scaleY: 0.5});
sphereRight = this.createPhotosphere_(texture, {offsetY: 0, scaleY: 0.5});
}
} else {
sphereLeft = this.createPhotosphere_(texture);
sphereRight = this.createPhotosphere_(texture);
Expand All @@ -125,8 +134,7 @@ SphereRenderer.prototype.onTextureLoaded_ = function(texture) {
sphereRight.eye = Eyes.RIGHT;
sphereRight.name = 'eyeRight';


this.scene.getObjectByName('photo').children = [sphereLeft, sphereRight];
this.scene.getObjectByName('photo').children = [sphereLeft, sphereRight];

this.resolve();
};
Expand All @@ -142,8 +150,8 @@ SphereRenderer.prototype.createPhotosphere_ = function(texture, opt_params) {
p.scaleY = p.scaleY || 1;
p.offsetX = p.offsetX || 0;
p.offsetY = p.offsetY || 0;
p.phiStart = p.phiStart || 0;
p.phiLength = p.phiLength || Math.PI * 2;
p.phiStart = p.phiStart || this.is180 ? Math.PI * 0.5 : 0;
p.phiLength = p.phiLength || Math.PI * (this.is180 ? 1 : 2);
p.thetaStart = p.thetaStart || 0;
p.thetaLength = p.thetaLength || Math.PI;

Expand Down
4 changes: 3 additions & 1 deletion src/embed/world-renderer.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -83,6 +83,8 @@ WorldRenderer.prototype.setScene = function(scene) {

var params = {
isStereo: scene.isStereo,
isSideBySide: scene.isSideBySide,
is180: scene.is180,
loop: scene.loop,
volume: scene.volume,
muted: scene.muted
Expand Down Expand Up @@ -142,7 +144,7 @@ WorldRenderer.prototype.setScene = function(scene) {
} else {
this.player = new AdaptivePlayer(params);
this.player.on('load', function(videoElement, videoType) {
self.sphereRenderer.set360Video(videoElement, videoType, params).then(function() {
self.sphereRenderer.setVideo(videoElement, videoType, params).then(function() {
self.didLoad_({videoElement: videoElement});
}).catch(self.didLoadFail_.bind(self));
});
Expand Down