<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Chat</title>
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<link href="static/styles/style.css" rel="stylesheet" type="text/css">
<link href="static/styles/dark.css" rel="stylesheet" type="text/css">
<link href="static/styles/msgboard.css" rel="stylesheet" type="text/css">
</head>
<body>
<div class="chat">
<div class="msg-board">
<h1>Доска объявлений для GAME SERVER ЧАТ | GENERAL |</h1>
<div style="text-align: center; display: flex;justify-content: space-between;margin-inline: 4vw;margin-top: 20px;">
<dl></dl>
<dl class="relays">
</dl>
</div>
</div>
<div id="chat-box" class="chat-box">
<div id="offline"><span class="big">Server is offline.</span><br />Sorry for that.</div>
<ul id="msgs" class="msgs"></ul>
<ul id="typing" class="msgs"></ul>
</div>
<div class="chat-form">
<ul id="emic" style="display:none;"></ul>
<button id="emic_btn">
<img src="static/emic/white-smiling-face.png" width="20px" height="20px" title="White Smiling Face">
</button>
<textarea id="form_input" class="form-control" data-user-id="2" placeholder="Type something ..." rows="1"></textarea>
<button id="send">Send</button>
<ul id="users"></ul>
</div>
</div>
<script type="text/javascript" src="socket.io/socket.io.js"></script>
<script type="text/javascript" src="static/scripts/emic.js"></script>
<script type="text/javascript" src="static/scripts/chat.js"></script>
<script type="text/javascript">
fetch('vars.json')
.then(response => {
return response.json();
})
.then(json => {
document.querySelector(".msg-board").querySelector("h1").innerText = json["title"];
document.querySelector(".msg-board").querySelector("div").querySelectorAll("dl")[0].innerHTML = json["msgs"];
//console.log(this.users);
})
fetch('/relays.json')
.then(response => {
return response.json();
})
.then(json => {
let tags = "";
Object.keys(json).forEach(element => {
tags += "<dt><a href='"+json[element]["url"]+"'>"+json[element]["name"]+"</a></dt>";
});
document.querySelector(".msg-board").querySelector("div").querySelectorAll("dl")[1].innerHTML = "<dt>другие чаты</dt>"+tags;
//console.log(this.users);
})
// optionally set own server where the client connects to
const socket = io(location.protocol + '//' + location.host, {
path: location.pathname.replace(/\/$/, '') + '/socket.io/'
})
Emic.init();
Chat.init(socket);
</script>
</body>
</html>