diff --git a/chat/views.py b/chat/views.py index 9e8a655..731325f 100644 --- a/chat/views.py +++ b/chat/views.py @@ -61,7 +61,7 @@ class ChatsView(APIView): continue for member2 in MemberModel.objects.filter(member_id=user_id2): if (member1.channel_id == member2.channel_id): - messages = MessageModel.objects.filter(channel_id=member1.channel_id) + messages = MessageModel.objects.filter(channel_id=member1.channel_id).order_by("time") messages = serializers.serialize("json", messages) return Response({'channel_id': member1.channel_id, 'messages':messages}, status=status.HTTP_200_OK) diff --git a/frontend/static/css/index.css b/frontend/static/css/index.css index db15e14..1413534 100644 --- a/frontend/static/css/index.css +++ b/frontend/static/css/index.css @@ -1,7 +1,7 @@ body { margin: 10; font-family: 'Quicksand', sans-serif; - font-size: 18px; + font-size: 3vh; } a { diff --git a/frontend/static/css/search.css b/frontend/static/css/search.css index 50cd3a1..71c4600 100644 --- a/frontend/static/css/search.css +++ b/frontend/static/css/search.css @@ -1,11 +1,12 @@ #app img { - max-height: 100px; - max-width: 100px; + max-height: 10vh; + max-width: 10vh; } #app ul { + font-size: 2vh; margin: 5px 0 0 0; padding: 0 0 0 0; list-style-type: none; @@ -22,17 +23,34 @@ text-align: left; } #app #users { - margin-right: 50px; + margin-right: 5vh; } #app #chat { position: relative; - height: 100%; + max-height: 80vh; width: 60%; - /*border: 4px solid green;*/ - overflow:hidden; - /*overflow-y: scroll; - overflow-x: hidden;*/ + /*border: 2px solid green;*/ + overflow: hidden; +} + +#app #add_chat_off { + text-decoration: underline; +} + +#app #messages { + max-height: 50vh; + overflow: scroll; + overflow-y: scroll; + overflow-x: hidden; + font-size: 2vh; +} + +#app #input_user{ + color: green; + width: 20vh; + height: 3vh; + font-size: 2vh; } #app #input_chat{ @@ -42,8 +60,10 @@ width: 100%; border: none; outline: none; - border-bottom: 2px solid green; + border-bottom: 0.5vh solid green; caret-color: green; + color: green; + font-size: 2vh; } #app #you { diff --git a/frontend/static/js/index.js b/frontend/static/js/index.js index 12dc11b..3e378e9 100644 --- a/frontend/static/js/index.js +++ b/frontend/static/js/index.js @@ -3,7 +3,6 @@ import { Client } from "./api/client.js"; import LoginView from "./views/accounts/LoginView.js"; import Dashboard from "./views/Dashboard.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"; import LogoutView from "./views/accounts/LogoutView.js"; @@ -44,7 +43,6 @@ const router = async (uri) => { { path: "/logout", view: LogoutView }, { path: "/register", view: RegisterView }, { path: "/search", view: Search }, - { path: "/chat", view: Chat }, { path: "/home", view: HomeView }, { path: "/me", view: MeView }, { path: "/matchmaking", view: MatchMakingView }, diff --git a/frontend/static/js/views/Chat.js b/frontend/static/js/views/Chat.js deleted file mode 100644 index becd31f..0000000 --- a/frontend/static/js/views/Chat.js +++ /dev/null @@ -1,56 +0,0 @@ -import AbstractView from "./AbstractView.js"; - -export default class extends AbstractView { - constructor(params) { - super(params, "Chat"); - - let url = `ws://${window.location.host}/ws/chat/` - - this.chatSocket = new WebSocket(url) - this.chatSocket.onmessage = function(e){ - let data = JSON.parse(e.data) - console.log('Data:', data) - if (data.type === 'chat') { - let messages = document.getElementById('messages') - - let username = data.username === null || data.username.length <= 0 ? "NoName" : data.username; - messages.insertAdjacentHTML('beforeend', ` -

${username}: ${data.message}

- `) - } - - } - } - - async postInit() { - let form = document.getElementById('form') - form.addEventListener('submit', (e)=> { - e.preventDefault() - let message = e.target.message.value - this.chatSocket.send(JSON.stringify({ - 'message':message - })) - form.reset() - }) - - } - - async leavePage() { - this.chatSocket.close(); - } - - async getHtml() { - return ` -

Chat

- -
- -
- -
- -
- - `; - } -} diff --git a/frontend/static/js/views/Search.js b/frontend/static/js/views/Search.js index 828aa0c..c91fe5e 100644 --- a/frontend/static/js/views/Search.js +++ b/frontend/static/js/views/Search.js @@ -45,7 +45,9 @@ export default class extends AbstractView { // chat if (logged && client.me.user_id != user.user_id) { let add_chat = document.createElement("a"); + add_chat.id = "add_chat_off"; add_chat.addEventListener("click", async () => { + add_chat.id = "add_chat_off"; if (client.channel != undefined) { client.channel.members_id.forEach((member_id) => { if (member_id == user.user_id) @@ -60,24 +62,20 @@ export default class extends AbstractView { client.channel = await client.channels.createChannel([client.me.user_id , user.user_id], this.chat); this.chat(); + add_chat.id = "add_chat_on"; }); add_chat.appendChild(document.createTextNode("Chat")); new_user.appendChild(add_chat); - /*new_user.appendChild(document.createTextNode(" ")); + new_user.appendChild(document.createTextNode(" ")); - let remove = document.createElement("a"); - remove.addEventListener("click", async () => { + let block = document.createElement("a"); + block.addEventListener("click", async () => { if (client.me.user_id != user.user_id) { - await client.channels.deleteChannel([client.me.user_id , user.user_id]); - if - client.channel.disconnect(); - client.channel = undefined; - this.chat() } }); - remove.appendChild(document.createTextNode("Remove")); - new_user.appendChild(remove);*/ + block.appendChild(document.createTextNode("Block")); + new_user.appendChild(block); } // break line