mirror of
https://github.com/marcrobledo/RomPatcher.js.git
synced 2025-06-27 16:25:54 +00:00
Updated Embedding Rom Patcher JS (markdown)
parent
e17b72615d
commit
6b3eb8f688
1 changed files with 40 additions and 5 deletions
|
@ -3,12 +3,9 @@ If you are self-hosting your own translations and/or hack patches, you can embed
|
||||||
Take a look at [`index_template.html`](https://github.com/marcrobledo/RomPatcher.js/blob/master/index_template.html) for a template. Basically you need to:
|
Take a look at [`index_template.html`](https://github.com/marcrobledo/RomPatcher.js/blob/master/index_template.html) for a template. Basically you need to:
|
||||||
|
|
||||||
1. [Download the latest version](https://github.com/marcrobledo/RomPatcher.js/releases) and copy the entire `rom-patcher-js/` folder to your site
|
1. [Download the latest version](https://github.com/marcrobledo/RomPatcher.js/releases) and copy the entire `rom-patcher-js/` folder to your site
|
||||||
2. Include **all** file imports from the `<header>` into yours:
|
2. Include the CSS and JS file imports from the `<header>` into yours:
|
||||||
```html
|
```html
|
||||||
<link type="text/css" rel="stylesheet" href="./rom-patcher-js/style.css" media="all" />
|
<link type="text/css" rel="stylesheet" href="./rom-patcher-js/style.css" media="all" />
|
||||||
<script type="text/javascript" src="./rom-patcher-js/modules/BinFile.js"></script>
|
|
||||||
...
|
|
||||||
<script type="text/javascript" src="./rom-patcher-js/RomPatcher.js"></script>
|
|
||||||
<script type="text/javascript" src="./rom-patcher-js/RomPatcher.webapp.js"></script>
|
<script type="text/javascript" src="./rom-patcher-js/RomPatcher.webapp.js"></script>
|
||||||
```
|
```
|
||||||
3. Copy the needed HTML structure from `index_template.html`:
|
3. Copy the needed HTML structure from `index_template.html`:
|
||||||
|
@ -29,7 +26,7 @@ Take a look at [`index_template.html`](https://github.com/marcrobledo/RomPatcher
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
```
|
```
|
||||||
|
5. Customize `style.css` at your own
|
||||||
|
|
||||||
|
|
||||||
# Providing additional patch information
|
# Providing additional patch information
|
||||||
|
@ -86,6 +83,10 @@ const myPatcherSettings={
|
||||||
/* this event is triggered after ROM is validated */
|
/* this event is triggered after ROM is validated */
|
||||||
/* can be used to show a custom error message if provided ROM is not valid */
|
/* can be used to show a custom error message if provided ROM is not valid */
|
||||||
},
|
},
|
||||||
|
onloadpatch: function (patchFile, embededPatchInformation) {
|
||||||
|
/* this event is triggered when user selects a patch from the dropdown */
|
||||||
|
/* can be used to toggle HTML elements in your site depending on the selected patch */
|
||||||
|
},
|
||||||
onpatch: function (romFile) {
|
onpatch: function (romFile) {
|
||||||
/* this event is triggered a ROM is patched */
|
/* this event is triggered a ROM is patched */
|
||||||
/* can be used to modify it before the patched ROM file is saved */
|
/* can be used to modify it before the patched ROM file is saved */
|
||||||
|
@ -206,3 +207,37 @@ SNES ROM files are usually stored in `.sfc` (headerless) or `.smc` (headered) fo
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|
||||||
|
## Example: Detect selected patch
|
||||||
|
By detecting which patch the user selected, you can do cool things in your site like showing different screenshots.
|
||||||
|
```js
|
||||||
|
RomPatcher.initialize(
|
||||||
|
{
|
||||||
|
onloadpatch: function (patchFile, embededPatchInformation) {
|
||||||
|
if (patchFile.getName() === 'legend_of_mana_sword_amanda') {
|
||||||
|
document.getElementById('screenshots_amanda').style.display = 'block';
|
||||||
|
document.getElementById('screenshots_duke').style.display = 'none';
|
||||||
|
}else if(patchFile.getName() === 'legend_of_mana_sword_duke'){
|
||||||
|
document.getElementById('screenshots_amanda').style.display = 'none';
|
||||||
|
document.getElementById('screenshots_duke').style.display = 'block';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}, {
|
||||||
|
file: 'legend_of_mana_sword.zip',
|
||||||
|
name: 'Legend of the Mana sword',
|
||||||
|
patches: [
|
||||||
|
{
|
||||||
|
file: 'legend_of_mana_sword_amanda.ips',
|
||||||
|
description: 'With this patch, you will play as Amanda',
|
||||||
|
outputName: 'Legend of Mana sword (Amanda version)'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
file: 'legend_of_mana_sword_duke.ips',
|
||||||
|
description: 'With this patch, you will play as Duke',
|
||||||
|
outputName: 'Legend of Mana sword (Duke version)'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
);
|
||||||
|
```
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue