Visually distinct own messages from others

[saladpanda]

Would be nice if Webogram would show your own messages aligned to the right and all other messages to the left. Maybe different colors would be helpful, too.
Like in the mobile app:

[nukeador]

You mean just for mobile view or also Desktop?

Desktop version shouldn't be the same as mobile, in fact issue #35 tries to solve mobile view, where I think this suggestion fits better ;)

[saladpanda]

I mean the desktop view. But would be nice in the mobile view as well I think.

[nukeador]

Can you rename the issue to something more descriptive like: "Use bubbles for message styling"?

[zhukov]

I personally don't think that desktop version of Telegram must be the same as mobile one. But it might be actual for mobile view of the layout.

[saladpanda]

I'm neither suggesting that the desktop view should be the same as the mobile view, nor am I asking for "bubbles".

What I wanted to say was:
I think the chat history would be way more readable if my own messages were right-aligned.

That would be a quite simple thing that would create a good visual distinction between other's messages an mine.

[staltz]

Maybe your suggestion is to simply find some distinction between other's messages and my messages.

Right-aligning is one solution. Another solution is giving a gray background for my own messages. That's how it is in Skype.

[saladpanda]

Yes that's a good point.
I've changed the title to better match the content of this issue.

[u1735067]

Could you also generate different name color for each member in a group chat ?
(Personally I like very much the TDesktop layout, but it miss some necessary features like emoji selector. I hope Telegram will not be another frustration since MSN)

[zhukov]

@Alex131089 aren't different photos/photo placeholders enough?

[staltz]

In the Android app, members get a different color, besides already having different photos. It's a minor detail, but it's actually nice.

[u1735067]

Nop, because 2 members have black picture, at first sight it's not obvious to distinguish them.

[igorsantos07]

My suggestion would be to not right align the messages, but only the contact picture. The texts would still be left-aligned, but my picture would appear on the right side.

[staltz]

I've implemented this on my own webogram fork, as a slightly darker background for your own messages. Try it out here: http://telegram.staltz.com

[nukeador]

@staltz since we can't see your fork's code, I would discourage everyone to connect to webogram sites other than the official one or a local downloaded.

[staltz]

That link is a simple redirect to http://staltz.github.io/webogram which is obviously this repo https://github.com/staltz/webogram . There's the code. (Branch gh-pages matching branch staltzogram). You could even diff that with zhukov's upstream, to see what's changed.

[igorsantos07]

I still prefer to use the original one, since that's the app that's
installable.

While I would consider that message free spamming of the concurrency, I
guess there's no other way to advertise forks on GitHub, right?

Have you tried sending a PR? What was the outcome?
On May 7, 2014 5:59 PM, "Andre Staltz" notifications@github.com wrote:

That link is a simple redirect to http://staltz.github.io/webogram which
is obviously this repo https://github.com/staltz/webogram . There's the
code. (Branch gh-pages matching branch staltzogram). You could even diff
that with zhukov's upstream, to see what's changed.

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/87#issuecomment-42482346
.

[staltz]

I don't want to send a PR and I don't want to "compete" or "spam". This is just a prototype implementation of issue #87, to see if this is what people want.

[Ecron]

Well, I think this is a good idea, in fact if you add the background issue and implement a solution for #92 you can have a nice result. I played a little with the CSS and got something kind of minimalist:

It doesn't look bad, I think. And with less width:

And with user distinction (can be user or contact distinction):

Sorry about the colors, I'm not good at color design...

What do you think?

[zhukov]

We have already separate styles for outbound messages in mobile version, but current Desktop design seems to be final about this.

[azzimuth]

Please reconsider this issue. It is really difficult to distinguish own messages in a chat with active users....

[sNiXx]

I have to agree with everyone asking for a different layout. Usability of the web version is very limited, especially if people in the chat don't have avatars. I think moving own messages to the right or distinguishing with different background colours would really help. At the very least an option to change current behaviour would be nice, which has been implemented in the desktop version (e.g. telegramdesktop/tdesktop#1629)