Watch-with-friends/views/chat.html

63 lines
2.2 KiB
HTML
Raw Permalink Normal View History

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Chat</title>
<link rel="icon" href="/img/favicon.png">
<link rel="stylesheet" href="/css/styles.min.css">
<link rel="stylesheet" href="/css/styles.css">
<meta name="description" content="Chat">
<meta name="author" content="SitePoint">
<script defer src="https://cdnjs.cloudflare.com/ajax/libs/mustache.js/3.0.1/mustache.min.js"></script>
<script defer src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.min.js"></script>
<script defer src="https://cdnjs.cloudflare.com/ajax/libs/qs/6.6.0/qs.min.js"></script>
<script defer src="/socket.io/socket.io.js"></script>
<script defer src="/js/chat.js"></script>
</head>
<body>
2021-01-26 12:31:57 +01:00
<!-- The Modal -->
<div id="myModal" class="modal">
<!-- Modal content -->
<div class="modal-content">
<span class="close">&times;</span>
<p class="modal-text"><h4>Manual:</h4>
2021-01-28 01:34:15 +01:00
<li>To send messages write text in the input fi and then click "Send" button</li>
<li>To send location just click "Send Location" button</li>
<li>To change video paste your youtube link and click "Change video"</li>
<li>To synchronize your video between users, click "Synchronize videos" button</li>
2021-01-26 12:31:57 +01:00
</p>
</div>
</div>
<div class="chat">
2021-01-25 19:27:44 +01:00
<div class = player id="ytplayer"></div>
<div class="chat__sidebar">
</div>
<div class="chat__main">
<div id="messages-container" class="chat__messages"> </div>
<div class="compose">
<form action="POST" id="sendMessForm">
2021-01-27 22:14:16 +01:00
<input placeholder="Write your message" autocomplete="off">
2021-01-28 01:34:15 +01:00
<button class="sendMessage" type="submit" id="formButton">Send</button>
</form>
</div>
2021-01-28 01:34:15 +01:00
<div class="buttonsDiv">
<!-- <hr style="padding: 6px; border: 0 none; height: 5px; color: rgb(233, 233, 233)"> -->
<button id="changeVideo" class="space-between">Change video</button>
<!-- <hr style="padding: 6px; border: 0 none; height: 5px; color: rgb(233, 233, 233)"> -->
<button id="syncVideos" class="space-between">Synchronize videos</button>
<button id="sendLocation" class="space-between">Send location</button>
2021-01-28 01:34:15 +01:00
</div>
</div>
</div>
</body>
</html>