add block option

chat/consumers.py

@@ -2,6 +2,7 @@ import json
 from channels.generic.websocket import WebsocketConsumer
 from asgiref.sync import async_to_sync
 from .models import MemberModel, MessageModel
+from profiles.models import BlockModel
 import time
 
 class ChatConsumer(WebsocketConsumer):
@@ -34,6 +35,9 @@ class ChatConsumer(WebsocketConsumer):
 
 		text_data_json = json.loads(text_data)
 		message = text_data_json['message']
+		receivers_id = text_data_json['receivers_id']
+
+		print(text_data)
 
 		channel_id : int = int(self.scope['path'].split('/')[3])
 		user = self.scope["user"]
@@ -46,9 +50,14 @@ class ChatConsumer(WebsocketConsumer):
 		if (self.channel_layer == None):
 			return
 
-		print(message)
-
 		message_time : int = int(time.time() * 1000)
+		
+		if (len(receivers_id) == 1 and 
+			BlockModel.objects.filter(blocker=user.pk, blocked=receivers_id[0]) or
+			BlockModel.objects.filter(blocker=receivers_id[0], blocked=user.pk)
+			):
+			return
+
 		async_to_sync(self.channel_layer.group_send)(
 			self.room_group_name,
 			{

chat/views.py

@@ -11,9 +11,9 @@ class ChatView(APIView):
 	
 	def get(self, request, pk):
 		if (ChannelModel.objects.filter(pk=pk)):
-			return Response({'channel_id': pk})
+			return Response({'channel_id': pk}, status=status.HTTP_200_OK)
 		else:
-			return Response("Channel doesn't exist")
+			return Response("Channel doesn't exist", status=status.HTTP_404_NOT_FOUND)
 
 	def delete(self, request, pk):
 
@@ -21,28 +21,7 @@ class ChatView(APIView):
 		MessageModel.objects.filter(pk=pk).delete()
 		MemberModel.objects.filter(pk=pk).delete()
 
-		return Response({'channel_id': pk})
-
-	"""
-	def post(self, request, pk):
-		channel = ChannelModel.objects.filter(pk=pk)
-		message = request.data.get("message", [])
-		print(message)
-		if (message == []):
-			return Response('No message', status=status.HTTP_400_BAD_REQUEST)
-
-		new_message = MessageModel()
-		new_message.channel_id = message["channel_id"]
-		new_message.author_id = message["author_id"]
-		new_message.content = message["content"]
-		new_message.time = message["time"]
-		new_message.save()
-
-		messages = MessageModel.objects.filter(channel_id=pk)
-		messages = serializers.serialize("json", messages) 
-		return Response({'messages':messages}, status=status.HTTP_200_OK)
-	"""
-
+		return Response({'channel_id': pk}, status=status.HTTP_200_OK)
 
 class ChatsView(APIView):
 	def post(self, request):

frontend/static/css/index.css

@@ -1,7 +1,8 @@
+
 body {
     margin: 0.5em;
     font-family: 'Quicksand', sans-serif;
-    font-size: 40px;
+    font-size: 30px;
 }
 
 a {

frontend/static/css/profile.css

@@ -0,0 +1,20 @@
+#app #avatar
+{
+	height: 100px;
+	width: 100px;
+}
+
+#app #username
+{
+	font-size: 0.8em;
+}
+
+#app #block {
+	cursor: pointer;
+	font-size: 0.7em;
+	text-decoration: underline;
+}
+
+#app {
+	margin-top: 20px;
+}

frontend/static/css/profiles/profile.css

@@ -1,11 +0,0 @@
-#app #avatar
-{
-	height: 100px;
-	width: 100px;
-}
-
-#app #username
-{
-	height: 100px;
-	width: 100px;
-}

frontend/static/css/profiles/profiles.css

@@ -1,11 +0,0 @@
-#app .item img
-{
-	height: 100px;
-	width: 100px;
-}
-
-#app .item a
-{
-	height: 100px;
-	width: 100px;
-}

frontend/static/css/search.css

@@ -30,7 +30,7 @@
 
 #app #chat {
 	position: relative;
-	max-height: 86vh;
+	max-height: 100vh;
 	width: 100vh;
 	/*border: 2px	solid green;*/
 	overflow: hidden;
@@ -42,21 +42,26 @@
 
 #app #add_chat_off {
 	text-decoration: underline;
+	cursor: pointer;
+}
+
+#app #add_chat_on {
+	cursor: pointer;
 }
 
 #app #messages {
