Discourse Presence - "Who is writing"


(Andre Pereira) #1

:tada: This plugin is now included in a standard installation of Discourse - there’s no need to install it separately.

Repo: https://github.com/discourse/discourse-presence

(Updated Sep '17 by @David_Taylor)

Do you want to see who - apart from you - is using the “Reply” dialog box to write a reply to a particular topic? If so, then this plugin is for you! This is particularly useful to avoid those situations where a user replies to a topic and sees that another reply was submitted a few seconds earlier.

The inspiration for the plugin was this topic See who all are writing replies to a topic

When other users are using the Reply dialog box, their avatars are displayed to the top right of the composer:

59

If you are editing an existing post (e.g. a Wiki), you will see any other users that are also editing:

30

On mobile, it looks like this:
01


See who all are writing replies to a topic
Editing wiki posts at same time as someone else sometimes loses revisions
Running a project or team using Discourse (instead of Slack, Trello, etc...)?
"Someone is typing..." feature at the bottom of topic
Some questions about staged users created by incoming email
Editing wiki posts at same time as someone else sometimes loses revisions
Discourse Presence no longer showing in composer
(Sam Saffron) #2

The expose draft thing should be behind a site setting imo


(@SenpaiMass) #3

I am using this plugin, it is really nice to see who is responding to a thread.

Instead of the composer can the presence be displayed at the timeline.?


(Jeff Atwood) #4

No, this is reply focused. I edited the title to reflect that.


#5

@adrapereira if you are accepting feature requests, what do you think of extending the functionality of the plugin to show an optional green circle next to the username (on the topic page, user card, etc) if the user is online? This could be an optional setting for users.


#6

It appears there is a bit of a bug on the mobile version here.

Edit: Ive also found a bug in which if you go to reply to a topic that someone else is/has writing in/drafted in, cancel and then go to create a new topic, than the system thinks you are still writing in the same topic as them.


(Alessio Fattorini) #7

Love this! :heart_eyes_cat:


(EW 👌) #8

Nice work :tada: thank you!

Something with animation (like animating a … 3 dots) could give a sense of action happening. As we used to see on most of communication apps.


(Joe Fedric) #9

You can add animation yourself with CSS :slight_smile:


(EW 👌) #10

:slight_smile: Good to know that it is possible with css. Let’s see how many hours or days will took me to figure out how :sweat_smile:


(Joe Fedric) #11

Well, it took me about 30 seconds to find this example you can easily modify:

:slight_smile:

Of course, if you want a different animation, you can create it yourself (bounce, spin, etc.). I have a ‘breathing’ animation on my own forums, that shows each time you switch categories or scroll beyond the topic-stream or post-stream end:


(EW 👌) #12

That’s exactly what I need but my real problem was, where to put it :slight_smile: , I men what class should I use or where to put a class to link it to that “User is writing a reply to this topic…” (may be it would be possible by inspect, will see)

(BTW I like TopazLab products :wink: )


(Joe Fedric) #13

Ah, the class is .writingClass

Edit:

I’m glad you enjoy our stuff :slight_smile: I’m the Support staff… haha


(EW 👌) #14

I did it as shown on the provided example (BTW class name is .writingClass ). It’s animating the whole line including the avatar to the left! Instead of animating only the dots to the right.

.writingClass:after {
  overflow: hidden;
  display: inline-block;
  vertical-align: bottom;
  -webkit-animation: ellipsis steps(4,end) 900ms infinite;
  animation: ellipsis steps(4,end) 900ms infinite;
  content: "\2026"; /* ascii code for the ellipsis character */
  width: 0px;
}

@keyframes ellipsis {
  to {
    width: 1.25em;    
  }
}

@-webkit-keyframes ellipsis {
  to {
    width: 1.25em;    
  }
}

(Joe Fedric) #15

Yea, I just noticed the class was named differently then what I originally stated. I edited the post. Sorry! Used to the hyphens!


(Joe Fedric) #16

Try using small.writingClass, instead of just .writingClass


(EW 👌) #17

I did now but nothing changed :frowning:

Edit:
I think I had to do it with dot in front for a class .small.writingClass I’d tried too, but then the animation stopped with no dots too.


(Joe Fedric) #18

I’m guessing this is because the writingClass element is all contained within the <small> tag, so you cannot animate just the ellipsis. There may be a novel JS solution to this, to add a new element within this writingClass, then you should be able to animate that separately. My JS chops aren’t up to the task of solving this, however. I am taking one technology at a time :slight_smile:


(EW 👌) #19

I appreciate your help and effort :+1:
We have great community, I’m sure someone will try to give it a try.


(EW 👌) #20

Could be a problem with this plugin after last Discourse updates?

When you try to Reply to any topic, write anything then click cancel, when you click Yes, abondon at the popup modal (you could see at the background that the topic is closed) the modal keep showing till you click modal’s No, keep. Then everything continue okay with the following Warning error log:

TypeError: Discourse.ajax is not a function Url: https://community.example.com/assets/application-a22c951718245c6fcb2433dcb1a6fd7cb414cd2658a63e9e2badf5c00f98a4a6.js Line: 65 Column: 11772 Window Lo

Info:
TypeError: Discourse.ajax is not a function
Url: https://community.example.com/assets/application-a22c951718245c6fcb2433dcb1a6fd7cb414cd2658a63e9e2badf5c00f98a4a6.js
Line: 65
Column: 11772
Window Location: https://community.example.com/t/testing-reply/178

I did uninstall the https://github.com/discourse/discourse-presence plugin and rebuild. Everything working fine, without the above mentioned problems.