Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

tgchat #52426

Merged
merged 31 commits into from
Aug 14, 2020
Merged

tgchat #52426

merged 31 commits into from
Aug 14, 2020

Conversation

stylemistake
Copy link
Member

@stylemistake stylemistake commented Jul 23, 2020

About The Pull Request

Fixes #52898
Fixes #52663

It has finally reached a full feature parity with goonchat, and is ready for review!

It is as fast as goonchat was (if not faster in certain circumstances), and is very extensible. It has all the necessary code for sorting messages into categories, which means that one of the next features will be multiple tab support.

Additional features that you will get with tgchat right now:

  • Massively faster server-side performance compared to goonchat, especially if batching multiple messages to one client.
  • Message persistence across rounds and reconnects. (All messages are stored client-side in IndexedDB)
  • More robust scroll tracking. If you scroll up, it will not change the scroll position on new messages like goonchat did.
  • Multiple message combining. (Currently set to combine up to 5 messages over last 5 seconds).
  • If using the highlighting feature, it highlights the whole message as well as the matching word.
  • "Now playing" widget, with preview of the song title, a knob for adjusting the volume and a stop button.

image


Architecture is as following:

to_chat() -+
           |
        SSchat
   (queue, batching)
           |
  window.send_message()
           |
           v
+-------------+
| tgui-panel  |
|+-----------+|
|| tgchat    ||
|+-----------+|
+-------------+

Subsystem is basically goonchat, but without all the garbage that slows the servers down (string concatenation, double urlencoding, sanitizing, etc). Now, instead of all that, it's being slowed down by json_encode in /datum/tgui_window/proc/send_message, which IMO is completely worth it, and allows sending various templates and widgets to tgchat.

/datum/tgui_window abstracts the whole window away from you, establishes a nice message-passing interface between DM and JS, with two message queues on each side, automatically loads js/css assets for you, basically does everything. You as a developer only have to worry about sending/receiving messages and write javascript.

tgui-panel is a slimmed down version of tgui, and functions as a container for various widgets, and tgchat is one of them. It of course can be expanded with more stuff.

It's also a separate entry point and a JS bundle, so it's not bloating the main tgui bundle, and is currently sitting at about 230kB.

The grand plan is to replace the whole side panel, and have absolutely everything written in inferno, with mindblowing features and customizability.

@tgstation-server tgstation-server added the UI We make the game less playable, but with round edges label Jul 23, 2020
@bobbah
Copy link
Member

bobbah commented Jul 23, 2020

i feel like you should remove the nanotrasen n from the background of the panel for chat but maybe thats just me

@Mothblocks
Copy link
Member

Is this going to force dark theme? I quite like the light theme for chat.

@optimumtact
Copy link
Member

finally light theme users will be executed

@RaveRadbury
Copy link
Member

RaveRadbury commented Jul 23, 2020

image
@stylemistake being received by a grateful community after finishing tgchat.

@MrDoomBringer
Copy link
Contributor

the start of an absolutely legendary feature
great work fam

@tgstation-server tgstation-server added the Merge Conflict Adding upstream files to your repo via drag and drop won't resolve conflicts label Jul 26, 2020
@tgstation-server tgstation-server removed the Merge Conflict Adding upstream files to your repo via drag and drop won't resolve conflicts label Jul 26, 2020
@tgstation-server tgstation-server added the Merge Conflict Adding upstream files to your repo via drag and drop won't resolve conflicts label Jul 28, 2020
@tgstation-server tgstation-server added Merge Conflict Adding upstream files to your repo via drag and drop won't resolve conflicts and removed Merge Conflict Adding upstream files to your repo via drag and drop won't resolve conflicts labels Jul 28, 2020
@tgstation-server tgstation-server removed the Merge Conflict Adding upstream files to your repo via drag and drop won't resolve conflicts label Jul 30, 2020
@saprasam

This comment was marked as spam.

@tgstation-server tgstation-server added Config Update Time to bother the headadmins for three months to get your config applied Merge Conflict Adding upstream files to your repo via drag and drop won't resolve conflicts labels Aug 1, 2020
@stylemistake stylemistake force-pushed the tgui-chat branch 2 times, most recently from 7e85d96 to e367b5f Compare August 1, 2020 03:25
@tgstation-server tgstation-server removed the Merge Conflict Adding upstream files to your repo via drag and drop won't resolve conflicts label Aug 1, 2020
@infoman-cor
Copy link
Contributor

Icons do not appear to render correctly. They instead just show up as a missing image box.

@Couls
Copy link
Contributor

Couls commented Aug 1, 2020

