SyntaxBomb - Indie Coders

General Category => General Discussion => Topic started by: Qube on November 11, 2017, 18:50:26

Title: Live chat - Now ready for alpha testing
Post by: Qube on November 11, 2017, 18:50:26
I've finally got the live chat module to an early working alpha stage \o/

URL : http://www.syntaxbomb.com/sbChat.php

Current features :

You can chat in real time ( obviously )
All BB code smilies work the same as they do on the forum
bold, italic, underline are the same BB codes as the forum
Youtube videos work like so {youtube}JoQ4GidQP-k{/youtube} ( change {} to [] )
To quit the chat type /quit or /exit

Stuff to fix / add :

The chat module references the forum database for user information, so if you log out of the forums either on purpose or your session times out you will be logged out of the chat too. So refresh the forum page every 15 minutes or so to keep you live.

I've not added in the BB code to add images yet so at the moment it's just text, smilies and youtube vids that you can post. I will add more goodies in as things progress.

No doubt this fix list will get a lot longer.

Lastly :

I have no idea how this is going to perform / work with multiple users :P - I've never written a PHP / javascript live chat room before and it might explode pretty quickly. The live chat will be a ongoing process but at the moment it's functional, I think.

* edit * - I've only tested it in Chrome and Safari.

Please post bugs and any feature requests here :)
Title: Re: Live chat - Now ready for alpha testing
Post by: Derron on November 11, 2017, 19:40:19
Date-time-text is smaller than rest but is bottom-aligned to the chat-text, it should either be the same size - or middle-aligned to a single line (or give some top-padding so it aligns similar for multi-line entries).




Keep a history of the last 10 phrases or so - this avoids entering an "empty" chat. And even allow for a kind of "shoutbox"-usage. This would be even better with a "load 10 previous lines"-link (clickable multiple times).




bye
Ron
Title: Re: Live chat - Now ready for alpha testing
Post by: Qube on November 11, 2017, 19:42:14
QuoteDate-time-text is smaller than rest but is bottom-aligned to the chat-text, it should either be the same size - or middle-aligned to a single line (or give some top-padding so it aligns similar for multi-line entries).
It was meant to be smaller as it was too much being the same size. I will middle align it vertically.

QuoteKeep a history of the last 10 phrases or so - this avoids entering an "empty" chat. And even allow for a kind of "shoutbox"-usage. This would be even better with a "load 10 previous lines"-link (clickable multiple times).
That is next on the list of "to-do" whereby when you enter chat X previous posts get loaded up.
Title: Re: Live chat - Now ready for alpha testing
Post by: Derron on November 11, 2017, 19:46:00
I would also suggest to have the timestamp this way:


{span title='complete timestamp'}hh:ii:ss{/span} - Most often people chatting together _know_ what day it is - and if you added a "history" people could hover with the mouse to see the day.
Another option is to change color of older days to be even more light gray.




bye
Ron
Title: Re: Live chat - Now ready for alpha testing
Post by: Qube on November 11, 2017, 22:39:20
Good ideas Derron, thanks :) - I've changed it now to only show the time. Was a bit excessive to show date and time but both are still logged.

I've also added a who's in live chat on the main portal landing page.

Next step, a history command...
Title: Re: Live chat - Now ready for alpha testing
Post by: Yue on November 11, 2017, 23:06:23
Avatars?
Title: Re: Live chat - Now ready for alpha testing
Post by: Qube on November 11, 2017, 23:48:45
A live chat session tonight showed an issue with the chat update script causing text input hogs. I blame javascript :D - I'll be working on a fix and when sorted will upload and announce here.

