mirror of
https://github.com/ad044/lainTSX.git
synced 2024-10-22 23:19:06 +00:00
update the page
This commit is contained in:
parent
85bcbdc6d4
commit
ecc367d56d
4 changed files with 56 additions and 110 deletions
|
@ -69,9 +69,10 @@ const Keybinding = () => {
|
|||
return (
|
||||
<>
|
||||
<p className="keybinding-note">
|
||||
This is the keybindings page. To change a keybinding, just click on it
|
||||
and press the button you wish to bind it to after. In order for this to
|
||||
take effect, you must refresh the game page.
|
||||
To change a keybinding, just click on it and press the button you wish
|
||||
to bind it to after.
|
||||
<br />
|
||||
In order for this to take effect, you must refresh the game page.
|
||||
</p>
|
||||
<br />
|
||||
<div className="keybinding">
|
||||
|
|
|
@ -17,27 +17,23 @@ const MainPage = () => {
|
|||
This is a web reimplementation of the Serial Experiments Lain PSX game
|
||||
with the aim to provide multi-language support.
|
||||
<br />
|
||||
Please make sure to read the <Link to="/notes">notes</Link> before you
|
||||
start playing.
|
||||
<h3><b>Please make sure to read the <Link to="/notes">notes</Link> before you
|
||||
start playing.</b></h3>
|
||||
<br />
|
||||
<br />
|
||||
</p>
|
||||
<p className="faq">
|
||||
FAQ:
|
||||
<br /> <br />
|
||||
<QA
|
||||
question={"I'm confused about the game."}
|
||||
answer={"Amazing! That means the game is working properly."}
|
||||
/>
|
||||
<QA
|
||||
question={
|
||||
"I'm extremely confused about the game and I'm not sure what I'm doing."
|
||||
}
|
||||
answer={`Read the <a href="/#/guide">guide</a>. Keep in mind though that this is only my interpretation of the game and what I pieced together while developing it, it could be wrong.`}
|
||||
answer={`The game is meant to be confusing, if you feel like you can't enjoy it the way it is, check out the <a href="/#/guide">guide</a>. Keep in mind though that this is only my interpretation of the game and what I pieced together while developing it, it could be wrong.`}
|
||||
/>
|
||||
<QA
|
||||
question={"Source code?"}
|
||||
answer={`<a href="https://github.com/ad044/lainTSX">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."}
|
||||
|
@ -74,7 +70,7 @@ const MainPage = () => {
|
|||
<Credit name={"Popcorn"} credit={"Programming help."} />
|
||||
<Credit
|
||||
name={"lelenium"}
|
||||
credit={"Helped with literally everything."}
|
||||
credit={"Managing subtitles/translation, sprites."}
|
||||
/>
|
||||
<Credit name={"BimBuns"} credit={"Fonts, help with Japanese."} />
|
||||
<Credit name={"Phenomenal"} credit={"Help with 3D stuff, fonts."} />
|
||||
|
@ -109,6 +105,12 @@ const MainPage = () => {
|
|||
}
|
||||
credit={"Subtitle timing team."}
|
||||
/>{" "}
|
||||
<Credit
|
||||
name={
|
||||
"Cyle, Chair Broken, aeon, Mainu, karuhaku, pb29"
|
||||
}
|
||||
credit={"Korean translation."}
|
||||
/>{" "}
|
||||
<Credit
|
||||
name={"psx.lain.pl team"}
|
||||
credit={"Providing the base translation."}
|
||||
|
|
|
@ -19,19 +19,14 @@ const Notes = () => {
|
|||
</td>
|
||||
<td>
|
||||
<p>
|
||||
The game performs best on chromium-based browsers - Chromium,
|
||||
Chrome, Edge, Brave, Opera, Iridium, Vivaldi, etc. It's highly
|
||||
recommended that you use one of those for an optimal experience.
|
||||
This is especially true if you're using a bad setup, and even
|
||||
more true if you're using Linux on a bad setup, since Firefox's
|
||||
WebGL implementation on it has had issues for a while now.
|
||||
Your setup must support WebGL2 in order to play this game. The game still runs on a setup with WebGL1, but some textures will look extremely low-quality. You can check this directly by going to{" "}
|
||||
<a href={"https://get.webgl.org/webgl2/"} className="notes-a">
|
||||
this website
|
||||
</a>.
|
||||
If it's not supported, this is most likely due to your browser. Try another one, the game performs best on chromium-based browsers - Chromium, Chrome, Edge, Brave, Opera, Iridium, etc. It's highly recommended that you use one of those for an optimal experience. This is especially true if you're using a bad setup, Linux or Firefox.
|
||||
<br />
|
||||
<br />
|
||||
If it's your first time playing the game, the first time loading
|
||||
it might take a while depending on the factors mentioned above.
|
||||
If you're seeing a black screen for a bit, just wait it out.
|
||||
Subsequent website visits will be much faster once the browser
|
||||
caches all the assets.
|
||||
If it's your first time playing the game, loading it might take a while. If you're seeing a black screen for a bit, just wait it out. Subsequent website visits will be much faster once the browser caches all the assets. Be aware that gameplay already starts at the "Authorize User/Load data" screen, it's not a loading screen.
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
|
@ -41,37 +36,9 @@ const Notes = () => {
|
|||
</td>
|
||||
<td>
|
||||
<p>
|
||||
Browsers require user permission to autoplay audio. If you're
|
||||
not hearing any sound effects, just click somewhere around the
|
||||
page.
|
||||
Browsers require user permission to autoplay audio. If you're not hearing any sound effects, just click somewhere around the page.
|
||||
<br /> <br />
|
||||
We've also had an issue where the player left the game idle for
|
||||
30~ mins, and the browser's autoplay permissions reset. Again,
|
||||
if this happens to you, just click around the page and it'll get
|
||||
fixed.
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<p>WebGL2</p>
|
||||
</td>
|
||||
<td>
|
||||
<p>
|
||||
Your setup must support WebGL2 in order to play this game. You
|
||||
can check this directly by going to{" "}
|
||||
<a href={"https://get.webgl.org/webgl2/"} className="notes-a">
|
||||
this website
|
||||
</a>
|
||||
. If it's not supported, this is most likely due to your
|
||||
browser. Try another one, preferably chromium/firefox-based,
|
||||
keeping in mind the notes written inside Performance. This could
|
||||
also be caused by your drivers being outdated. <br />
|
||||
<br />
|
||||
The game still runs on a setup with WebGL1, but some textures
|
||||
will look extremely low-quality. This is because WebGL1 can't
|
||||
generate mipmaps with non-POT (power of two) textures, so it has
|
||||
to downscale each texture to be POT.
|
||||
We've also had an issue where the player left the game idle for 30~ mins, and the browser's autoplay permissions reset. Again, if this happens to you, just click around the page and it'll get fixed.
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
|
@ -80,132 +47,115 @@ const Notes = () => {
|
|||
<p>Browser Settings</p>
|
||||
</td>
|
||||
<td>
|
||||
<span className="text-center">Firefox</span>
|
||||
<span className="text-center">Firefox specific settings</span>
|
||||
<p className="browser-notes">
|
||||
privacy.resistFingerprinting should be set to false (it should
|
||||
be by default). Otherwise, it limits the maximum WebGL texture
|
||||
size to 2048, resulting in poor sprite quality.
|
||||
privacy.resistFingerprinting should be set to false (normally is by default). Otherwise, it limits the maximum WebGL texture size to 2048, resulting in poor sprite quality.
|
||||
<br />
|
||||
<br />
|
||||
Picture-In-Picture functionality should not be used (you most
|
||||
likely have it disabled already). Just having it enabled won't
|
||||
break anything, but actually using it might lead to some funny
|
||||
visual bugs with media files.
|
||||
Picture-In-Picture functionality should not be used (you most likely have it disabled already). Just having it enabled won't break anything, but actually using it might lead to some funny visual bugs with media files.
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
<p>Changing Language</p>
|
||||
</td>
|
||||
<td>
|
||||
<p>
|
||||
To change the language of subtitles, go to{" "}
|
||||
<Link to={"/options"} className="notes-a">
|
||||
options
|
||||
</Link>.
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
<p>Keyboard Controls</p>
|
||||
<p>Keybinds</p>
|
||||
</td>
|
||||
<td>
|
||||
<table className="control-table">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>ArrowDown</td>
|
||||
<td>↓</td>
|
||||
<td>↓</td>
|
||||
<td>Go down</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>ArrowLeft</td>
|
||||
<td>←</td>
|
||||
<td>←</td>
|
||||
<td>Go left</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>ArrowUp</td>
|
||||
<td>↑</td>
|
||||
<td>↑</td>
|
||||
<td>Go up</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>ArrowRight</td>
|
||||
<td>→</td>
|
||||
<td>→</td>
|
||||
<td>Go right</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>x</td>
|
||||
<td>◯</td>
|
||||
<td>Confirm</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>z</td>
|
||||
<td>✖</td>
|
||||
<td>Back</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>s</td>
|
||||
<td>◼</td>
|
||||
<td>Display node information</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>d</td>
|
||||
<td>▲</td>
|
||||
<td>Menu</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>r</td>
|
||||
<td>R1</td>
|
||||
<td>Rotate right</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>t</td>
|
||||
<td>R2</td>
|
||||
<td>Look Up/Down</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>w</td>
|
||||
<td>L1</td>
|
||||
<td>Rotate left</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>e</td>
|
||||
<td>L2</td>
|
||||
<td>Fast jump to level</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>v</td>
|
||||
<td>START</td>
|
||||
<td>Start/Proceed</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>c</td>
|
||||
<td>SELECT</td>
|
||||
<td>Menu</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>k</td>
|
||||
<td>Upscale Game Window</td>
|
||||
<td></td>
|
||||
<td>Upscale game window</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>j</td>
|
||||
<td>Downscale Game Window</td>
|
||||
<td></td>
|
||||
<td>Downscale game window</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<br />
|
||||
<span className="text-center">
|
||||
If you'd like to change the keybindings, go{" "}
|
||||
<Link to={"/options"} className="notes-a">
|
||||
here
|
||||
</Link>
|
||||
.
|
||||
</span>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>
|
||||
<p>Saving Progress</p>
|
||||
<p>Options</p>
|
||||
</td>
|
||||
<td>
|
||||
<p>
|
||||
There is no auto-save feature just like the original game, so
|
||||
progress must be saved manually. This can be done by navigating
|
||||
to "Save" inside the pause menu in-game, which can be accessed
|
||||
by pressing ▲ (d key on keyboard).
|
||||
<br />
|
||||
The state is stored in a minimized JSON format as a string
|
||||
inside localStorage with the key "lainSaveState".
|
||||
You can change the language of the subtitles, rebind the keys, and export/import the save file over at the <Link to={"/options"} className="notes-a">options</Link> page.
|
||||
<br/><br/>
|
||||
There is no auto-save feature just like the original game, so progress must be saved manually. This can be done by navigating to "Save" inside the pause menu in-game, which can be accessed by pressing ▲ (d key on keyboard).
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
|
|
|
@ -38,22 +38,15 @@
|
|||
margin: 0 auto;
|
||||
border: 1px solid white;
|
||||
padding: 1em;
|
||||
}
|
||||
|
||||
.control-table tr td {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.control-table tr td:first-child {
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.control-table tr td:nth-child(3) {
|
||||
text-align: right;
|
||||
}
|
||||
.control-table tr td:nth-child(2) {
|
||||
padding-left: 1em;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.notes-a {
|
||||
|
|
Loading…
Reference in a new issue