alex/agb
1
0
Fork 0
mirror of https://github.com/italicsjenga/agb.git synced 2024-12-23 08:11:33 +11:00
Code Issues Packages Projects Releases Wiki Activity

more mobile stuff

Browse source
This commit is contained in:
Corwin 2024-04-05 17:09:50 +01:00
parent e43d2d5a3e
commit 552f8f878d
No known key found for this signature in database
3 changed files with 125 additions and 115 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
website/app/src/mgba.tsx
View file

@ -6,7 +6,7 @@ import {
useState, useState,
} from "react"; } from "react";
import mGBA from "./vendor/mgba"; import mGBA from "./vendor/mgba";
import { KeyBindings } from "./bindings"; import { GbaKey, KeyBindings } from "./bindings";
import { styled } from "styled-components"; import { styled } from "styled-components";
type Module = any; type Module = any;
@ -36,6 +36,8 @@ const MgbaCanvas = styled.canvas`
export interface MgbaHandle { export interface MgbaHandle {
restart: () => void; restart: () => void;
buttonPress: (key: GbaKey) => void;
buttonRelease: (key: GbaKey) => void;
} }
export const Mgba = forwardRef<MgbaHandle, MgbaProps>( export const Mgba = forwardRef<MgbaHandle, MgbaProps>(
@ -124,6 +126,8 @@ export const Mgba = forwardRef<MgbaHandle, MgbaProps>(
useImperativeHandle(ref, () => { useImperativeHandle(ref, () => {
return { return {
restart: () => mgbaModule.current.quickReload(), restart: () => mgbaModule.current.quickReload(),
buttonPress: (key: GbaKey) => mgbaModule.current.buttonPress(key),
buttonRelease: (key: GbaKey) => mgbaModule.current.buttonRelease(key),
}; };
}); });

1
website/site/crash/index.html
View file

@ -1,6 +1,7 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>agbrs crash backtrace</title> <title>agbrs crash backtrace</title>
<style> <style>
body { body {

19
website/site/index.html
View file

@ -1,5 +1,6 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>agb - a rust framework for making Game Boy Advance games</title> <title>agb - a rust framework for making Game Boy Advance games</title>
@ -20,11 +21,13 @@
flex-direction: column; flex-direction: column;
margin: 0; margin: 0;
} }
h1, h1,
h2, h2,
h3 { h3 {
line-height: 1.2; line-height: 1.2;
} }
.gameDisplay>div { .gameDisplay>div {
display: flex; display: flex;
justify-content: center; justify-content: center;
@ -35,7 +38,7 @@
height: clamp(480px, 40vh, calc(100vw / 3)); height: clamp(480px, 40vh, calc(100vw / 3));
max-width: 100vw; max-width: 100vw;
margin-top: 20px; margin-top: 20px;
overflow-x: hidden; overflow: hidden;
} }
.gameDisplay .imageWrapper { .gameDisplay .imageWrapper {
@ -56,7 +59,7 @@
} }
header, header,
.help { .desktopHelp {
max-width: 60%; max-width: 60%;
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
@ -92,6 +95,7 @@
} }
</style> </style>
</head> </head>
<body> <body>
<header> <header>
<h1>agb - a rust framework for making Game Boy Advance games</h1> <h1>agb - a rust framework for making Game Boy Advance games</h1>
@ -100,14 +104,14 @@
<div class="gameDisplay"> <div class="gameDisplay">
<div> <div>
<div class="imageWrapper"><img src="assets/left.png" /></div> <div class="imageWrapper"><img src="assets/left.png" /></div>
<iframe <iframe id="gameFrame" onload="this.contentWindow.focus()" src="mgba/index.html#/assets/combo.gba"></iframe>
onload="this.contentWindow.focus()"
src="mgba/index.html#/assets/combo.gba"
></iframe>
<div class="imageWrapper"><img src="assets/right.png" /></div> <div class="imageWrapper"><img src="assets/right.png" /></div>
</div> </div>
</div> </div>
<div class="help"> <div class="mobileControls">
</div>
<div class="desktopHelp">
<p> <p>
Press escape to open the menu where you can view or change controls Press escape to open the menu where you can view or change controls
and restart the game. The game provided is a combination of multiple and restart the game. The game provided is a combination of multiple
@ -124,4 +128,5 @@
</div> </div>
</section> </section>
</body> </body>
</html> </html>