Quote from: Yue on November 11, 2017, 23:06:23
Avatars?
I did think about having the avatars against the posters message but it may take up too much room. I will try it out and see how it looks :)
Title: Re: Live chat - Now ready for alpha testing
Post by: Derron on November 12, 2017, 00:56:04
I assume Yue is asking for some kind of "chat balloons/bubbles". Avatars would increase minimum height for an chat entry to 16px + padding (I assume 16x16 is still way too small - so it might better to have 24x24 or 32x32 plus some padding to wrap it in a "standard element" (eg. a rounded rect).

(https://www.syntaxbomb.com/proxy.php?request=http%3A%2F%2Fi.imgur.com%2FY6rFZa9.png&hash=63d447b67a58620a953190a699e0a06ec4fcc52d)
Excuse the bad quality, its's 2am here, short break from helping buddy with his diploma (creating a big bunch of scheme graphics) - and meanwhile I want to get used to my drawing tablet.




Think this "whatsapp/messenger"-style works if you have less population and use it similar to a "shoutbox". For a really frequent communication this might be "too much". Some people prefer the "IRC style".



bye
Ron
Title: Re: Live chat - Now ready for alpha testing
Post by: Qube on November 12, 2017, 01:17:43
Cool art work :P

I'm not sure about a WhatsApp style to the chat. The left me, right you works on one to one but could look weird for multiuser chats. It's something I could mockup and see what it look like though.

First things first though... Fix the javascript text box input hog. I think I need to do asynchronous javascript on that ( from what I've read ) so will look into that. After that we can work on frilly bits :)
Title: Re: Live chat - Now ready for alpha testing
Post by: Derron on November 12, 2017, 01:52:46
When I wrote my last chat it used iframes and submit forms as Javascript was not that common and only used to insert smileys from a popup window ;-)
With 20-25 concurrent users I already hogged my 1 GHz Server that time. Did much polling to fetch new content. Nobody used the word "ajax" (or at least I did not) that time - nowadays even "ajax" got uncommon again.

That time I created a big bunch of custom smileys for my users - so they got smileys fitting to their usernames - we even got some adult smileys (doing adult things). Was fun to animate all these things in ~1kb gif files. Pheww, that's already ~15 years ago.



@ styling the chat
The benefit of CSS is the easyness when it comes to replacing the stylesheet ;-). You just put everything in the corresponding containers/spans and let CSS do the rest for you. So at the end each user profile could have an additional field defining the used "chat theme" and voila, done.

Regarding multiple users: just tint the top border of the "balloon" to a randomly assigned user color (when entering the chat a color is assigned). The tint could be done using the top-border-color. If you think this becomes too "colorful" just brighten up the colors. Dunno if jscript has some inbuilt functions for this - but I just convert RGB to HSL and then adjust Luminance. According to my DIG-Framework I used a code similar to this:

https://github.com/mjackson/mjijackson.github.com/blob/master/2008/02/rgb-to-hsl-and-rgb-to-hsv-color-model-conversion-algorithms-in-javascript.txt (https://github.com/mjackson/mjijackson.github.com/blob/master/2008/02/rgb-to-hsl-and-rgb-to-hsv-color-model-conversion-algorithms-in-javascript.txt)



bye
Ron
Title: Re: Live chat - Now ready for alpha testing
Post by: Yue on November 12, 2017, 02:00:16
Derron perfect idea. :)
Title: Re: Live chat - Now ready for alpha testing
Post by: Dabz on November 12, 2017, 05:45:49
Gerrrr innnn!!! :)

Dabz
Title: Re: Live chat - Now ready for alpha testing
Post by: Derron on November 12, 2017, 09:52:07
Add a new line to the chat if one enters the chat.

[hh:ii:ss] XYZ enters the chat.
[hh:ii:ss] XYZ left the chat.

Consider darkening the left side of the chat (containing the time) to be a mix of the "website background" and "chat background" - for now it uses "visually" a lot of space in the chat while this is not-as-important-meta-data...

bye
Ron
Title: Re: Live chat - Now ready for alpha testing
Post by: Dabz on November 12, 2017, 18:32:27
Well, I had a play, went in... left the tab open and had a browse about the net... Saw Naughty Alien was in, went to say hello and...

You are not logged in or your session has expired. Please login to the SyntaxBomb forums and then refresh this page or chat will not function properly..

So, my feeling is, a chat session shouldnt really expire, due to you may have to sit there quite a while waiting for someone to come in. I had to close the tab, go back in, but when posting the message popped up again, so I tried again, Naughty Alien was gone, but it let me post.

Also, just thought, we need "ding, dong, boing" sounds in there, a ding for someone thats entered chat, dong for someone thats left, and a boing for a message thats been posted.

Dabz
Title: Re: Live chat - Now ready for alpha testing
Post by: Qube on November 12, 2017, 20:01:14
Recoded all the javascript side to work asynchronously so now there is no jerky typing while javascript faffs about with background stuff.

QuoteAdd a new line to the chat if one enters the chat.
Tis on me to-do list :)

QuoteConsider darkening the left side of the chat (containing the time) to be a mix of the "website background" and "chat background" - for now it uses "visually" a lot of space in the chat while this is not-as-important-meta-data...
This side is going to get a little face lift as initially I just wanted to see if the bare-bones works.

