diff --git a/.gitignore b/.gitignore index fd3dbb5..9f33194 100644 --- a/.gitignore +++ b/.gitignore @@ -1,36 +1,33 @@ # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. -# dependencies +# Dependencies /node_modules /.pnp .pnp.js -.yarn/install-state.gz +.yarn +.yarnrc +.yarn.lock -# testing -/coverage +# Next.js +/.next +/out -# next.js -/.next/ -/out/ - -# production +# Production /build -# misc +# Miscellaneous .DS_Store -*.pem -# debug +# Debug npm-debug.log* yarn-debug.log* yarn-error.log* -# local env files -.env*.local - -# vercel -.vercel +# Local environment files +.env.local +.env.development.local +.env.test.local +.env.production.local -# typescript -*.tsbuildinfo -next-env.d.ts +# Others +.NOTES.md \ No newline at end of file diff --git a/next-env.d.ts b/next-env.d.ts new file mode 100644 index 0000000..4f11a03 --- /dev/null +++ b/next-env.d.ts @@ -0,0 +1,5 @@ +/// +/// + +// NOTE: This file should not be edited +// see https://nextjs.org/docs/basic-features/typescript for more information. diff --git a/src/app/favicon.ico b/src/app/favicon.ico deleted file mode 100644 index 718d6fe..0000000 Binary files a/src/app/favicon.ico and /dev/null differ diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 40e027f..b498d60 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -1,22 +1,22 @@ -import type { Metadata } from 'next' -import { Inter } from 'next/font/google' -import './globals.css' +import type { Metadata } from "next"; +import { Inter } from "next/font/google"; +import "./globals.css"; -const inter = Inter({ subsets: ['latin'] }) +const inter = Inter({ subsets: ["latin"] }); export const metadata: Metadata = { - title: 'Create Next App', - description: 'Generated by create next app', -} + title: "Create Next App", + description: "Generated by create next app", +}; export default function RootLayout({ children, }: { - children: React.ReactNode + readonly children: React.ReactNode; }) { return ( {children} - ) + ); } diff --git a/src/app/page.tsx b/src/app/page.tsx index b973266..6fc57f0 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,113 +1,167 @@ -import Image from 'next/image' +"use client"; + +import Choose from "@/components/Choose"; +import GameOver from "@/components/GameOver"; +import Play from "@/components/Play"; +import Toss from "@/components/Toss"; +import { useState } from "react"; export default function Home() { - return ( -
-
-

- Get started by editing  - src/app/page.tsx -

-
- - By{' '} - Vercel Logo - -
-
+ const [tossed, setTossed] = useState(false); // to check if the toss is done + const [choosed, setChoosed] = useState(false); // to check if the user has choosed batting or bowling + const [userBatting, setUserBatting] = useState(false); // to check if the user is batting + const [toss, setToss] = useState(""); // to store the toss result + const [play, setPlay] = useState(false); // to check if the game is started + const [userScore, setUserScore] = useState(0); // to store the user score + const [computerScore, setComputerScore] = useState(0); // to store the computer score + const [firstInning, setFirstInning] = useState(true); // to check if the first inning is done + const [balls, setBalls] = useState(0); // to store the balls + const [gameOver, setGameOver] = useState(false); + const [message, setMessage] = useState(""); -
- Next.js Logo -
+ function restart() { + setTossed(false); + setChoosed(false); + setUserBatting(false); + setToss(""); + setPlay(false); + setUserScore(0); + setComputerScore(0); + setFirstInning(true); + setBalls(0); + setGameOver(false); + setMessage(""); + } -
- -

- Docs{' '} - - -> - -

-

- Find in-depth information about Next.js features and API. -

- + function generateToss() { + const random = Math.random(); + if (random < 0.5) { + return "Heads"; + } else { + return "Tails"; + } + } - -

- Learn{' '} - - -> - -

-

- Learn about Next.js in an interactive course with quizzes! -

- + function generateComputerChoice() { + const random = Math.random(); + if (random < 0.5) { + return "Batting"; + } else { + return "Bowling"; + } + } - -

- Templates{' '} - - -> - -

-

- Explore starter templates for Next.js. -

- + function handleSubmit(event: any) { + setTossed(true); + console.log(event.target.value); + if (event.target.value === generateToss()) { + setToss("You won the toss"); + } else { + setToss("You lost the toss"); + const computerChoice = generateComputerChoice(); + if (computerChoice == "Batting") { + setUserBatting(false); + } else { + setUserBatting(true); + } + setChoosed(true); + setPlay(true); + } + } - -