-	max-height: 40em;
+	max-height: 60vh;
 	overflow: scroll;
 	overflow-y: scroll;
 	overflow-x: hidden;
-	font-size: 0.6em;
+	font-size: 0.75em;
 }
 
 #app #input_user{
 	color: green;
 	width: 8.5em;
 	height: 1.1em;
-	font-size: 0.75em;
+	font-size: 0.65em;
 	border: none;
 	outline: none;
 	border-bottom: 0.15em solid green;
@@ -72,7 +77,7 @@
 	border-bottom: 0.2em solid green;
 	caret-color: green;
 	color: green;
-	font-size: 0.65em;
+	font-size: 16px;
 }
 
 #app #you {

frontend/static/js/api/chat/channel.js

@@ -54,13 +54,14 @@ class Channel {
 		return new_messages;
 	}
 
-	async sendMessageChannel(message) {
+	async sendMessageChannel(message, receivers_id) {
 
 		if (this.chatSocket == undefined)
 			return;
 
 		this.chatSocket.send(JSON.stringify({
-			'message':message
+			'message':message,
+			'receivers_id':receivers_id,
 		}));
 	}
 

frontend/static/js/api/client.js

@@ -35,10 +35,11 @@ class Client
 		return this.logged;	
 	}
 
-	async _get(uri)
+	async _get(uri, data)
 	{
 		let response = await fetch(this._url + uri, {
 			method: "GET",
+			body: JSON.stringify(data),
 		});
 		return response;
 	}

frontend/static/js/api/profile.js

@@ -12,8 +12,9 @@ class Profile
 		 */
 		this.client = client;
 		this.username = username;
-		this.avatar_url = avatar_url
-		this.user_id = user_id
+		this.avatar_url = avatar_url;
+		this.user_id = user_id;
+		this.isBlocked = false;
 	}
 
 	async init(user_id)
@@ -21,9 +22,23 @@ class Profile
 		let response = await this.client._get(`/api/profiles/${user_id}`);
 		let response_data = await response.json();
 
-		this.user_id = response.user_id;
+		this.user_id = response_data.user_id;
 		this.username = response_data.username;
 		this.avatar_url = response_data.avatar_url;
+
+		let block_response = await this.client._get("/api/profiles/block");
+
+		if (block_response.status == 404)
+			return
+
+		let block_data = await block_response.json();
+		let block_list = JSON.parse(block_data);
+		block_list.forEach(block => {
+			let blocker = block.fields.blocker;
+			let blocked = block.fields.blocked;
+			if (blocker == this.client.me.user_id && blocked == user_id)
+				return this.isBlocked = true;
+		});
 	}
 }
 

frontend/static/js/api/profiles.js

@@ -31,6 +31,34 @@ class Profiles
 		await profile.init(user_id);
 		return profile;
 	}
+
+	async block(user_id) {
+
+		// blocker & blocked
+		let response = await this.client._post("/api/profiles/block", { 
+			users_id:[this.client.me.user_id, user_id],
+		});
+
+		let data = await response.json();
+		console.log(response.status);
+		console.log(data);
+		return data;
+
+	}
+
+	async deblock(user_id) {
+
+		// blocker & blocked
+		let response = await this.client._delete("/api/profiles/block", { 
+			users_id:[this.client.me.user_id, user_id],
+		});
+
+		let data = await response.json();
+		console.log(response.status);
+		console.log(data);
+		return data;
+		
+	}
 }
 
 export {Profiles}

frontend/static/js/index.js

