Archived
100 lines
3.1 KiB
JavaScript
100 lines
3.1 KiB
JavaScript
import React, { Component } from 'react';
|
|
import {
|
|
Navbar,
|
|
Nav,
|
|
NavDropdown,
|
|
//Form,
|
|
FormControl,
|
|
Button
|
|
} from 'react-bootstrap'; //eslint-disable-next-line
|
|
import { Link, withRouter } from 'react-router-dom';
|
|
import './css/TopBar.css';
|
|
import './reccomenders/fvitali'
|
|
// import PropTypes from "prop-types";
|
|
|
|
class TopBar extends Component {
|
|
state = {
|
|
query: ''
|
|
};
|
|
handleChange = event => {
|
|
this.setState({
|
|
query: event.target.value
|
|
});
|
|
}
|
|
handleSubmit = event => {
|
|
event.preventDefault();
|
|
event.target.reset();
|
|
this.props.history.push('/search/' + this.state.query);
|
|
}
|
|
render() {
|
|
return (
|
|
<React.Fragment>
|
|
<Navbar bg="dark" className="py-0 px-1 w-100" expand="md">
|
|
<Navbar.Brand>
|
|
<Link to="/">HazeTV</Link>
|
|
</Navbar.Brand>
|
|
<Navbar.Toggle aria-controls="basic-navbar-nav" />
|
|
<Navbar.Collapse id="basic-navbar-nav">
|
|
<Nav className="mr-auto">
|
|
<Link to="/" className="text-light nav-link">Home</Link>
|
|
<Link to={{ pathname: `/video/${localStorage['lastId']}/vitali` }} className="text-light nav-link">Vitali</Link>
|
|
<Link to={{ pathname: `/video/${localStorage['lastId']}/recent` }} className="text-light nav-link">Recent</Link>
|
|
<Link to={{ pathname: `/video/${localStorage['lastId']}/random` }} className="text-light nav-link">Random</Link>
|
|
<Link to={{ pathname: `/video/${localStorage['lastId']}/related` }} className="text-light nav-link">Related</Link>
|
|
{ <NavDropdown title="Similarity" id="basic-nav-dropdown" >
|
|
<NavDropdown.Item href="#action/3.1">
|
|
Artist
|
|
</NavDropdown.Item>
|
|
<NavDropdown.Item href="#action/3.2">
|
|
Genre
|
|
</NavDropdown.Item>
|
|
</NavDropdown> }
|
|
{ <NavDropdown title="Popolarità locale" id="basic-nav-dropdown" >
|
|
<NavDropdown.Item href="#action/3.1">
|
|
Assoluta
|
|
</NavDropdown.Item>
|
|
<NavDropdown.Item href="#action/3.2">
|
|
Relativa
|
|
</NavDropdown.Item>
|
|
</NavDropdown> }
|
|
{ <NavDropdown title="Popolarità globale" id="basic-nav-dropdown" >
|
|
<NavDropdown.Item href="#action/3.1">
|
|
Assoluta
|
|
</NavDropdown.Item>
|
|
<NavDropdown.Item href="#action/3.2">
|
|
Relativa
|
|
</NavDropdown.Item>
|
|
</NavDropdown> }
|
|
{ <NavDropdown title="Progetti" id="basic-nav-dropdown" >
|
|
<NavDropdown.Item href="#action/3.1">Action</NavDropdown.Item>
|
|
<NavDropdown.Item href="#action/3.2">
|
|
Another action
|
|
</NavDropdown.Item>
|
|
<NavDropdown.Item href="#action/3.3">
|
|
Something
|
|
</NavDropdown.Item>
|
|
<NavDropdown.Divider />
|
|
<NavDropdown.Item href="#action/3.4">
|
|
Separated link
|
|
</NavDropdown.Item>
|
|
</NavDropdown> }
|
|
|
|
</Nav>
|
|
<form className="form-inline" onSubmit={this.handleSubmit}>
|
|
<FormControl
|
|
type="text"
|
|
placeholder="Search"
|
|
className="mr-sm-2"
|
|
onChange={this.handleChange}
|
|
/>
|
|
<Button type="submit" variant="outline-success">Search</Button>
|
|
</form>
|
|
</Navbar.Collapse>
|
|
</Navbar>
|
|
</React.Fragment>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default withRouter(TopBar);
|