diff --git a/README.md b/README.md index 1b245ac..bf46c81 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@ # SCUMM NES resource explorer -> An app to explore the content of the Maniac Mansion game on NES. +> An app to explore and modify the content of the Maniac Mansion game on NES. ## What is this? @@ -84,7 +84,6 @@ Then deploy the content of the `dist` folder. - Write more tests. - Parse more resource types (scripts, sounds...). - QoF improvements (store the ROM files locally...) -- Enable modification of the resources to create new games. ### Out of scope for now diff --git a/experiments/relocateNtAttrs.js b/experiments/relocateNtAttrs.js index 70c31c6..940a860 100644 --- a/experiments/relocateNtAttrs.js +++ b/experiments/relocateNtAttrs.js @@ -2,7 +2,8 @@ import { parseArgs } from 'node:util'; import { basename } from 'node:path'; -import { loadRom, saveRom, expandRom, inject } from '../src/lib/cliUtils.js'; +import { loadRom, saveRom, expandRom } from '../src/lib/cliUtils.js'; +import { inject } from '../src/lib/romUtils.js'; import parseRoom from '../src/lib/parser/parseRooms.js'; import { zeroPad, hex } from '../src/lib/utils.js'; @@ -119,7 +120,7 @@ for (let i = 0; i < roomNum; i++) { nametableLength, hex(bankOffset + nametableLength, 4), hex(atOffset + headerLength), - attrsLength + attrsLength, ); bankOffset += nametableLength; bankOffset += attrsLength; diff --git a/experiments/updatePreps.js b/experiments/updatePreps.js index bb51231..ab15bb8 100644 --- a/experiments/updatePreps.js +++ b/experiments/updatePreps.js @@ -2,7 +2,8 @@ import { parseArgs } from 'node:util'; import { basename } from 'node:path'; -import { loadRom, saveRom, inject } from '../src/lib/cliUtils.js'; +import { loadRom, saveRom } from '../src/lib/cliUtils.js'; +import { inject } from '../src/lib/romUtils.js'; import serialisePreps from '../src/lib/serialiser/serialisePreps.js'; /* diff --git a/package.json b/package.json index 4c2d29f..0f4878a 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "scumm-nes", - "version": "0.1.2", - "description": "An app to explore the content of the Maniac Mansion game on NES.", + "version": "0.2.0", + "description": "An app to explore and modify the content of the Maniac Mansion game on NES.", "author": "edo999@gmail.com", "license": "BlueOak-1.0.0", "keywords": [ diff --git a/src/App.js b/src/App.js index f671ba9..1bb33b2 100644 --- a/src/App.js +++ b/src/App.js @@ -1,41 +1,19 @@ -import { useState } from 'react'; -import { ErrorBoundary } from 'react-error-boundary'; -import { useNavigate } from 'react-router-dom'; +import { useRom } from './contexts/RomContext'; import Layout from './components/Layout'; import DropZoneContainer from './containers/DropZoneContainer'; import ResourceExplorer from './containers/ResourceExplorer'; -import ErrorMessage from './components/ErrorMessage'; const App = () => { - const [rom, setRom] = useState(null); - const [res, setRes] = useState(null); - const [resources, setResources] = useState(null); - const navigate = useNavigate(); - - const onFile = async (rom, res) => { - const { default: parseRom } = await import('./lib/parser/parseRom'); - setRom(rom); - setRes(res); - setResources(parseRom(rom, res)); - - // Redirect to the first room. - navigate('/rooms/1'); - }; + const { prg, res, resources } = useRom(); return ( - - - {!rom || !res ? ( - - ) : ( - - )} - - + + {!prg || !res || !resources ? ( + + ) : ( + + )} + ); }; diff --git a/src/components/DownloadRom.js b/src/components/DownloadRom.js new file mode 100644 index 0000000..d19e038 --- /dev/null +++ b/src/components/DownloadRom.js @@ -0,0 +1,51 @@ +import { useRef, useState } from 'react'; +import { useRom } from '../contexts/RomContext'; +import { generateRomHackFile } from '../lib/romUtils'; + +const type = 'application/x-nes-rom'; +const fileName = 'mm-hack.nes'; + +const DownloadRom = ({ children }) => { + const { prg, resources } = useRom(); + const [aHref, setAHref] = useState(null); + const aRef = useRef(null); + + if (prg === null) { + return ( + + ); + } + + return ( + <> + + {/* eslint-disable-next-line jsx-a11y/anchor-has-content */} + + + ); +}; + +export default DownloadRom; diff --git a/src/components/Footer.js b/src/components/Footer.js index 3e6d738..32135bf 100644 --- a/src/components/Footer.js +++ b/src/components/Footer.js @@ -46,40 +46,40 @@ const navigation = [ }, ]; -export default function Footer() { - return ( - +); + +export default Footer; diff --git a/src/components/Header.js b/src/components/Header.js index 6b25eac..59eb6e1 100644 --- a/src/components/Header.js +++ b/src/components/Header.js @@ -1,5 +1,6 @@ import { Fragment, useState } from 'react'; import { Link } from 'react-router-dom'; +import DownloadRom from './DownloadRom'; import { Dialog, DialogPanel, @@ -7,6 +8,7 @@ import { TransitionChild, } from '@headlessui/react'; import { + ArrowDownTrayIcon, Cog8ToothIcon, Bars3Icon, XMarkIcon, @@ -22,7 +24,7 @@ const navigation = [ { name: 'Settings', href: '/settings', sideBarOnly: true }, ]; -export default function Header() { +const Header = () => { const [mobileMenuOpen, setMobileMenuOpen] = useState(false); return ( @@ -63,7 +65,13 @@ export default function Header() { ))} -
+
+ + + ))} + + + Download modified ROM + +
@@ -139,4 +152,6 @@ export default function Header() { ); -} +}; + +export default Header; diff --git a/src/components/Layout.js b/src/components/Layout.js index c4dd6a5..5a5eb14 100644 --- a/src/components/Layout.js +++ b/src/components/Layout.js @@ -1,14 +1,14 @@ import Header from './Header'; import Footer from './Footer'; -export default function Layout({ children }) { - return ( -
-
-
- {children} -
-