From the Testmerge, using ghostears and examining things when you have more than 1000 chat messages stored seems to freeze up the client and make it entirely unresponsive for a few seconds. Hasn't crashed my game yet but turning off ghostears stopped the freezing

this is especially bad when you examine mobs

@infoman-cor
Copy link
Contributor

I realize that this is still in its infancy but I would suggest adding string highlighting. As it really helps me know someone is attempting to talk to me in game.

@ShibaInuLord
Copy link

Personally, I prefer the old style of the settings area just in the corner, and that having a whole bar with it saying chat and the amount of chat messages is kind of redundant.

ZeWaka added a commit to goonstation/goonstation that referenced this pull request Aug 1, 2020
- tgui-dev-server works again
- Looks up and notifies dreamseeker to reload tgui windows
@stylemistake
Copy link
Member Author

It's ready for merging (doubt anyone will review it). Most of the bugs were squashed and it was testmerged for a full day with no errors in the logs, so it's safe to merge.

Begin the new era of /tg/station now!

@optimumtact optimumtact merged commit 0e1b20e into tgstation:master Aug 14, 2020
@TheSilverNuke
Copy link
Contributor

When filtering by dead chat the ghosts become unfollowable.
2020-08-14 05_03_22-_tg_Station Basil  ENGLISH   US-WEST   100% FREE LAG _ Rogue Edition Quebec
2020-08-14 05_03_10-_tg_Station Basil  ENGLISH   US-WEST   100% FREE LAG _ Rogue Edition Quebec

@stylemistake stylemistake deleted the tgui-chat branch August 26, 2020 21:10
GoryMoon pushed a commit to Ravenholdt/hdstation that referenced this pull request Oct 25, 2020
Replaces goonchat with a tgui based chat panel

    Fixes tgstation#52898
    Fixes tgstation#52663

It is as fast as goonchat was (if not faster in certain circumstances), and is very extensible. It has all the necessary code for sorting messages into categories, which means that one of the next features will be multiple tab support.

Additional features that you will get with tgchat right now:
    Massively faster server-side performance compared to goonchat, especially if batching multiple messages to one client.
    Message persistence across rounds and reconnects. (All messages are stored client-side in IndexedDB)
    More robust scroll tracking. If you scroll up, it will not change the scroll position on new messages like goonchat did.
    Multiple message combining. (Currently set to combine up to 5 messages over last 5 seconds).
    If using the highlighting feature, it highlights the whole message as well as the matching word.
    "Now playing" widget, with preview of the song title, a knob for adjusting the volume and a stop button.

Architecture is as following:
```
to_chat() -+
           |
        SSchat
   (queue, batching)
           |
  window.send_message()
           |
           v
+-------------+
| tgui-panel  |
|+-----------+|
|| tgchat    ||
|+-----------+|
+-------------+
```

Subsystem is basically goonchat, but without all the garbage that slows the servers down (string concatenation, double urlencoding, sanitizing, etc). Now, instead of all that, it's being slowed down by json_encode in /datum/tgui_window/proc/send_message, which IMO is completely worth it, and allows sending various templates and widgets to tgchat.

/datum/tgui_window abstracts the whole window away from you, establishes a nice message-passing interface between DM and JS, with two message queues on each side, automatically loads js/css assets for you, basically does everything. You as a developer only have to worry about sending/receiving messages and write javascript.

tgui-panel is a slimmed down version of tgui, and functions as a container for various widgets, and tgchat is one of them. It of course can be expanded with more stuff.

