Skip to content

Commit 9e54437

Browse files
chore: update README (#23)
1 parent f1a7294 commit 9e54437

File tree

1 file changed

+59
-12
lines changed

1 file changed

+59
-12
lines changed

README.md

+59-12
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,17 @@
1414
- [Oculus Rift and HTC Vive Support](#oculus-rift-and-htc-vive-support)
1515
- [Accessing the Camera Position](#accessing-the-camera-position)
1616
- [Accessing THREE.js objects](#accessing-threejs-objects)
17+
- [Options](#options)
18+
- [`forceCardboard`](#forcecardboard)
19+
- [`projection`](#projection)
20+
- [`'360'` or `'Sphere'`](#360-or-sphere)
21+
- [`'Cube'`, `'360_CUBE'`, or `'equirectangular'`](#cube-360_cube-or-equirectangular)
22+
- [`'NONE'`](#none)
23+
- [`'AUTO'`](#auto)
24+
- [`'360_LR'`](#360_lr)
25+
- [`'360_TB'`](#360_tb)
26+
- [`player.mediainfo.projection`](#playermediainfoprojection)
27+
- [`debug`](#debug)
1728
- [Credits](#credits)
1829
- [Support](#support)
1930

@@ -116,36 +127,72 @@ player.vr({projection: 'AUTO'});
116127
## Oculus Rift and HTC Vive Support
117128
This plugin leverages the [webvr-boilerplate](https://github.com/borismus/webvr-boilerplate) project (which in turn uses [webvr-polyfill](https://github.com/borismus/webvr-polyfill) and [three.js](https://github.com/mrdoob/three.js)) to create a 'responsive VR' experience across multiple devices.
118129

119-
Oculus Rift and HTC Vive playback requires Firefox Nightly with the WebVR addon, or experimental WebVR-enabled builds of Chromium. Go to [WebVR.info](http://www.webvr.info) for more info.
130+
Oculus Rift and HTC Vive playback requires Firefox >= 55, experimental WebVR-enabled builds of Chromium, or via Chrome by enabling webvr in `chrome://flags`. Go to [WebVR.info](http://www.webvr.info) for more info.
120131

121132
GearVR playback requires the latest Samsung Internet for Gear VR with WebVR support enabled. Go [here](https://webvr.rocks/samsung_internet) for more info.
122133

123134
## Accessing the Camera Position
124135
The Three.js rotation values are exposed under the property `cameraVector` on the `vr` plugin namespace.
125136

126-
For example, assuming the parent element for Video.js is `#video-container` the following code would return the current `cameraVector` values:
127-
128-
document.getElementById('video-container').player.vr.cameraVector
137+
```js
138+
var player = videojs('my-video');
129139

130-
See `example-camera.html` for a working demo that logs camera object and rotation to the console every second.
140+
player.vr().cameraVector;
141+
```
131142

132143
## Accessing THREE.js objects
133144
The Three.js Scene, renderer, and perspective camera are exposed under the `threeJs` object as the properties `scene`, `renderer`, and `camera` on the `vr` plugin namespace.
134145

135-
For example, assuming the parent element for Video.js is `#video-container` the following code would return the current `camera` object:
146+
```
147+
var player = videojs('my-video');
148+
149+
player.vr().camera;
150+
player.vr().scene;
151+
player.vr().rendeer;
152+
```
153+
154+
## Options
155+
### `forceCardboard`
156+
> Type: `boolean`, default: `false`
157+
158+
Force the cardboard button to display on all devices even if we don't think they support it.
159+
160+
### `projection`
161+
162+
> Type `string`, default: `'auto'`
163+
Can be any of the following:
164+
165+
#### `'360'` or `'Sphere'`
166+
The video is a sphere
167+
168+
#### `'Cube'`, `'360_CUBE'`, or `'equirectangular'`
169+
The video is a cube
170+
171+
#### `'NONE'`
172+
This video is not a 360 video
173+
174+
#### `'AUTO'`
175+
Check `player.mediainfo.projection` to see if the current video is a 360 video.
176+
177+
#### `'360_LR'`
178+
Used for side-by-side 360 videos
179+
180+
#### `'360_TB'`
181+
Used for top-to-bottom 360 videos
136182

137-
document.getElementById('video-container').player.vr.threeJs.camera
183+
### `player.mediainfo.projection`
138184

139-
while:
185+
> type: `string`
140186
141-
document.getElementById('video-container').player.vr.threeJs.scene
187+
This should be set on a source-by-source basis to turn 360 videos on an off depending upon the video.
142188

143-
would return the THREE.js Scene, and:
189+
See [`projection`](#projection) above for information of values. Note that `AUTO` is the same as `NONE` for `player.mediainfo.projection`.
144190

145-
document.getElementById('video-container').player.vr.threeJs.renderer
191+
### `debug`
146192

147-
would return the THREE.js renderer.
193+
> type: `boolean`, default: `false`
148194
195+
Enable debug logging for this plugin
149196

150197
## Credits ##
151198

0 commit comments

Comments
 (0)