diff options
Diffstat (limited to 'app/javascript/components/Games.jsx')
| -rw-r--r-- | app/javascript/components/Games.jsx | 93 |
1 files changed, 0 insertions, 93 deletions
diff --git a/app/javascript/components/Games.jsx b/app/javascript/components/Games.jsx deleted file mode 100644 index f1545b8..0000000 --- a/app/javascript/components/Games.jsx +++ /dev/null @@ -1,93 +0,0 @@ -import React, { useState, useEffect } from "react"; -//import { Link } from "react-router-dom"; -import GameCard from "./GameCard"; -import Button from "./Button"; - -//export default () => ( -export default function Games () { - const [games, setGames] = useState([]); - useEffect(() => { - const url = "/api/v1/games"; - fetch(url).then((response) => { - if (response.ok) { - return response.json(); - } - throw new Error("Network response was not ok."); - }).then((response) => setGames(response)).catch(() => navigate("/")); - }, []); - const allGames = games.map((game) => ( - <GameCard game={game} key={game.id}/> - )); - var handleSubmit = (e) => { - e.preventDefault() //stops submit from happening - const form = e.target; - const formData = new FormData() - formData.append('game[title]', form.title.value) - for(let i =0; i < form.game_files.files.length; i++) - { - formData.append('game[game_files][]', form.game_files.files[i], form.game_files.files[i].value); - } - formData.append('game[card_img]', form.card_img.files[0], form.card_img.value); - formData.append('game[char_img]', form.char_img.files[0], form.char_img.value); - formData.append('game[title_img]', form.title_img.files[0], form.title_img.value); - - for (var pair of formData.entries()) { - console.log(pair[0] + ', ' + pair[1]) - }; - - fetch('http://127.0.0.1:3000/api/v1/games', { - method: 'post', - body: formData, - }); - } - return( - <> - <div> - <div className="flex flex-col gap-16 max-w-6xl shrink"> - <div className="title font-bold text-6xl font-title">Games</div> - <div className=""> - <div className="jumbotron jumbotron-fluid bg-transparent"> - <div className="container secondary-color"> - <form onSubmit={handleSubmit} action="/upload" method="post" className="flex flex-col gap-4"> - <div> - <label>Title</label> - <input type="text" name="title" /> - </div> - <div> - <label>Files</label> - <input type="file" multiple="multiple" name="game_files" /> - </div> - <div> - <label>Card Image</label> - <input type="file" name="card_img" /> - </div> - <div> - <label>Character Image</label> - <input type="file" name="char_img" /> - </div> - <div> - <label>Title Image</label> - <input type="file" name="title_img" /> - </div> - <div style={{ boxShadow: 'rgba(255,255,255,.1) 0 1px 0,rgba(0,0,0,.8) 0 1px 7px 0 inset' }} className="p-[5px] w-min h-min bg-stone-800 rounded-[5px]"> - <Button width={ 28 } height={ 12 } link={ <button type="submit" className="w-28 h-12 bg-stone-transparent text-stone-50 rounded">Submit</button> }/> - </div> - - </form> - </div> - </div> - </div> - { allGames } - <div className="flex flex-row flex-wrap gap-20 justify-around"> - <GameCard /> - <GameCard /> - <GameCard /> - <GameCard /> - <GameCard /> - <GameCard /> - </div> - </div> - </div> - </> - ); -}; |
