<?php
/**
 * Copyright (c) 2018.
 * Author: Igor Barkov <lopar.4ever@gmail.com>
 * Project name: Battles-Game
 */

session_start();
if (!isset($_SESSION['uid'])) header("Location: index.php");
//include("config.php");

//$msg = filter_input(INPUT_POST,'msg');
//$uid = $_SESSION['uid'];
//if ($msg) db::c()->query('INSERT INTO `chat` (`cid`, `uid`, `msg`) VALUES (?i, ?i, "?s")', 1, $uid, $msg);
?>
<!doctype html>
<html>
<head>
    <title>Окно игры</title>
    <meta charset="utf-8">
    <style>
        form {
            width: 100%;
            text-align: center;
        }

        form input {
            border: 1px solid silver;
            width: 80%;
            margin-right: .5%;
        }

        form input[type="submit"] {
            width: 15%;
        }

        body {
            margin: 0;
        }

        .wrap {
            display: grid;
            height: 100vh;
            grid-template-rows: 45px /* Шапка */ 2fr /* Окно игры */ 1fr /* Окно чата*/ 30px; /* Подвал */
        }

        header {
            text-align: right;
            box-shadow: 0 3px 2px -2px slategray;
        }

        footer {
            margin: 5px;
        }

        #game, #chat {
            overflow: auto;
            box-shadow: 0 3px 2px -2px slategray;
            padding: 5px;
        }

        a img {
            border: 1px solid #fff;
            transition: box-shadow 0.5s ease;
            margin: 5px;
        }

        a img:hover {
            box-shadow: 0 0 7px slategray;
        }
    </style>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
<div class="wrap">
    <header>
        <a href="/user_anketa.php" title="Анкета" target="main"><img src="http://placehold.it/32x32/33ff33?text=A"/></a>
        <a href="/friend.php" title="Друзья" target="main"><img src="http://placehold.it/32x32/33ff33?text=F"/></a>
        <a href="/main.php?edit=1" title="Инвентарь" target="main"><img src="http://placehold.it/32x32/33ff33?text=I"/></a>
        <a href="/relikt.php?edit=1" title="Реликты" target="main"><img src="http://placehold.it/32x32?text=R"/></a>
        <a href="/klan.php" title="Клан" target="main"><img src="http://placehold.it/32x32/33ff33?text=K"/></a>
        <a href="/orden.php" title="Особые умения" target="main"><img
                    src="http://placehold.it/32x32/33ff33?text=O"/></a>
        <a href="/moderators.php" title="Модераторы" target="main"><img src="http://placehold.it/32x32/33ff33?text=M"/></a>
        <a href="/forum.php" title="Форум" target="main"><img src="http://placehold.it/32x32?text=F"/></a>
        <a href="javascript:$('#game').load('/forum.php')"><img src="http://placehold.it/32x32?text=F"/></a>
    </header>
    <div id="game"></div>
    <div id="chat"></div>
    <footer>
        <form action="chat.php" method="post" target="chat">
            <input id="msg" name="msg" size="100" placeholder="Введите сообщение...">
            <input type="submit" value="Отправить">
        </form>
    </footer>
</div>
<script>
    $("#game").load("main.php");

    function loadlink(){
        $('#chat').load('chat.php');
    }

    loadlink(); // This will run on page load
    setInterval(function(){
        loadlink() // this will run after every 5 seconds
    }, 5000);
</script>
</body>
</html>