{"id":13989661,"url":"https://github.com/supermedium/aframe-super-shooter-kit","last_synced_at":"2025-08-15T17:12:05.999Z","repository":{"id":32725377,"uuid":"140567822","full_name":"supermedium/aframe-super-shooter-kit","owner":"supermedium","description":"🔫 A-Frame kit of components for making a simple WebVR shooter minigame.","archived":false,"fork":false,"pushed_at":"2022-12-02T06:48:49.000Z","size":1035,"stargazers_count":133,"open_issues_count":17,"forks_count":34,"subscribers_count":10,"default_branch":"master","last_synced_at":"2025-08-09T01:07:02.537Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://supermedium.com/aframe-super-shooter-kit/examples/supercraft/","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/supermedium.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}},"created_at":"2018-07-11T11:48:20.000Z","updated_at":"2025-03-31T19:07:01.000Z","dependencies_parsed_at":"2023-01-14T22:02:54.292Z","dependency_job_id":null,"html_url":"https://github.com/supermedium/aframe-super-shooter-kit","commit_stats":null,"previous_names":["supermedium/aframe-simple-shooter","supermedium/aframe-super-shooter"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/supermedium/aframe-super-shooter-kit","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/supermedium%2Faframe-super-shooter-kit","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/supermedium%2Faframe-super-shooter-kit/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/supermedium%2Faframe-super-shooter-kit/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/supermedium%2Faframe-super-shooter-kit/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/supermedium","download_url":"https://codeload.github.com/supermedium/aframe-super-shooter-kit/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/supermedium%2Faframe-super-shooter-kit/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":270602456,"owners_count":24614260,"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-15T02:00:12.559Z","response_time":110,"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":[],"created_at":"2024-08-09T13:01:55.450Z","updated_at":"2025-08-15T17:12:05.947Z","avatar_url":"https://github.com/supermedium.png","language":"JavaScript","readme":"# aframe-super-shooter-kit\n\n[A-Frame](https://aframe.io) kit of components for making a simple WebVR\nshooter minigame. From the creators of A-Frame, Supermedium, and Supercraft.\n\n![screenshot](https://user-images.githubusercontent.com/674727/43233052-499cf788-9074-11e8-98bb-3823e30ef13d.jpg)\n\n**[PLAY](https://supermedium.github.io/aframe-super-shooter-kit/examples/supercraft/)**\n\nThe kit is set of simple and easy to use components to provide a way of\nbuilding simple shooting experiences, where a \"shooter\" shoots \"bullets\" that\ncan hit \"targets\". A large chunk of the game can be handled at just the\ndeclarative A-Frame layer in HTML.\n\n1. One `bullet` entity acts as a template for the instances of shot bullets.\n2. Entity with `shooter` component attached (e.g., a gun) spawns bullets on\n`shoot` event from its position.\n3. Collisions among bullet's and `target`'s bounding boxes are checked.\n4. Health and life of targets are calculated (`hit` and `die` events).\n\nSo we define which entities are bullets, shooters, and targets, and then wire\nup the game using controls and progress the game with events.\n\n![diagram](https://user-images.githubusercontent.com/674727/43211842-cb6de9da-9032-11e8-94ff-8c4b6b8ac176.png)\n\n[Video of Supercraft + Super Shooter Kit workflow](https://www.youtube.com/watch?v=RW3enib2X94)\n\n## API\n\n### `shooter` component\n\nThe `shooter` component should be attached to a controller for gun. But it can\nalso be attached to the camera to support 2D / desktop or normal smartphone if\nwired to mouse or touch.\n\n| Property         | Description                                                                                                                                          | Default Value |\n| --------         | -----------                                                                                                                                          | ------------- |\n| activeBulletType | Name of current active bullet the shooter is firing.                                                                                                 | 'normal'      |\n| bulletTypes      | Array of possible bullet names.                                                                                                                      | ['normal']    |\n| cycle            | A flag to tell when swapping to the `next` or `prev` bullet type, cycle to the first or last type when reaching the last or first type respectively. | false         |\n\n#### Events\n\nThese events can be triggered with `entity.emit(eventName)`.\n\n| Event Name     | Effect                                                      |\n|----------------|-------------------------------------------------------------|\n| shoot        | Shoot a bullet.                                             |\n| changebullet | Swap bullet type (either `prev`, `next`, or name of bullet. |\n\n### `bullet` component\n\n| Property     | Description                                                               | Default Value |\n|--------------|---------------------------------------------------------------------------|---------------|\n| damagePoints | How many health points to remove from target when hitting target.         | 1.0           |\n| maxTime      | Life time of bullet in seconds. When elapsed, the bullet will be removed. | 1.0           |\n| name         | Name of the bullet type.                                                  | normal        |\n| poolSize     | How many copies of this bullet can be on screen at once.                  | 10            |\n| speed        | Speed of bullet in meters per second.                                     | 1.0           |\n\n### `target` component\n\n| Property     | Description                                                                                                                                                                                                                          | Default Value |\n|--------------|--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|---------------|\n| active       | Whether this target is included in collision tests.                                                                                                                                                                                  | true          |\n| healthPoints | Number of hit or health points of the target. When a bullet hits this target, its health points will decrease by the bullet's damage points. When the target reaches 0 health points, then the event 'die' is emitted on the target. | 1             |\n| static       | Whether this object does not ever move or change shape. If set to false, then the bounding box is recalculated continuously.                                                                                                         | true          |\n\n#### Members\n\nComponent members can be accessed by like `entity.components.target.lastBulletHit`:\n\n| Member        | Description                                                                                                                                   |\n|---------------|-----------------------------------------------------------------------------------------------------------------------------------------------|\n| lastBulletHit | Reference object to the last bullet object3D that hit the target. Useful for attaining the position of where the bullet contacted the target. |\n\n#### Events\n\nEvents emitted on the target that we can listen to, to perhaps show an\nexplosion effect on target hit or die.\n\n| Event Name | Description                                            |\n|------------|--------------------------------------------------------|\n| hit        | Target was hit by a bullet.                            |\n| die        | Target ran out of healthPoints and has been destroyed. |\n\n## With Supercraft Assets\n\n[Supercraft](https://supermedium.com/supercraft) is an A-Frame WebVR\napplication that lets you build low-poly VR assets inside of VR with your\nhands, and export them to Web or JSON! With the shooter kit providing dead-easy\ncomponents, A-Frame letting you do things in just HTML, and ability to create\ngood assets without modeling experience, WebVR development is made simple.\n\nThe advantage of the Supercraft JSON exports alongside\n[aframe-supercraft-loader](https://www.npmjs.com/package/aframe-supercraft-loader)\nand [aframe-supercraft-thing](https://www.npmjs.com/package/aframe-supercraft-thing)\nis that they are tailored for A-Frame resulting in extremely small file sizes\nand performant through geometry merging.\n\nAll 3D assets in this scene are delivered within a single 190KB JSON file:\n[Supercraft Shooter](https://supermedium.github.io/supercraft-shooter). All\nthe assets in the game were done using Supercraft in **45 minutes**, and the\ncode is just dozens of lines of Javascript and HTML. Game created in an\nafternoon.\n\nAn extremely cool workflow is using the `supercraft-loader` to \"live-reload\"\nassets.  The Supercraft JSON is hosted on the Web via name; we just need to do\n`supercraft-loader=\"name: my-supercraft-site\"`, and whenever we publish an update\nto `my-supercraft-site` within Supercraft, the scene will automatically have\naccess to the fresh new assets.\n\nAnd `supercraft-thing-loader` can be used to pick individual objects out of a\nSupercraft scene of objects. You can create all your assets in one scene, make\nsure they have good scale relative to one another, tweak them all at once!\n\n**[VIDEO](https://www.youtube.com/watch?v=RW3enib2X94)**\n\n## Installation\n\n### Browser\n\nSee the [Supercraft Shooter example source\ncode](https://github.com/supermedium/aframe-super-shooter-kit/tree/master/examples/supercraft).\n\nInstall and use by directly including the [browser files](dist):\n\n```html\n\u003chead\u003e\n  \u003ctitle\u003eA-Frame Super Shooter Kit - Basic\u003c/title\u003e\n  \u003cscript src=\"https://aframe.io/releases/0.8.2/aframe.min.js\"\u003e\u003c/script\u003e\n  \u003cscript src=\"../../dist/aframe-super-shooter-kit.min.js\"\u003e\u003c/script\u003e\n  \u003cscript\u003e\n    /**\n     * Click mouse to shoot.\n     */\n    AFRAME.registerComponent('click-to-shoot', {\n      init: function () {\n        document.body.addEventListener('mousedown', () =\u003e { this.el.emit('shoot'); });\n      }\n    });\n\n    /**\n     * Change color when hit.\n     */\n    AFRAME.registerComponent('hit-handler', {\n      dependencies: ['material'],\n\n      init: function () {\n        var color;\n        var el = this.el;\n\n        color = new THREE.Color();\n        color.set('#666');\n        el.components.material.material.color.copy(color);\n        el.addEventListener('hit', () =\u003e {\n          color.addScalar(0.05);\n          el.components.material.material.color.copy(color);\n        });\n\n        el.addEventListener('die', () =\u003e {\n          color.setRGB(1, 0, 0);\n          el.components.material.material.color.copy(color);\n        });\n      }\n    });\n  \u003c/script\u003e\n\u003c/head\u003e\n\n\u003cbody\u003e\n  \u003ca-scene background=\"color: #DADADA\"\u003e\n    \u003ca-entity id=\"bulletTemplate\" bullet geometry=\"primitive: sphere; radius: 0.1\" material=\"color: orange\"\u003e\u003c/a-entity\u003e\n\n    \u003ca-entity class=\"target\" target=\"healthPoints: 10\" geometry=\"primitive: box\" material=\"color: teal\" position=\"0 0 -4\" hit-handler\u003e\u003c/a-entity\u003e\n\n    \u003ca-entity id=\"gun\" shooter geometry=\"primitive: box; width: 0.1; height: 0.1; depth: 0.3\" material=\"color: red\" click-to-shoot position=\"0 0 -1\"\u003e\u003c/a-entity\u003e\n\n    \u003ca-camera id=\"camera\" position=\"-1 0 0\" shooter click-to-shoot\u003e\u003c/a-camera\u003e\n  \u003c/a-scene\u003e\n\u003c/body\u003e\n```\n\n### npm\n\nInstall via npm:\n\n```bash\nnpm install aframe-super-shooter-kit\n```\n\nThen require and use.\n\n```js\nrequire('aframe');\nrequire('aframe-super-shooter-kit');\n```\n","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsupermedium%2Faframe-super-shooter-kit","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsupermedium%2Faframe-super-shooter-kit","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsupermedium%2Faframe-super-shooter-kit/lists"}