First Commit

2020-01-13 23:51:54 +01:00
27 changed files with 85 additions and 272 deletions
--- a/public/index.html
+++ b/public/index.html
@ -3,7 +3,7 @@
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="initial-scale=1" />
-        <title>LORD//CHANNEL</title>
+        <title>LORDNABBO</title>
    </head>
    <body style="background-color: #343a40;">
        <div id="root"></div>
--- a/src/About.js
+++ b/src/About.js
@ -0,0 +1,14 @@
+import React from 'react';
+import Navbar from './Navbar';
+
+class About extends React.Component {
+    render() {
+        return (
+            <>
+                <Navbar brand="LORDNABBO" />
+            </>
+        );
+    }
+}
+
+export default About;
--- a/src/App.js
+++ b/src/App.js
@ -1,41 +1,21 @@
 import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
 import React, { Suspense, lazy } from 'react';
-import Loading from "./routes/Loading";

-//const Home = lazy(() => import('./routes/Home'));
-const Home = lazy(() => {
-    return new Promise(resolve => {
-        setTimeout(() => resolve(import("./routes/Home")), 500);
-    });
-});
-const Film = lazy(() => import('./routes/Film'));
-const Anime = lazy(() => import('./routes/Anime'));
-const SerieTV = lazy(() => import('./routes/SerieTV'));
-const Immagini = lazy(() => import('./routes/Immagini'));
-const Musica = lazy(() => import('./routes/Musica'));
-const Giochi = lazy(() => import('./routes/Giochi'));
-const Programmi = lazy(() => import('./routes/Programmi'));
-const Pannocchiacattiva = lazy(() => import('./routes/Pannocchiacattiva'))
+const Home = lazy(() => import('./Home'));
+const About = lazy(() => import('./About'));
+const Notfound = lazy(() => import('./notfound'));

