import React from 'react';
import '../../css/Components/footer.css'

class Footer extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            onMeans:false
        }
    }

    handleDisplayMeans = () => {
        this.setState({onMeans:true})
    }
    
    handleNormal = () => {
        this.setState({onMeans:false})
    }

    render() {
        const date = new Date();
        return (
            <div className="footer">
                <div id="contactAndMeans">
                {this.state.onMeans ?
                    <div id="means" onMouseLeave={this.handleNormal}>
                        {/* eslint-disable-next-line */}
                        <a  href="https://m.me/100008584754501" target="_blank"><img id="mess" src='img\logo_messenger.png' alt='bonjour'/></a>
                        {/* eslint-disable-next-line */}
                        <a href="https://mail.google.com/mail/?view=cm&fs=1&to=baptiste1296@gmail.com&su=Proximo" target="_blank"><img id="gmail" src='img\logo_gmail.png' alt='bonjour'/></a>
                    </div>
                 : <div onClick={this.handleDisplayMeans} id="contact">Contacter le développeur</div>
                }
                </div>
                <div id="copyright">Copyright © {date.getFullYear()} Baptiste MARTY. Tous droits réservés</div>
                <div id="proxiBlock">
                    <div id="proxiLogoBlock">
                        <img id="proxiLogo" src='img\logo_proximo.png' alt="bonjour"/>   
                    </div>
                    <div id="proxiTxt">
                        Le Proxigang
                    </div>
                </div>
            </div>
        )
    }
}


export default Footer;