QuoteSo, my feeling is, a chat session shouldnt really expire, due to you may have to sit there quite a while waiting for someone to come in. I had to close the tab, go back in, but when posting the message popped up again, so I tried again, Naughty Alien was gone, but it let me post.
It does seem to expire at silly times even though it should not. I may code a separate login system to handle chat but still requires the same user / pass as the forums.

QuoteAlso, just thought, we need "ding, dong, boing" sounds in there, a ding for someone thats entered chat, dong for someone thats left, and a boing for a message thats been posted.
Yup, it needs whizzy pop pop sounds for events. Add to the to-do list :D
Title: Re: Live chat - Now ready for alpha testing
Post by: Naughty Alien on November 13, 2017, 05:50:21
..chat should be open in separate window, or integrated to forum so one can chat and browse forum at same time..
Title: Re: Live chat - Now ready for alpha testing
Post by: Dabz on November 13, 2017, 13:52:32
Yep... That session expire thing is a git... I was just in the middle of a conversion with TomToad conversing on how bone idle we are when off work and poof... I was gone... And so was he! :D

;)

Couple of other things... A bit of conversion history would be nice when you go in, and TT mentioned a mute button for the noise's

Dabz
Title: Re: Live chat - Now ready for alpha testing
Post by: TomToad on November 13, 2017, 14:18:48
Seems chat is knocking me off after 10 minutes whether I am actively typing or not.  Would be nice if instead of a tone, the tab changes color, or flashes when there is a post and you were on another tab.
Title: Re: Live chat - Now ready for alpha testing
Post by: Qube on November 13, 2017, 16:21:25
I'll be adding a login to the chat to control session time-outs. You'll just have to login with your forum details and then all should be OK.

QuoteCouple of other things... A bit of conversion history would be nice when you go in, and TT mentioned a mute button for the noise's
Easy to add in and will do that :)

QuoteWould be nice if instead of a tone, the tab changes color, or flashes when there is a post and you were on another tab.
There is going to be boing boing noises to alert you to new posts ( which you can turn off ). I'll see what can be done in regards to none obtrusive visual alerts.
Title: Re: Live chat - Now ready for alpha testing
Post by: Rooster on November 13, 2017, 18:14:51
The chat hasn't been letting me post since around yesterday.
I've been going in to it when the front page says someone is in chat, but in the chat room it's not showing anyone as being in.

I've also noticed that even after I close the chat page tab, the front page will still show me as being in the chat room.
I don't know if I've just gotten unlucky, and have been going in after people left but are still show as being on?
Title: Re: Live chat - Now ready for alpha testing
Post by: Qube on November 13, 2017, 19:04:34
Just tested it and it's still working fine. What browser are you using as I've only tested it in Safari and Chrome.
Title: Re: Live chat - Now ready for alpha testing
Post by: Rooster on November 13, 2017, 19:40:13
I'm using Pale Moon.
It was originally based on Firefox, but has since gone it's own way from what I understand.

I'll try it from Firefox, and see if that works.
Title: Re: Live chat - Now ready for alpha testing
Post by: Rooster on November 13, 2017, 19:46:41
Okay Firefox was working, so it looks like it's my browser. :(
And for the record it was working before.
Title: Re: Live chat - Now ready for alpha testing
Post by: Qube on November 13, 2017, 20:00:20
It might be because I recoded the javascript side to use asynchronous calls to stop the sticky input box.
Title: Re: Live chat - Now ready for alpha testing
Post by: Flanker on November 13, 2017, 21:58:26
Just a little bump to say that the "+" character doesn't work in the chat.
Anyway, good work so far ;)
Title: Re: Live chat - Now ready for alpha testing
Post by: Qube on November 14, 2017, 04:53:44
QuoteJust a little bump to say that the "+" character doesn't work in the chat.
Blimey, I just typed 1 + 2 = 3 and it took out the + sign. How stupid is that :P - There is nothing in the sanitising code to remove a + sign. Yet they still vanish.

Ah well, something to fix today :) - Thanks for pointing that out. Now where's the ban button
Title: Re: Live chat - Now ready for alpha testing
Post by: TomToad on November 14, 2017, 09:22:40
It might be that + has a special meaning, either in Javascript or in the underlying network code. Possibly escape the + character.

Javascriptish pseudocode
when sent:
var originalstr = inputtext();
var escapedstr = originalstr.replace("+"."^p");
network.send(escapedstr);

