Quick Messages Plugin

Plugin
1

Here’s something I’ve been playing around with for a bit. Will definitely still be some issues to iron out, but it mostly works. Would be good to get some feedback at this stage. Please use with caution :slight_smile:

repo: GitHub - paviliondev/discourse-quick-messages

Screen Shot 2016-02-07 at 7.11.23 PM.png1350×985 136 KB

Description

Adds a dropdown in the header that shows you your latest private messages and a ‘chat’ experience for private messages similar to Facebook Messages or Google Hangouts.

User notes:

Please note that this plugin extends the existing private message feature. If you are looking for a chat experience separate from the private message feature, I suggest @gdpelican’s Babble plugin.

  1. You cannot yet have multiple chats open at once. If you open a new private message topic from the messages menu, it will override any existing private message compose and message stream you have open. Multiple chats open at once may be a future feature.

  2. New private messages composed from the “New Message” compose button in the messages dropdown behave like chat streams, i.e.:

    1. The topic title will be the usernames of the participants in the topic, e.g. “Bob & Mary”.
    2. If the participants in the new topic match the participants in an existing topic, the existing topic will be continued rather than a new topic created.

  3. Notifications about private messages will no longer appear in the notifications stream in the user menu. Whenever there is a new post in any private message topic, that topic will automatically move to the top of the message menu list. The unread private messages count will appear above the messages menu icon, rather than the user menu icon.

  4. Using any compose action other than the two in the messages menu will display the normal discourse compose and should work as normal. It should be possible to transition seamlessly between the two types of compose experience.

Technical notes:

I have tried to override as little of the existing discourse composer functionality as possible. Where I have overridden existing discourse methods I have made a note of it in the code. See in particular here and here

Using this plugin on the same page as another topic does not produce conflicts in topic tracking as I have replicated some the functionality of screenTrack, rather than use it at cross purposes. See here.

72 Likes
2

:grinning:Seems interesting, I would test it on my site,but there’s an similar plugin already - Babble, except babble is designed to be an chatroom plugin, not a direct message plugin.

Any possibilities on these two plugins merge/integrate eventually?
Are there conflicts of these two plugins?

1 Like
3

I haven’t actually tested both of them together, but there shouldn’t be any conflicts.

As you point out, the plugins serve different purposes. As @gdpelican notes here, he doesn’t intend to integrate Babble with private messages.

I guess it depends on what kind of ‘chat’ experience you want. Now you have two options :slightly_smiling:

4 Likes
4

This is very interesting, I like it a lot … some tweaks I would recommend

  1. Let me pull that chat window up a bit more, don’t stop me at half hight.

  2. Make ENTER submit, if people need newlines let them use SHIFT ENTER

  3. Align avatars to the right not the left, unaligned text is OCDs biggest enemy

  4. Tighten spacing between avatars, maybe even make the smaller

  5. [object object] when hovering over the envelope

  6. You need some CSS to deal with wide images.

15 Likes
5

Thanks for the feedback. I intend to do some further work on this in the coming week and will address those points.

4 Likes
6

Re your useful feedback.

  1. This is now fixed.

  2. This is now fixed.

  3. This is an interesting one. I agree that the existing style leaves much to be desired. I had a little look around and it seems the ‘chat’ convention is to:

  • Not use an avatar, but add a slight background, for the user’s own messages
  • Align all text to the left
    e.g.

Not that Facebook and Google are the only conventions one should follow, but I’ve gone with something along those lines for now:

4 - Same as above.

5 - This is now fixed.

6 - Images and attachments in chat will need a little more work. Will give that a shot when I next have some free time.

Cheers.

8 Likes
7

I think that was a good way of handling it.

5 Likes
8

@angus, this looks very cool! Thank you for your contribution!

Because Quick Messages and Babble are related in their functionality but could be used side by side, perhaps you and @gdpelican could could work together and agree on a design so the Discourse design remains uniform?

3 Likes
9

Not a bad idea @holden. I’ll play around with Babble and this plugin alongside each other on the weekend and a) see if that use case makes sense and b) whether to adapt the design of this. Cheers.

1 Like
10

Just updated the CSS to deal with wide images and added back emojis and uploads.

Screen Shot 2016-02-10 at 8.36.40 AM.png610×810 311 KB

edit: oof that big space next to the emojis looks bad. Lets use max-width on that content instead. Ahh that’s better.

Screen Shot 2016-02-10 at 8.48.42 AM.png614×808 310 KB

9 Likes
11

@angus, that looks great!

1 Like
12

Wow keep up the good work!! :grinning:

1 Like
13

@holden Didn’t get to this this weekend after all (worked on my ratings plugin instead), but I promise I’ll look at the quick messages / babble style consistency soon.

2 Likes
14

FYI I’m in the midst of making Babble’s style a little less mad science, so kicking this down the road a little bit is probably a good thing. (The look-and-feel won’t change too much, but the underlying structure and css will hopefully make it much more robust in the face of XBC, especially on mobile)

2 Likes
15

Ah cool, thanks for the heads up. I’ll focus on the other to dos here first then.

16

These are the ‘other To dos’ at the moment. If anyone has any other requests/ideas for these please feel free to add them.

  1. Allow the user to have more than one quick message compose open at once.

  2. Improve message previews in the messages menu: image

  3. Add a “Mark All Read” button to the messages menu that marks all your messages read.

  4. Improve the quick message compose experience so that:

    1. Text never overlaps with the buttons
    2. The compose window increases in size instead of being scrollable.
    3. A user can send a ‘Like’ as a response (perhaps).

  5. Performance. Make the posting of messages even quicker.

5 Likes
17

I’ve added the usernames of the participants to the minimized quick message compose.

2 Likes
18

Would it be possible to set a file size limit of attachments and some other messaging quota?

I really loves that feature :heart: , but as far as I know, most of my friends communicating in chats with a lot of pictures. As admin of multiple small instances (up to 30 GB disk space), I don’t like pictures as much as my lovely friends does :wink:

In fact, I would have some limitations regarded to the users trust level. Is this possible?

1 Like
19

@terraboss hm, I don’t know if I’ll add that feature. But you can always limit image and/or attachment file size in the settings.

Screenshot at Feb 19 20-14-30.png1954×1040 135 KB

20

Indeed, but those settings are globaly and not specific for messaging.

In this case, some extra limits would make sence, except you’re going to compete with Facebook and other gigant social media providers with an nearly endless amount of storage :wink:

1 Like