{"id":18933129,"url":"https://github.com/dirkk0/aframe-playground","last_synced_at":"2025-04-15T16:34:13.002Z","repository":{"id":141677303,"uuid":"141795832","full_name":"dirkk0/aframe-playground","owner":"dirkk0","description":"A tool to edit and show A-Frame examples in the most frictionless way possible. It doesn't need any online connection and only needs a local webserver.","archived":false,"fork":false,"pushed_at":"2018-07-22T20:00:57.000Z","size":5223,"stargazers_count":4,"open_issues_count":0,"forks_count":1,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-29T00:11:13.522Z","etag":null,"topics":["aframevr","codeeditor","html","javascript"],"latest_commit_sha":null,"homepage":"","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/dirkk0.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,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2018-07-21T08:43:53.000Z","updated_at":"2024-01-17T16:12:35.000Z","dependencies_parsed_at":null,"dependency_job_id":"a223c4d2-4e2c-4fb0-bbe0-9ba5f599c24f","html_url":"https://github.com/dirkk0/aframe-playground","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dirkk0%2Faframe-playground","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dirkk0%2Faframe-playground/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dirkk0%2Faframe-playground/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dirkk0%2Faframe-playground/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/dirkk0","download_url":"https://codeload.github.com/dirkk0/aframe-playground/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":249108808,"owners_count":21214065,"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":["aframevr","codeeditor","html","javascript"],"created_at":"2024-11-08T11:51:41.712Z","updated_at":"2025-04-15T16:34:12.996Z","avatar_url":"https://github.com/dirkk0.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# A-Frame Playground\n\nThe A-Frame playground aims to provide a tool to edit and show A-Frame examples in the most frictionless way possible. It doesn't need any online connection and only needs a local webserver.\n\nMade for educational purposes to teach [A-Frame](https://aframe.io/) but can also be used with standard HTML.\n\nYou can try a [demo here](https://curious-electric.com/w/experiments/aframe/aframe-playground/playground).\n\n\n## Installation\nDownload the zip or clone into the project. To use it you need to run a simple HTTP Server in the main directory.\n\nOn Unix-type OSes you can usually use ```python -m SimpleHTTPServer 9001``` .\n\nIf you prefer NodeJS, you can install a web server with\n\n    npm install http-server -g\n    http-server -p 9001\n\nAfter that, you should be able to open ```http://localhost:9001/playground``` and see something like this:\n\n![screenshot](screenshot2.png)\n\n\n## Features\n\n- fast loading of both code and render view of HTML/JS with one click\n- code editing via [CodeMirror](https://codemirror.net/)\n- hot reloading\n- no server sided components (only the web server)\n- works on mobile devices\n\nThere are a number of features that could be implemented additionally ( file save, autocompletion etc) but I felt the feature set was sufficient for my use case. Feel free to create issues to discuss more features.\n\n## Adapt\n\nTo use your own example files, prepare them by adding a ```\u003c!--START--\u003e``` and ```\u003c!--END--\u003e ``` line to the HTML which you want to use in the use case (see an example [here](https://github.com/dirkk0/aframe-playground/blob/master/examples/cube.html)).\n\nThen put them into the examples directory and add them to the examples array [here](https://github.com/dirkk0/aframe-playground/blob/master/playground/index.html#L55).\n\n## How it works\n\nEverything is done in client-sided JavaScript; the code examples are split into the distinct code views, reassambled once the code is edited, and reloaded into an iFrame.\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdirkk0%2Faframe-playground","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdirkk0%2Faframe-playground","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdirkk0%2Faframe-playground/lists"}