{"id":18930682,"url":"https://github.com/ninjadev/renin","last_synced_at":"2025-04-15T16:31:50.774Z","repository":{"id":37026695,"uuid":"415690513","full_name":"ninjadev/renin","owner":"ninjadev","description":"A reimagining of https://github.com/ninjadev/nin. WIP.","archived":false,"fork":false,"pushed_at":"2024-07-13T22:08:44.000Z","size":10572,"stargazers_count":20,"open_issues_count":10,"forks_count":0,"subscribers_count":9,"default_branch":"main","last_synced_at":"2024-10-16T06:33:15.542Z","etag":null,"topics":["demoscene","hacktoberfest","hacktoberfest-accepted","hacktoberfest2023","nin","ninjadev"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ninjadev.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"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":"2021-10-10T20:15:10.000Z","updated_at":"2024-09-26T08:52:33.000Z","dependencies_parsed_at":"2024-07-13T11:50:25.838Z","dependency_job_id":"25db01ee-c947-442a-91e2-1f97b52739c3","html_url":"https://github.com/ninjadev/renin","commit_stats":{"total_commits":200,"total_committers":9,"mean_commits":22.22222222222222,"dds":"0.20499999999999996","last_synced_commit":"6d5320ae26c535679d24d6a5d1f001e3c1d584f7"},"previous_names":[],"tags_count":6,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ninjadev%2Frenin","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ninjadev%2Frenin/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ninjadev%2Frenin/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ninjadev%2Frenin/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ninjadev","download_url":"https://codeload.github.com/ninjadev/renin/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":249105472,"owners_count":21213535,"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":["demoscene","hacktoberfest","hacktoberfest-accepted","hacktoberfest2023","nin","ninjadev"],"created_at":"2024-11-08T11:38:33.985Z","updated_at":"2025-04-15T16:31:50.318Z","avatar_url":"https://github.com/ninjadev.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003ch1 align=\"center\"\u003er e n i n\u003c/h1\u003e\n\n\u003cp align=center\u003e \u003ca href=\"#getting-started\"\u003eGetting started\u003c/a\u003e • \u003ca href=\"#project-status\"\u003eProject status\u003c/a\u003e\u003c/p\u003e\n\n\n\u003e \u003csup\u003eDISCLAIMER: This is a tool created for internal use by Ninjadev, and is open sourced to share ideas with and get\n\u003e feedback from the community. You are free to use it, according to the License, but we will not necessarily provide\n\u003e support and may at any time add, change or remove features as we require for our productions.\u003c/sup\u003e\n\n\u003cpre align=\"center\"\u003e\n\u003cimg src=\"screenshot.png\" /\u003e\n\u003c/pre\u003e\n\n\u003cbr/\u003e\u003cbr/\u003e\n\n\u003cp align=\"center\"\u003e\nRenin is a browser-based demo creation library and tool built on top of \u003ca href=\"https://github.com/mrdoob/three.js/\"\u003eThree.js\u003c/a\u003e and \u003ca href=\"https://vitejs.dev\"\u003eVite\u003c/a\u003e.\u003cbr/\u003eIt is the successor to \u003ca href=\"https://github.com/ninjadev/nin\"\u003enin\u003c/a\u003e, Ninjadev's old demo tool.\n\u003c/p\u003e\n\n\u003cbr/\u003e\n\n## Getting started\n\n```shell\nnpx renin init mydemo\ncd mydemo\nyarn install\nyarn run dev\n```\n\nNow visit localhost:3000 in Chrome to start renin. Try modifing the source in mydemo/src/ to get started. Happy hacking!\n\n### First time setup for demo in new repo\n\nIf you are making or running a renin-demo from a separate repository, you will need to place your demo project/repo folder adjacent to the renin repo directory.\n\n\u003cdetails\u003e\n\u003csummary\u003eFolder/repo structure illustration\u003c/summary\u003e\n\n```\nprojects/\n├─ renin/\n|  ├─ .git/\n|  ├─ renin/\n|  |  ├─ node_modules/\n|  |  ├─ src/\n|  ├─ ...\n├─ new-demo/\n|  ├─ .git/\n|  ├─ node_modules/\n|  ├─ src/\n|  ├─ ...\n```\n\u003c/details\u003e\n\u003cbr\u003e\n\nWhen you are setting this up for the first time, it's important that you restore packages for and build renin before restoring packages for your new demo.\nYarn caches somewhat aggressively, and your repeated attempts to rebuild your new demo will fail until you delete node_modules, which basically is starting from scratch build-wise.\n\nThe setup therefore becomes\n\n```shell\ncd projects/renin/renin\n\nyarn install\nyarn build\n\ncd projects/new-demo\n\nyarn install\n```\n\n### Build and export demo\n\nOnce you feel that you're done, you might want to generate a version without all the tracks and debug tooling.\nTo achieve this, you simply need to run `yarn build` within your demo.\n\nIf you do this on a separate machine, the full path from having cloned renin and your new demo becomes like this\n\n```shell\ncd projects/renin/renin\n\nyarn install\nyarn build\n\ncd projects/new-demo\n\nyarn install\nyarn build\n```\n\nAt this point you will get a folder named \"dist/\" in your demo project.\nIt will contain an index.html file, and a directory with all needed assets.\nTo run it you unfortunately can't just trust the content you made yourself locally on your machine and open it in a browser directly.\nYou'll have to spin it up in a server and access it through localhost.\nThe snippet below should work reasonably well cross-platform and enable you to enjoy your work at http://localhost:3000\n\n```shell\ncd projects/new-demo/dist\npython3 -m http.server 3000\n```\n\n## Build renin 🔨🔧\n\n```shell\ncd renin\nyarn build\n```\n\nOn Windows, you might have to manually run the commands defined in `\"build\"` in package.json instead.\n\n\u003cbr/\u003e\n\n## Project status\n\nRenin is quite new and pretty rough around the edges.\nCurrently, basic editing, live-reloading and jogging is implemented.\nCompilation/export is sort of implemented, but could use some more polish.\nAs such, it should be able to make a demo with this already :tada:\n\nRendering to video can be done like this: [#92](https://github.com/ninjadev/renin/pull/92)\n\n\u003cbr/\u003e\n\n## Keyboard shortcuts\n\n| Key      | Description                                                                                                       |\n|----------|-------------------------------------------------------------------------------------------------------------------|\n| R (hold) | Experimental: Record a video snippet while playing. After you release the button, a .webm file will be downloaded |\n| S        | Copy current step number to clipboard                                                                             |\n| F        | Copy current frame number to clipboard                                                                            |\n| M        | Mute/unmute music                                                                                                 |\n| O        | Enabled/disable thirds overlay                                                                                    |\n| Enter    | Toggle fullscreen                                                                                                 |\n| Space    | Play/pause                                                                                                        |\n| V        | Toggle repeat of current beat                                                                                     |\n| B        | Toggle repeat of current bar                                                                                      |\n| N        | Toggle repeat of current 4 bars                                                                                   |\n| G        | Set or remove loop cue points (set start, set end, remove both)                                                   |\n| shift+J  | Go back one frame                                                                                                 |\n| shift+K  | Go forward one frame                                                                                              |\n| shift+H  | Go to start                                                                                                       |\n| L        | Go forward 4 beats                                                                                                |\n| J        | Go back one beat                                                                                                  |\n| K        | Go forward one beat                                                                                               |\n| H        | Go back 4 beats                                                                                                   |\n| 6        | Set playback rate to 0.25                                                                                         |\n| 7        | Set playback rate to 0.5                                                                                          |\n| 8        | Set playback rate to 2                                                                                            |\n| 9        | Set playback rate to 4                                                                                            |\n| 0        | Set playback rate to 1                                                                                            |\n\n# Debugging renin\n\nTypically, to debug renin, you need a demo using renin to mess around with.\nMake sure that the demo references your local renin repo and files and not the published packages, or you will grow frustrated that none of you changes seem to take effect.\nTo use the repo, in your demos `package.json` file, in the `dependencies` section, make sure the `renin` entry refers to `file:./../renin/renin`.\n\nSee this example :\n\n```json\n{\n  \"...\": \"...\",\n  \"dependencies\": {\n    \"...\": \"...\",\n    \"@types/three\": \"*\",\n    \"renin\": \"file:./../renin/renin\",\n    \"seedrandom\": \"^3.0.5\",\n    \"three\": \"*\",\n    \"...\": \"...\",\n  },\n  \"...\": \"...\",\n}\n```\n\n# Known renin demos\n\n- [Ninjadev - The Tale of the Bluebird \u0026 the Dragon](https://www.pouet.net/prod.php?which=91820)\n- [Ninjadev - Crank You Very Much](https://www.pouet.net/prod.php?which=94165)\n- [Sigveseb / Ninjadev - FILL_ER](https://www.pouet.net/prod.php?which=94133)\n- [NDV (닌자데브) 'We are back - JP Ver.-' Official MV](https://www.pouet.net/prod.php?which=94648)\n\n\u003cbr/\u003e\n\n## How is renin different compared to nin?\n\n- The entire UI is WebGL (threejs).\n- No graph.json -- instead, the graph is implicitly defined in the code directly in the node relationships.\n- New experimental visualization of nodes as layers.\n- Typescript and modern tooling/imports/etc which makes the coding experience much nicer.\n- It uses vite \"as a backend\" instead of the node backend + html frontend architecture of nin.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fninjadev%2Frenin","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fninjadev%2Frenin","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fninjadev%2Frenin/lists"}