{"id":22672304,"url":"https://github.com/jimlynchcodes/old-school-gameboy-controls","last_synced_at":"2025-10-08T17:12:28.964Z","repository":{"id":74887884,"uuid":"115536987","full_name":"JimLynchCodes/Old-School-Gameboy-Controls","owner":"JimLynchCodes","description":" A leightweight Javascript library for adding 90's era gameboy-esque input controls to HTML5 games!","archived":false,"fork":false,"pushed_at":"2018-03-30T14:47:38.000Z","size":577,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-09-01T17:45:44.987Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"gpl-3.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/JimLynchCodes.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":"2017-12-27T16:05:09.000Z","updated_at":"2019-03-28T14:14:37.000Z","dependencies_parsed_at":"2023-02-26T21:15:39.181Z","dependency_job_id":null,"html_url":"https://github.com/JimLynchCodes/Old-School-Gameboy-Controls","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/JimLynchCodes/Old-School-Gameboy-Controls","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JimLynchCodes%2FOld-School-Gameboy-Controls","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JimLynchCodes%2FOld-School-Gameboy-Controls/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JimLynchCodes%2FOld-School-Gameboy-Controls/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JimLynchCodes%2FOld-School-Gameboy-Controls/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/JimLynchCodes","download_url":"https://codeload.github.com/JimLynchCodes/Old-School-Gameboy-Controls/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JimLynchCodes%2FOld-School-Gameboy-Controls/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":278981518,"owners_count":26079640,"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-10-08T02:00:06.501Z","response_time":56,"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-12-09T16:18:49.465Z","updated_at":"2025-10-08T17:12:28.959Z","avatar_url":"https://github.com/JimLynchCodes.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\n\n\n# Old School Gameboy Controls \n\n[![Build Status](https://travis-ci.org/JimTheMan/Old-School-Gameboy-Controls.svg?branch=master)](https://travis-ci.org/JimTheMan/Old-School-Gameboy-Controls)\n\n_A leightweight Javascript library for adding 90's era gameboy-esque input controls to HTML5 games!_\n\n\n_Note: This projet is still a work-in-progress._\n\n\n## Current State of Gamebody controls\n\n\u003cimg src=\"./gameboy-controls_3-31-18.png\"/\u003e\n\nCurrently, I have the _up, left, right, and down arrow_ buttons on the page. I also  have the A, B, start, and select buttons in. After having a had a breakthrough with the way I was dispatching Keyboard Events and listening for mouse / touch events, I'm now moving on to polishing off the controls, writing a detailed guide for integrating into your HTML5 game, and creating a sample game with the controls myself!\n\n\n## Motivation For Gameboy Controls\nThis is a normal div and lives outside of the phaser game.\nThe whole point of this is so that the gameboy controls can have a window (where the gameboy screen would be) that the user\ncan just drop their main div in which phaser gets rendered and code as usual. This way the creator can simply build\nthe game listening for arrow key press events and easily have a way to let the user trigger those keypress events on \nmobile devices by simply pressing the gameboy buttons.\n\n## Live Demo\nCheckout the live demo here: https://jimtheman.github.io/Old-School-Gameboy-Controls/\n\nIf the spinning mushroom moves when you click down on the arrow button then you know that it works! Your device is registering the normal phaser keydown and keyup events!\n\n\n### Mappings\n\u003ctable\u003e\n    \u003ctr\u003e\u003cth\u003eGameboy button\u003c/th\u003e\u003cth\u003eQWERTY mapping\u003c/th\u003e\u003c/tr\u003e\n    \u003ctr\u003e\u003ctd\u003eUp arrow\u003c/td\u003e\u003ctd\u003eup arrow\u003c/td\u003e\u003c/tr\u003e\n    \u003ctr\u003e\u003ctd\u003eDown arrow\u003c/td\u003e\u003ctd\u003edown arrow\u003c/td\u003e\u003c/tr\u003e\n    \u003ctr\u003e\u003ctd\u003eLeft arrow\u003c/td\u003e\u003ctd\u003eright arrow\u003c/td\u003e\u003c/tr\u003e\n    \u003ctr\u003e\u003ctd\u003eRight arrow\u003c/td\u003e\u003ctd\u003eleft arrow\u003c/td\u003e\u003c/tr\u003e\n    \u003ctr\u003e\u003ctd\u003eA\u003c/td\u003e\u003ctd\u003ea\u003c/td\u003e\u003c/tr\u003e\n    \u003ctr\u003e\u003ctd\u003eB\u003c/td\u003e\u003ctd\u003es\u003c/td\u003e\u003c/tr\u003e\n    \u003ctr\u003e\u003ctd\u003eStart\u003c/td\u003e\u003ctd\u003ep\u003c/td\u003e\u003c/tr\u003e\n    \u003ctr\u003e\u003ctd\u003eSelect\u003c/td\u003e\u003ctd\u003eEscape\u003c/td\u003e\u003c/tr\u003e\n\u003c/table\u003e\n\n\n#### How To Use Gameboy Controls in Another Project (WIP)\nI'm imagining a syntax where you can just wrap your main root game tag named \"content\" or \"app\" or something and wrap that in\nanother div marked as gameboy-controls. Then you just add the gameboy-controls (or possibly it happens behind the scenes).\n\n```\n\u003c!DOCTYPE html\u003e\n\u003chtml lang=\"en\"\u003e\n\n\u003chead\u003e\n    \u003cmeta charset=\"UTF-8\"\u003e\n    \u003ctitle\u003eExample Of Simple Index.Html With Game Controls/title\u003e\n\u003c/head\u003e\n\n\u003cbody\u003e\n    \u003cscript src=\"./gameboy-controls.js\"\u003e\u003c/script\u003e\n\n    \u003cdiv id=\"gameboy-controls\"\u003e\n        \u003cdiv id=\"content\"\u003e\u003c/div\u003e\n    \u003c/div\u003e\n\n\u003cscript type=\"text/javascript\" src=\"./dist/vendor.bundle.js\"\u003e\u003c/script\u003e\u003cscript type=\"text/javascript\" src=\"./dist/bundle.js\"\u003e\u003c/script\u003e\u003c/body\u003e\n\n\u003c/html\u003e\n\n```\n\n\nThen in your phaser code listen for the arrow keys as usual.\n\n```\n      this.game.input.keyboard.onDownCallback = (e) =\u003e {\n          console.log('Phaser game heard key DOWN event for ' + e.key +\n             \" keycode: \" + e.keyCode + \", charCode: \" + e.charCode);\n\n          \n          if (e.keyCode === 38) {       // up arrow key\n            this.mushroom.x = Math.floor(Math.random() * this.world.bounds.width);\n            this.mushroom.y = Math.floor(Math.random() * this.world.bounds.height);\n          }\n\n      }\n```\n\n\n\nThe images are svg and should scale based on the viewport width to any portrait-layout sreen without degrading quality. \n\n\n$ Contributing To Old-School Gameboy Controls\n\nFeel free free to open issues if you have any questions or suggestions!\n\nThe sample project was scaffolded with Phaser + ES6 + Webpack.\n\n[![js-standard-style](https://cdn.rawgit.com/feross/standard/master/badge.svg)](https://github.com/feross/standard)\n\n\n## Features\n- ESLINT with JavaScript Standard Style configuration\n- Next generation of Javascript\n- Browsers are automatically updated as you change project files\n- Webpack ready\n- WebFont Loader\n\n\n## Setup\n\n### 1. Install node.js and npm:\n\nhttps://nodejs.org/en/\n\n\n### 2. Navigate into the sample-phaser project folder\n\n`cd sample-phaser-project`\n\n\n### 3. Install dependencies (optionally you can install [yarn](https://yarnpkg.com/)):\n\nRun:\n\n```npm install``` \n\nor if you chose yarn, just run ```yarn```\n\n\n### 4. Run the development server:\n\nRun:\n\n```npm run dev```\n\nThis will run a server so you can run the game in a browser. It will also start a watch process, so you can change the source and the process will recompile and refresh the browser automatically.\n\nTo run the game, open your browser and enter http://localhost:3000 into the address bar.\n\n\n### Build for deployment:\n\nRun:\n\n```npm run deploy```\n\n\n_Current build is sort of hackish. You may need to go into build/index.html and change game-controls path to \"./gameboy-controls.js\"_\n\n\n## Deploy to gh-pages\n\nFrom the root fo the project run this:\n\n`git subtree push --prefix sample-phaser-project/build/ origin gh-pages`\n\nThis will optimize and minimize the compiled bundle.\n\n### Deploy for cordova:\nMake sure to uncomment the cordova.js file in the src/index.html and to update config.xml with your informations. (name/description...)\n\nMore informations about the cordova configuration:\nhttps://cordova.apache.org/docs/en/latest/config_ref/\n\nThere is 3 platforms actually tested and supported : \n- browser\n- ios\n- android\n\nFirst run (ios example):\n\n```\nnpm run cordova\ncordova platform add ios\ncordova run ios\n```\n\nUpdate (ios example):\n\n```\nnpm run cordova\ncordova platform update ios\ncordova run ios\n```\n\nThis will optimize and minimize the compiled bundle.\n\n## Config:\nbefore you get to work you will surely want to check the config file. You could setup dimensions, webfonts, etc\n\n## Webfonts:\nIn the config file you can specify which webfonts you want to include. In case you do not want to use webfonts simply leave the array empty\n\n## Credits\nBig thanks to these great repos:\n\nhttps://github.com/belohlavek/phaser-es6-boilerplate\n\nhttps://github.com/cstuncsik/phaser-es6-demo\n\n## Contributors\n\n- https://github.com/jimtheman\n- https://github.com/psyrotix\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjimlynchcodes%2Fold-school-gameboy-controls","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjimlynchcodes%2Fold-school-gameboy-controls","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjimlynchcodes%2Fold-school-gameboy-controls/lists"}