From decf637945b0a5c2d9d1f54b09c24201bbd53914 Mon Sep 17 00:00:00 2001 From: Gustavo Date: Mon, 3 Oct 2022 13:18:53 -0300 Subject: [PATCH] Inicia projeto do Gym - Cesmac --- .gitignore | 24 + index.html | 13 + package.json | 29 + public/vite.svg | 1 + src/App.tsx | 117 ++ src/assets/1663003133164.gif | Bin 0 -> 516670 bytes src/assets/dale.mp3 | Bin 0 -> 3265965 bytes src/assets/gugas.png | Bin 0 -> 39272 bytes src/assets/react.svg | 1 + src/assets/sound.svg | 10 + src/assets/vite.svg | 15 + src/components/Content/index.tsx | 19 + src/components/Content/styles.ts | 26 + src/components/Footer/index.tsx | 49 + src/components/Footer/styles.ts | 231 ++++ src/components/MainHeader/index.tsx | 36 + src/components/MainHeader/styles.ts | 97 ++ src/components/UserCard/index.tsx | 10 + src/components/UserCard/styles.ts | 20 + src/contexts/AppContext.ts | 3 + src/main.tsx | 11 + src/styles/GlobalStyles.ts | 9 + src/styles/Layout.ts | 12 + src/vite-env.d.ts | 1 + tsconfig.json | 21 + tsconfig.node.json | 9 + vite.config.ts | 7 + yarn.lock | 1839 +++++++++++++++++++++++++++ 28 files changed, 2610 insertions(+) create mode 100644 .gitignore create mode 100644 index.html create mode 100644 package.json create mode 100644 public/vite.svg create mode 100644 src/App.tsx create mode 100644 src/assets/1663003133164.gif create mode 100644 src/assets/dale.mp3 create mode 100644 src/assets/gugas.png create mode 100644 src/assets/react.svg create mode 100644 src/assets/sound.svg create mode 100644 src/assets/vite.svg create mode 100644 src/components/Content/index.tsx create mode 100644 src/components/Content/styles.ts create mode 100644 src/components/Footer/index.tsx create mode 100644 src/components/Footer/styles.ts create mode 100644 src/components/MainHeader/index.tsx create mode 100644 src/components/MainHeader/styles.ts create mode 100644 src/components/UserCard/index.tsx create mode 100644 src/components/UserCard/styles.ts create mode 100644 src/contexts/AppContext.ts create mode 100644 src/main.tsx create mode 100644 src/styles/GlobalStyles.ts create mode 100644 src/styles/Layout.ts create mode 100644 src/vite-env.d.ts create mode 100644 tsconfig.json create mode 100644 tsconfig.node.json create mode 100644 vite.config.ts create mode 100644 yarn.lock diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..a547bf3 --- /dev/null +++ b/.gitignore @@ -0,0 +1,24 @@ +# Logs +logs +*.log +npm-debug.log* +yarn-debug.log* +yarn-error.log* +pnpm-debug.log* +lerna-debug.log* + +node_modules +dist +dist-ssr +*.local + +# Editor directories and files +.vscode/* +!.vscode/extensions.json +.idea +.DS_Store +*.suo +*.ntvs* +*.njsproj +*.sln +*.sw? diff --git a/index.html b/index.html new file mode 100644 index 0000000..e0d1c84 --- /dev/null +++ b/index.html @@ -0,0 +1,13 @@ + + + + + + + Vite + React + TS + + +
+ + + diff --git a/package.json b/package.json new file mode 100644 index 0000000..3344ff6 --- /dev/null +++ b/package.json @@ -0,0 +1,29 @@ +{ + "name": "gym", + "private": true, + "version": "0.0.0", + "type": "module", + "scripts": { + "dev": "vite", + "build": "tsc && vite build", + "preview": "vite preview" + }, + "dependencies": { + "@firebase/app": "^0.7.33", + "@types/axios": "^0.14.0", + "@types/styled-components": "^5.1.26", + "axios": "^0.27.2", + "firebase": "^9.10.0", + "react": "^18.2.0", + "react-dom": "^18.2.0", + "react-draggable": "^4.4.5", + "styled-components": "^5.3.6" + }, + "devDependencies": { + "@types/react": "^18.0.17", + "@types/react-dom": "^18.0.6", + "@vitejs/plugin-react": "^2.1.0", + "typescript": "^4.6.4", + "vite": "^3.1.0" + } +} diff --git a/public/vite.svg b/public/vite.svg new file mode 100644 index 0000000..e7b8dfb --- /dev/null +++ b/public/vite.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/App.tsx b/src/App.tsx new file mode 100644 index 0000000..1efde89 --- /dev/null +++ b/src/App.tsx @@ -0,0 +1,117 @@ +import Footer from "./components/Footer"; +import MainHeader from "./components/MainHeader"; +import { Context } from "./contexts/AppContext"; +import { Layout } from "./styles/Layout"; +import { initializeApp } from "firebase/app"; +import { getAuth, GoogleAuthProvider, signInWithPopup } from "firebase/auth"; +import { useEffect, useState } from "react"; +import Content from "./components/Content"; +import Sound from "./assets/dale.mp3"; + +// Types - Interfaces + +interface IUser { + name: string; +} + +// Config Firebase + +// const firebaseConfig = { +// apiKey: import.meta.env.VITE_API_KEY, +// authDomain: import.meta.env.VITE_AUTH_DOMAIN, +// projectId: import.meta.env.VITE_PROJECT_ID, +// storageBucket: import.meta.env.VITE_STORAGE_BUCKET, +// messagingSenderId: import.meta.env.VITE_MESSAGING_SENDER_ID, +// appId: import.meta.env.VITE_APP_ID, +// }; + +/** Initialize Firebase */ +// const app = initializeApp(firebaseConfig); + +// export const auth = getAuth(app); + +const provider = new GoogleAuthProvider(); + +function App() { + // Hooks + const [userProfile, setUserProfile] = useState(); + const [userEmail, setUserEmail] = useState(); + const [userName, setUserName] = useState(); + const [error, setError] = useState(); + const [isUserLogIn, setIsUserLogIn] = useState(true); + + const audioTune = new Audio(Sound); + + const [audio, setAudio] = useState(audioTune); + const [playInLoop, setPlayInLoop] = useState(false); + const [isDale, setIsDale] = useState(false); + + useEffect(() => { + audioTune.load(); + }, []); + + useEffect(() => { + audioTune.loop = playInLoop; + }, [playInLoop]); + + /** Toca a musica */ + const playSound = () => { + audio.play(); + setIsDale(true); + }; + + /** Pausa a musica */ + const pauseSound = () => { + setIsDale(false); + audio.pause(); + }; + + /** Para a musica */ + const stopSound = () => { + setIsDale(false); + audio.pause(); + audio.currentTime = 0; + }; + + // const signInWithGoogle = () => { + // signInWithPopup(auth, provider) + // .then((result) => { + // const name: any = result.user.displayName; + // const email: any = result.user.email; + // const profilePic: any = result.user.photoURL; + + // setUserName(name); + // setUserEmail(email); + // setUserProfile(profilePic); + // setIsUserLogIn(false); + // }) + // .catch((error) => { + // console.log(error); + // setError(error); + // }); + // }; + + return ( + + + + +