when received:
var receivedstr = network.receive();
var outstr = receivedstr.replace("^p","+");
textbox.add(outstr);
Title: Re: Live chat - Now ready for alpha testing
Post by: Derron on November 14, 2017, 09:31:06
Is there a reason for the "^p" rather than using urlencode() and urldecode() which are intended for these things? Maybe your form-encryption is doing some odd stuff?
Why are you requesting a new chat key each second? Isn't that a bit nasty regarding server load/requests-count? These "I am alive and still the same" could be done way less often - and/or before user interaction happens (so check on sending a new line rather than periodically).




bye
Ron
Title: Re: Live chat - Now ready for alpha testing
Post by: Flanker on November 14, 2017, 14:44:21
Quote from: Qube on November 14, 2017, 04:53:44
Now where's the ban button

It's not a button, you have to type "+ban Flanker" :P
Title: Re: Live chat - Now ready for alpha testing
Post by: Qube on November 14, 2017, 17:20:16
QuoteIt's not a button, you have to type "+ban Flanker" :P
Great idea, I'll add that in so any user in chat can boot you out \o/ ;D
Title: Re: Live chat - Now ready for alpha testing
Post by: Qube on November 14, 2017, 18:58:20
Quote from: Derron on November 14, 2017, 09:31:06
Is there a reason for the "^p" rather than using urlencode() and urldecode() which are intended for these things? Maybe your form-encryption is doing some odd stuff?
Why are you requesting a new chat key each second? Isn't that a bit nasty regarding server load/requests-count? These "I am alive and still the same" could be done way less often - and/or before user interaction happens (so check on sending a new line rather than periodically).
I don't use "^p"? - I use urlencode() / urldecode() amongst other things.

There is a very good reason for the key generation. It's also not every second but every three seconds as it checks for new messages and also the users in chat. As javascript calls PHP files they need to be executed securely so users can not call / abuse the those PHP files separately. I can't check for new messages way less often or else having a conversation is going to be really slow.

Title: Re: Live chat - Now ready for alpha testing
Post by: Derron on November 14, 2017, 19:16:35
https://socket.io/get-started/chat/ (and others)


Basic idea is to use WebSockets to allow communication between Server->Client. So instead of your current "client polls server for changes" it becomes a "server informs clients of changes".




Currently you request things on a 3 second interval, yes -  but you request them multiple times (at least with my Chrome):
(https://www.syntaxbomb.com/proxy.php?request=http%3A%2F%2Fi.imgur.com%2F2ANCyo5.png&hash=1c908e60313faf0b411985fbfdf430e667517605)




bye
Ron
Title: Re: Live chat - Now ready for alpha testing
Post by: Qube on November 14, 2017, 20:30:47
QuoteCurrently you request things on a 3 second interval, yes -  but you request them multiple times (at least with my Chrome)
That is correct. Calling for a key uses minimal resources so I'm fine with that.

If the chat ever gets like 50+ users in regularly ( highly doubtful ) then it will be recoded to a more efficient system.
Title: Re: Live chat - Now ready for alpha testing
Post by: Derron on November 14, 2017, 20:44:05
Sorry if I did not made it clear enough: you do request the key multiple times per "request cycle". So 2 times at 0s, 2 times at 3s, 2 times at 6s...
I understand, that you request the key again each 3 seconds - but assumed 1 request/3 seconds would be enough.




bye
Ron
Title: Re: Live chat - Now ready for alpha testing
Post by: Qube on November 14, 2017, 20:50:36
QuoteSorry if I did not made it clear enough: you do request the key multiple times per "request cycle". So 2 times at 0s, 2 times at 3s, 2 times at 6s...
I understand, that you request the key again each 3 seconds - but assumed 1 request/3 seconds would be enough.
Oh I see what you are referring to.. On the version being uploaded tonight it doesn't go mad with key requests. Most of those calls should of been removed days ago, I just forgot about them.
Title: Re: Live chat - Now ready for alpha testing
Post by: Qube on November 15, 2017, 05:01:16
New version uploaded.

1.. You *should* no longer be logged out at random times.
2.. The chat sounds can now be turned on / off via the new shiny checkbox.
3.. Under the hood - Far less external calls are made to scripts. Thanks to Derron for pointing out there were excessive calls. There were some I knew about about but others I'd forgotten about during the initial coding of the chat room which should of been removed from day one.

There are still a couple of bugs to fix and a new face lift coming but it's progressing.
Title: Re: Live chat - Now ready for alpha testing
Post by: Derron on November 15, 2017, 09:13:33
There is no announcement for users leaving the chat.


bye
Ron
Title: Re: Live chat - Now ready for alpha testing
Post by: Qube on November 15, 2017, 13:07:17
T
Quote from: Derron on November 15, 2017, 09:13:33
There is no announcement for users leaving the chat.
That will be done today :)
Title: Re: Live chat - Now ready for alpha testing
Post by: Qube on November 15, 2017, 19:39:52
New version uploaded...