It's also a separate entry point and a JS bundle, so it's not bloating the main tgui bundle, and is currently sitting at about 230kB.
LemonInTheDark pushed a commit to LemonInTheDark/tgstation that referenced this pull request Dec 31, 2020
* [Ready] CDN browser assets! (tgstation#52681)

Rewrites the asset_cache system to handle sending assets to a CDN via a webroot.

see https://github.com/MrStonedOne/tgstation/blob/asset-cdn/code/modules/asset_cache/readme.md

Fixed a lot of bugs with assets, removed some dead code.

Changes:
    Moved asset cache code to transport datums, the currently loaded one is located at SSassets.transport, asset cache calls made before the config is loaded use the simple browse_rsc transport.
    Added subsystem call for when the config loads or reloads.
    Added a webroot CDN asset transport. assets are saved to a file in a format based on the file's hash (currently md5).
    Assets that don't use get_asset_url or get_url_mappings (such as browser assets referred to by static html files like changelog.html or static css files) can be saved to browse_rsc even when in cdn asset mode by setting legacy to TRUE on the datum returned by register_assets
    Added a system for saving assets on a cdn in a hash based namespace (folder), assets within the same namespace will always be able to refer to each other by relative names. (used to allow cdn'ing font awesome without having to make something that regenerates it's css files.).
    The simple/namespaced asset cache datum helper will handle generating a namespace composed of the combined md5 of everything in the same datum, as well as registering them properly.
    Moved external resource from a snowflake loaded file to a config entry, added it to resources.txt
    To ensure the system breaks in local testing in any situation that wouldn't work in cdn mode, the simple transport will mutate the filenames of non-legacy and non-namespaced assets and return this with get_asset_url.
    Simple transport's passive send of all roundstart assets to all clients is now a config that defaults to off. this is to break race conditions during local testings from devs accidentally relying on this instead of using send() properly.

cl
refactor: Interface assets (js/css/images) can now be managed using an external webserver instead of byond's one at a time file transfer queue.
admin: Adds admin verb toggle-cdn that allows admins to disable the external webserver asset transport and revert to the old system. Useful if the webserver backing this goes down (thanks cloudflare).
config: New config file, resources.txt, (must be loaded by an $include statement from the main config)
server: The external_rsc_urls.txt config has been moved to the main config system.
/cl
Porting notes:

Interface webpages must refer to their assets (css/js/image/etc) by a generated url, or the asset must register itself as a legacy asset. The system is designed to break in localtest (on simple/legacy mode) in most situations that would break in cdn mode.

Requires latest tgui.

The webserver must set the proper CORS headers for font files or font awesome (and other fonts) won't load.

/tg/'s webserver config: https://gist.github.com/MrStonedOne/523388b2f161af832292d98a8aad0eae

* tgchat (tgstation#52426)

Replaces goonchat with a tgui based chat panel

    Fixes tgstation#52898
    Fixes tgstation#52663

It is as fast as goonchat was (if not faster in certain circumstances), and is very extensible. It has all the necessary code for sorting messages into categories, which means that one of the next features will be multiple tab support.

Additional features that you will get with tgchat right now:
    Massively faster server-side performance compared to goonchat, especially if batching multiple messages to one client.
    Message persistence across rounds and reconnects. (All messages are stored client-side in IndexedDB)
    More robust scroll tracking. If you scroll up, it will not change the scroll position on new messages like goonchat did.
    Multiple message combining. (Currently set to combine up to 5 messages over last 5 seconds).
    If using the highlighting feature, it highlights the whole message as well as the matching word.
    "Now playing" widget, with preview of the song title, a knob for adjusting the volume and a stop button.

Architecture is as following:
```
to_chat() -+
           |
        SSchat
   (queue, batching)
           |
  window.send_message()
           |
           v
+-------------+
| tgui-panel  |
|+-----------+|
|| tgchat    ||
|+-----------+|
+-------------+
```

Subsystem is basically goonchat, but without all the garbage that slows the servers down (string concatenation, double urlencoding, sanitizing, etc). Now, instead of all that, it's being slowed down by json_encode in /datum/tgui_window/proc/send_message, which IMO is completely worth it, and allows sending various templates and widgets to tgchat.

/datum/tgui_window abstracts the whole window away from you, establishes a nice message-passing interface between DM and JS, with two message queues on each side, automatically loads js/css assets for you, basically does everything. You as a developer only have to worry about sending/receiving messages and write javascript.

tgui-panel is a slimmed down version of tgui, and functions as a container for various widgets, and tgchat is one of them. It of course can be expanded with more stuff.

It's also a separate entry point and a JS bundle, so it's not bloating the main tgui bundle, and is currently sitting at about 230kB.

* tgui: Yarn Berry (tgstation#53026)

This pull request upgrades Yarn to version 2 (also known as Yarn Berry).
* Update build validator

* Provide inferno in the root level package

* Remove type module from package.json

* Powershell build script

* tgchat: Hotfixes, Message Annotations (tgstation#52947)

This PR changes the message pipeline a little bit to support list-based messages, which can be annotated with custom data. Function signature of to_chat was slightly changed as well:

// Plain text message
to_chat(client,
  type = MESSAGE_TYPE_INFO,
  text = "foo")

// HTML message
to_chat(client,
  type = MESSAGE_TYPE_INFO,
  html = "<span class='notice'>foo</span>")

Old to_chat format is still supported, but handle_whitespace, trailing_newline and confidential flags have no effect. confidential flag could still be revived though, if there is enough merit in it, for example to filter out confidential messages when saving a chat log.

The reason for using /list and not /datum, is because lists are plain faster, and there are minimal data transformations - these lists are fed directly to json_encode and sent to tgchat.

Plain text messages do not need to be HTML-escaped, which makes them safer and more performant than HTML messages. Plain text messages can be made interactive (or formatted with CSS) by custom-handling them in javscript based on message type and annotations.

It would be impossible to annotate every single message in the game (at the moment of writing, there are 9447 to_chat calls in the code), but it could be done selectively, for only those messages that are hard to classify by span classes (and there are still A LOT of them).
Please annotate more messages. Thank you.

    Fixes tgstation#52943
    Fixes tgstation#52908
    Fixes tgstation#52816

Changelog

cl
add: tgchat: Unread message count is now smarter and won't increase on other tabs if you have already read the same message in the active tab.
add: tgchat: Admin PMs are now properly annotated and can be filtered into separate tabs.
fix: tgchat: Fix: Highlighted message overlay no longer blocks clicks. Clicking a highlighted (F) link should work as it should.
fix: tgui: Fixed NTOS bluescreen due to calling .includes() on a stylesheet href which could be null on certain browsers.
code: tgchat: Chat schema bumped to version 5. All chat-related settings were reset to avoid breakage.
/cl

* tgui: Prevent Ctrl+F passthrough, Fix regressions (tgstation#53012)

Prevents trigerring custom game keybinds when pressing Ctrl+F.

Search is a commonly used feature in browser windows, so it makes no sense to pass through the key.
Fixes a regression introduced in tgstation#52947.

New stylesheet loading validation code was the only way to make dynamic asset loading work on IE10, but it broke IE8 support along the way in absolutely incomprehensible, IMPOSSIBLE way.
Reduced debug log spam.

That much logged information scrolls at 500 lines per second, which makes it very hard to debug.

* TGUI Photocopier (tgstation#52831)

Converts photocopier UI to TGUI.

Initially I tried to make it so you could select to make a color or greyscale copy of paper's but I couldn't really figure it out, so I decided to hide those two buttons if the inserted item isn't a photo.

Something not shown in the pictures below is that if you don't have a toner cartridge or the cartridge doesn't have enough charge, the "Copy" button is greyed out, likewise for the AI's print button.

cl
refactor: Photocopiers now use TGUI
tweak: You can insert any type of toner cartridge into photocopiers, and regardless of the currently inserted toner's charge level.
tweak: Toner cartridges can be ejected from photocopiers at any time
/cl

* Fix tgui chat on IE8 (tgstation#53141)

* tgui: Shuttle Console (tgstation#53168)

* Browser Status Panel (tgstation#53112)

* tgui: Improve logging, Fix external links (tgstation#53226)

* tgui: Improve logging, Fix external links

* Print suspending on the same line

* Streamline fix chat verb

* Muh https

* tgui: Add a proxy storage object with graceful fallback (tgstation#53294)

* Fix various issues with browser statpanel (tgstation#53263)

* Keep tab buttons in view when scrolled down
* Unfocus tab buttons after click so scrollbar keeps working
* Fix some subsystem stat entries
* Improve key passthrough
* Fix runtimes from nulls in AI connected_robot list
* Add missing info in MC tab for global/config/etc.
* Fix tgstation#53298 by including turf in alt-click menu

* misc spacemandmm fixes

* fixes TGUI errors

* small mentor status panel fixes

* e

* Fix Alt Clicking opening up a window and add back some object verbs to the browser stat panel (tgstation#53369)

Fixes some more issues with browser stat panel

- Alt clicking items in the listed turf tab doesn't open up a popup
- Toggle suit sensors button missing

* looc span readdition

* tgui is a beeeeYUTCH

Co-authored-by: Kyle Spier-Swenson <kyleshome@gmail.com>
Co-authored-by: Aleksej Komarov <stylemistake@gmail.com>
Co-authored-by: SteelSlayer <42044220+SteelSlayer@users.noreply.github.com>
Co-authored-by: Tad Hardesty <tad@platymuus.com>
Co-authored-by: Arkatos1 <43862960+Arkatos1@users.noreply.github.com>
Co-authored-by: Couls <coul422@gmail.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Config Update Time to bother the headadmins for three months to get your config applied Feature Exposes new bugs in interesting ways RED LABEL This PR will not auto stale, this label should be green at all times. UI We make the game less playable, but with round edges Verified ✔️ Yeah, i'm a coder. What about it?
Projects
None yet
Development

Successfully merging this pull request may close these issues.

High lag can make walking spam chat. Opening UIs prevnts the use of some keybinds (like the talk keybind)