import Postload from './post.jsx';
import calendar from './calendar';
import linkmenu from './link';
import { os } from './tool';
import { mHeader as MHeader } from './header.jsx';
import Poker from './deck.jsx';
import Sponsor from './sponsor.jsx';
import {Ipc,Weather} from './footer.jsx';

import './sass/index-home.scss';
import ViewPage from './view_page.jsx';

class Index extends Component {
    componentDidMount(){

        let menu = new linkmenu({ book: "https://book.ourfor.top", video: "/video", news: "/zone" });
        menu.render();
        calendar(new Date());
        let postload = new Postload('https://api.ourfor.top/blog/essays');
    }
    render(){
      let platform = os();
      let header;
      if(platform.isAndroid || platform.isPhone){
          header = <MHeader />
      } else {
          header = <nav className="headerbar"></nav>
      }
        return (
            <>
            <header>
                {header}
            </header>
            <div className="post-content">
              <div className="aside">
                <nav id="calendar-box"></nav>
                <div id="menu-card"></div>
                <Poker />
                <Sponsor />
              </div>
              <div id="main-content">
                <ViewPage />
                <div id="post-content" />
              </div>
            </div>
            <nav id="page-nav"></nav>
            <footer>
              <div className="ad-display">
                <a href="https://www.vultr.com/?ref=7812582-4F"><img src="https://www.vultr.com/media/banners/banner_728x90.png" width="728" height="90" /></a>
                <div></div>
              </div>
              <div className="footer-row-item">
                <Ipc />
                <Weather />
              </div>
            </footer>
            </>
        );
    }
}


export default Index;