109 lines
3.1 KiB
Markdown
109 lines
3.1 KiB
Markdown
# ruffle-demo
|
|
|
|
ruffle-demo is an example of how to include Ruffle in your website.
|
|
It also serves as a nice local test to run Ruffle in the web locally, for developers.
|
|
|
|
## Using ruffle-demo
|
|
|
|
### Hosted demo
|
|
|
|
To view this demo online right now, [check out the hosted demo](https://ruffle.rs/demo).
|
|
|
|
It's exactly the same code as this directory, updated nightly.
|
|
|
|
### Run your own demo
|
|
|
|
After [building ruffle-web](https://github.com/ruffle-rs/ruffle/blob/master/web/README.md#building-from-source),
|
|
you can run `npm run demo` in the `web` folder to launch the demo.
|
|
|
|
It will start a local web server and print the address in the console.
|
|
Navigate to that website (usually [http://localhost:4173](http://localhost:4173)) in your browser.
|
|
|
|
### Configuring the demo
|
|
|
|
The demo provides the ability to have a list of sample SWFs to choose from.
|
|
This can be helpful if you have a list of useful SWFs to test through, and we use it ourselves
|
|
to showcase Ruffle on various games or animations.
|
|
|
|
To use this, add a new file `swfs.json` in this directory. The contents should look like this:
|
|
|
|
```json
|
|
{
|
|
"swfs": [
|
|
{
|
|
"location": "logo-anim.swf",
|
|
"title": "Ruffle Logo",
|
|
"author": "Ruffle contributors",
|
|
"authorLink": "https://ruffle.rs",
|
|
"config": {
|
|
"autoplay": "on",
|
|
"backgroundColor": "#31497D",
|
|
"letterbox": "off",
|
|
"unmuteOverlay": "hidden"
|
|
}
|
|
},
|
|
{
|
|
"location": "swfs/bitey1.swf",
|
|
"title": "Bitey of Brackenwood",
|
|
"author": "Adam Phillips",
|
|
"authorLink": "https://bitey.com",
|
|
"type": "Animation"
|
|
},
|
|
{
|
|
"location": "swfs/saturday_morning_watchmen.swf",
|
|
"title": "Saturday Morning Watchmen",
|
|
"author": "Harry Partridge",
|
|
"authorLink": "https://twitter.com/HappyHarryToons",
|
|
"type": "Animation"
|
|
},
|
|
{
|
|
"location": "swfs/synj1.swf",
|
|
"title": "Synj vs. Horrid Part 1",
|
|
"author": "Dan Paladin",
|
|
"authorLink": "https://www.thebehemoth.com",
|
|
"type": "Animation"
|
|
},
|
|
{
|
|
"location": "swfs/synj2.swf",
|
|
"title": "Synj vs. Horrid Part 2",
|
|
"author": "Dan Paladin",
|
|
"authorLink": "https://www.thebehemoth.com",
|
|
"type": "Animation"
|
|
},
|
|
|
|
{
|
|
"location": "swfs/alien_hominid.swf",
|
|
"title": "Alien Hominid",
|
|
"author": "Tom Fulp and Dan Paladin",
|
|
"authorLink": "https://www.newgrounds.com",
|
|
"type": "Game"
|
|
},
|
|
{
|
|
"location": "swfs/flyguy.swf",
|
|
"title": "FlyGuy",
|
|
"author": "Trevor van Meter",
|
|
"authorLink": "https://www.heytvm.com",
|
|
"type": "Game"
|
|
},
|
|
{
|
|
"location": "swfs/marvin_spectrum.swf",
|
|
"title": "Marvin Spectrum",
|
|
"author": "Bryan Singh",
|
|
"authorLink": "https://www.hotbryan.com",
|
|
"type": "Game"
|
|
},
|
|
{
|
|
"location": "swfs/wasted_sky.swf",
|
|
"title": "Wasted Sky",
|
|
"author": "Tom Fulp",
|
|
"authorLink": "https://www.newgrounds.com",
|
|
"type": "Game"
|
|
}
|
|
]
|
|
}
|
|
```
|
|
|
|
## Building, testing or contributing
|
|
|
|
Please see [the ruffle-web README](https://github.com/ruffle-rs/ruffle/blob/master/web/README.md).
|