diff --git a/MessageSystem/chatlist.php b/MessageSystem/chatlist.php
old mode 100755
new mode 100644
index c1b0d141dc411cd4d3cba36041ee89e29b5129e2..19ffeeb0f71fb2137aa07bdc9f512acd6c097606
--- a/MessageSystem/chatlist.php
+++ b/MessageSystem/chatlist.php
@@ -2,58 +2,64 @@
<html>
<head>
<title>Title</title>
- <script src='http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js'></script>
+ <script src='http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js'></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
- <script>
- var chatlistbox = angular.module('chatlistbox',[]);
- chatlistbox.controller('controller', ['$scope', function ($scope) {
- $scope.chatrooms = [];
- var room = new Object();
- room.username = "Dewita Sonya";
- room.lastmessage = "iya itu barangnya bagus banget, udah pake lama tetep awet";
- $scope.chatrooms.push(room);
- var room2 = new Object();
- room2.username = "Mico mico";
- room2.lastmessage = "micomicomico barangnya oke punya, ukuran juga pas";
- $scope.chatrooms.push(room2);
- var room3 = new Object();
- room3.username = "Albertus Djauhari";
- room3.lastmessage = "jangan dibel itumah barang palsu, kualitasnya jelek ";
- $scope.chatrooms.push(room3);
- var room4 = new Object();
- room4.username = "William";
- room4.lastmessage = "kskskso sajsa sakjsk as akjka dkjs kfasjfssak fjsaf";
- $scope.chatrooms.push(room4);
-
- }]);
-
-
-
-
- </script>
+ <script src="https://www.gstatic.com/firebasejs/4.6.2/firebase.js"></script>
+ <script src="firebase-conf.js"></script>
+
<link rel="stylesheet" href="chat.css">
</head>
-<body ng-app="chatlistbox" ng-controller="controller">
+<body >
<div class="box" >
<div class = "chat-title">
<span class="name">Chats</span>
</div>
<div class = "chat-search">
- <form ng-submit="submit1()">
+ <form >
<input type="text" name="chattext" placeholder="Search name" class="search-name">
<input type="submit" name="search" value="Cari" class="search-button">
</form>
</div>
- <div class="chat-list" ng-repeat="chatroom in chatrooms">
- <div class="chatroom-item">
- <div class="chatroom-username">
- <span>{{chatroom.username}}</span>
- <div class="chatroom-lastmessage">
- <span>{{chatroom.lastmessage}}</span>
- </div>
- </div>
+ <div id="chatlist" class="chat-list">
+ <!-- <div class="chatroom-item">
+ </div> -->
</div>
</div>
+ <script>
+ var startListening = function() {
+ console.log("startListening");
+ firebase.database().ref().on('child_added', function(snapshot) {
+ var chatrooms = snapshot.val();
+
+ if (chatrooms.sender=="person1"){
+ console.log("yeay");
+ var chatroom_item = document.createElement("div");
+ chatroom_item.classList.add('chatroom-item');
+
+ var chatroom_username = document.createElement("div");
+ chatroom_username.classList.add('chatroom-username');
+
+ var chatroom_lastmessage = document.createElement("div");
+ chatroom_lastmessage.classList.add('chatroom-lastmessage');
+
+ var chatroom_username_span = document.createElement("span");
+ chatroom_username_span.textContent = chatrooms.receiver;
+ chatroom_username.appendChild(chatroom_username_span);
+ var chatroom_lastmessage_span = document.createElement("span");
+ chatroom_lastmessage_span.textContent = chatrooms.message;
+ chatroom_lastmessage.appendChild(chatroom_lastmessage_span);
+
+ chatroom_item.appendChild(chatroom_username);
+ chatroom_item.appendChild(chatroom_lastmessage);
+ var chatlist = document.getElementById("chatlist");
+
+ chatlist.appendChild(chatroom_item);
+ }
+ });
+ }
+ startListening();
+
+ </script>
</body>
</html>
diff --git a/MessageSystem/chatroom.php b/MessageSystem/chatroom.php
index 08f2f2103ce72b596c768f706428bb23302192b0..8c42204740b960c5340a0954b98b05e71b8e2158 100755
--- a/MessageSystem/chatroom.php
+++ b/MessageSystem/chatroom.php
@@ -18,7 +18,8 @@
</div>
<div class="chat-input">
<div>
- <input id="username" type="hidden" value="person1">
+ <input id="sender" type="hidden" value="person1">
+ <input id="receiver" type="hidden" value="person2">
<input id="message" type="text" name="chattext" class="message-content">
<input id="send" type="submit" class="send-button" onclick="send()">
</div>
@@ -26,6 +27,7 @@
</div>
</div>
<!-- Bagian ini cuma buat test front end, yang dipake yg atas aja -->
+<!-- yang bawah emg ga diatur dgn benar cuma buat nambahan chat -->
<div class="box" >
<div class = "chat-title">
<span class="name">Person 1 Name</span>
@@ -35,7 +37,8 @@
</div>
<div class="chat-input">
<div>
- <input id="username2" type="hidden" value="person2">
+ <input id="sender2" type="hidden" value="person2">
+ <input id="receiver2" type="hidden" value="person1">
<input id="message2" type="text" name="chattext" class="message-content">
<input id="send2" type="submit" class="send-button" onclick="send2()">
</div>
@@ -45,21 +48,25 @@
<script>
function send() {
console.log("masuk");
- var username = document.getElementById("username").value;
+ var sender = document.getElementById("sender").value;
+ var receiver = document.getElementById("receiver").value;
var message = document.getElementById("message").value;
firebase.database().ref().push().set({
- username: username,
+ sender: sender,
+ receiver: receiver,
message: message
});
document.getElementById("message").value = "";
}
function send2() {
console.log("masuk");
- var username = document.getElementById("username2").value;
- var message = document.getElementById("message2").value;
+ var sender2 = document.getElementById("sender2").value;
+ var receiver2 = document.getElementById("receiver2").value;
+ var message2 = document.getElementById("message2").value;
firebase.database().ref().push().set({
- username: username,
- message: message
+ sender: sender2,
+ receiver: receiver2,
+ message: message2
});
document.getElementById("message2").value = "";
}
@@ -71,12 +78,16 @@
var msgTextElement = document.createElement("p");
msgTextElement.textContent = msg.message;
- if (msg.username=="person1"){
+ if ((msg.sender=="person1")&&(msg.receiver=="person2")){
msgTextElement.classList.add('sendermessage');
- } else {
+ } else if ((msg.sender=="person2")&&(msg.receiver=="person1")) {
msgTextElement.classList.add('receivemessage');
+ } else {
+
}
- document.getElementById("chatbox").appendChild(msgTextElement);
+ var chatbox = document.getElementById("chatbox");
+ chatbox.appendChild(msgTextElement);
+ chatbox.scrollTop=chatbox.scrollHeight;
});
}
startListening();