- Deploy{' '} - - -> - -

-

- Instantly deploy your Next.js site to a shareable URL with Vercel. + function generateComputerScore() { + return Math.floor(Math.random() * 6) + 1; + } + + function handleUserBatting(userShot: number, computerShot: number) { + if (userShot === computerShot) { + if (firstInning) { + setFirstInning(false); + setUserBatting(false); + } else { + setGameOver(true); + setMessage("You are out. Computer won the match"); + } + } else { + setUserScore(userScore + userShot); + } + } + + function handleUserBowling(userShot: number, computerShot: number) { + if (userShot === computerShot) { + if (firstInning) { + setFirstInning(false); + setUserBatting(true); + } else { + setGameOver(true); + setMessage("Computer is out. You won the match"); + } + } else { + setComputerScore(computerScore + computerShot); + } + } + + function handlePlay(event: any) { + if (balls === 6) { + if (firstInning) { + setFirstInning(false); + setUserBatting(!userBatting); + setBalls(0); + } else { + setGameOver(true); + if (userScore > computerScore) { + setMessage("You won the match"); + } else if (computerScore > userScore) { + setMessage("Computer won the match"); + } else { + setMessage("Match draw"); + } + } + } + const userShot = parseInt(event.target.value); + const computerShot = generateComputerScore(); + setBalls(balls + 1); + + if (userBatting) { + handleUserBatting(userShot, computerShot); + } else { + handleUserBowling(userShot, computerShot); + } + } + if (gameOver) { + return ; + } + + return ( +

+ -
- ) + + ); } diff --git a/src/components/Choose.tsx b/src/components/Choose.tsx new file mode 100644 index 0000000..0e47af2 --- /dev/null +++ b/src/components/Choose.tsx @@ -0,0 +1,36 @@ +interface ChooseProps { + readonly setUserBatting: (value: boolean) => void; + readonly setChoosed: (value: boolean) => void; + readonly setPlay: (value: boolean) => void; +} + +export default function Choose({ + setUserBatting, + setChoosed, + setPlay, +}: ChooseProps) { + return ( +
+ { + setUserBatting(true); + setChoosed(true); + setPlay(true); + }} + /> + { + setUserBatting(false); + setChoosed(true); + setPlay(true); + }} + /> +
+ ); +} diff --git a/src/components/GameOver.tsx b/src/components/GameOver.tsx new file mode 100644 index 0000000..8103e9f --- /dev/null +++ b/src/components/GameOver.tsx @@ -0,0 +1,13 @@ +interface GameOverProps { + readonly message: string; + readonly restart: () => void; +} + +export default function GameOver({ message, restart }: GameOverProps) { + return ( +
+

{message}

+ +
+ ); +} diff --git a/src/components/Play.tsx b/src/components/Play.tsx new file mode 100644 index 0000000..fe7f022 --- /dev/null +++ b/src/components/Play.tsx @@ -0,0 +1,43 @@ +interface PlayProps { + readonly userBatting: boolean; + readonly handlePlay: (event: any) => void; + readonly computerScore: number; + readonly userScore: number; + readonly balls: number; + readonly firstInning: boolean; + readonly gameOver: boolean; +} + +export default function Play({ + userBatting, + handlePlay, + computerScore, + userScore, + balls, + firstInning, + gameOver, +}: PlayProps) { + return ( +
+

Play

+

{userBatting ? "You are batting" : "You are bowling"}

+
+ {["1", "2", "3", "4", "5", "6"].map((item, index) => ( + + ))} +
+

Computer Score: {computerScore}

+

Your Score: {userScore}

+

Balls: {balls}

+

First Inning: {firstInning ? "Yes" : "No"}

+

Game Over: {gameOver ? "Yes" : "No"}

+
+ ); +} diff --git a/src/components/Toss.tsx b/src/components/Toss.tsx new file mode 100644 index 0000000..da32f64 --- /dev/null +++ b/src/components/Toss.tsx @@ -0,0 +1,24 @@ +import React, { MouseEventHandler } from "react"; + +interface TossProps { + readonly handleSubmit: MouseEventHandler; +} + +export default function Toss({ handleSubmit }: TossProps) { + return ( +
+ + +
+ ); +}