{"id":28629766,"url":"https://github.com/codebox/beatmatcher","last_synced_at":"2025-06-12T12:13:32.061Z","repository":{"id":215127255,"uuid":"738136060","full_name":"codebox/beatmatcher","owner":"codebox","description":"An HTML/JavaScript mixing and beatmatching game","archived":false,"fork":false,"pushed_at":"2024-01-13T11:05:40.000Z","size":63,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"main","last_synced_at":"2024-01-13T21:08:48.484Z","etag":null,"topics":["dj","game","mixing"],"latest_commit_sha":null,"homepage":"https://codebox.net/pages/beatmatching-game","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/codebox.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":"2024-01-02T14:07:47.000Z","updated_at":"2024-01-05T11:02:47.000Z","dependencies_parsed_at":"2024-01-13T12:16:29.658Z","dependency_job_id":"e7690e85-0b40-4496-87ce-f2cf0944cd15","html_url":"https://github.com/codebox/beatmatcher","commit_stats":null,"previous_names":["codebox/beatmatcher"],"tags_count":0,"template":null,"template_full_name":null,"purl":"pkg:github/codebox/beatmatcher","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codebox%2Fbeatmatcher","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codebox%2Fbeatmatcher/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codebox%2Fbeatmatcher/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codebox%2Fbeatmatcher/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/codebox","download_url":"https://codeload.github.com/codebox/beatmatcher/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codebox%2Fbeatmatcher/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":259462578,"owners_count":22861514,"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":["dj","game","mixing"],"created_at":"2025-06-12T12:13:31.386Z","updated_at":"2025-06-12T12:13:32.042Z","avatar_url":"https://github.com/codebox.png","language":"JavaScript","readme":"# Beatmatching Game\n\nTry out your mixing skills with this [online beatmatching game](https://codebox.net/pages/beatmatching-game/online)!\n\nYou will hear 2 drum loops playing at different speeds, which will probably sound awful. You need to adjust the\nspeeds of the loops so that they match, and then synchronise the beats so that they play at the same time.\nAll of this will be easier if you use headphones - one drum loop will play in each ear.\n\nTo change the playback speed of a drum loop use the vertical sliders to the right of each turntable, these allow you\nto increase or decrease the speed by up to 10%. The game will only give you drum loops that can be matched using\nthis speed range. To make fine adjustments to the speed, click above or below the slider to move it slightly in\nthat direction.\n\n![Turntable controls](https://codebox.net/assets/images/beatmatcher/turntable_controls.png)\n\nThere is a volume control below each slider (drag it up and down to change volume).\nYou can create a better mix by adjusting how loudly each track is playing, so that one doesn't drown out the other.\nIt can sometimes be helpful to completely mute each of the loops in turn so that you can hear them in isolation before trying\nto mix them together.\n\nEach turntable also has a Start/Stop button in the lower left corner, as well as a Power button just above it.\nThe Start/Stop button quickly (but not instantly) starts/stops the turntable. Pressing the Power button while a loop\nis playing allows the loop to slow down and stop gradually, simulating the effect of friction. You can use both these\ncontrols for different effects when mixing.\n\nThe turntables have patterns of circular dots around the circumference, similar to those found on\n[good quality record decks](https://en.wikipedia.org/wiki/Technics_SL-1200). On a physical record deck the\nred light built into the power button is actually a strobe, and the dots are positioned so that when the deck is rotating\nat certain predefined speeds, the dots in one or other of the rows will appear to be stationary. This allows the DJ to\ncheck for any miscalibration of the pitch (speed) control. No such checks are needed for these virtual turntables, however\nthe dots do provide a visual indication of the exact speed of the turntable and so may still be useful. One of the four\nrows of dots will appear static at speeds of +6.4%, +3.3%, 0% and -3.3%. The positions of the dots are calculated based on\nthe refresh rate of the screen, so the spacing between them may differ between devices.\n\nThe turntables can also be manipulated using your mouse (or fingers, on a touch screen).\nTry some scratching or backspins and see how it sounds!\n\nThe game itself has 2 modes:\n\n## Freestyle Mode\n\nIf you haven't done any mixing before start here. In Freestyle Mode you can just play around with the turntables,\ntry (and probably fail) to get a nice mix going, and then use the Auto-Match All button to hear what the loops sound\nlike when mixed together perfectly. You also have the option to just auto-match the speeds of the loops without synchronising\nthe beats, or to auto-synchronise the beats without changing the speeds (of course if you do the latter the beats will go out\nof sync again very quickly!).\n\nHere is a video showing Freestyle mode. The 2 drum loops start off out-of-sync and are then automatically matched.\nNotice how the speed controls and the BPM values change when the 'All' button is pressed:\n\n\u003ca href=\"https://codebox.net/assets/video/beatmatcher/auto_mix_demo.mp4\"\u003e\u003cimg src=\"https://codebox.net/assets/video/beatmatcher/auto_mix_demo_poster.png\" width=\"600\" \u003e\u003c/a\u003e\n\n\n## Training Mode\n\nTraining Mode is intended for anyone who is more serious about improving their mixing skills. Initially the Auto-Match buttons and BPM\ndisplays are hidden. Mix the drum loops together by ear as best you can, and then press the 'Analyse' button to see how you did.\nVarious statistics will be displayed, including the BPM of each loop, the difference between the BPMs, and the beat period.\n\nHere is a video showing Training Mode after a mix has been attempted and the Analyse button pressed.\nBelow the various stats is a 'ladder' display showing the beats from the 2 turntables and the mismatch between them.\nThe red sections of the ladder show the gaps between the beats, so in general the less red you see here the better the mix was.\nIn the video the 2 loops start off completely out-of-sync, as can be seen from the BPM Difference and Error values, and from\nall the red on the ladder display. Once the pitch is auto-matched the BPM Difference and Error values drop to zero, however there\nis still a lot of red on the ladder display (the exact amount is shown by the 'Total Mismatch' score above the ladder) because\nthe beats are still out of sync. Clicking the Auto-Match Position button brings the beats into sync, and the Total Mismatch\nscore drops to zero indicating a perfect mix.\n\n\u003ca href=\"https://codebox.net/assets/video/beatmatcher/training_mode.mp4\"\u003e\u003cimg src=\"https://codebox.net/assets/video/beatmatcher/training_mode_poster.png\" width=\"600\" \u003e\u003c/a\u003e\n","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcodebox%2Fbeatmatcher","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcodebox%2Fbeatmatcher","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcodebox%2Fbeatmatcher/lists"}