{"id":14981307,"url":"https://github.com/felixtrz/elixr","last_synced_at":"2025-10-29T05:31:30.869Z","repository":{"id":58540122,"uuid":"532148854","full_name":"felixtrz/elixr","owner":"felixtrz","description":"A WebXR framework for building the metaverse, powered by three.js and cannon-es","archived":false,"fork":false,"pushed_at":"2024-05-07T04:29:50.000Z","size":2509,"stargazers_count":37,"open_issues_count":1,"forks_count":3,"subscribers_count":2,"default_branch":"main","last_synced_at":"2024-09-29T05:23:06.219Z","etag":null,"topics":["ecs","game-engine","javascript-framework","javascript-game-engine","physics-engine","threejs","webxr","webxr-controllers"],"latest_commit_sha":null,"homepage":"https://elixrjs.io/","language":"TypeScript","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/felixtrz.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2022-09-03T03:54:48.000Z","updated_at":"2024-08-14T17:15:35.000Z","dependencies_parsed_at":"2024-03-19T02:44:30.656Z","dependency_job_id":"34edcf46-b57c-481a-ae74-87905448c7b7","html_url":"https://github.com/felixtrz/elixr","commit_stats":{"total_commits":82,"total_committers":1,"mean_commits":82.0,"dds":0.0,"last_synced_commit":"d05b84d24c52778218fadc8e9bee8d78daf552be"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/felixtrz%2Felixr","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/felixtrz%2Felixr/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/felixtrz%2Felixr/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/felixtrz%2Felixr/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/felixtrz","download_url":"https://codeload.github.com/felixtrz/elixr/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":219858317,"owners_count":16556047,"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":["ecs","game-engine","javascript-framework","javascript-game-engine","physics-engine","threejs","webxr","webxr-controllers"],"created_at":"2024-09-24T14:03:18.193Z","updated_at":"2025-10-29T05:31:30.400Z","avatar_url":"https://github.com/felixtrz.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cimg alt=\"elixr\" src=\"assets/images/elixr.png\" width=\"400\"\u003e\n\n[![npm version](https://badge.fury.io/js/elixr.svg)](https://badge.fury.io/js/elixr)\n[![language](https://badgen.net/badge/icon/typescript?icon=typescript\u0026label)](https://www.typescriptlang.org/)\n[![npm download](https://badgen.net/npm/dw/elixr)](https://www.npmjs.com/package/elixr)\n[![license](https://badgen.net/github/license/felixtrz/elixr)](/LICENSE.md)\n\nElixr is a lightweight and flexible framework for building WebXR experiences. Built on top of the popular [three.js](https://threejs.org/) library and integrated with the highly performant [Rapier](https://rapier.rs/) physics engine, Elixr aims to provide an easy-to-use and customizable solution for creating XR experiences on the web.\n\n## Table of contents\n\n**[Key features](#key-features)** |\n**[Installation](#installation)** |\n**[Usage](#usage)** |\n**[API](#api)** |\n**[License](#license)**\n\n## Key features\n\n- 🚀 **Easy-to-use WebXR scene setup**: Intuitive APIs for setting up WebXR scenes.\n- 🎮 **Powerful ECS architecture**: Efficient game logic with a flexible entity-component system.\n- 🏗️ **Rapier physics integration**: Realistic physics simulations with the highly performant Rapier physics engine.\n- 🕹️ **Pre-built, customizable interaction systems**: Easily add pre-built interaction systems like snap-turn and teleportation.\n- 🌐 **Compatibility with three.js plugins**: Build on top of an established three.js ecosystem with compatibility for plugins.\n\n## Installation\n\nTo install and set up the library, run:\n\n```sh\n$ npm install elixr\n```\n\nOr if you prefer using Yarn:\n\n```sh\n$ yarn add elixr\n```\n\n## Usage\n\nTo import elixr and set up your new world with a cube:\n\n```js\nimport { Core, GameObject, PrimitiveType, THREE, VRButton } from 'elixr';\n\n// create a Core objects automatically sets up the base scene and the render loop\nCore.init(document.getElementById('scene-container')).then((core) =\u003e {\n\tconst cubeObject = new GameObject();\n\tcubeObject.addComponent(MeshRenderer, {\n\t\tmeshRef: new THREE.Mesh(\n\t\t\tnew THREE.BoxGeometry(1, 1, 1),\n\t\t\tnew THREE.MeshStandardMaterial({ color: 0xff0000 }),\n\t\t),\n\t});\n\tcubeObject.position.set(0, 1, -2);\n\n\t// add some lighting\n\tcore.scene.add(new THREE.AmbientLight(0xffffff, 0.5));\n\tcore.scene.add(new THREE.DirectionalLight(0xffffff, 1));\n\n\t// convert a button to the Enter VR button\n\tconst vrButton = document.getElementById('vr-button');\n\tVRButton.convertToVRButton(vrButton, core.renderer);\n});\n```\n\nUse ECS to add a spin behavior to that cube:\n\n```js\nimport { GameComponent, GameSystem } from 'elixr';\n\nclass Spin extends GameComponent {}\n\nclass SpinSystem extends GameSystem {\n\t// update(delta, time) is run every frame, define the game loop behavior here\n\tupdate(delta) {\n\t\t// query game objects as defined in SpinSystem.queries\n\t\tthis.queryGameObjects('cubes').forEach((cubeObject) =\u003e {\n\t\t\t// GameObjects extends THREE.Object3D\n\t\t\tcubeObject.rotateY(Math.PI * delta);\n\t\t});\n\t}\n}\n\nSpinSystem.queries = {\n\tcubes: { components: [Spin] },\n};\n\ncore.registerGameComponent(Spin);\ncore.registerGameSystem(SpinSystem);\n\n// GameObjects also function as entities that can be queried in systems\ncubeObject.addComponent(Spin);\n```\n\nMake the world and the cube have physics:\n\n```js\nimport { Core, GameObject, PrimitiveType, THREE, VRButton } from 'elixr';\n\n// set gravity\ncore.physics.gravity.set(0, -9.8, 0);\n\n// primitive objects come with rigidbodies and colliders\nconst cubeObject = GameObject.createPrimitive(PrimitiveType.Cube);\ncubeObject.position.set(0, 10, -2);\nconst floor = GameObject.createPrimitive(PrimitiveType.Plane);\nfloor.position.set(0, 0, 0);\n```\n\nTo implement naive joystick movement:\n\n```js\nimport { AXES, Vector3, XRGameSystem } from 'elixr';\n\nconst MAX_MOVEMENT_SPEED = 1;\n\nexport class JoystickMovementSystem extends XRGameSystem {\n\tupdate(delta, _time) {\n\t\t// \"left\" and \"right\" controllers are stored in core.controllers\n\t\t// they are only available after entering XR\n\t\tif (!this.core.controllers['left']) return;\n\t\tconst gamepad = this.core.controllers['left'].gamepad;\n\t\tconst xValue = gamepad.getAxis(AXES.XR_STANDARD.THUMBSTICK_X);\n\t\tconst zValue = gamepad.getAxis(AXES.XR_STANDARD.THUMBSTICK_Y);\n\t\t// core.playerSpace is a THREE.Group that contains the camera and both controllers\n\t\tthis.core.playerSpace.position.x += xValue * delta * MAX_MOVEMENT_SPEED;\n\t\tthis.core.playerSpace.position.z += zValue * delta * MAX_MOVEMENT_SPEED;\n\t}\n}\n```\n\n## API\n\nPlease refer to [elixrjs.io](https://elixrjs.io) for full API documentation.\n\n## License\n\n[Apache-2.0 License](/LICENSE.md) © 2023 Felix Zhang\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffelixtrz%2Felixr","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffelixtrz%2Felixr","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffelixtrz%2Felixr/lists"}