Compare commits

..

7 Commits

Author SHA1 Message Date
snen
1f2db74132 fix github link 2021-11-08 22:40:32 -05:00
snen
4586c09293 upgrade to firebase 9 to fix import issues 2021-11-08 05:08:29 -05:00
snen
2c3d29aef8 update github links 2021-11-08 03:29:26 -05:00
snen
1c88134753 Merge branch 'main' of github.com:sullivansean27/tomecraft into main 2021-10-07 03:25:23 -04:00
snen
8a47729bcc Correctly inform player whether they won 2021-10-07 03:25:03 -04:00
fcd8868849 Set interval for readying command 2021-10-01 19:54:43 -04:00
snen
a3146f055f Clarify readme title 2021-10-01 17:37:53 -04:00
7 changed files with 28 additions and 18 deletions

View File

@ -1,6 +1,6 @@
# Tomecraft # Tomecraft Web
This is a client for a tactical card game server. It is made using [my Deno-React-Web-Starter template repository](https://github.com/sullivansean27/deno-react-web-starter). This is a client for a tactical card game server. It is made using [my Deno-React-Web-Starter template repository](https://github.com/snendev/deno-react-web-starter).
Deployed server is at http://www.tomecraft.xyz/. Code for the websocket server was written by @stryan. Deployed server is at http://www.tomecraft.xyz/. Code for the websocket server was written by @stryan.

View File

@ -1,7 +1,14 @@
import firebase from 'firebase' import {initializeApp} from 'firebase/app'
import 'firebase/auth' import {
getAuth,
onAuthStateChanged,
createUserWithEmailAndPassword,
signInWithEmailAndPassword,
GoogleAuthProvider,
signInWithPopup,
} from 'firebase/auth'
const app = firebase.initializeApp({ const app = initializeApp({
apiKey: "AIzaSyBICkyQIt-9lTsxHvRS1MOlZ-UdFVj8rsA", apiKey: "AIzaSyBICkyQIt-9lTsxHvRS1MOlZ-UdFVj8rsA",
authDomain: "tomecraft-87ce5.firebaseapp.com", authDomain: "tomecraft-87ce5.firebaseapp.com",
projectId: "tomecraft-87ce5", projectId: "tomecraft-87ce5",
@ -10,11 +17,11 @@ const app = firebase.initializeApp({
appId: "1:1021868917316:web:6c58534dd0ed491beab211", appId: "1:1021868917316:web:6c58534dd0ed491beab211",
}) })
const auth = app.auth() const auth = getAuth(app)
// auto-login // auto-login
export function subscribeToAuthState(handleUser: (user: {uid: string; displayName: string} | null) => void) { export function subscribeToAuthState(handleUser: (user: {uid: string; displayName: string} | null) => void) {
return auth.onAuthStateChanged(handleUser) return onAuthStateChanged(auth, handleUser)
} }
/// ///
@ -22,11 +29,11 @@ export function subscribeToAuthState(handleUser: (user: {uid: string; displayNam
/// ///
export async function registerBasic(email: string, password: string) { export async function registerBasic(email: string, password: string) {
const user = await auth.createUserWithEmailAndPassword(email, password) const user = await createUserWithEmailAndPassword(auth, email, password)
} }
export async function loginBasic(email: string, password: string): Promise<string | null> { export async function loginBasic(email: string, password: string): Promise<string | null> {
const credentials = await auth.signInWithEmailAndPassword(email, password) const credentials = await signInWithEmailAndPassword(auth, email, password)
return credentials.user?.uid ?? null return credentials.user?.uid ?? null
} }
@ -36,7 +43,7 @@ export async function loginBasic(email: string, password: string): Promise<strin
export async function loginGoogle(): Promise<string> { export async function loginGoogle(): Promise<string> {
// @ts-ignore deno does not recognize firebase.auth the way it is imported, but it exists // @ts-ignore deno does not recognize firebase.auth the way it is imported, but it exists
const provider = new firebase.auth.GoogleAuthProvider(); const provider = new GoogleAuthProvider(auth);
const {accessToken, credential, user} = await auth.signInWithPopup(provider) const {accessToken, credential, user} = await signInWithPopup(auth, provider)
return user.uid return user.uid
} }

View File

@ -18,7 +18,7 @@ export default function Page({children}: PageProps): JSX.Element {
Tomecraft Tomecraft
</h1> </h1>
<a <a
href="https://github.com/sullivansean27/tomecraft" href="https://github.com/snendev/tomecraft"
target="_blank" target="_blank"
> >
<GithubIcon size={80} /> <GithubIcon size={80} />

View File

@ -14,7 +14,7 @@ export default function Page({children}: PageProps): JSX.Element {
Tomecraft Tomecraft
</h2> </h2>
<a <a
href="https://github.com/sullivansean27/deno-react-web-starter" href="https://github.com/snendev/tomecraft"
target="_blank" target="_blank"
> >
<GithubIcon size={60} /> <GithubIcon size={60} />

View File

@ -90,7 +90,7 @@ export default function Game(props: GameProps): JSX.Element {
</div> </div>
) : ( ) : (
<div> <div>
{maybeIsGameWinner ? "You Lose!" : "You Win!"} {maybeIsGameWinner ? "You Win!" : "You Lose!"}
</div> </div>
)} )}
<div className="player-info"> <div className="player-info">

View File

@ -244,7 +244,12 @@ export default function useServerSocket(
React.useEffect(() => { React.useEffect(() => {
if (state.status !== 'pre-game') return if (state.status !== 'pre-game') return
const intervalId = setInterval(() => {
sendJson({command: 'ready', player_id: state.playerId, match_id: state.matchId}) sendJson({command: 'ready', player_id: state.playerId, match_id: state.matchId})
}, 200)
return () => {
clearInterval(intervalId)
}
}, [sendJson, state]) }, [sendJson, state])
React.useEffect(() => { React.useEffect(() => {

View File

@ -2,9 +2,7 @@
"imports": { "imports": {
"~/": "./", "~/": "./",
"firebase": "https://cdn.skypack.dev/firebase@8.7.0/app", "firebase/": "https://cdn.skypack.dev/firebase@9.3.0/",
"firebase/auth": "https://cdn.skypack.dev/firebase@8.7.0/auth",
"firebase/firestore": "https://cdn.skypack.dev/firebase@8.7.0/firestore",
"http": "https://deno.land/std@0.105.0/http/mod.ts", "http": "https://deno.land/std@0.105.0/http/mod.ts",
"media-types": "https://deno.land/x/media_types@v2.10.0/mod.ts", "media-types": "https://deno.land/x/media_types@v2.10.0/mod.ts",
"oak": "https://deno.land/x/oak@v9.0.1/mod.ts", "oak": "https://deno.land/x/oak@v9.0.1/mod.ts",