oss/RomPatcher.js
oss/RomPatcher.js
1
0
Fork 0
mirror of https://github.com/marcrobledo/RomPatcher.js.git synced 2025-06-27 16:25:54 +00:00
Code Wiki Activity

Updated Embedding Rom Patcher JS (markdown)

Marc Robledo 2024-08-11 21:35:47 +02:00
parent e17b72615d
commit 6b3eb8f688
1 changed files with 40 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

45
Embedding-Rom-Patcher-JS.md

@ -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:
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
<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>
```
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>
```
5. Customize `style.css` at your own
&nbsp;
# Providing additional patch information
@ -86,6 +83,10 @@ const myPatcherSettings={
/* this event is triggered after ROM is validated */
/* 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) {
/* this event is triggered a ROM is patched */
/* 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
}
);
```
&nbsp;
## 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)'
}
]
}
);
```