Open hiddeninthesand opened 2 years ago
I would love to see this feature. Our use-case would be a plugin for the company which could e.g. generate links to our Jitsi server, or insert some funny GIF sourced from some company insider jokes. I just want to emphasize the point that such things are out-of-scope of the main repo.
@sweidac both of those can be done using Widget integrations and Bots already today.
Sounds nice @t3chguy! Unfortunately I couldn't find documentation about Widget's after excessive querying the web (my fault most probably). Can you provide a link to some resources?
both of those can be done using Widget integrations and Bots already today.
This was my thought as well.
Unfortunately I couldn't find documentation about Widget's after excessive querying the web
I've also tried a few times to find good info/resources on this, and I keep struggling to do so. Would love to see the official/comprehensive/etc docs for it!
The best I've found (that I can remember off the top of my head) has just been searching the issues here for 'widget' and combing through the disparate threads to try and get snippets of info:
Edit: Based on that, here are a few relevant snippets i've (re-)discovered just now:
Integration managers are embedded applications within Element to help the user configure bots, bridges, and widgets. An integration manager is a separate piece of software not typically available with your homeserver.
For the icon you can specify
avatar_url
with anmxc
resource in the same widget event content
Integration managers are applications that help clients bring integrations (bridges, bots, etc) to users.
There are 2 integration managers at the time of writing this, each with different goals and APIs. Scalar (aka Modular) is the proprietary manager that ships with Riot and is developed specifically for Riot. Dimension (a project of mine) is open source and caters towards self-hosted integrations.
An open source integration manager for matrix clients, like Element.
Element's Widget API
Scalar API (Element)
Use the example code below. You can create a new React app, add the
matrix-widget-api
package and paste the code intoApp.js
.
JavaScript/TypeScript API for widgets & web clients to communicate
For help and support, visit #matrix-widgets:matrix.org on Matrix.
Disclaimer: Widgets are not yet in the Matrix spec, so this library may not work with other implementations.
And from Google/etc:
Introducing Matrix Widgets - including Jitsi video conferencing!
Matrix.org Widgets (RFC), Version: 2.0, State: PROPOSED
Widgets are HTML and Javascript content / applications that can be embedded within, and communicate with Matrix clients.
Riot Widget API
What’s a widget? It’s an embedded iframe in Riot. So it’s just an arbitrary URL.
Matrix Widget Api Examples
Learn how to use
matrix-widget-api
by viewing and forking example apps that make use ofmatrix-widget-api
on CodeSandbox.
matrix-hookshot
, but I figured I would include it just in case anywayMatrix Widget Toolkit
Reusable framework for creating Matrix widgets.
This repository contains multiple packages that provide reusable components that can be used to write Matrix/Element widgets.
@matrix-widget-toolkit/api: A package that wraps matrix-widget-api to provide a more convenient API.
@matrix-widget-toolkit/react: A package that provides a Widget API integration for React apps.
@matrix-widget-toolkit/semantic-ui: A package that provides a matching Semantic UI theme for Element.
@matrix-widget-toolkit/mui: A package that provides a matching Mui theme for Element.
@matrix-widget-toolkit/testing: Testing support for @matrix-widget-toolkit/api.
@matrix-widget-toolkit/widget-server: A container to host a Matrix widget in a production environment.
More packages to follow…
Matrix Example Widget (Material UI)
This is an example that shows how you can write a Matrix/Element widget. You can use this package as a starting point for writing new widgets.
Matrix Client-Server SDK for JavaScript
Matrix SDK for React Javascript
JS/TS SDK for handling (extensible) events in Matrix
TypeScript/JavaScript SDK for Matrix bots
A template for creating bots with matrix-bot-sdk
Repository of the bot we created in the
matrix-bot-sdk-tutorial
A potential use-case outside the scope of Element may be file compression. Because of Discord's abysmal 8MB upload limit, I threw together a BetterDiscord plugin to compress images, video and audio automatically (using FFmpeg for the video/audio) which is extremely helpful. Even with the increased upload sizes today, I like to use it to quickly normalize audio files or clip video I send when I share things, and it would be great to have similar functionality on Element.
Maybe it would be appropriate to have a simplified version of it built into Element with a hidden advanced menu for all the other stuff? But I think it's probably better suited to being an optional plugin.
Your use case
What would you like to do?
An official plugin/modification API similar to BetterDiscord which would allow expanding the functionality of Element in a much more dynamic way than committing directly to the project.
Why would you like to do it?
Electron was built specifically to be easily modifiable by the user, ever since it was Atom Shell, and eventually renamed to Electron. Many other projects, rather officially or not, make good use of this, such as previously mentioned BetterDiscord. Many features that some people may want are rather too niche or not worth the Element developers' time to justify adding to the main Element client, such as automatic message translation, advanced GUIs for search and room management, or a reimplementation of Discord's emoji system (all notable BD plugins). An upside that may be more important to the Element developers is that if this catches on, it'd be an easy way to gauge what features people do want added to the main project via plugin popularity.
How would you like to achieve it?
Possibly the same way BetterDiscord does it, an injector with plugin script files. If BD is anything to go by, if you give people a way to modify a client, they will modify a client.
Have you considered any alternatives?
There are really only three alternatives to this, and all of them are less than ideal.
Unofficial Injector
The best of these would be to make an unofficial plugin injector, and while that is perfectly functional, especially since as an open source project I imagine the developers would be more likely to play ball with the maintainers of an unofficial injector to ensure stability, this would guarantee some loss of stability and security. This specific example is not a bad alternative, but it's certainly not the best one.
Contributing directly to the Element project
This comes with many more issues, including but not limited to being more difficult to create (as it would obviously come with more stringent security and stability criteria than a user modification), being less likely to be approved at all (too niche for the main project/out of scope), or simply because it'd make the project bigger than it has to be. Not ideal for users, developers, or the Element project maintainers.
Forking Element
The worst option of them all, as it'd mean minor changes would be forced to be maintained on an entirely separate fork of Element, with no upstream improvements likely to come, and being even more difficult for a would-be plugin developer or plugin user than the other two. It's very rare that someone who wants to modify a client would prefer to have to maintain their own version of said client.
Additional context
This issue is related to vector-im/element-web#15650, which was previously closed as the specific examples the OP submitted could be done using an alternative (a local service). I'd like to make clear that the specific examples I've listed are not the only reason I'd like such a thing to exist, and if you require more examples there's an official list of BetterDiscord plugins that contain popularity statistics to further my case here.