-const NotFound = lazy(() => import('./routes/NotFound'));

 class App extends React.Component {
    render() {
        return (
            <Router>
-                <Suspense fallback={<Loading />}>
+                <Suspense fallback={<div>Loading...</div>}>
                    <Switch>
                        <Route exact path="/" component={Home}/>
-                        <Route path="/Film" component={Film}/>
-                        <Route path="/Anime" component={Anime}/>
-                        <Route path="/SerieTV" component={SerieTV}/>
-                        <Route path="/Immagini" component={Immagini}/>
-                        <Route path="/Musica" component={Musica}/>
-                        <Route path="/Giochi" component={Giochi}/>
-                        <Route path="/Programmi" component={Programmi}/>
-                        <Route path="/Pannocchiacattiva" component={Pannocchiacattiva}/>
+                        <Route path="/About" component={About}/>

-                        <Route component={NotFound} />
+                        <Route component={Notfound} />
                    </Switch>
                </Suspense>
            </Router>
--- a/src/Buttons.js
+++ b/src/Buttons.js
@ -1,17 +1,23 @@
-import React from 'react';
-import {Link} from 'react-router-dom';
+import React from 'react'
+import {Link} from 'react-router-dom'
 import 'bootstrap/dist/css/bootstrap.min.css';
 import 'bootstrap/dist/js/bootstrap.min.js';
 import './Buttons.css';

-class NavButton extends React.Component {
+export default class NavButton extends React.Component {
    render() {
        return (
        <li className="nav-item">
-            <Link to={this.props.lhref}><button className="btn1">{this.props.name}</button></Link>
+            <Button name={this.props.name} />
        </li>
        );
    }
 }

-export default NavButton;
+export class Button extends React.Component {
+    render() {
+        return (
+        <button className="btn1" type="button"><Link to="/About">{this.props.name}</Link></button>
+        );
+    }
+}
--- a/src/Error.jpg
+++ b/src/Error.jpg
--- a/src/Error.png
+++ b/src/Error.png
--- a/src/routes/Home.js
+++ b/src/routes/Home.js
@ -1,13 +1,13 @@
 import React from 'react';
-import Navbar from '../Navbar';
-import Parallax from '../Parallax';
-import CardContainer from '../CardContainer';
+import Navbar from './Navbar';
+import Parallax from './Parallax';
+import CardContainer from './CardContainer';

 class Home extends React.Component {
    render() {
        return (
            <>
-                <Navbar brand="CHANNEL" />
+                <Navbar brand="LORDNABBO" />
                <Parallax />
                <CardContainer sectionTitle="Latest Uploads" />
                <CardContainer sectionTitle="Random" />
--- a/src/ModalButton.css
+++ b/src/ModalButton.css
@ -1,4 +1,4 @@
-.VideoPlayer {
+.videoPlayer {
    width: 100%;
    height: 250px;
    background-color: black;
--- a/src/ModalButton.js
+++ b/src/ModalButton.js
@ -1,7 +1,7 @@
 import React from 'react';
 import 'bootstrap/dist/css/bootstrap.min.css';
 import 'bootstrap/dist/js/bootstrap.min.js';
-import Button from 'react-bootstrap/Button';
+import Button from './Buttons';
 import Modal from 'react-bootstrap/Modal';
 import './Buttons.css';
 import './ModalButton.css';
@ -11,17 +11,16 @@ function ModalButton() {
    
    const handleClose = () => setShow(false);
    const handleShow = () => setShow(true);
-
    return (
    <>
-        <Button className="btn1" onClick={handleShow} lhref="#">View</Button>
+        <Button className="btn1" name="view" onClick={handleShow} />

        <Modal show={show} onHide={handleClose}>
            <Modal.Header closeButton>
                <Modal.Title>Card Title</Modal.Title>
            </Modal.Header>
            <Modal.Body>
-                <div className="VideoPlayer"></div>
+                <VideoPlayer />
                Some quick example text to build on the card title and make up the bulk of the card's content.
            </Modal.Body>
        </Modal>
@ -29,4 +28,12 @@ function ModalButton() {
    );
 }

+class VideoPlayer extends React.Component {
+    render() {
+        return (
+            <div className="videoPlayer"></div>
+        );
+    }
+}
+
 export default ModalButton;
--- a/src/Navbar.js
+++ b/src/Navbar.js
@ -1,5 +1,4 @@
 import React from 'react';
-import {Link} from 'react-router-dom';
 import NavButton from './Buttons';
 import 'bootstrap/dist/css/bootstrap.min.css';
 import 'bootstrap/dist/js/bootstrap.min.js';
@ -9,23 +8,20 @@ class Navbar extends React.Component {
    render() {
        return (
        <nav className="navbar navbar-expand-lg navbar-dark bg-dark">
-            <Link to="/"><span className="navbar-brand">LORD//{this.props.brand}</span></Link>
+            <span className="navbar-brand">{this.props.brand}</span>
            <button className="navbar-toggler" type="button" data-toggle="collapse" data-target="#navButtons" aria-controls="navButtons" aria-expanded="false" aria-label="Toggle navigation">
                <span className="navbar-toggler-icon"></span>
            </button>
            <div className="collapse navbar-collapse flex" id="navButtons">
                <ul className="navbar-nav nav-mod">
-                    <NavButton name="Film" lhref="/Film" />
-                    <NavButton name="Anime" lhref="/Anime" />
-                    <NavButton name="Serie TV" lhref="/Serietv" />
-                    <NavButton name="Immagini" lhref="/Immagini" />
-                    <NavButton name="Musica" lhref="/Musica" />
-                    <NavButton name="Giochi" lhref="/Giochi" />
-                    <NavButton name="Programmi" lhref="/Programmi" />
+                    <NavButton name="Home" lhref="/" />
+                    <NavButton name="Film" />
+                    <NavButton name="Series" />
+                    <NavButton name="About" lhref="/About" />
                </ul>
-                <form className="form-inline my-2 my-lg-0">
-                    <input className="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search" />
-                    <button className="btn1" type="submit">Search</button>
+                <form class="form-inline my-2 my-lg-0">
+                    <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search" />
+                    <button class="btn1" type="submit">Search</button>
                </form>
            </div>
        </nav>
--- a/src/NavbarError.css
+++ b/src/NavbarError.css
@ -0,0 +1,7 @@
+.centered{
+    text-align: center;
+}
+.loli-not-found{
+    height: 300px;
+    width: 300px;  /*modifica la dimensione dell'immagine come ritieni opportuno*/
+}
--- a/src/notfound.js
+++ b/src/notfound.js
@ -0,0 +1,22 @@
+import React from 'react';
+import Navbar from './Navbar';
+
+class NotFound extends React.Component {    //non mi caricava l'immagine il server quindi non so se le modifiche che ho fatto funzionano sull'immagine spero di si
+    render() {
+        return (
+            <>
+                <Navbar brand="LORD//404" />
+                <div class="container">
+                    <h1 class="header">
+                        SwEMBRA CHwE QwUALCwOSA SwIA ANDwATO STwORTwO NYAN! UwU
+                        <div class="container centered loli-not-found">
+                            <img src="Error.png" alt="ragazza anime molto carina"></img>     
+                        </div>
+                    </h1>
+                </div>
+            </>
+        );
+    }
+}
+
+export default NotFound;
--- a/src/routes/Anime.js
+++ b/src/routes/Anime.js
@ -1,14 +0,0 @@
-import React from 'react';
-import Navbar from '../Navbar';
-
-class Anime extends React.Component {
-    render() {
-        return (
-            <>
-                <Navbar brand="ANIME" />
-            </>
-        );
-    }
-}
-
-export default Anime;
--- a/src/routes/Film.js
+++ b/src/routes/Film.js
@ -1,14 +0,0 @@
-import React from 'react';
-import Navbar from '../Navbar';
-
-class Film extends React.Component {
-    render() {
-        return (
-            <>
-                <Navbar brand="FILM" />
-            </>
-        );
-    }
-}
-
-export default Film;
--- a/src/routes/Giochi.js
+++ b/src/routes/Giochi.js
@ -1,14 +0,0 @@
-import React from 'react';
-import Navbar from '../Navbar';
-
-class Giochi extends React.Component {
-    render() {
-        return (
-            <>
-                <Navbar brand="GIOCHI" />
-            </>
-        );
-    }
-}
-
-export default Giochi;
--- a/src/routes/Immagini.js
+++ b/src/routes/Immagini.js
@ -1,14 +0,0 @@
-import React from 'react';
-import Navbar from '../Navbar';
-
-class Immagini extends React.Component {
-    render() {
-        return (
-            <>
-                <Navbar brand="IMMAGINI" />
-            </>
-        );
-    }
-}
-
-export default Immagini;
--- a/src/routes/Loading.js
+++ b/src/routes/Loading.js
@ -1,38 +0,0 @@
-import React from 'react';
-import Navbar from '../Navbar';
-import 'bootstrap/dist/css/bootstrap.min.css';
-import 'bootstrap/dist/js/bootstrap.min.js';
-import "./centercontainer.css";
-import loading1 from "./loadinggifs/loading1.gif";
-import loading2 from "./loadinggifs/loading2.gif";
-import loading3 from "./loadinggifs/loading3.gif";
-import loading4 from "./loadinggifs/loading4.gif";
-
-class Loading extends React.Component {
-    render() {
-
-        let randInt = () => {
-            return Math.round(Math.random() * 4);
-        };
-
-        let randomGif = () => {
-            let images = [loading1, loading2, loading3, loading4]
-            return images[randInt()];
-        };
-
-        console.log(randomGif())
-
-        return (
-            <>
-                <Navbar brand="LOADING" />
-                <div className="centered">
-                    <div className="row">
-                        <img alt="Loading..." src={randomGif()} />
-                    </div>
-                </div>
-            </>
-        );
-    }
-}
-
-export default Loading;
--- a/src/routes/Musica.js
+++ b/src/routes/Musica.js
@ -1,14 +0,0 @@
-import React from 'react';
-import Navbar from '../Navbar';
-
-class Musica extends React.Component {
-    render() {
-        return (
-            <>
-                <Navbar brand="MUSICA" />
-            </>
-        );
-    }
-}
-
-export default Musica;
--- a/src/routes/NotFound.js
+++ b/src/routes/NotFound.js
@ -1,22 +0,0 @@
-import React from 'react';
-import Navbar from '../Navbar';
-import 'bootstrap/dist/css/bootstrap.min.css';
-import 'bootstrap/dist/js/bootstrap.min.js';
-import "./centercontainer.css"
-
-class NotFound extends React.Component {
-    render() {
-        return (
-            <>
-                <Navbar brand="404" />
-                <div className="centered">
-                    <div className="row">
-                        <img alt="Loading..." src="https://i.pinimg.com/originals/8f/c3/21/8fc32146cbf72ae17430e05ecc8b61be.gif" />
-                    </div>
-                </div>
-            </>
-        );
-    }
-}
-
-export default NotFound;
--- a/src/routes/Pannocchiacattiva.js
+++ b/src/routes/Pannocchiacattiva.js
@ -1,46 +0,0 @@
-import React from 'react';
-import 'bootstrap/dist/css/bootstrap.min.css';
-import 'bootstrap/dist/js/bootstrap.min.js';
-import Form from 'react-bootstrap/Form';
-import Col from 'react-bootstrap/Col';
-import '../Buttons.css';
-import Navbar from '../Navbar';
-
-class Pannocchiacattiva extends React.Component {
-    render() {
-        const shiroTexto = {
-            color: 'white'
-        }
-        return (
-            <>
-                <Navbar brand="PANNOCCHIA" />
-                <div className="centered" style={shiroTexto}>
-                    <Form>
-                        <Form.Group controlId="exampleForm.ControlInput1">
-                            <Form.Control type="text" placeholder="Titolo Anime" />
-                        </Form.Group>
-                        <Form.Group controlId="exampleForm.ControlTextarea1">
-                            <Form.Control type="text" placeholder="Trama" as="textarea" rows="3" />
-                        </Form.Group>
-                        <Form.Row>
-                            <Form.Group as={Col} controlId="formGridCity">
-                                <Form.Control type="text" placeholder="Durata" />
-                            </Form.Group>
-
-                            <Form.Group as={Col} controlId="formGridState">
-                                <Form.Control type="text" placeholder="Voto" />
-                            </Form.Group>
-
-                            <Form.Group as={Col} controlId="formGridZip">
-                                <Form.Control type="text" placeholder="Lingua" />
-                            </Form.Group>
-                        </Form.Row>
-                        <button className="btn1">Submit</button>
-                    </Form>
-                </div>
-            </>
-        );
-    }
-}
-
-export default Pannocchiacattiva;
--- a/src/routes/Programmi.js
+++ b/src/routes/Programmi.js
@ -1,14 +0,0 @@
-import React from 'react';
-import Navbar from '../Navbar';
-
-class Programmi extends React.Component {
-    render() {
-        return (
-            <>
-                <Navbar brand="PROGRAMMI" />
-            </>
-        );
-    }
-}
-
-export default Programmi;
--- a/src/routes/SerieTV.js
+++ b/src/routes/SerieTV.js
@ -1,14 +0,0 @@
-import React from 'react';
-import Navbar from '../Navbar';
-
-class SerieTV extends React.Component {
-    render() {
-        return (
-            <>
-                <Navbar brand="SERIETV" />
-            </>
-        );
-    }
-}
-
-export default SerieTV;
--- a/src/routes/centercontainer.css
+++ b/src/routes/centercontainer.css
@ -1,15 +0,0 @@
-.centered {
-    height: 93vh;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-}
-
-.row {
-    width: auto;
-}
-
-img {
-    height: 30vh;
-    width: auto;
-}
--- a/src/routes/loadinggifs/loading1.gif
+++ b/src/routes/loadinggifs/loading1.gif
--- a/src/routes/loadinggifs/loading2.gif
+++ b/src/routes/loadinggifs/loading2.gif
--- a/src/routes/loadinggifs/loading3.gif
+++ b/src/routes/loadinggifs/loading3.gif
--- a/src/routes/loadinggifs/loading4.gif
+++ b/src/routes/loadinggifs/loading4.gif