mirror of
https://github.com/morluto/rea.git
synced 2026-11-08 15:56:35 +00:00
Ysopwnable
5047373006
Long guides and case studies now have a small `↑ Top` link at the bottom right. It appears after scrolling, returns smoothly to the page header, and moves keyboard focus back to navigation. Reduced-motion users return immediately; the native `#top` link also works without JavaScript. The link is shared by all 11 styled website pages. The README and style guide document it, and the evidence notes retain the original browser-example digest alongside its later navigation addition. Validation: - Website preparation and verification: 12 HTML pages, 195 local references, SVG XML, the six-file ZIP and the sole manual Pages publisher. - Oxfmt, `git diff --check` and `npm run check:fast` with Node.js 24.18.0. - Focused browser checks at `/` and `/rea/`: 22 routes, 21 pointer returns, six keyboard returns, five viewport widths, smooth scrolling, reduced motion, focus return and the no-JavaScript anchor. - Existing site interactions: 24 routes, 68 copy buttons, 20 comparison steps, two CSV exports, two ZIP downloads and eight viewport widths from 320px to 1440px. Code excerpts are unchanged. - Desktop and mobile rendering reviewed. Downloadable Electron source and CSV export source/data are unchanged. Publication continues through the existing manual Pages workflow after merge.
124 lines
5.1 KiB
HTML
124 lines
5.1 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<title>Case studies — REA</title>
|
|
<meta
|
|
name="description"
|
|
content="Follow REA investigations through code and figures: DX-Ball's sound pan, Notion's Electron clipboard and TH04's aimed bullet rings."
|
|
/>
|
|
<meta name="theme-color" content="#ffffff" />
|
|
<link rel="icon" href="../assets/favicon.svg" type="image/svg+xml" />
|
|
<link rel="stylesheet" href="../assets/styles.css" />
|
|
<script src="../assets/main.js" defer></script>
|
|
</head>
|
|
<body id="top">
|
|
<a class="skip-link" href="#main">Skip to content</a>
|
|
<header class="site-header">
|
|
<div class="container header-inner">
|
|
<a class="brand" href="../" aria-label="REA home"
|
|
><span class="brand-name">REA</span
|
|
><span class="brand-caption">Reverse Engineer Anything</span></a
|
|
>
|
|
<nav class="navigation" aria-label="Main navigation">
|
|
<a href="./" aria-current="page">Showcases</a>
|
|
<a class="nav-start" href="../get-started/">Get started</a>
|
|
<a href="../guides/">Guides</a>
|
|
<a href="https://github.com/morluto/rea">GitHub</a>
|
|
</nav>
|
|
</div>
|
|
</header>
|
|
<main id="main" class="container">
|
|
<div class="page-heading">
|
|
<p class="breadcrumb"><a href="../">Home</a> / Showcases</p>
|
|
<h1>REA case studies.</h1>
|
|
<p class="lede">
|
|
Game reconstruction and Electron analysis, with examples from DX-Ball,
|
|
Notion and TH04.
|
|
</p>
|
|
</div>
|
|
<div class="guide-index">
|
|
<section class="guide-entry">
|
|
<p class="eyebrow">Native · Reconstruction</p>
|
|
<div>
|
|
<h2>DX-Ball's sound-pan calculation</h2>
|
|
<p>
|
|
Recover a sound-pan calculation from a 1996 Windows game. REA's
|
|
instructions, caller references and numeric constants lead to a
|
|
small C function, checked against the original behavior and all 63
|
|
compiled bytes.
|
|
</p>
|
|
<div class="guide-route">
|
|
<span>Executable</span> <b aria-hidden="true">→</b>
|
|
<span>REA findings</span> <b aria-hidden="true">→</b>
|
|
<span>Recovered C</span> <b aria-hidden="true">→</b>
|
|
<span>Validation</span>
|
|
</div>
|
|
<a class="text-link" href="dx-ball/">Read the DX-Ball case study</a>
|
|
</div>
|
|
</section>
|
|
<section class="guide-entry">
|
|
<p class="eyebrow">Electron · Feature tracing</p>
|
|
<div>
|
|
<h2>How Notion copies text and HTML</h2>
|
|
<p>
|
|
Trace a page-facing API through Notion's packaged JavaScript.
|
|
Follow its IPC wrappers to the system clipboard, then see how a
|
|
small HTML marker keeps rich block data connected to a copy.
|
|
</p>
|
|
<div class="guide-route">
|
|
<span>Packaged app</span> <b aria-hidden="true">→</b>
|
|
<span>Exposed API</span> <b aria-hidden="true">→</b>
|
|
<span>IPC wrappers</span> <b aria-hidden="true">→</b>
|
|
<span>Clipboard</span>
|
|
</div>
|
|
<a class="text-link" href="notion/">Read the Notion case study</a>
|
|
</div>
|
|
</section>
|
|
<section class="guide-entry">
|
|
<p class="eyebrow">PC-98 DOS · Reconstruction</p>
|
|
<div>
|
|
<h2>How TH04 aims a ring of bullets</h2>
|
|
<p>
|
|
Inspect the original 16-bit angle helper with REA. Match its
|
|
multiply, divide and coordinate operations to readable C++, then
|
|
see how they produce a ring aimed at the player.
|
|
</p>
|
|
<div class="guide-route">
|
|
<span>Original DOS code</span> <b aria-hidden="true">→</b>
|
|
<span>REA instructions</span> <b aria-hidden="true">→</b>
|
|
<span>Angle calculation</span> <b aria-hidden="true">→</b>
|
|
<span>Bullet ring</span>
|
|
</div>
|
|
<a class="text-link" href="th04/">Read the TH04 case study</a>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
<section class="article-section">
|
|
<h2>Step-by-step guides</h2>
|
|
<p>
|
|
The guides walk through a native calculation, an Electron export and a
|
|
browser request. Each starts with a prompt and a concrete target.
|
|
</p>
|
|
<a class="text-link" href="../guides/">Read the guides</a>
|
|
</section>
|
|
</main>
|
|
<footer class="site-footer">
|
|
<div class="container footer-inner">
|
|
<p>REA · Reverse Engineer Anything</p>
|
|
<div class="footer-links">
|
|
<a href="https://github.com/morluto/rea">Source</a
|
|
><a href="https://github.com/morluto/rea/blob/main/LICENSE"
|
|
>MIT license</a
|
|
><a href="https://discord.gg/GkcryMnJDM">Community</a>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
<p class="sr-only" id="copy-status" role="status" aria-live="polite"></p>
|
|
<a class="back-to-top" href="#top" aria-label="Back to top">
|
|
<span aria-hidden="true">↑</span> Top
|
|
</a>
|
|
</body>
|
|
</html>
|