{"id":14384806,"url":"https://github.com/stewdio/THREE.VRController","last_synced_at":"2025-08-23T18:30:45.004Z","repository":{"id":148552248,"uuid":"89487837","full_name":"stewdio/THREE.VRController","owner":"stewdio","description":"Support hand controllers for Oculus, Vive, Windows Mixed Reality, Daydream, GearVR, and more by adding VRController to your existing Three.js-based WebVR project.","archived":false,"fork":false,"pushed_at":"2019-01-22T21:50:16.000Z","size":1070,"stargazers_count":232,"open_issues_count":13,"forks_count":32,"subscribers_count":16,"default_branch":"master","last_synced_at":"2025-05-12T12:15:57.371Z","etag":null,"topics":["daydream","gamepad","gear-vr","javascript","oculus","threejs","vive","vrcontroller","webvr","webxr","windows-mixed-reality"],"latest_commit_sha":null,"homepage":"https://stewdio.github.io/THREE.VRController/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/stewdio.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null}},"created_at":"2017-04-26T14:04:11.000Z","updated_at":"2025-03-24T07:55:06.000Z","dependencies_parsed_at":"2023-05-20T12:00:14.638Z","dependency_job_id":null,"html_url":"https://github.com/stewdio/THREE.VRController","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/stewdio/THREE.VRController","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stewdio%2FTHREE.VRController","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stewdio%2FTHREE.VRController/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stewdio%2FTHREE.VRController/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stewdio%2FTHREE.VRController/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/stewdio","download_url":"https://codeload.github.com/stewdio/THREE.VRController/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stewdio%2FTHREE.VRController/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":271762738,"owners_count":24816821,"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","status":"online","status_checked_at":"2025-08-23T02:00:09.327Z","response_time":69,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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":["daydream","gamepad","gear-vr","javascript","oculus","threejs","vive","vrcontroller","webvr","webxr","windows-mixed-reality"],"created_at":"2024-08-28T18:01:41.100Z","updated_at":"2025-08-23T18:30:44.693Z","avatar_url":"https://github.com/stewdio.png","language":"JavaScript","readme":"\n\nTHREE.VRController\n==============================================================================\n\n![THREE.VRController](https://github.com/stewdio/THREE.VRController/raw/master/VRController.jpg \"THREE.VRController\")\n\n__Support hand controllers for Oculus, Vive, Windows Mixed Reality, Daydream, \nGearVR, and more by adding VRController to your existing \n[Three.js](https://threejs.org/)-based \n[WebVR](https://webvr.rocks/) project.__\nVRController wraps the [Web Gamepad API](https://www.w3.org/TR/gamepad/), \nhandles [gamepad browser quirks](https://medium.com/@stew_rtsmith/webvr-controllers-and-chromiums-gamepad-api-6c9adc633f38),\nemits a controller instance (an extended `THREE.Object3D`) upon gamepad \ndiscovery, handles controller updates for position and orientation—including\n3[DOF](https://en.wikipedia.org/wiki/Degrees_of_freedom_(mechanics)) rigs\nvia the `OrientationArmModel`—and watches for updates on axes and button \nstates—emitting corresponding events on the controller instance.\n(Pretty great, right?!)\n\nVRController includes explicit support for\n[Oculus Rift + Touch](https://www.oculus.com/rift/),\n[HTC Vive](https://www.vive.com),\n[Windows Mixed Reality motion controllers](https://www.microsoft.com/en-us/windows/windows-mixed-reality),\n[Google Daydream](https://vr.google.com/daydream/),\nand has implicit support for\n[Samsung GearVR](http://www.samsung.com/GearVR)\nand similar devices. Is your company developing new hand controllers? Send\nthem my way and I’ll add support for it. 😉\n\nVRController is compatible with Three.js __r87__ which is the first version to\nuse the new `renderer.vr` object and was originally submitted to\n[Three.js](https://github.com/mrdoob/three.js/) as\n[pull request #10991](https://github.com/mrdoob/three.js/pull/10991)\non Saturday, 11 March 2017. Note: that pull request is no longer maintained.\n\n\nRequirements\n------------------------------------------------------------------------------\n1. Virtual Reality rig with 3DOF or 6DOF controllers such as the\n[Oculus Rift + Touch](https://www.oculus.com/rift/),\n[HTC Vive](https://www.vive.com/),\na [Windows Mixed Reality](https://www.microsoft.com/en-us/windows/windows-mixed-reality) rig,\n[Google Daydream](https://vr.google.com/daydream/),\n[Samsung GearVR](http://www.samsung.com/GearVR), or similar devices.\n2. WebVR-capable browser. For the latest list of browsers\nthat support WebVR—as well as download and setup instructions—see\n[WebVR Rocks](https://webvr.rocks/).\n3. Working knowledge of [Three.js](https://threejs.org/).\n\n\nTry it now!\n------------------------------------------------------------------------------\nAlready on a VR rig with a WebVR-capable browser? Just point your browser to\n[https://stewdio.github.io/THREE.VRController/](https://stewdio.github.io/THREE.VRController/)\nto experience this code in action.\n\n\nDo it yourself\n------------------------------------------------------------------------------\n1. Add our\n[VRController.js](https://github.com/stewdio/THREE.VRController/raw/master/VRController.js) file to your existing Three.js project and use our\n[index.html](https://github.com/stewdio/THREE.VRController/raw/master/index.html)\nexample file as your guide for the following steps.\n2. Add a `THREE.VRController.update()` function call to your animation loop.\n3. Add a listener for the `\"vr controller connected\"` global event. This is\nhow you will receive the controller object instance—which is an extended\n`THREE.Object3D`. This means you can add it to your scene, attach meshes\nto it, and so on.\n4. When you receive the controller object instance you must give it some\nadditional information depending on the type of controller. For 6DOF (room\nscale) rigs you must provide a standing matrix, easily obtained from your\n`WebGLRenderer` instance in Three.js __r87__ and above. This will look similar to:\n`controller.standingMatrix = renderer.vr.getStandingMatrix()`.\nFor 3DOF (seated) rigs you must provide a reference to the camera so the\ncontroller can use the headset’s live position and orientation to guess where\nit ought to be: `controller.head = camera`. There’s no penalty for providing\nthe controller instance with both `standingMatrix` and `head` properties as\nwe do in the\n[example](https://github.com/stewdio/THREE.VRController/raw/master/index.html).\n5. Explore the available touch, press, and trackpad events by assigning\n`THREE.VRController.verbosity = 1`.\nYou’ll now see a flood of verbose comments in the JavaScript console as you\ninteract with your controller. To access controllers directly from the console\nexplore the `THREE.VRController.controllers` object. To get a snapshot of all\ncontroller data try `THREE.VRController.inspect()`.\n\n\nRun locally\n------------------------------------------------------------------------------\nFor security reasons you can’t run a WebVR experience by just dragging the\n`index` file onto a browser tab. You have to run an actual server. The easiest\nway to do this on your own desktop machine is to start a simple Python server.\nOpen up a\n[command line prompt](https://en.wikipedia.org/wiki/Command-line_interface),\nnavigate to wherever you’ve stored this code package, then type the\nfollowing command depending on the version of\n[Python](https://en.wikipedia.org/wiki/Python_(programming_language)) you have\ninstalled.  \n\nPython 2: `python -m SimpleHTTPServer 8000`  \nPython 3: `py -m http.server 8000`  \n\nIn your browser you can now navigate to\n[http://localhost:8000/](http://localhost:8000/) to see the demo running\nlocally. You can shutdown the local server by returning to the command line\nand hitting Control + C.\n\n\nNotes on Chromium’s Gamepad API\n------------------------------------------------------------------------------\nIf you’re building WebVR experiences and targeting the\n[WebVR build of Chromium](https://webvr.info/get-chrome/) you may want to read\nmy Medium post about its quirky behavior and how VRController compensates for\nit: [WebVR controllers and Chromium’s Gamepad API](https://medium.com/@stew_rtsmith/webvr-controllers-and-chromiums-gamepad-api-6c9adc633f38).\n\n\nSpace Rocks!\n------------------------------------------------------------------------------\n![Space Rocks](https://github.com/moar-tech/spacerocks/raw/master/media/space-rocks.jpg \"Space Rocks (WebXR)\")\n\nLooking for a more complex, fleshed out example of VRController in action?\nPlay [Space Rocks](https://spacerocks.moar.io \"Space Rocks (WebXR)\") now at \n[https://spacerocks.moar.io](https://spacerocks.moar.io \"Space Rocks (WebXR)\")\nYou can read more about it on \n[Medium](https://medium.com/@stew_rtsmith/space-rocks-webvr-d4035d0ac429)\nor check out the \n[code repository](https://github.com/moar-tech/spacerocks).\nLook for VRController-related bits in\n[`/scripts/player.js`](https://github.com/moar-tech/spacerocks/blob/master/scripts/player.js).\n\nAnd for the full technical breakdown, including multi-channel haptic \nfeedback, button handling, and attaching visuals to controllers, see\n[Space Rocks—WebXR tech deep dive](https://medium.com/@stew_rtsmith/space-rocks-technical-deep-dive-9bf67fb8a467).\n\n[![Space Rocks technical deep dive](https://cdn-images-1.medium.com/max/2000/1*TjqlHICRPMCzR68SggeW-g.jpeg \"Space Rocks—WebXR tech deep dive\")](https://medium.com/@stew_rtsmith/space-rocks-technical-deep-dive-9bf67fb8a467)\n\n\n\n","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fstewdio%2FTHREE.VRController","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fstewdio%2FTHREE.VRController","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fstewdio%2FTHREE.VRController/lists"}