nkc-ug · Yuma-Satake · Sep 2, 2023 · Sep 2, 2023 · Sep 2, 2023 · Sep 2, 2023
diff --git a/README.md b/README.md
@@ -9,6 +9,7 @@
 # ドキュメント
 
 - [ディレクトリ構成](./doc/composition.md)
+- [chatGPTAPI 仕様](./doc/api.md)
 
 # 技術スタック
 

diff --git a/doc/battle.md b/doc/battle.md
diff --git a/doc/composition.md b/doc/composition.md
@@ -4,6 +4,7 @@
 
 ```
 .
+├── .git
 ├── .github
 │   └── workflows
 │       ├── ci.yml
@@ -23,37 +24,106 @@
 │   ├── README.md
 │   └── tsconfig.json
 ├── public
-│   └── favicon.ico
+│   ├── favicon.ico
+│   └── ogp.png
 ├── src
+│   ├── api
+│   │   ├── addWordEmotions.ts
+│   │   ├── getEmotionApi.ts
+│   │   └── getWordEmotions.ts
 │   ├── assets
 │   ├── Audio
 │   ├── components
-│   │   ├── Bgm.tsx
+│   │   ├── auth
+│   │   │   ├── update
+│   │   │   │   ├── BattleWinCount.ts
+│   │   │   │   └── TotalEatCount.ts
+│   │   │   ├── AddUserData.ts
+│   │   │   ├── AuthGoogleSigninPopup.ts
+│   │   │   ├── GetUserData.ts
+│   │   │   ├── LoginButton.tsx
+│   │   │   ├── SetupUserData.ts
+│   │   │   ├── UpdateUserData.ts
+│   │   │   └── UserDataDisplay.tsx
+│   │   ├── battle
+│   │   │   ├── BattleAction.tsx
+│   │   │   ├── BattleForm.tsx
+│   │   │   ├── BattleNavbar.tsx
+│   │   │   ├── BattleNavBarcon.tsx
+│   │   │   ├── BattleResult.tsx
+│   │   │   └── MonsterModal.tsx
+│   │   ├── common
+│   │   │   ├── CircleProgressCon.tsx
+│   │   │   └── VerticalDivider.tsx
+│   │   ├── costume
+│   │   │   ├── BgImageBox.tsx
+│   │   │   ├── ChangeBgImageBox.tsx
+│   │   │   ├── ChangeCostumeBox.tsx
+│   │   │   ├── CostumeBox.tsx
+│   │   │   ├── CostumeHeader.tsx
+│   │   │   ├── CostumeNavbar.tsx
+│   │   │   └── CostumeNavBarcon.tsx
+│   │   ├── navbar
+│   │   │   ├── Bgm.tsx
+│   │   │   ├── NavBar.tsx
+│   │   │   └── NavBarCon.tsx
+│   │   ├── settings
+│   │   │   ├── SettingsNavbar.tsx
+│   │   │   └── SettingsNavBarCon.tsx
+│   │   ├── trophy
+│   │   │   ├── RequestLogin.tsx
+│   │   │   └── TrophyList.tsx
 │   │   ├── Branch.tsx
 │   │   ├── Eat.tsx
 │   │   ├── EvolutionPopup.tsx
 │   │   ├── EvolutionWalk.tsx
-│   │   ├── FlowerPopup.tsx
 │   │   ├── Form.tsx
-│   │   ├── getEmotionApi.ts
-│   │   ├── NavBar.tsx
 │   │   ├── NormalWalk.tsx
+│   │   ├── PageContainer.tsx
 │   │   ├── Pulse.tsx
-│   │   └── Tutorial.tsx
+│   │   ├── ShowNewGrassModal.tsx
+│   │   ├── Tutorial.tsx
+│   │   └── TwitterShare.ts
+│   ├── const
+│   │   └── eatLimit.ts
 │   ├── hooks
-│   │   └── useDiscloser.ts
+│   │   ├── useDiscloser.ts
+│   │   └── useInput.ts
+│   ├── lib
+│   │   ├── analytics.ts
+│   │   ├── AuthGoogleProviderCreate.ts
+│   │   ├── AuthGoogleProviderScopes.ts
+│   │   ├── firebase.ts
+│   │   └── firestore.ts
 │   ├── pages
-│   │   └── AppView.tsx
+│   │   ├── AppView.tsx
+│   │   ├── BattleView.tsx
+│   │   ├── CostumePage.tsx
+│   │   ├── MonsterView.tsx
+│   │   ├── SettingsView.tsx
+│   │   └── TrophyPage.tsx
+│   ├── provider
+│   │   ├── ContextProviders.tsx
+│   │   └── Providers.tsx
 │   ├── routes
 │   │   └── Routers.tsx
+│   ├── styles
+│   │   ├── modalStyle.ts
+│   │   ├── MonsterModalStyle.ts
+│   │   └── textFieldStyle.ts
 │   ├── theme
 │   │   ├── palette.ts
 │   │   ├── theme.ts
 │   │   └── typography.ts
 │   ├── types
-│   │   ├── EatLimit.ts
 │   │   ├── EmotionDataType.ts
-│   │   └── import-image.d.ts
+│   │   ├── import-image.d.ts
+│   │   └── UserDataType.ts
+│   ├── util
+│   │   ├── convertBackGroundImg.ts
+│   │   ├── convertCostume.ts
+│   │   ├── convertGoat.ts
+│   │   └── convertMonster.ts
 │   ├── App.tsx
 │   ├── main.tsx
 │   └── vite-env.d.ts
@@ -62,6 +132,7 @@
 ├── .firebaserc
 ├── .gitignore
 ├── .prettierrc
+├── eslint-results.sarif
 ├── firebase.json
 ├── index.html
 ├── package-lock.json
@@ -76,3 +147,4 @@
 
 - `src/components`: React コンポーネントを格納するディレクトリ
 - `src/pages`: 各ページのコンポーネントを格納するディレクトリ
+- `src/routes`: React ルーティングを格納するディレクトリ
diff --git a/src/components/auth/UserDataDisplay.tsx b/src/components/auth/UserDataDisplay.tsx
@@ -44,21 +44,23 @@ export const UserDataDisplay: FC = () => {
         >
           <Box>
             <Typography variant="h6">ゆーざーID</Typography>
-            <Typography variant="h6">{email}</Typography>
+            <Typography variant="body1">{email}</Typography>
           </Box>
           <Box>
             <Typography variant="h6">ゆーざーねーむ</Typography>
-            <Typography variant="h6">{userData?.userName ?? 'ユーザネームがありません'}</Typography>
+            <Typography variant="body1">
+              {userData?.userName === '' ? 'ユーザネームがありません' : ''}
+            </Typography>
           </Box>
           <Box>
             <Typography variant="h6">ことばをたべさせたかいすう</Typography>
-            <Typography variant="h6">
+            <Typography variant="body1">
               {userData?.totalEatCount ? String(userData?.totalEatCount) : '0'}かい
             </Typography>
           </Box>
           <Box>
             <Typography variant="h6">バトルでかったかいすう</Typography>
-            <Typography variant="h6">
+            <Typography variant="body1">
               {userData?.battleWinCount ? String(userData?.battleWinCount) : '0'}かい
             </Typography>
           </Box>

diff --git a/src/components/battle/MonsterModal.tsx b/src/components/battle/MonsterModal.tsx
@@ -21,6 +21,7 @@ export const MonsterModal: FC<Props> = ({ open, closeClick, monsternumber }) =>
             <br />
             よわいようだ!
             <br />
+            <br />
             ことばをたべさせて
             <br />
             やぎをいかりのかんじょうに
@@ -37,6 +38,7 @@ export const MonsterModal: FC<Props> = ({ open, closeClick, monsternumber }) =>
             <br />
             よわいようだ!
             <br />
+            <br />
             ことばをたべさせて
             <br />
             やぎをかなしいかんじょうに
@@ -53,6 +55,7 @@ export const MonsterModal: FC<Props> = ({ open, closeClick, monsternumber }) =>
             <br />
             よわいようだ!
             <br />
+            <br />
             ことばをたべさせて
             <br />
             やぎをたのしいのかんじょうに
@@ -69,6 +72,7 @@ export const MonsterModal: FC<Props> = ({ open, closeClick, monsternumber }) =>
             <br />
             よわいようだ!
             <br />
+            <br />
             ことばをたべさせて
             <br />
             やぎをよろこびのかんじょうに

diff --git a/src/components/trophy/RequestLogin.tsx b/src/components/trophy/RequestLogin.tsx
@@ -1,19 +1,15 @@
 import { useContext } from 'react';
-import { Box } from '@mui/material';
+import { Box, Typography } from '@mui/material';
 import { IsLoginContext } from '../../provider/ContextProviders';
 import { LoginButton } from '../auth/LoginButton';
 
 export const RequestLogin = () => {
   const [isLogin] = useContext(IsLoginContext);
   return isLogin ? null : (
     <div>
-      <Box sx={{ color: 'rgba(225, 225, 225, 1)' }}>
-        <h2>ログインがひつようです</h2>
-        <h4>
-          トロフィーきのうをつかうにはログインがひつようです。
-          <br />
-          おてすうですがログインしていただくようにおねがいいたします。
-        </h4>
+      <Box sx={{ color: 'rgba(225, 225, 225, 1)', py: 3 }}>
+        <Typography variant="h5">ログインがひつようです</Typography>
+        <h4>トロフィーきのうをつかうには ログインがひつようです</h4>
       </Box>
       <LoginButton />
     </div>

diff --git a/src/pages/SettingsView.tsx b/src/pages/SettingsView.tsx
@@ -1,4 +1,4 @@
-import { Box, Button, ButtonGroup, Divider, Slider, Typography } from '@mui/material';
+import { Box, Button, ButtonGroup, Divider, Slider, Switch, Typography } from '@mui/material';
 import { Container } from '@mui/material';
 import { Stack } from '@mui/material';
 import Paper from '@mui/material/Paper';
@@ -15,8 +15,8 @@ import VolumeUpIcon from '@mui/icons-material/VolumeDown';
 import VolumeOffIcon from '@mui/icons-material/VolumeOff';
 
 export const SettingsView = () => {
-  const [value, setValue] = useState<number>(50);
-  const [isPlaying, setIsPlaying] = useState(true);
+  const [value, setValue] = useState<number>(0);
+  const [isPlaying, setIsPlaying] = useState(false);
   const [isMusicPlaying, setMusicPlaying] = useContext(MusicContext);
   const [backgroundUrl] = useContext(BackgroundContext);
 
@@ -104,11 +104,21 @@ export const SettingsView = () => {
               mb: 1,
             }}
           >
-            おんりょう
+            おんがく
           </Typography>
+          <Stack justifyContent="center" alignItems="center" direction="row">
+            <Switch
+              value={isMusicPlaying}
+              onChange={() => {
+                toggleBGM();
+              }}
+            />
+            <Typography variant="body2">オン・オフ</Typography>
+          </Stack>
           <Stack spacing={2} direction="row" sx={{ mb: 1 }} alignItems="center">
             {value === 0 ? <VolumeOffIcon /> : <VolumeDownIcon />}
             <Slider
+              disabled={!isMusicPlaying}
               aria-label="Volume"
               value={value}
               onChange={(_, newValue) => {
@@ -134,6 +144,7 @@ export const SettingsView = () => {
         }}
       >
         <Container
+          maxWidth="sm"
           disableGutters
           sx={{
             backgroundImage: `url(${backGround.skyUrl})`,
@@ -146,6 +157,7 @@ export const SettingsView = () => {
           }}
         />
         <Container
+          maxWidth="sm"
           disableGutters
           sx={{
             marginTop: '-5dvh',

diff --git a/src/pages/TrophyPage.tsx b/src/pages/TrophyPage.tsx
@@ -27,7 +27,7 @@ export const TrophyPage = () => {
         }}
       >
         <Typography
-          variant="h2"
+          variant="h3"
           sx={{
             margin: '0px',
             padding: '20px',

diff --git a/src/provider/ContextProviders.tsx b/src/provider/ContextProviders.tsx
@@ -1,4 +1,4 @@
-import { FC, createContext, useState } from 'react';
+import { FC, createContext, useRef, useState } from 'react';
 
 type Props = {
   children: React.ReactNode;
@@ -72,6 +72,8 @@ export const ContextProviders: FC<Props> = ({ children }) => {
   //チュートリアルモーダルの状態を保持するステート
   const [isTutorialModal, setIsTutorialModal] = useState(true);
 
+  const audioRef = useRef<HTMLAudioElement | null>(null);
+
   return (
     <GoatClothesContext.Provider value={[clothesUrl, setClothesUrl]}>
       <GoatContext.Provider value={[goatUrl, setGoatUrl]}>