import React from 'react';
import {Card, CardActions, CardHeader, CardMedia, CardTitle, CardText} from 'material-ui/Card';
import Background from './images/pirate-mod.jpg'
import RaisedButton from 'material-ui/RaisedButton';
import Search from './search'
class Header extends React.Component {
constructor(props)
{
super(props)
this.header = React.createRef();
}
componentDidMount()
{
window.onscroll = () => {
if (window.pageYOffset >= 15)
{
const scrollHeight = Math.max(
document.body.scrollHeight, document.documentElement.scrollHeight,
document.body.offsetHeight, document.documentElement.offsetHeight,
document.body.clientHeight, document.documentElement.clientHeight
);
if(scrollHeight - 240 < document.documentElement.clientHeight)
{
return
}
if(!this.stickyHeader)
{
this.stickyHeader = true
this.header.current.classList.add("sticky");
}
}
else
{
if(this.stickyHeader)
{
this.stickyHeader = false
this.header.current.classList.remove("sticky");
}
}
};
}
componentWillUnmount()
{
window.onscroll = null
}
render()
{
return (
{
window.router('/config')
}}
fill='white' style={{height: 45, margin: 4}} viewBox="0 0 932.179 932.179">
{
window.router('/filters')
}}
fill='white' style={{height: 45, margin: 4}} viewBox="0 0 512 512">
{__('Welcome to')} ROTB! {__('This is file search engine based on the torrents from the internet')}.
{__('Here you can easily find torrent or file that you intrested for')}. {__('We are not responsible for any content')}:
{__('this is only information about content that collected automatically')}!
} />}
>
{
window.router('/')
}}
backgroundColor='#69238c'
labelColor='white'
style={{height: 60, borderRadius: 6, margin: 5, zIndex: 1}}
buttonStyle={{borderRadius: 5}}
icon={
}
/>
{
window.router('/downloads')
}}
backgroundColor='#2080E4'
labelColor='white'
style={{height: 60, borderRadius: 6, margin: 5, zIndex: 1}}
buttonStyle={{borderRadius: 5}}
icon={
}
/>
{
window.router('/top')
}}
backgroundColor='#B1CE57'
labelColor='white'
style={{height: 60, width: 120, borderRadius: 5, margin: 5, zIndex: 1}}
buttonStyle={{borderRadius: 5}}
icon={
}
/>
)
}
}
export {Header}