nova/Chatto
1
0
Fork 0
Code Issues 7 Pull Requests Releases Wiki Activity

set active css class to user boxes on click

Browse Source
This commit is contained in:
Rohan Sircar 2019-11-05 16:48:29 +05:30
parent dacf0f90dc
commit 579f819254
2 changed files with 32 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
chatto/src/main/resources/static/js/chat.js
View File

@ -35,6 +35,34 @@ var msgContainerSendTemplate = Handlebars.compile(source);
var chatAreaNew = document.getElementById('chat_area_new');
var userBoxes = document.getElementsByName('user-box');
// Loop through the buttons and add the active class to the current/clicked button
// for (var i = 0; i < btns.length; i++) {
// btns[i].addEventListener("click", function() {
// var current = document.getElementsByClassName("active");
// // If there's no active class
// if (current.length > 0) {
// current[0].className = current[0].className.replace(" active", "");
// }
// // Add the active class to the current/clicked button
// this.className += " active";
// });
// }
for (let i = 0; i < userBoxes.length; i++) {
userBoxes[i].addEventListener('click', function() {
let current = document.getElementsByClassName('user-box active');
if (current.length > 0) {
current[0].className = current[0].className.replace(" active", "");
}
// Add the active class to the current/clicked button
this.className += " active";
})
}
// var lastMessageTimeStamp;
// console.log(authToken);
@ -220,12 +248,7 @@ parent.addDelegatedListener("click", "input[type='radio']", function(event) {
let messageLog = [];
let messageLogNew = [];
let lastMessageTimeStamp;
// console.log("Json length = " + json.length);
//
// if(json.length == 0)
// {
// console.log("JSON LENGTH IS 0")
// }
if (json.length > 0) {
json.forEach(function(obj) {
// console.log(obj.toUser);

4
chatto/src/main/resources/templates/chat.html
View File

@ -72,7 +72,7 @@
</ui>
<ui class="contacts">
<th:block th:each="userName: ${userNames}">
<li>
<li name="user-box" class="user-box">
<div class="d-flex bd-highlight">
<div class="img_cont">
<img src="https://static.turbosquid.com/Preview/001292/481/WV/_D.jpg" class="rounded-circle user_img">
@ -80,7 +80,7 @@
</div>
<div class="user_info">
<span th:text="${userName}">Khalid</span>
<p th:text="${userName}">Kalid is online</p>
<p th:text="${userName} + ' is online'">Kalid is online</p>
</div>
</div>
</li>