@@ -10,9 +10,9 @@ import GameView from "./views/Game.js"
 
 import PageNotFoundView from './views/PageNotFoundView.js' 
 
-import AbstractRedirectView from "./views/AbstractRedirectView.js";
+import AbstractRedirectView from "./views/abstracts/AbstractRedirectView.js";
 import MeView from "./views/MeView.js";
-import ProfilePageView from "./views/profiles/ProfilePageView.js";
+import ProfilePageView from "./views/ProfilePageView.js";
 import MatchMakingView from "./views/MatchMakingView.js";
 
 let client = new Client(location.protocol + "//" + location.host)

frontend/static/js/views/Dashboard.js

@@ -1,4 +1,4 @@
-import AbstractView from "./AbstractView.js";
+import AbstractView from "./abstracts/AbstractView.js";
 
 export default class extends AbstractView {
     constructor(params) {

frontend/static/js/views/Game.js

@@ -1,4 +1,4 @@
-import AbstractView from './AbstractView.js'
+import AbstractView from "./abstracts/AbstractView.js";
 
 export default class extends AbstractView {
 	constructor(params) {

frontend/static/js/views/HomeView.js

@@ -1,4 +1,4 @@
-import AbstractAuthentificateView from "./AbstractAuthentifiedView.js";
+import AbstractAuthentificateView from "./abstracts/AbstractAuthentifiedView.js";
 
 export default class extends AbstractAuthentificateView {
     constructor(params) {

frontend/static/js/views/MatchMakingView.js

@@ -1,5 +1,5 @@
 import { client, navigateTo } from "../index.js";
-import AbstractView from "./AbstractView.js";
+import AbstractView from "./abstracts/AbstractView.js";
 
 function game_found(game_id)
 {

frontend/static/js/views/MeView.js

@@ -1,6 +1,6 @@
 import { client, navigateTo } from "../index.js";
 import { clear, fill_errors } from "../utils/formUtils.js";
-import AbstractAuthentificateView from "./AbstractAuthentifiedView.js";
+import AbstractAuthentificateView from "./abstracts/AbstractAuthentifiedView.js";
 
 export default class extends AbstractAuthentificateView
 {    

frontend/static/js/views/PageNotFoundView.js

@@ -1,4 +1,4 @@
-import AbstractView from "./AbstractView.js";
+import AbstractView from "./abstracts/AbstractView.js";
 
 export default class extends AbstractView {
     constructor(params) {

frontend/static/js/views/ProfilePageView.js

@@ -0,0 +1,62 @@
+import AbstractView from "./abstracts/AbstractView.js";
+import { client } from "../index.js"
+
+export default class extends AbstractView {
+    constructor(params) {
+        super(params, "Profile ");
+        this.user_id = params.id;
+    }
+
+    async postInit()
+    {
+        this.profile = await client.profiles.getProfile(this.user_id);
+		this.info = document.getElementById("info");
+
+		// Username
+        let username = document.createElement("a");
+		username.id = "username";
+        username.appendChild(document.createTextNode(this.profile.username));
+		this.info.appendChild(username);
+
+		this.info.appendChild(document.createElement("br"));
+
+		// Avatar
+        let avatar = document.createElement("img");
+		avatar.id = "avatar";
+        avatar.src = this.profile.avatar_url;
+		this.info.appendChild(avatar);
+
+		await this.blockButton();
+    }
+
+	async blockButton() {
+		// Block option
+		if (client.me.user_id != this.user_id) {
+			let block = document.getElementById("block") || document.createElement("a");
+			block.id = "block";
+			block.innerText = "";
+			block.onclick = async () => {
+				if (!this.profile.isBlocked)
+					await client.profiles.block(this.user_id);
+				else
+					await client.profiles.deblock(this.user_id);
+				this.profile = await client.profiles.getProfile(this.user_id);
+				this.blockButton();
+			};
+			if (this.profile.isBlocked)
+				block.appendChild(document.createTextNode("Deblock"));
+			else
+				block.appendChild(document.createTextNode("Block"));
+			this.info.appendChild(block);
+		}
+	}
+
+    async getHtml() {
+        return `
+            <link rel="stylesheet" href="/static/css/profile.css">
+			<div id="info"> 
+
+			</div>
+        `;
+    }
+}

frontend/static/js/views/Search.js

@@ -1,4 +1,4 @@
-import AbstractView from "./AbstractView.js";
+import AbstractView from "./abstracts/AbstractView.js";
 import {client} from "../index.js";
 import {Message} from "../api/chat/message.js"
 
@@ -52,7 +52,6 @@ export default class extends AbstractView {
 			// chat
 			if (logged && client.me.user_id != user.user_id) {
 				let add_chat = document.createElement("a");
-				add_chat.href = "";
 				add_chat.id = "add_chat_off";
 				add_chat.onclick = async () => {
 					if (client.channel != undefined) {
@@ -82,13 +81,6 @@ export default class extends AbstractView {
 				
 				new_user.appendChild(document.createTextNode(" "));
 
-				let block = document.createElement("a");
-				block.addEventListener("click", async () => {
-					if (client.me.user_id != user.user_id) {
-					}
-				});
-				block.appendChild(document.createTextNode("Block"));
-				new_user.appendChild(block);
 			}
 			
 			// break line
@@ -108,12 +100,13 @@ export default class extends AbstractView {
 
 	async chat() {
 
+		let users = await client.profiles.all();
 		let logged = await client.isAuthentificate();
-		let reload = document.getElementById("messages");
+		/*let reload = document.getElementById("messages");
 		if (reload != null)
-			reload.remove();
+			reload.remove();*/
 
-		reload = document.getElementById("members");
+		let reload = document.getElementById("members");
 		if (reload != null)
 			reload.remove();
 
@@ -128,13 +121,33 @@ export default class extends AbstractView {
 			chats.appendChild(chat);
 		}
 
+		
 		// div des messages
-		let messages = document.createElement("div");
+		let messages = document.getElementById("messages");
+		if (messages == null) {
+			messages = document.createElement("div");
 			messages.id = "messages";
 			if (document.getElementById("input_chat") == null)
 				chat.appendChild(messages);
 			else
 				document.getElementById("input_chat").before(messages);
+		}
+
+		// les messages, réecriture seulement du dernier 
+		let i = 0;
+		client.channel.messages.forEach((message) => {
+			if (messages.children[i] == null || message.content != messages.children[i].innerText) {
+				let text = document.createElement("p");
+				text.appendChild(document.createTextNode(message.content));
+				if (message.author_id == client.me.user_id)
+					text.id = "you";
+				else
+					text.id = "other";
+
+				messages.appendChild(text);
+			}
+			i++;
+		});
 
 		// Input pour rentrer un message
 		if (document.getElementById("input_chat") == null) {
@@ -146,21 +159,25 @@ export default class extends AbstractView {
 			chat_input.maxLength=255;
 			chat.appendChild(chat_input);
 			
-			chat_input.addEventListener("keydown", async () => {
+			chat_input.onkeydown = async () => {
 				if (event.keyCode == 13 && client.channel != undefined) {
 					//let chat_input = document.getElementById("input_chat");
 					let chat_text = chat_input.value;
 
-					await client.channel.sendMessageChannel(chat_text)
+					let receivers_id = [];
+					client.channel.members_id.forEach((member_id) => {
+						if (member_id != client.me.user_id)
+							receivers_id.push(users.filter(user => user.user_id == member_id)[0].user_id);
+					});
+					await client.channel.sendMessageChannel(chat_text, receivers_id)
 
 					// Reset
 					chat_input.value = "";
 				}
-			});
+			};
 		}
 
 		// nom des membres du chat
-		let users = await client.profiles.all();
 		let members = document.createElement("h2");
 		members.id = "members";
 		let usernames = "";
@@ -174,17 +191,6 @@ export default class extends AbstractView {
 		members.appendChild(document.createTextNode(usernames));
 		messages.before(members);
 
-		// les messages
-		client.channel.messages.forEach((message) => {
-			let text = document.createElement("p");
-			text.appendChild(document.createTextNode(message.content));
-			if (message.author_id == client.me.user_id)
-				text.id = "you";
-			else
-				text.id = "other";
-
-			messages.appendChild(text);
-		});
 
 		// Scroll to the bottom of messages
 		messages.scrollTop = messages.scrollHeight;

frontend/static/js/views/abstracts/AbstractAuthentifiedView.js

@@ -1,4 +1,4 @@
-import { client, navigateTo } from "../index.js";
+import { client, navigateTo } from "../../index.js";
 import AbstractRedirectView from "./AbstractRedirectView.js";
 
 export default class extends AbstractRedirectView{

frontend/static/js/views/abstracts/AbstractNonAuthentified.js

@@ -1,4 +1,4 @@
-import { client, navigateTo } from "../index.js";
+import { client, navigateTo } from "../../index.js";
 import AbstractRedirectView from "./AbstractRedirectView.js";
 
 export default class extends AbstractRedirectView{

frontend/static/js/views/abstracts/AbstractRedirectView.js

@@ -1,4 +1,4 @@
-import { navigateTo } from "../index.js";
+import { navigateTo } from "../../index.js";
 import AbstractView from "./AbstractView.js";
 
 export default class extends AbstractView{

frontend/static/js/views/accounts/LoginView.js

@@ -1,6 +1,6 @@
 import { client, navigateTo } from "../../index.js";
 import { clear, fill_errors } from "../../utils/formUtils.js";
-import AbstractNonAuthentifiedView from "../AbstractNonAuthentified.js";
+import AbstractNonAuthentifiedView from "../abstracts/AbstractNonAuthentified.js";
 
 async function login()
 {

frontend/static/js/views/accounts/LogoutView.js

@@ -1,5 +1,5 @@
 import { client, navigateTo } from "../../index.js";
-import AbstractAuthentifiedView from "../AbstractAuthentifiedView.js";
+import AbstractAuthentifiedView from "../abstracts/AbstractAuthentifiedView.js";
 
 export default class extends AbstractAuthentifiedView
 {

frontend/static/js/views/accounts/RegisterView.js

@@ -1,6 +1,6 @@
 import { client, navigateTo } from "../../index.js";
 import { clear, fill_errors } from "../../utils/formUtils.js";
-import AbstractNonAuthentifiedView from "../AbstractNonAuthentified.js";
+import AbstractNonAuthentifiedView from "../abstracts/AbstractNonAuthentified.js";
 
 async function register()
 {

frontend/static/js/views/profiles/ProfilePageView.js

@@ -1,29 +0,0 @@
-import AbstractView from "../AbstractView.js";
-import { client } from "../../index.js"
-
-export default class extends AbstractView {
-    constructor(params) {
-        super(params, "Profile ");
-        this.user_id = params.id;
-    }
-
-    async postInit()
-    {
-        let profile = await client.profiles.getProfile(this.user_id);
-
-        let username_element = document.getElementById("username");
-        username_element.href = `/profiles/${this.user_id}`;
-        username_element.appendChild(document.createTextNode(profile.username));
-
-        let avatar_element = document.getElementById("avatar");
-        avatar_element.src = profile.avatar_url;
-    }
-
-    async getHtml() {
-        return `
-            <link rel="stylesheet" href="/static/css/profiles/profile.css">
-		    <img id="avatar"/>
-		    <a id="username"></a>
-        `;
-    }
-}

profiles/admin.py

@@ -1,6 +1,7 @@
 from django.contrib import admin
 
-from .models import ProfileModel
+from .models import ProfileModel, BlockModel
 
 # Register your models here.
 admin.site.register(ProfileModel)
+admin.site.register(BlockModel)

profiles/models.py

@@ -4,6 +4,7 @@ from django.contrib.auth.models import User
 from django.db.models.signals import post_save
 from django.dispatch import receiver
 from django.conf import settings
+from django.db.models import IntegerField
 
 def upload_to(instance, filename: str):
     return f"./profiles/static/avatars/{instance.pk}.{filename.split('.')[1]}"
@@ -18,3 +19,10 @@ def on_user_created(sender, instance, created, **kwargs):
     if created:
         profile: ProfileModel = ProfileModel.objects.create(pk = instance.pk, user = instance)
         profile.save()
+		
+class BlockModel(models.Model):
+	blocker = IntegerField(primary_key=False)
+	blocked = IntegerField(primary_key=False)
+
+	def __str__(self):
+		return "blocker_id: " + str(self.blocker) + ", blocked_id: " + str(self.blocked)

profiles/urls.py

@@ -3,9 +3,13 @@ from django.conf import settings
 from django.conf.urls.static import static
 
 from . import viewsets
+from . import views
 
 urlpatterns = [
     path("me", viewsets.MyProfileViewSet.as_view({'patch': 'partial_update', 'get': 'retrieve'}), name="my_profile_page"),
     path("<int:pk>", viewsets.ProfileViewSet.as_view({'get': 'retrieve'}), name="profile_page"),
     path("", viewsets.ProfileViewSet.as_view({'get': 'list'}), name="profiles_list"),
+	path("block", views.BlocksView.as_view(), name="block_page"),
+	path("block/<int:pk>", views.BlockView.as_view(), name="block_page"),
+
 ] + static("/static/avatars/", document_root="./avatars")

profiles/views.py

@@ -0,0 +1,66 @@
+from rest_framework.views import APIView
+from rest_framework.response import Response
+from rest_framework import authentication, permissions, status
+from rest_framework.authentication import SessionAuthentication
+from rest_framework.renderers import JSONRenderer
+from django.core import serializers
+from .models import BlockModel
+
+class BlockView(APIView):
+	permission_classes = (permissions.IsAuthenticated,)
+	authentication_classes = (SessionAuthentication,)
+
+	def get(self, request, pk):
+		block = BlockModel.objects.filter(pk=pk)
+		if (block):
+			return Response(serializers.serialize("json", block), status=status.HTTP_200_OK)
+		else:
+			return Response("Not Found", status=status.HTTP_404_NOT_FOUND)
+
+
+class BlocksView(APIView):
+	permission_classes = (permissions.IsAuthenticated,)
+	authentication_classes = (SessionAuthentication,)
+
+	def get(self, request):
+		blocks = BlockModel.objects.filter(blocker=request.user.pk)
+		if (blocks):
+			return Response(serializers.serialize("json", BlockModel.objects.filter(blocker=request.user.pk)), status=status.HTTP_200_OK)
+		else:
+			return Response({}, status=status.HTTP_404_NOT_FOUND)
+
+	def post(self, request):
+		data: dict = request.data
+		users_id = request.data.get("users_id", None)
+
+		if (users_id == None):
+			return Response({"Error"}, status=status.HTTP_400_BAD_REQUEST)
+
+		if (BlockModel.objects.filter(blocker=users_id[0], blocked=users_id[1])):
+			return Response({"Already Exist"}, status=status.HTTP_409_CONFLICT)
+
+		new_block = BlockModel()
+		new_block.blocker = users_id[0]
+		new_block.blocked = users_id[1]
+		new_block.save()
+
+		return Response({"block_id": new_block.pk}, status=status.HTTP_201_CREATED)
+
+	def delete(self, request):
+		data: dict = request.data
+		users_id = request.data.get("users_id", None)
+
+		if (users_id == None):
+			return Response({"Error"}, status=status.HTTP_400_BAD_REQUEST)
+
+		block = BlockModel.objects.filter(blocker=users_id[0], blocked=users_id[1])
+
+		print(list(block))
+		if (block.count() > 1):
+			return Response("Not normal >:[", status=status.HTTP_500_INTERNAL_SERVER_ERROR)
+		
+		if (not block):
+			return Response("Don't exist", status=status.HTTP_404_NOT_FOUND)
+
+		block.delete()
+		return Response("Deleted", status=status.HTTP_200_OK)