Name changes to files and components

This commit is contained in:
Kristoffer Longva Eriksen 2022-03-22 13:21:23 +01:00
parent f7e5c99eb0
commit 876c1ce03a
14 changed files with 199 additions and 172 deletions

View File

@ -2,7 +2,7 @@ import * as React from "react";
import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom"; import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom";
import logo from "./../Asura2222.png"; import logo from "./../Asura2222.png";
export default function Home_Image() { export default function HomeImage() {
return ( return (
<Link to="/"> <Link to="/">
<img src={logo} alt="Tournament logo"></img> <img src={logo} alt="Tournament logo"></img>

View File

@ -1,9 +1,9 @@
import React from "react"; import React from "react";
import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom"; import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom";
export default function Manage_Button(props) { export default function ManageButton(props) {
return ( return (
<button className="Manage_Button"> <button className="ManageButton">
<Link to="/tournament/manage">Manage Tournament</Link> <Link to="/tournament/manage">Manage Tournament</Link>
</button> </button>
); );

View File

@ -1,9 +1,9 @@
import React from "react"; import React from "react";
import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom"; import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom";
export default function Overview_Button(props) { export default function OverviewButton(props) {
return ( return (
<button className="Overview_Button"> <button className="OverviewButton">
<Link to="/tournament">View Tournament</Link> <Link to="/tournament">View Tournament</Link>
</button> </button>
); );

View File

@ -1,10 +0,0 @@
import * as React from "react";
import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom";
export default function Save_Button(props) {
return (
<Link to="/">
<button>Create Tournament!</button>
</Link>
);
}

View File

@ -0,0 +1,10 @@
import * as React from "react";
import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom";
export default function SaveButton(props) {
return (
<Link to="/">
<button>Create Tournament!</button>
</Link>
);
}

View File

@ -1,43 +0,0 @@
import * as React from "react";
import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom";
import Save_Button from "./components/save_button";
import Home_Image from "./components/home_image";
function Format_Selector(props) {
return (
<div>
<select>
<option value="Single Elimination">Single Elimination</option>
<option value="Double Elimination">Double Elimination</option>
</select>
</div>
);
}
function Create_Form(props) {
return (
<form>
<label for="organizer">Tournament Organizer:</label><br />
<input type="text" id="organizer" /><br />
<label for="name">Tournament Name:</label><br />
<input type="text" id="name" /><br />
<label for="description">Description</label><br />
<input type="text" id="description" /><br />
<label for="image">Tournament Image:</label><br />
<input type="image" id="image" /><br />
<label for="date">Start Time:</label><br />
<input type="date" id="date" /><br />
</form>
)
}
export default function Create_Tournament(props) {
return (
<React.Fragment>
<Home_Image />
<Create_Form />
<Format_Selector />
<Save_Button />
</React.Fragment>
);
}

View File

@ -0,0 +1,55 @@
import * as React from "react";
import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom";
import SaveButton from "./components/savebutton";
import HomeImage from "./components/homeimage";
function FormatSelector(props) {
return (
<div>
<select>
<option value="Single Elimination">Single Elimination</option>
<option value="Double Elimination">Double Elimination</option>
</select>
</div>
);
}
function CreateForm(props) {
return (
<React.Fragment>
<form>
<label for="organizer">Tournament Organizer:</label>
<input type="text" id="organizer" />
<br />
<label for="name">Tournament Name:</label>
<input type="text" id="name" />
<br />
<label for="description">Description:</label>
<input type="text" id="description" />
<br />
<label for="image">Tournament Image:</label>
<input
type="file"
id="image"
accept="image/png, image/jpeg, image/jpg"
/>
<br />
<label for="date">Start Date:</label>
<input type="date" id="date" />
<input type="time" id="time" />
<br />
</form>
</React.Fragment>
);
}
export default function CreateTournament(props) {
return (
<React.Fragment>
<HomeImage />
<CreateForm />
<FormatSelector />
<SaveButton />
</React.Fragment>
);
}

View File

@ -1,73 +0,0 @@
import * as React from "react";
import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom";
import Manage_Button from "./components/manage_button";
import Create_Tournament from "./create_tournament.js";
import Tournament_Overview from "./tournament_overview.js";
import Tournament_Manager from "./manage_tournament.js";
import Home_Image from "./components/home_image";
import 'bootstrap/dist/css/bootstrap.min.css'
import Button from 'react-boostrap/Button'
import Container from 'react-boostrap/Container'
import Card from 'react-boostrap/Card'
function Create_Button(props) {
return (
<Button className="Create_Button" variant='primary'>
<Link to="/create">Create Tournament</Link>
</Button>
);
}
function Overview_Button(props) {
return (
<Button className="Overview_Button" variant='secondary'>
<Link to="/tournament">View Tournament</Link>
</Button>
);
}
function ListElement(props) {
return (
<Container>
<Card className="ListElement">
<div className="tournamentDetails">
{props.name}, {props.competitors} competitors, Date: {props.date}
</div>
<Manage_Button />
<Overview_Button />
</Card>
</Container>
);
}
function Home() {
return (
<React.StrictMode>
<Home_Image />
<Create_Button />
<Card id="tournamentList">
<ListElement name="Weekend Warmup" competitors="16" date="29.04.2022" />
<ListElement
name="Saturday Showdown"
competitors="8"
date="30.04.2022"
/>
<ListElement name="Sunday Funday" competitors="64" date="01.05.2022" />
</Card>
</React.StrictMode>
);
}
export default function App() {
return (
<Router>
<Routes>
<Route path="/" element={<Home />} />
<Route path="/create" element={<Create_Tournament />} />
<Route path="/tournament" element={<Tournament_Overview />} />
<Route path="/tournament/manage" element={<Tournament_Manager />} />
</Routes>
</Router>
);
}

View File

@ -0,0 +1,79 @@
import * as React from "react";
import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom";
import ManageButton from "./components/managebutton";
import CreateTournament from "./createtournament.js";
import TournamentOverview from "./tournamentoverview.js";
import TournamentManager from "./managetournament.js";
import HomeImage from "./components/homeimage";
import "bootstrap/dist/css/bootstrap.min.css";
import Button from "react-bootstrap/Button";
import Container from "react-bootstrap/Container";
import Card from "react-bootstrap/Card";
import Row from "react-bootstrap/Row";
import Col from "react-bootstrap/Col";
function CreateButton(props) {
return (
<Link to="/create">
<Button variant="primary">Create Tournament</Button>
</Link>
);
}
function OverviewButton(props) {
return (
<Button variant="secondary">
<Link to="/tournament">View Tournament</Link>
</Button>
);
}
function ListElement(props) {
return (
<Container>
<Row>
<Col xs={6}>
{props.name}, {props.competitors} competitors, Date: {props.date}
</Col>
<Col>
<ManageButton />
</Col>
<Col>
<OverviewButton />
</Col>
</Row>
</Container>
);
}
function Home() {
return (
<React.StrictMode>
<HomeImage />
<CreateButton />
<Container>
<ListElement name="Weekend Warmup" competitors="16" date="29.04.2022" />
<ListElement
name="Saturday Showdown"
competitors="8"
date="30.04.2022"
/>
<ListElement name="Sunday Funday" competitors="64" date="01.05.2022" />
</Container>
</React.StrictMode>
);
}
export default function App() {
return (
<Router>
<Routes>
<Route path="/" element={<Home />} />
<Route path="/create" element={<CreateTournament />} />
<Route path="/tournament" element={<TournamentOverview />} />
<Route path="/tournament/manage" element={<TournamentManager />} />
</Routes>
</Router>
);
}

View File

@ -1,7 +1,7 @@
import React from "react"; import React from "react";
import ReactDOM from "react-dom"; import ReactDOM from "react-dom";
import "./index.css"; import "./index.css";
import App from "./front_page.js"; import App from "./frontpage.js";
ReactDOM.render( ReactDOM.render(
<React.StrictMode> <React.StrictMode>

View File

@ -1,33 +0,0 @@
import * as React from "react";
import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom";
import Home_Image from "./components/home_image";
function Manage_Tournament(props) {
return (
<form>
<label>Edit name: <br />
<input type="text" id="edtName" /><br />
</label>
<label>Edit description: <br />
<input type="text" id="edtDesc" /><br />
</label>
<label>Edit image: <br />
<input type="image" id="edtImage" /><br />
</label>
<label>Edit start time: <br />
<input type="date" id="edtTime" /><br />
</label>
</form>
)
}
export default function Tournament_Manager() {
return (
<React.Fragment>
<Home_Image />
<Manage_Tournament />
<Save_Button />
</React.Fragment>
);
}

View File

@ -0,0 +1,42 @@
import * as React from "react";
import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom";
import HomeImage from "./components/homeimage";
import SaveButton from "./components/savebutton";
function ManageTournament(props) {
return (
<React.Fragment>
<form>
<label>Edit name: </label>
<input type="text" id="edtName" />
<br />
<label>Edit description: </label>
<input type="text" id="edtDesc" />
<br />
<label>Edit image: </label>
<input
type="file"
id="edtImage"
accept="image/png, image/jpeg, image/jpg"
/>
<br />
<label>Edit start time: </label>
<input type="date" id="edtDate" />
<input type="time" id="edtTime" />
<br />
<br />
</form>
<button>.</button>
</React.Fragment>
);
}
export default function TournamentManager() {
return (
<React.Fragment>
<HomeImage />
<ManageTournament />
<SaveButton />
</React.Fragment>
);
}

View File

@ -1,7 +0,0 @@
import * as React from "react";
import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom";
import Home_Image from "./components/home_image";
export default function Tournament_Overview(props) {
return <Home_Image />;
}

View File

@ -0,0 +1,7 @@
import * as React from "react";
import { BrowserRouter as Router, Link, Route, Routes } from "react-router-dom";
import HomeImage from "./components/homeimage";
export default function TournamentOverview(props) {
return <HomeImage />;
}