{"_id":"@astobie/videojs-vr","_rev":"1-ecd5a6464432d0112a82464810bd36cd","name":"@astobie/videojs-vr","dist-tags":{"latest":"1.5.0"},"versions":{"1.5.0":{"name":"@astobie/videojs-vr","version":"1.5.0","description":"A plugin to add 360 and VR video support to video.js. with custom to support different cube options","author":{"name":"Andrew Stobie","email":"agstobie@gmail.com"},"contributors":[{"name":"James Broberg","email":"james.broberg@metacdn.com"},{"name":"Sean Lawrence","email":"lawrensm@gmail.com"},{"name":"Mitchell Trent","email":"mitch@tofi.com.au"},{"name":"Brandon Casey","email":"branonocasey@gmail.com"}],"license":"Apache-2.0","repository":{"type":"git","url":"git+https://github.com/videojs/videojs-vr.git"},"main":"dist/videojs-vr.cjs.js","module":"dist/videojs-vr.es.js","generator-videojs-plugin":{"version":"7.3.2"},"scripts":{"prebuild":"npm run clean","build":"npm-run-all -p build:*","build:css":"node-sass src/plugin.scss dist/videojs-vr.css --output-style=compressed --linefeed=lf","build:js":"rollup -c scripts/rollup.config.js","build:lang":"vjslang --dir dist/lang","clean":"shx rm -rf ./dist ./test/dist","postclean":"shx mkdir -p ./dist ./test/dist","docs":"npm-run-all docs:*","docs:api":"jsdoc src -g plugins/markdown -r -d docs/api","docs:toc":"doctoc README.md","lint":"vjsstandard","server":"karma start scripts/karma.conf.js --singleRun=false --auto-watch","start":"npm-run-all -p server watch","pretest":"npm-run-all lint build","test":"karma start scripts/karma.conf.js","posttest":"shx cat test/dist/coverage/text.txt","update-changelog":"conventional-changelog -p videojs -i CHANGELOG.md -s","preversion":"npm test","version":"is-prerelease || npm run update-changelog && git add CHANGELOG.md","watch":"npm-run-all -p watch:*","watch:css":"npm run build:css -- -w","watch:js":"npm run build:js -- -w","prepublishOnly":"npm run build && vjsverify"},"keywords":["videojs","videojs-plugin"],"vjsstandard":{"ignore":["dist","docs","test/dist"]},"greenkeeper":{"ignore":["three"]},"dependencies":{"global":"^4.3.2","three":"0.93.0","video.js":"^6 || ^7","webvr-polyfill":"0.10.6"},"devDependencies":{"conventional-changelog-cli":"^2.0.1","conventional-changelog-videojs":"^3.0.0","doctoc":"^1.3.1","husky":"^1.0.0-rc.13","jsdoc":"git+https://github.com/BrandonOCasey/jsdoc.git#feat/plugin-from-cli","karma":"^3.0.0","lint-staged":"^7.2.2","node-sass":"^4.5.3","not-prerelease":"^1.0.1","npm-merge-driver-install":"^1.0.0","npm-run-all":"^4.1.3","pkg-ok":"^2.2.0","postcss-cli":"^6.0.0","rollup":"^0.66.0","rollup-plugin-re":"^1.0.6","shx":"^0.3.2","sinon":"^6.1.5","videojs-generate-karma-config":"~3.0.0","videojs-generate-postcss-config":"~2.0.1","videojs-generate-rollup-config":"~2.2.0","videojs-languages":"^1.0.0","videojs-standard":"~7.1.0","videojs-generator-verify":"~1.0.3"},"browserslist":["defaults","ie 11"],"lint-staged":{"*.js":["vjsstandard --fix","git add"],"README.md":["npm run docs:toc","git add"]},"husky":{"hooks":{"pre-commit":"lint-staged"}},"gitHead":"2c4b09c05dd8dd67ed50aade2159032582cf0a16","bugs":{"url":"https://github.com/videojs/videojs-vr/issues"},"homepage":"https://github.com/videojs/videojs-vr#readme","_id":"@astobie/videojs-vr@1.5.0","_npmVersion":"5.8.0","_nodeVersion":"10.10.0","_npmUser":{"name":"astobie","email":"agstobie@gmail.com"},"dist":{"integrity":"sha512-zaZQSAt41+UMivTswNJd0XmXToh/JMd6YgC1BAAPP8uf8fwQvrXGMuHD805dCD+WGrqTNG6kAQ+Vtwl50KzrjA==","shasum":"74dcb5b0adaab1393068fa11b0fb57d42ba20655","tarball":"https://registry.npmjs.org/@astobie/videojs-vr/-/videojs-vr-1.5.0.tgz","fileCount":26,"unpackedSize":6322445,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbpWa/CRA9TVsSAnZWagAAYWYP/0WfQXiLwGDYvcFhlDJ1\nJefW8z6PfZfxWRetpVE1HproNHbZHEUEYmYq4dUdKaVm9CZ+5sdg2DC9oMQP\n38SKLyCl1iDAtXVwo1xA913Yd5ZKoSQCJwnBtYD3gDLy3wLZLjTZyE6jjy8e\nAKUJm2DteY550mh3dBhowMSQr6WTRB5iqhczVvEHX67NyVFV1DlFGiuvDjIK\nF5kjoSukWnRuKMdBiPoSjObRFK3sSI0BnjdlMcP52Il1Fwhv1F4++WyUHZSU\nlljqShfVxxJ70JhkZtm/NIVa4VLIiAmJIzw6V6snhZqZWnwH8ZO9pDBNIhcc\n5RwbEvkzx81VdZ7N6QVolFG4ipyP6ZIZMBYju9xNt6BzXDws37Lb/7QDXd1Q\nj/d9GnEldGvMNj4BdHRxF4cYWIRnl7Sp+j1wYbdwLtCGXdy1LIUasEV3VGRk\nzAI/XLUd6Z4PN41vkO7Du14PC4YVvGD+cA1LBx98h/JEScsBNygt0y/KUFPh\nbjCHvFzLJAYUOAyLUblOenZFOy0vxx4ruE/3UC3phgWy3fOTCti1FzMLxkma\nGr69YsJ5uhatk0o0ST9c71Q1ROZd3uLSXxB49vlRwBBtLbBJOCO97dPM19OV\ntmgAvL3iVTT5YtDN3vjn57OJHjrUr5zMQ8yq9ZtWKCQi+4rOARxl8KAGnu3p\nVLZy\r\n=eWme\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD797JS0HFGs2jbxELkCJh2oUcpyg9RlFYh9kEoU8Ny9wIhAMV5UGT++D4c8swIAnCJlcUwC1E9Ad5J6N6zuW4SfMAQ"}]},"maintainers":[{"name":"astobie","email":"agstobie@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/videojs-vr_1.5.0_1537566397835_0.3298089883895463"},"_hasShrinkwrap":false}},"time":{"created":"2018-09-21T21:46:37.672Z","1.5.0":"2018-09-21T21:46:38.699Z","modified":"2022-04-04T15:53:23.313Z"},"maintainers":[{"name":"astobie","email":"agstobie@gmail.com"}],"description":"A plugin to add 360 and VR video support to video.js. with custom to support different cube options","homepage":"https://github.com/videojs/videojs-vr#readme","keywords":["videojs","videojs-plugin"],"repository":{"type":"git","url":"git+https://github.com/videojs/videojs-vr.git"},"contributors":[{"name":"James Broberg","email":"james.broberg@metacdn.com"},{"name":"Sean Lawrence","email":"lawrensm@gmail.com"},{"name":"Mitchell Trent","email":"mitch@tofi.com.au"},{"name":"Brandon Casey","email":"branonocasey@gmail.com"}],"author":{"name":"Andrew Stobie","email":"agstobie@gmail.com"},"bugs":{"url":"https://github.com/videojs/videojs-vr/issues"},"license":"Apache-2.0","readme":"# VR\n\n[![Build Status](https://travis-ci.org/videojs/videojs-vr.svg?branch=master)](https://travis-ci.org/videojs/videojs-vr)\n[![Greenkeeper badge](https://badges.greenkeeper.io/videojs/videojs-vr.svg)](https://greenkeeper.io/)\n[![Slack Status](http://slack.videojs.com/badge.svg)](http://slack.videojs.com)\n\n[![NPM](https://nodei.co/npm/videojs-vr.png?downloads=true&downloadRank=true)](https://nodei.co/npm/videojs-vr/)\n\nA video.js plugin that turns a video element into a HTML5 Panoramic 360 video player. Project video onto different shapes. Optionally supports Oculus Rift, HTC Vive and the GearVR.\n\nLead Maintainer: Brandon Casey [@brandonocasey](https://github.com/brandonocasey)\n\nMaintenance Status: Stable\n\n<!-- START doctoc generated TOC please keep comment here to allow auto update -->\n<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->\n\n\n- [Installation](#installation)\n- [Browser Support](#browser-support)\n- [Projection support](#projection-support)\n  - [`<script>` Tag](#script-tag)\n  - [Browserify/CommonJS](#browserifycommonjs)\n  - [RequireJS/AMD](#requirejsamd)\n  - [Optional integration with videojs-errors](#optional-integration-with-videojs-errors)\n- [Setting a global projection](#setting-a-global-projection)\n  - [Passing a projection on a source by source basis](#passing-a-projection-on-a-source-by-source-basis)\n- [Oculus Rift and HTC Vive Support](#oculus-rift-and-htc-vive-support)\n- [Accessing the Camera Position](#accessing-the-camera-position)\n- [Accessing THREE.js objects](#accessing-threejs-objects)\n- [Options](#options)\n  - [`forceCardboard`](#forcecardboard)\n  - [`motionControls`](#motioncontrols)\n  - [`projection`](#projection)\n    - [`'360'`, `'Sphere'`, or `'equirectangular'`](#360-sphere-or-equirectangular)\n    - [`'Cube'` or `'360_CUBE'`](#cube-or-360_cube)\n    - [`'NONE'`](#none)\n    - [`'AUTO'`](#auto)\n    - [`'360_LR'`](#360_lr)\n    - [`'360_TB'`](#360_tb)\n  - [`player.mediainfo.projection`](#playermediainfoprojection)\n  - [`debug`](#debug)\n- [Credits](#credits)\n- [Support](#support)\n\n<!-- END doctoc generated TOC please keep comment here to allow auto update -->\n\n## Installation\n\n```sh\nnpm install --save videojs-vr\n```\n\n## Browser Support\nThe most recent versions of:\n* Desktop\n  * Chrome\n  * Firefox\n  * Safari\n* Mobile\n  * Chrome on Andriod\n  * Safari on iOS\n\n## Projection support\nCurrently we only support:\n* Projections\n  * Spherical Videos, via the 360/equirectangular projection\n  * 360 cube videos\n* Mappings\n  * Monoscopic (single video pane)\n  * Stereoscopic (dual video pane for both eyes) via the cardboard button\n## Usage\n\nTo include videojs-vr on your website or web application, use any of the following methods.\n\n### `<script>` Tag\n\nThis is the simplest case. Get the script in whatever way you prefer and include the plugin _after_ you include [video.js][videojs], so that the `videojs` global is available.\n\n```html\n<script src=\"//path/to/video.min.js\"></script>\n<script src=\"//path/to/videojs-vr.min.js\"></script>\n<script>\n  var player = videojs('my-video');\n\n  player.vr();\n</script>\n```\n\n### Browserify/CommonJS\n\nWhen using with Browserify, install videojs-vr via npm and `require` the plugin as you would any other module.\n\n```js\nvar videojs = require('video.js');\n\n// The actual plugin function is exported by this module, but it is also\n// attached to the `Player.prototype`; so, there is no need to assign it\n// to a variable.\nrequire('videojs-vr');\n\nvar player = videojs('my-video');\n\nplayer.vr({projection: '360'});\n```\n\n### RequireJS/AMD\n\nWhen using with RequireJS (or another AMD library), get the script in whatever way you prefer and `require` the plugin as you normally would:\n\n```js\nrequire(['video.js', 'videojs-vr'], function(videojs) {\n  var player = videojs('my-video');\n\n  player.vr({projection: '360'});\n});\n```\n\n### Optional integration with videojs-errors\nIf the [videojs-errors](https://github.com/brightcove/videojs-errors) plugin is intialized before `videojs-vr`, then it will be used to display errors to users.\n\n## Setting a global projection\nIf you are only going to be playing 360 videos you can set the global plugin projection like so:\n\n```js\n\nvar player = videojs('my-video');\n\nplayer.vr({projection: '360'});\n\n// or change player.vr.defaultProjection\n// and call player.vr.initScene again\n\n```\n\n### Passing a projection on a source by source basis\nSet `player.mediainfo` and `player.mediainfo.projection` to a valid projection value and pass in 'AUTO' or nothing for the `projection` key when initializing this plugin.\nEX:\n```js\nvar player = videojs('my-video');\n\nif (!player.mediainfo) {\n  player.mediainfo = {};\n}\n\nif (!player.mediainfo.projection) {\n  player.mediainfo.projection = '360';\n}\n\nplayer.vr({projection: 'AUTO'});\n\n// or player.vr(); since 'AUTO' is the default\n```\n\n## Oculus Rift and HTC Vive Support\nThis project leverages the [webvr-polyfill](https://github.com/borismus/webvr-polyfill) and [three.js](https://github.com/mrdoob/three.js) libraries to create a 'responsive VR' experience across multiple devices.\n\nOculus 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.\n\nGearVR playback requires the latest Samsung Internet for Gear VR with WebVR support enabled. Go [here](https://webvr.rocks/samsung_internet) for more info.\n\n## Accessing the Camera Position\nThe Three.js rotation values are exposed under the property `cameraVector` on the `vr` plugin namespace.\n\n```js\nvar player = videojs('my-video');\n\nplayer.vr().cameraVector;\n```\n\n## Accessing THREE.js objects\nThe 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.\n\n```\nvar player = videojs('my-video');\n\nplayer.vr().camera;\nplayer.vr().scene;\nplayer.vr().rendeer;\n```\n\n## Options\n### `forceCardboard`\n> Type: `boolean`, default: `false`\n\nForce the cardboard button to display on all devices even if we don't think they support it.\n\n### `motionControls`\n> Type: `boolean`, default: `true on ios and andriod`\n\nWhether motion/gyro controls should be enabled.\n\n### `projection`\n\n> Type `string`, default: `'auto'`\nCan be any of the following:\n\n#### `'360'`, `'Sphere'`, or `'equirectangular'`\nThe video is a sphere\n\n#### `'Cube'` or `'360_CUBE'`\nThe video is a cube\n\n#### `'NONE'`\nThis video is not a 360 video\n\n#### `'AUTO'`\nCheck `player.mediainfo.projection` to see if the current video is a 360 video.\n\n#### `'360_LR'`\nUsed for side-by-side 360 videos\n\n#### `'360_TB'`\nUsed for top-to-bottom 360 videos\n\n### `player.mediainfo.projection`\n\n> type: `string`\n\nThis should be set on a source-by-source basis to turn 360 videos on an off depending upon the video.\n\nSee [`projection`](#projection) above for information of values. Note that `AUTO` is the same as `NONE` for `player.mediainfo.projection`.\n\n### `debug`\n\n> type: `boolean`, default: `false`\n\nEnable debug logging for this plugin\n\n## Credits ##\n\nThis project is a conglomeration of a few amazing open source libraries.\n\n* [VideoJS](http://www.videojs.com)\n* [Three.js](http://threejs.org)\n* [webvr-polyfill](https://github.com/borismus/webvr-polyfill)\n\n## Support ##\nThis work is sponsored by [Brightcove](https://www.brightcove.com), [HapYak](http://corp.hapyak.com/) and [StreamShark](https://streamshark.io)\n","readmeFilename":"README.md"}