added readme, renamed npm package

This commit is contained in:
ad044 2021-03-23 20:38:40 +04:00
parent 862f2ed0e8
commit b896adcbfa
12 changed files with 73 additions and 6 deletions

3
.gitmodules vendored
View file

@ -1,3 +0,0 @@
[submodule "scripts/dump"]
path = scripts/dump
url = https://github.com/2-3/lain-psx-ts-dump

70
README.md Normal file
View file

@ -0,0 +1,70 @@
## lainTSX
A browser-based implementation of the Serial Experiments Lain PSX game using `react-three-fiber` with the aim to provide multi-language support and make it more accessible.
## History
The original PSX game was released in Japan, back in 1998. The game never got a proper english adaptation, which resulted in all non-japanese speaking players either having to play through the game while simultaneously reading through the translation, or simply not playing the game at all and only reading it.
The goal of this project is to provide a better experience for those willing to play the game, and the way to do so is by implementing a subtitle system, which has the capability to support multiple languages.
## Building locally
Building locally is currently not possible. This is because the repository lacks static assets ripped from the game due to it being copyrighted content. The plan is to write an extraction script (currently located inside `scripts/extract`), where the user who owns the game provides the disc binaries themselves, and the script automates the static file extraction. This script is still WIP.
## Code strutcure
- **/src/**
- **/\_\_tests\_\_/** - Jest tests.
- **/components/** - TSX components used in the actual 3D environment (sprites, meshes, etc.).
- **/dom-components/** - TSX components used in the website itself (index page, guide, notes, etc.).
- **/core/** - State management. Contextual (scene/state influenced) processors, mutation handler, event templates.
- **/helpers/** - Helper functions used to boostrap functionalities (node finding algorithm, name selection handlers, etc.).
- **/hooks/** - Custom hooks for React.
- **/resources/** - Mostly reverse-engineered JSON data the game uses for a variety of tasks (node positions, font texture atlas definitions, etc.).
- **/scenes/** - TSX components containing scene definitions.
- **/static/** - Static files (sprites, css, sfx, media, fonts).
- **/types/** - Type definitions.
- **/utils/** - Utility functions.
- **store.ts** - Zustand store used for managing global state.
- **/scripts/**
- **/extract/** - WIP extraction script to automate the local building process of the game.
## Importing/exporting game progress from within the browser
Once you've saved the game manually (going into pause => selecting Save), look inside the `localStorage` of your browser and copy the value of the key `lainSaveState`. Changing that value and calling Load Game from the main menu will load that save state. Keep in mind manually modifying the JSON and loading it might lead to some funny bugs since the dependency graph of the game progress is not linear.
## Screenshots
<img src="markdown/img/1.png" width="50%"></img>
<img src="markdown/img/2.jpg" width="50%"></img>
<img src="markdown/img/3.png" width="50%"></img>
<img src="markdown/img/4.png" width="50%"></img>
<img src="markdown/img/5.png" width="50%"></img>
<img src="markdown/img/6.png" width="50%"></img>
<img src="markdown/img/7.png" width="50%"></img>
## TODO
- **Finish writing the extraction script**
- **Improve/complete the translation**
- **Implement an interface for changing languages**
- **Allow the player to modify the keybindings**
- **Implement a better way of exporting/importing save files**
## Reporting bugs/Contributing
If you have any ideas/suggestions/found an issue or want to help us with the translation or anything else, please submit an issue or join our [Discord server](https://discord.com/invite/W22Ga2R).
## Tools used while developing
- [`jPSXdec`](https://github.com/m35/jpsxdec) - PlayStation 1 audio/video converter.
- [`three.js`](https://github.com/mrdoob/three.js/) - JavaScript 3D renderer.
- [`react-three-fiber`](https://github.com/pmndrs/react-three-fiber) - three.js wrapper for React.
- [`zustand`](https://github.com/pmndrs/zustand) - State management library for React.
- [`react-spring`](https://github.com/pmndrs/react-spring) - Animation library.
- [`drei`](https://github.com/pmndrs/drei) - Utilities for react-three-fiber.
- [`three-plain-animator`](https://github.com/MaciejWWojcik/three-plain-animator) - Sprite animation library.

BIN
markdown/img/1.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 989 KiB

BIN
markdown/img/2.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 149 KiB

BIN
markdown/img/3.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 888 KiB

BIN
markdown/img/4.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 500 KiB

BIN
markdown/img/5.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 457 KiB

BIN
markdown/img/6.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 729 KiB

BIN
markdown/img/7.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 449 KiB

2
package-lock.json generated
View file

@ -1,5 +1,5 @@
{
"name": "lain-psx-ts",
"name": "lain-tsx",
"version": "0.1.0",
"lockfileVersion": 1,
"requires": true,

View file

@ -1,5 +1,5 @@
{
"name": "lain-psx-ts",
"name": "lain-tsx",
"version": "0.1.0",
"private": true,
"dependencies": {

View file

@ -33,7 +33,7 @@ const MainPage = () => {
/>
<QA
question={"Source code?"}
answer={`<a href="https://github.com/ad044/lain-psx-ts">On my github.</a>`}
answer={`<a href="https://github.com/ad044/lainTSX">On my github.</a>`}
/>
<QA
question={"I found an issue/have a suggestion/etc."}