first commit

chat.php

@@ -0,0 +1,220 @@
+<!-- getting timecode of last message out of timecode file -->
+
+<?php
+$lastTimecode = file_get_contents('lastTimecode.txt');
+echo "<div id='lastTimecode'>$lastTimecode</div>";
+
+?>
+
+
+
+<div id="showChat" onclick="openChat();scrollLate()">CH4TFORM</div>
+
+<div class="chat" id="chat">
+
+<h1>CH4TFORM</h1>
+
+<div class="closeChat" onclick="closeChat()">&#x2715;</div>
+
+<div id="historyBox">
+<div id="history"></div>
+</div>
+
+
+
+<div id="sending">
+<input id="chatName" placeholder="your nickname.." type="text">
+
+<input id="newMesInput" onkeypress="clickPress(event)" placeholder="write a message..." type="text">
+<button class="sendBtn" onclick="sendMes()">send</button>
+</div>
+
+</div>
+
+<div id="load"></div>
+
+
+
+
+
+
+
+
+
+
+
+
+
+<script type="text/javascript">
+
+// function fetchHeader(url, wch) {
+//     try {
+//         var req=new XMLHttpRequest();
+//         req.open("HEAD", url, false);
+//         req.send(null);
+//         if(req.status== 200){
+//             return req.getResponseHeader(wch);
+//         }
+//         else return false;
+//     } catch(er) {
+//         return er.message;
+//     }
+// }
+
+// alert(fetchHeader("https://pl4tform.org/includes/chatContent.php",'Last-Modified'));
+
+function loadFile(filePath) {
+  var result = null;
+  var xmlhttp = new XMLHttpRequest();
+  xmlhttp.open("GET", filePath, false);
+  xmlhttp.send();
+  if (xmlhttp.status==200) {
+    result = xmlhttp.responseText;
+  }
+  var actualChat = '2';
+}
+
+loadFile();
+
+// function reloadTest() {
+
+//     var loadedChat = document.getElementById('history').innerHTML;
+
+//     var filePath = 'includes/chatContent.php';
+//     var result = null;
+//     var xmlhttp = new XMLHttpRequest();
+//     xmlhttp.open("GET", filePath, false);
+//     xmlhttp.send();
+//     if (xmlhttp.status==200) {
+//         result = xmlhttp.responseText;
+//     }
+//     var actualChat = result;
+
+
+//     if (actualChat.length!==loadedChat.length) {
+//             reload();
+//         // console.log("NEW MESSAEG - reload chat");
+//         console.log('reload pq plus actuelle !')
+
+
+//     }
+
+//     else {
+//     // console.log("no new messages - don't reload chat");
+
+//     }
+
+// }
+
+// reloadTest();
+
+function reloadTest() {
+
+var loadedChat = document.getElementById('lastTimecode').innerHTML;
+
+var filePath = 'includes/lastTimecode.txt';
+var result = null;
+var xmlhttp = new XMLHttpRequest();
+xmlhttp.open("GET", filePath, false);
+xmlhttp.send();
+if (xmlhttp.status==200) {
+    result = xmlhttp.responseText;
+}
+var actualChat = result;
+
+// console.log('actualchat: '+actualChat+' loaded chat: '+loadedChat)
+
+
+if (actualChat!==loadedChat) {
+        reload();
+    // console.log("NEW MESSAEG - reload chat");
+    document.getElementById('lastTimecode').innerHTML = actualChat;
+    console.log('different timestamp ==> reload!')
+
+
+}
+
+else {
+// console.log("same timestamp - don't reload chat");
+
+
+}
+
+}
+
+reloadTest();
+
+
+setInterval(reloadTest, 2000);
+
+
+
+function reload() {
+        $("#history").load("includes/chatContent.php");
+        setTimeout(scroll, 200)
+        console.log("reload")
+
+    }
+
+
+function scroll() {
+    // document.getElementById('historyBox').scrollTo(0, 1000); 
+    chatWindow = document.getElementById('historyBox'); 
+    var xH = chatWindow.scrollHeight; 
+    chatWindow.scrollTo(0, xH);
+
+    console.log("scroll")
+}
+
+
+function sendMes() {
+
+    var newMes = document.getElementById('newMesInput').value;
+    var chatName = document.getElementById('chatName').value;
+
+    if (newMes) {
+    $("#load").load("includes/chatLoad.php", {message: newMes, chatName: chatName});
+    var newMes = document.getElementById('newMesInput').value = "";
+    setTimeout(reload, 200);
+    console.log('message send');
+    }
+    else {
+        console.log('message field empty ==> no message sended');
+    }
+
+
+
+
+
+}
+
+reload();
+setTimeout(scroll, 2000)
+
+function clickPress(event) {
+    if (event.key == "Enter") {
+        sendMes();
+    }
+}
+
+function closeChat() {
+    document.getElementById("chat").style.display = 'none';
+    document.getElementById("showChat").style.display = 'block';
+    console.log("close chat");
+
+};
+
+function openChat() {
+    document.getElementById("chat").style.display = 'block';
+    document.getElementById("showChat").style.display = 'none';
+
+};
+
+
+function scrollLate() {
+    setTimeout(scroll, 300)
+    console.log('scrolllatency')
+}
+
+</script>
+