GSoC Wrapup!
For the past few weeks I’ve been working with the Matrix.org team on its Vector.im client. Most of the work described here has been continously merged into the /develop branch of matrix-react-sdk
and vector-web
and hence has been available on Vector (Develop) for feedback from the community throughout GSoC, and has been developed accordingly. What follows is a brief outline of the work I’ve done (not all commits are mentioned or linked to).
Although originally not a part of my proposal for GSoC, a major part of the work done throughout has been on a rich text editor for Vector. While the Markdown-only editor formerly used was quite convenient for early adopters, RTE is essential for the kind of business and casual users Vector hopes to gain mindshare among next.
- Initial version of rich text editor (matrix-react-sdk)
- Initial version of rich text editor (vector-web)
- Minor improvements
- Fix MessageComposerInput.setLastTextEntry
- RTE improvements, markdown mode
- Cleanup, better comments, markdown hotkeys
- Add basic Markdown highlighting
- Fixes and improvements in RichText
- User and room decorators, history & typing notifs
- Use constants for keycodes in RTE
- More RTE fixes
- Fix cursor bug, persist editor mode & RTE default
- Fix RTE escaping, HTML output with breaks
- Use different keys for new MessageComposerInput
- Style changes and improvements in autocomplete
- Style selection color
- MessageComposer styling for Draft
- RTE mode switch styling & cleanup
As this was a completely new feature, it was implemented based on my own designs, without input from ribot (the design firm for Vector). Once those designs were available, I made the required changes.
Another major part of the work done was autocomplete with various providers replacing the concept of “plugins” from the proposal.
- Initial version of autocomplete
- Autocomplete style
- Styling for autocomplete
- Room, user, DDG autocomplete providers (wip)
- Emoji provider, DDG working, style improvements
- Style changes and improvements in autocomplete
- Fuzzy matching in User and Room providers
- Hide/show autocomplete based on selection state
- Get basic keyboard selection working
- Autocomplete selection wraparound
- Autocomplete replacement
- Use canonical room alias for completion
- https for DDG, provide range for UserProvider
- Code cleanup and emoji replacement in composer
- Strip (IRC) displayname suffix from autocomplete
- Fix autocomplete to use tab instead of return
- Allow up/down normally for no completions
One of the most shockingly popular parts of the work I did (to the extent where I’ve received direct messages about it, and it’s been discussed in the Vector User Feedback room) is emoji replacement. Normally, only platforms with a system font that supports emoji renders them correctly. With my changes, almost all emoji are rendered correctly.
- Render unicode emoji as emojione images
- Large emoji support
- Use SVG emoji
- Emojify ALL THE THINGS!*
- And emojify name in MemberInfo
- Improve emoji-body detection
- Add EmojiText component for emoji replacement
- Add max-width to emoji completions
- Styling for emojione emojis 😃
- Large emoji support
- Bump emoji-body font-size down to 48px
- Various fixes and improvements to emojificiation
*actually a commit message
Making all of these mostly-WIP changes available on /develop meant we couldn’t have them enabled by default. So, I added a “Labs mode”, for options to enable experimental features:
- Add experimental “Labs” section to settings
- Fix key attr placement in UserSettings
- Labs improvements
- Use RTE labs settings
This is now also used for other experimental features like End-to-End Encryption and Integration Management.
A rather interesting part of the work done was the Slack Webhook-compatible bridge, which immediately makes a Slack-like Webhook interface available for Matrix servers, making it possible to use other services’ Slack integrations without modifications. This is available at github.com/aviraldg/matrix-appservice-slack-api.
I also spent a fair amount of time refactoring, and cleaning up code; a part of which was setting up eslint with sensible defaults to lint our code; and working on and discussing proposals for message metadata and message type extensions (not linked to here since they are not public.)