{"id":21162510,"url":"https://github.com/josepedrodias/wave-function-collapse","last_synced_at":"2026-04-11T08:41:54.416Z","repository":{"id":203097823,"uuid":"708560165","full_name":"JosePedroDias/wave-function-collapse","owner":"JosePedroDias","description":"a javascript implementation of the wave function collapse algorithm","archived":false,"fork":false,"pushed_at":"2023-10-23T12:53:15.000Z","size":198,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-01-21T09:48:24.641Z","etag":null,"topics":["algorithm","wave-function-collapse"],"latest_commit_sha":null,"homepage":"https://josepedrodias.github.io/wave-function-collapse/index.html?stepMode=10fps\u0026scale=2","language":"JavaScript","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/JosePedroDias.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}},"created_at":"2023-10-22T22:45:41.000Z","updated_at":"2023-10-23T12:57:45.000Z","dependencies_parsed_at":null,"dependency_job_id":"be43c3ed-075a-4138-bb7d-1eff44c5a796","html_url":"https://github.com/JosePedroDias/wave-function-collapse","commit_stats":null,"previous_names":["josepedrodias/wave-function-collapse"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JosePedroDias%2Fwave-function-collapse","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JosePedroDias%2Fwave-function-collapse/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JosePedroDias%2Fwave-function-collapse/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JosePedroDias%2Fwave-function-collapse/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/JosePedroDias","download_url":"https://codeload.github.com/JosePedroDias/wave-function-collapse/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243606960,"owners_count":20318314,"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":["algorithm","wave-function-collapse"],"created_at":"2024-11-20T13:30:03.177Z","updated_at":"2025-12-29T08:42:29.114Z","avatar_url":"https://github.com/JosePedroDias.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# intro\n\nWave function collapse in JS\n\nKudos to [CodingQuest](https://www.youtube.com/@CodingQuest2023) and his\n[The Wave Function Collapse algorithm](https://www.youtube.com/watch?v=qRtrj6Pua2A)\nand [accompanying repo implementation in Python](https://github.com/CodingQuest2023/Algorithms) which I ported to Javascript and slightly restructured.\n\n\n# changelog\n\n## 2023/10/23\n- `wfc.mjs` no longer imports `config.mjs` (configuration is now received via DrawWorld.ctor args and Tile's static property setting)\n- minor UI improvements (font scales with sprite scale, github link)\n- early experiments with manipulating initial state\n\n# potential todo list\n\n- manipulate initial state:\n    - by drawing solid forms (circle, bresenham line, rect)\n    - by using simplex noise to drive different zones with different weights?\n- create a WFC editor that reads/writes JSON, similar to [this idea here](https://www.youtube.com/watch?v=OiJmO2BRcVE)\n\n# structure\n\nThe abstract algorithm code sits under `wfc.mjs`.\n`canvas.mjs` has the simplest canvas abstraction I could come up for these purposes.\nIn `main.mjs` you can have the code display the spritesheet, the configured sprites and also run the algorithm (the function activate ATM).\n`config.mjs` drives this WFC setup. The only non-generic code has to do with a fix which superimposes forest over grass so that WFC doesn't have to handle special use cases.\nCreated a simple UI overlay which reads and overrides the URL search parameters for demo purposes, it sits on `ui.mjs`.\n\n# resources\n\n\n## canvas cheat sheet\n- https://simon.html5.org/dump/html5-canvas-cheat-sheet.html\n\n## code\n\n- [alea](https://github.com/coverslide/node-alea)\n- [simplex-noise](https://github.com/jwagner/simplex-noise.js)\n\n## artwork\n\n- 2D ortho\n    - https://merchant-shade.itch.io/16x16-puny-world\n    - https://www.spriters-resource.com/arcade/pacman/sheet/52631/\n    - https://www.spriters-resource.com/pc_computer/pipemania/sheet/19847/\n- 2D side-scroller\n    - https://www.spriters-resource.com/nes/theterminator/sheet/208262/\n- 2D hex\n    - https://kenney.nl/assets/hexagon-pack\n    - https://opengameart.org/content/hex-tileset-pack\n- 3D hex\n    - https://kenney-assets.itch.io/hexagon-kit\n\n## fonts\n- https://fonts.google.com/specimen/Roboto\n- https://www.fontsquirrel.com/tools/webfont-generator\n\n\n## inspiration\n\n- https://www.youtube.com/watch?v=OiJmO2BRcVE (the godot WFC editor)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjosepedrodias%2Fwave-function-collapse","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjosepedrodias%2Fwave-function-collapse","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjosepedrodias%2Fwave-function-collapse/lists"}