You once had a NES in your home, now you can have one on your web page. <x-nes> is the web component you didn't know you needed.
<x-nes> can be installed through npm or bower:
npm install x-nes
bower install x-nes
Using <x-nes> is easy. Simply import a piece of HTML and then start using the tag:
<link rel="import" href="./node_modules/x-nes/dist/x-nes.html">
<x-nes src="./roms/supermario.nes">See the demo for an example.
The following attributes are supported:
| Name | type | Description |
|---|---|---|
| autoplay | boolean | If true, ROM will automatically load and play. |
| muted | boolean | If true, sound will be disabled. |
| preload | "none" or "auto" | If "auto", ROM will be preloaded (but not played). |
| poster | string | Path to image to use when ROM is not playing yet. |
| src | string | Required. Path to INES ROM (usually .nes) file. |
<x-nes> works in Chrome and Opera without any dependencies. Other modern browsers require the webcomponent.js polyfill (the most recent versions of IE and Firefox have been tested).
<x-nes> can be built by installing the dependencies, then running make:
npm install
make
This will create x-nes.html in the dist/ directory.
<x-nes> is built on NESNES. If you find any problems, please file an issue there.
The icons were borrowed from the plyr HTML5 media player. Do check it out!