MODULE: ChatDisplay (show a WhatsApp-like dialogue on GUI Button)

[Khris]

DOWNLOAD: https://drive.google.com/file/d/1sklK7U1ZNEz_lSmtUxCcwBAPculqVQCt/view?usp=sharing

To use the module, put a button on a GUI, then create a new chat instance:

Code: ags

  globalHandleInt = Chat.Create(btnChat, eFontWestwood [, bgSprite, width, height]);

bgSprite is a sprite slot for the background, it gets auto-tiled if it's smaller than the button. You can also state width and height, in that case the button is resized to those dimensions.

Optionally add sound:

Code: ags

  Chat.SetSound(globalHandleInt, aBlip);

Pass null to disable sound.

To add a message, just call:

Code: ags

  Chat.Add(globalHandleInt, "The message", "sender" [, hour, minute]);

If you put an asterisk at the start of the sender, like "*Alice", the message appears on the right. You can optionally state a timestamp, or omit for user's local time.

Adding a message makes the chat scroll down automatically. You can also scroll using the mousewheel, while hovering over the chat.

The chat is automatically drawn and scrolled if the GUI and button are visible.

It's also possible to prepare multiple messages, just call Chat.Prepare() instead. Show them one by one using Chat.Advance(globalHandleInt); or all at once using Chat.ShowAllPrepared(globalHandleInt);.
(Calling .Add() will simply call .Prepare(), then .Advance(), so make sure you have advanced over all prepared messages before using .Add(), or you will get unexpected results )

It is recommended to call Chat.CleanUp() upon quitting the game, this will delete all the DynamicSprites, avoiding a warnings log in the game folder.

Given that most people will probably want to customize the look of the chat, I've moved the function that draws a message to the very top of the module script.
It gets passed all relevant parameters:

Code: ags

DynamicSprite *CustomMessage(int chatWidth, Alignment align, String author, int hour, int minute, String text, FontType font) 

and must return a new DynamicSprite containing the message.

Preview of default look:

Spoiler

[close]

My example room script: http://pastebin.com/raw/BvruHqr7

[Vincent]

Hi Khris.
I would like to say that, in my opinion, it's truely amazing the work you have done with this module, really.
Later I have done a quickly basic test to try it out :
http://www.fileconvoy.com/dfl.php?id=gbb02b56387dd286a999940942fd5c255f26ad0a41

Suddenly, I would like to ask you if there is a way to do those extra stuff inside your module so far...

- Add emoticon 'graphic' at the end of the text message lenght if a "needle emoticon" was found inside a string.
- Mouse click at the scrolling bar to make it scroll and visible like how it is working for (mouse wheel support)
- "Drag and drop" the btnFirstChat to make it scroll like how it is working for (mouse wheel support)
- A way to open our computer folders and to select an image to send in the text message (eventually it get resize to a default value to fill well into the text message)

Let me know, if you want, what do you think about those ideas.
Thank you in advance again for reading this message.

[Khris]

Hi Vincent,

I've already thought about adding emoticons; right now the text is created using DrawStringWrapped() but I wanted to implement links, so I'd have to pick apart and reassemble the bubble text anyway. It's more work than writing the entire current module though, so maybe at some point.

Dragging the scroll bar using the mouse it much more easy to implement; I might also add that, yes. Dragging and dropping the button however is pretty easy and unrelated to the module. Just look up code for dragging GUI buttons or objects and implement it in your game.

As for opening a file selection window, not possible. You can populate a listbox with filtered content of your game folder, but you cannot browse the hard drive. You can select and load an image file in the same folder as the game though.

[Vincent]

Hi Vincent,

I've already thought about adding emoticons; right now the text is created using DrawStringWrapped() but I wanted to implement links, so I'd have to pick apart and reassemble the bubble text anyway.

Hi Khris.
I have try to reassemble so far the bubble text and adding an emoticon graphic in it but it didn't work at all.
I was just able to show the emoticon graphic outside the bubble text which it's not looking very well..

Dragging and dropping the button however is pretty easy and unrelated to the module. Just look up code for dragging GUI buttons or objects and implement it in your game.

