Bug fix with username in chat

.gitignore

@@ -3,4 +3,4 @@
 db.sqlite3
 **/migrations/**
 /profiles/static/avatars/*
-!/profiles/static/avatars/default
+!/profiles/static/avatars/default.env

chat/consumers.py

@@ -22,15 +22,15 @@ class ChatConsumer(WebsocketConsumer):
 			self.room_group_name,
 			{
 				'type':'chat_message',
+				'username':self.scope["user"].username,
 				'message':message
 			}
 		)
 
 	def chat_message(self, event):
-		message = event['message']
 
 		self.send(text_data=json.dumps({
 			'type':'chat',
-			'username':self.scope["user"].username,
-			'message':message
+			'username':event['username'],
+			'message':event['message']
 		}))

frontend/static/css/search.css

@@ -0,0 +1,17 @@
+#app img
+{
+	max-height: 100px;
+	max-width: 100px;
+}
+
+#app ul
+{
+	margin: 5px 0 0 0;
+	padding: 0 0 0 0;
+	list-style-type: none;
+}
+
+#app li
+{
+	margin: 10px 10px 0 0;
+}

frontend/static/js/index.js

@@ -1,6 +1,7 @@
 import LoginView from "./views/accounts/LoginView.js";
 import Dashboard from "./views/Dashboard.js";
 import Settings from "./views/Settings.js";
+import Search from "./views/Search.js";
 import Chat from "./views/Chat.js";
 import HomeView from "./views/HomeView.js";
 import RegisterView from "./views/accounts/RegisterView.js";
@@ -41,6 +42,7 @@ const router = async (uri = "") => {
         { path: "/login", view: LoginView },
         { path: "/logout", view: LogoutView },
         { path: "/register", view: RegisterView },
+        { path: "/search", view: Search },
         { path: "/chat", view: Chat },
         { path: "/home", view: HomeView },
         { path: "/me", view: MeView },

frontend/static/js/views/Chat.js

@@ -4,7 +4,7 @@ export default class extends AbstractAuthentifiedView {
     constructor(params) {
         super(params, "Chat");
 
-		let url = `wss://${window.location.host}/ws/socket-server/`
+		let url = `ws://${window.location.host}/ws/socket-server/`
 
 		this.chatSocket = new WebSocket(url)
 		this.chatSocket.onmessage = function(e){
@@ -44,7 +44,7 @@ export default class extends AbstractAuthentifiedView {
 			<h1>Chat</h1>
 
 			<form id="form">
-				<input type="text" name="message" />
+				<input type="text" name="message" placeholder="message"/>
 			</form>
 
 			<div id="messages">

frontend/static/js/views/Search.js

@@ -0,0 +1,74 @@
+import AbstractView from "./AbstractView.js";
+import {client} from "../index.js";
+
+export default class extends AbstractView {
+    constructor(params) {
+        super(params, "Search");
+    }
+
+	async postInit() {
+
+		let search = document.getElementById("form");
+		search.addEventListener("input", this.users)
+
+		this.users();
+
+	}
+
+	async users() {
+
+		let search = document.getElementById("form").value;
+		
+		let logged = client.isAuthentificate();
+
+		let users = await client.profiles.all();
+		let list_users = document.getElementById('list_users');
+		list_users.innerHTML = "";
+
+		users.filter(user => user.username.startsWith(search) == true).forEach((user) => {
+			var new_user = document.createElement("li");
+
+			// username
+			let username = document.createElement("a");
+			username.href = `/profiles/${user.user_id}`;
+			username.appendChild(document.createTextNode(user.username));
+			new_user.appendChild(username);
+
+			// space
+			new_user.appendChild(document.createTextNode(" "));
+
+			// chat
+			let chat = document.createElement("a");
+			chat.href = `/chat`
+			chat.appendChild(document.createTextNode("Chat"));
+			new_user.appendChild(chat);
+			
+			// break line
+			new_user.appendChild(document.createElement("br"));
+
+			// avatar
+			var img = document.createElement("img");
+			img.src = user.avatar_url;
+			new_user.appendChild(img);
+
+
+			list_users.appendChild(new_user);
+		});
+		console.log(list_users);
+
+	}
+
+    async getHtml() {
+        return `
+			<link rel="stylesheet" href="/static/css/search.css">
+
+			<input id="form" type="text" name="message" placeholder="userbozo"/>
+
+			<div id="users">
+				<ul id="list_users">
+				</ul>
+			</div>
+
+        `;
+    }
+}

frontend/templates/index.html

@@ -13,7 +13,7 @@
         <a href="/profiles" class="nav__link" data-link>Profiles</a>
         <a href="/login" class="nav__link" data-link>Login</a>
         <a href="/register" class="nav__link" data-link>Register</a>
-        <a href="/chat" class="nav__link" data-link>Chat</a>
+        <a href="/search" class="nav__link" data-link>Search</a>
     </nav>
     <div id="app"></div>
 	<script type="module" src="{% static 'js/index.js' %}"></script>

package-lock.json

@@ -0,0 +1,6 @@
+{
+  "name": "ft_transcendence",
+  "lockfileVersion": 3,
+  "requires": true,
+  "packages": {}
+}