{"id":14385035,"url":"https://github.com/immersive-web/webvr-polyfill","last_synced_at":"2025-12-12T03:31:58.582Z","repository":{"id":26631472,"uuid":"30087179","full_name":"immersive-web/webvr-polyfill","owner":"immersive-web","description":"Use WebVR today, without requiring a special browser build.","archived":false,"fork":false,"pushed_at":"2021-01-15T09:13:05.000Z","size":13538,"stargazers_count":1406,"open_issues_count":30,"forks_count":323,"subscribers_count":134,"default_branch":"main","last_synced_at":"2025-05-09T00:34:04.272Z","etag":null,"topics":["polyfill","webvr","webxr"],"latest_commit_sha":null,"homepage":"http://immersive-web.github.io/webvr-polyfill/examples/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/immersive-web.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":".github/CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":".github/CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-01-30T19:23:46.000Z","updated_at":"2025-05-04T15:24:07.000Z","dependencies_parsed_at":"2022-06-29T10:51:29.939Z","dependency_job_id":null,"html_url":"https://github.com/immersive-web/webvr-polyfill","commit_stats":null,"previous_names":["googlevr/webvr-polyfill","borismus/webvr-polyfill"],"tags_count":64,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/immersive-web%2Fwebvr-polyfill","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/immersive-web%2Fwebvr-polyfill/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/immersive-web%2Fwebvr-polyfill/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/immersive-web%2Fwebvr-polyfill/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/immersive-web","download_url":"https://codeload.github.com/immersive-web/webvr-polyfill/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254190396,"owners_count":22029632,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["polyfill","webvr","webxr"],"created_at":"2024-08-28T18:01:52.944Z","updated_at":"2025-12-12T03:31:53.543Z","avatar_url":"https://github.com/immersive-web.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"# WebVR Polyfill\n\n[![Build Status](http://img.shields.io/travis/immersive-web/webvr-polyfill.svg?style=flat-square)](https://travis-ci.org/immersive-web/webvr-polyfill)\n[![Build Status](http://img.shields.io/npm/v/webvr-polyfill.svg?style=flat-square)](https://www.npmjs.org/package/webvr-polyfill)\n\nA JavaScript implementation of the [WebVR spec][spec]. This project ensures\nyour WebVR content works on any platform, whether or not the browser/device has\nnative WebVR support, or when there are inconsistencies in implementation.\n\nTake a look at [basic WebVR samples][samples] that use this polyfill.\n\n## Installing\n\n### Script\n\nDownload the build at [build/webvr-polyfill.js](build/webvr-polyfill.js) and include it as a script tag,\nor use a CDN. You can also use the minified file in the same location as `webvr-polyfill.min.js`.\n\n```html\n  \u003cscript src='webvr-polyfill.js'\u003e\u003c/script\u003e\n  \u003c!-- or use a link to a CDN --\u003e\n  \u003cscript src='https://cdn.jsdelivr.net/npm/webvr-polyfill@latest/build/webvr-polyfill.js'\u003e\u003c/script\u003e\n```\n\n### npm\n\nIf you're using a build tool like [browserify] or [webpack], install it via [npm].\n\n```\n$ npm install --save webvr-polyfill\n```\n\n## Using\n\nInstructions for using versions `\u003e=0.10.0`. For `\u003c=0.9.x` versions, see [0.9.40 tag](https://github.com/immersive-web/webvr-polyfill/tree/v0.9.40).\n\nThe webvr-polyfill exposes a single constructor, `WebVRPolyfill` that takes an\nobject for configuration. See full configuration options at [src/config.js](src/config.js).\n\nBe sure to instantiate the polyfill before calling any of your VR code! The\npolyfill needs to patch the API if it does not exist so your content code can\nassume that the WebVR API will just work.\n\nIf using script tags, a `WebVRPolyfill` global constructor will exist.\n\n```js\nvar polyfill = new WebVRPolyfill();\n```\n\nIn a modular ES6 world, import and instantiate the constructor similarly.\n\n```js\nimport WebVRPolyfill from 'webvr-polyfill';\nconst polyfill = new WebVRPolyfill();\n```\n\nHere's an example of querying displays and setting up controls based on\nenvironment. Remember, you'll still need to provide controls and code\nto support a desktop-like experience if no native VRDisplays are found,\nas the CardboardVRDisplay is only on mobile. See the [example](examples/index.html).\n\n```js\n// Polyfill always provides us with `navigator.getVRDisplays`\nnavigator.getVRDisplays().then(displays =\u003e {\n  // If we have a native VRDisplay, or if the polyfill\n  // provided us with a CardboardVRDisplay, use it\n  if (displays.length) {\n    vrDisplay = displays[0];\n    controls = new THREE.VRControls(camera);\n    vrDisplay.requestAnimationFrame(animate);\n  } else {\n    // If we don't have a VRDisplay, we're probably on\n    // a desktop environment, so set up desktop-oriented controls\n    controls = new THREE.OrbitControls(camera);\n    requestAnimationFrame(animate);\n  }\n});\n```\n\n### iframes\n\nThere are some concerns and caveats when embedding polyfilled WebVR content inside iframes. [More information is documented in the cardboard-vr-display README](https://github.com/immersive-web/cardboard-vr-display#iframes).\n\n## Goals\n\nThe polyfill's goal is to provide a library so that developers can create\ncontent targeting the WebVR API without worrying about what browsers and devices\ntheir users have in a world of growing, [but fragmented](caniuse) support.\n\nThe three main components of the polyfill are:\n\n* Injects a [WebVR 1.1](spec) JavaScript implementation if one does not exist\n* Patches browsers that have an incomplete or inconsistent implementation of the API\n* Provide a synthesized [CardboardVRDisplay] on mobile when WebVR is not supported, or if it does have native support but no native VRDisplays and `PROVIDE_MOBILE_VRDISPLAY` is true (default).\n\n## Performance\n\nPerformance is critical for VR. If you find your application is too sluggish,\nconsider tweaking some of the above parameters. In particular, keeping\n`BUFFER_SCALE` at 0.5 (the default) will likely help a lot.\n\n## Developing\n\nIf you're interested in developing and contributing on the polyfill itself, you'll need to\nhave [npm] installed and familiarize yourself with some commands below. For full list\nof commands available, see `package.json` scripts.\n\n```\n$ git clone git@github.com:immersive-web/webvr-polyfill.git\n$ cd webvr-polyfill/\n\n# Install dependencies\n$ npm install\n\n# Build uncompressed JS file\n$ npm run build\n\n# Run tests\n$ npm test\n\n# Watch src/* directory and auto-rebuild on changes\n$ npm watch\n```\n\n### Testing\n\nRight now there are some unit tests in the configuration and logic for how things get polyfilled.\nBe sure to run tests before submitting any PRs, and bonus points for having new tests!\n\n```\n$ npm test\n```\n\nDue to the nature of the polyfill, be also sure to test the examples with your changes where appropriate.\n\n### Releasing a new version\n\nFor maintainers only, to cut a new release for npm, use the [npm version] command. The `preversion`, `version` and `postversion` npm scripts will run tests, build, add built files and tag to git, push to github, and publish the new npm version.\n\n`npm version \u003csemverstring\u003e`\n\n## License\n\nThis program is free software for both commercial and non-commercial use,\ndistributed under the [Apache 2.0 License](LICENSE).\n\n[samples]: https://webvr.info/samples/\n[npm]: https://www.npmjs.com\n[browserify]: http://browserify.org/\n[webpack]: https://webpack.github.io/\n[caniuse]: https://caniuse.com/#search=webvr\n[spec]: https://immersive-web.github.io/webvr/spec/1.1\n[CardboardVRDisplay]: https://github.com/immersive-web/cardboard-vr-display\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fimmersive-web%2Fwebvr-polyfill","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fimmersive-web%2Fwebvr-polyfill","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fimmersive-web%2Fwebvr-polyfill/lists"}