I apologize if I misspoke about the dragging and dropping question.
I meant to say to use the dragging and dropping method (to the btnFirstChat) to make scroll the messages history (as it's working for the mouse wheel) but without dragging and dropping the button itself just to use the dragging and dropping method to scroll the messages if possible..
I hope you understand what I mean.

As for opening a file selection window, not possible. You can populate a listbox with filtered content of your game folder, but you cannot browse the hard drive. You can select and load an image file in the same folder as the game though.

I'm not sure what I'm about to say but if I remember correctly there's a module made by Wyz "TilemapConv1.0.0" which does exactly a browse to our hard drive to find a folder containing a TMX files..
Anytime we select '..' inside the listbox then it move to the parent directory.


Ps: Everything you're going to implement it sounds fantastic !!!


:EDIT:

if I remember correctly there's a module made by Wyz

It's actually an executable.

[Vincent]

I am sorry to necroposting this thread. Actually I noticed that all the text which are processed into the static bool Chat::Prepare are not translated into the .trs file.
I edited the static bool Chat::Prepare to look in this way now:

Code: ags

message[messages].text = GetTranslation(text);

Actually this is working well and it get the translation just properly fine.

[Khris]

Thanks Vincent, nice catch! I updated the module and the download link in the first post.

[Vincent]

Thanks you are welcome!

[granulac]

Sorry to revive the thread. This plugin has been enormously useful to me, but I haven't been able to figure out how to use it in skippable cutscenes. The game inevitably freezes if I try to skip any Chatdisplay content. I've tried to use if (!Game.SkippingCutscene) to bypass the Chat code, but no luck.

Any thoughts would be greatly appreciated. Either way it's a terrific module!

[Khris]

What's the visibility setting of the GUI you're using? If it's set to "pause game when shown", that could be the cause.

[Vincent]

Hi Khris sorry for necroposting, I was trying to do something when I encountered something strange. I was trying to use a transparent sprite slot for the chat background but it seems that by doing so the chat isn't displayed properly fine. Since that parameter is optional I've try to not submit anything in this way the background is showed in black but if I use a background with alpha transparency then the chat is showed twisted. I don't know if this is Ags or something that can be fixed within the module. Can you test this by yourself when you have some free time? Thanks in advance.

[Khris]

Yeah, that's probably the famous alpha blending issue.
Can you make a screenshot and crop it and use that as basis for your background sprite? Because I'm pretty sure there's no easy fix for this.

[Vincent]

That's a bad news... 
Well basically what I tried to do was to create a white background in paint and import it into Ags with alpha transparency to have the background of the chat completely transparent but it doesn't seems to work fine. Do you think that resizing the image will work? I've also tried to edit the module to only show the text without the bubble box around but it still get twisted somehow...

[Snarky]

If you want the background completely transparent, that shouldn't be an issue?

If you want a semi-transparent background, the workaround is usually to have the background and text on two separate GUIs.

[Vincent]

I am in need to have the background of the chat completely transparent, that shouldn't be an issue. Indeed the background of the chat is transparent properly but the issue comes that by doing so the chat is showed twisted for some reason. If I use any kind of other backgrounds works fine even if I don't submit any background (which it show in black) it works fine but when I use a transparent background the chat isn't displayed fine. I don't know if this is just my case or you have the same issue by using a transparent background for the chat? To make the background of the chat to be transparent I just used a white image and imported into Ags with alpha transparency.

[eri0o]

Can you share a screenshot of what you get and a mock of what you want? I fail to understand what is wrong here. :/

[Vincent]

Please note the background you are seeing it's not the one submitted for the chat background. For the chat background here I've submitted an alpha transparency image (it's working fine because the chat background is transparent properly) so the background you are seeing here it's the one used inside a room. But submitting an alpha transparency image for the chat background it get twisted in this way:




Using any other background for example black which doesn't have alpha transparency the chat works fine:




I sense that there's no easy fix for this as Khris said early...
Still, as he suggested, I can use the room background for the chat, crop it and try to make it match with the room background (which atm it doesn't looks so good)

[BlenderheadGames]

Hello, I'm getting back into AGS after several years and my knowledge is a little rusty, I can't seem to get this working.

I have copy/paste the example room script to a new room, created a new GUI "gChat" with a button "btnFirstChat".

Pressing C will bring up my GUI with my button but I don't see anything else, what am I missing?

[BlenderheadGames]

Anyone? 

[granulac]

Apologies for bumping the thread again, I have one final question. The module has been extremely useful in my game - it comes up in multiple scenes - but the longer you play, the creakier the animations get. Not just the scrolling of the text, but any other nonblocking animations just become unbearably slow. I've tried turning off any extraneous animation, but it doesn't seem to make a difference - the chat itself is still just as slow.

I've used Chat.Clear before each scene and Chat.Cleanup at quit - still, the scenes creak on. Any thoughts on what might be bogging the game down would be much appreciated!

[Khris]

The module has a repeatedly_execute_always, but that only really does stuff when the button used to display the chat is visible.
Are you using multiple buttons? Or a single one for all chats? Because if the latter, the module might actually draw all chats on top of each other...