1.. Room announcements for members joining and leaving
2.. You should no longer be randomly kicked out after X minutes of being idle
3.. The + sign now works again ( silly javascript )
4.. If you are idle for more then 7 minutes your username goes grey and the time idle is shown next to your username
5.. If you are idle for about an hour you are booted out
Title: Re: Live chat - Now ready for alpha testing
Post by: Derron on November 15, 2017, 21:07:19
Dunno if you updated something now:


(https://www.syntaxbomb.com/proxy.php?request=http%3A%2F%2Fi.imgur.com%2F3Ysf4rr.png&hash=4c398ff682343a275b9382d50fba377c533b323b)


(https://www.syntaxbomb.com/proxy.php?request=http%3A%2F%2Fi.imgur.com%2F86dLVe1.png&hash=fa5312d35ea96b6370b0773cd61c48e623aa4979)


bye
Ron
Title: Re: Live chat - Now ready for alpha testing
Post by: Goodlookinguy on November 15, 2017, 21:40:14
I was about to post that Derron and I have been kicked and reentered several times. Definitely seems to be some issues when people are actively chatting or something.
Title: Re: Live chat - Now ready for alpha testing
Post by: Derron on November 15, 2017, 21:41:18
I chatted with Dabz a while and did not encounter that - so probably this is Qube doing things on the server.

We'll let him do that. Good night ;-)



PS: Closing a chat window does not remove you from the list so soon, doing a /quit is immediately removing the user.


bye
Ron
Title: Re: Live chat - Now ready for alpha testing
Post by: Qube on November 15, 2017, 23:37:41
QuoteI chatted with Dabz a while and did not encounter that - so probably this is Qube doing things on the server.
Yeah, it was me changing code around causing the problems :)

QuotePS: Closing a chat window does not remove you from the list so soon, doing a /quit is immediately removing the user.
Still need to add an on close event.
Title: Re: Live chat - Now ready for alpha testing
Post by: Qube on November 16, 2017, 03:00:31
Just for you Derron, the chat now shows the last 10 messages when you enter ;D
Title: Re: Live chat - Now ready for alpha testing
Post by: Derron on November 16, 2017, 08:32:59
bla enters
bla leaves the building
blub enters
...


That's not the kind of messages _most_ people are interested in :-)


bye
Ron
Title: Re: Live chat - Now ready for alpha testing
Post by: Qube on November 16, 2017, 15:18:36
QuoteThat's not the kind of messages _most_ people are interested in :-)
But at least you know who's been and gone recently ;D
Title: Re: Live chat - Now ready for alpha testing
Post by: Derron on November 16, 2017, 20:06:15
Time displayed on the "left" should match the timezone of the user. (it's GMT now)


bye
Ron
Title: Re: Live chat - Now ready for alpha testing
Post by: Qube on November 16, 2017, 20:54:40
Quote from: Derron on November 16, 2017, 20:06:15
Time displayed on the "left" should match the timezone of the user. (it's GMT now)
Eventually it will but main priority at the moment is getting it stable :)
Title: Re: Live chat - Now ready for alpha testing
Post by: Qube on November 16, 2017, 21:46:08
Last ten messages now only shows proper messages and not and any system messages of users joining and leaving.
Title: Re: Live chat - Now ready for alpha testing
Post by: Derron on November 16, 2017, 21:50:21
I do not add "wishes" here but "noted down things". Just that they do not get forgotten ;-)


bye
Ron
Title: Re: Live chat - Now ready for alpha testing
Post by: Qube on November 16, 2017, 21:53:18
QuoteI do not add "wishes" here but "noted down things". Just that they do not get forgotten ;-)
That's OK :) - the chat is in alpha testing stages and there are lots of things to do and tidy up.
Title: Re: Live chat - Now ready for alpha testing
Post by: Hardcoal on January 23, 2018, 04:26:16
nice to have a chat.. i did try making a chat using wireclub.. https://www.wireclub.com/chat/room/blitzmax_room

Please add more click sounds.. and if possible a volume control p

other than that looks cool..

Lets not try to fight  with each other and keep the conversations mostly about programming..
I personally will try to avoid debating on politics.. and stuff like that