1

I'm currently working on a project where two users can chat between each other. I just got socket.io working without laravel, Currently there is no chatting between users whatsoever. It is only on the homepage, and I used the tutorial that is on their website.

Question 1

I want to use socket.io for my laravel project. But I haven't found the right tutorial yet where they're making use of a database and private messaging between two logged-in users. I already have a database model, but I don't quite know if it is modelled the right way for my system. You can see the model in this picture: https://i.stack.imgur.com/7Krha.jpg

In my system I want to make use of a clickable message feature, With this I mean; that the user clicks on a conversation and he/she can talk with them. It is illustrated pretty well in the image below. For those who can't find it, It is the list on the left which displays the conversations.

Image: https://i.stack.imgur.com/uPnWQ.jpg Do have in mind, This picture is pure HTML, CSS. No functions whatsoever

How can I accomplish this?

Question 2

I have a small problem with the styling. I can't figure out how to style the messages separately, With this I mean, The sender's text bubble needs its background coloured while if he/she received a message, that text bubble's background colour needs to be grey. I made my message system in bootstrap. I can't figure out how to do that in the way my current system is built.

TLDR; I'm looking for a tutorial for a message system that suits my project, or tips for my project regarding socket.io, styling and implementing it all in laravel.

Thanks in advance!

Rainier laan
  • 1,101
  • 5
  • 26
  • 63

1 Answers1

0

I don't know anything about that PHP framework, but it looks like you want to put two people into unique socket.io room and emit socket.io events in that room when they initiate conversation.

Keep list of running rooms.

This is nice answer explaining events and rooms:

Send response to all clients except sender

martinerk0
  • 403
  • 1
  • 4
  • 17