Timo K.andClaude Fable 5.1
28e1a9e22f
ploy previews run pr-deploy.yaml from main, which downloads build-output-sdk, so a renamed artifact can never be found from a pull request. Keep the package name and point build:sdk:production and build:sdk:development at the CallViewModel bundle the preview is meant to carry. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
2.8 KiB
SDK mode (EXPERIMENTAL, superseded)
Superseded by the
sdk/package (@element-hq/matrixrtc-sdk) and its harness insdk/dev; seesdk-plan.md. This folder still builds, with its own script, until that package can do what this does.
EC can be build in sdk mode. This will result in a compiled js file that can be imported in very simple webapps.
It allows to use matrixRTC in combination with livekit without relying on element call.
This is done by instantiating the call view model and exposing some useful behaviors (observables) and methods.
This folder contains an example index.html file that showcases the sdk in use (hosted on localhost:8123 with a webserver allowing cors (for example npx serve -l 81234 --cors)) as a godot engine HTML export template.
Getting started
To get started run
pnpm install
pnpm build:sdk-target-based-on-call-view-model
in the repository root. (pnpm build:sdk builds the sdk/ package instead.)
CI's sdk package (build:sdk:production, build:sdk:development, the
build-output-sdk artifact and the pr<N>-sdk Netlify preview) is still this
bundle, not the sdk/ package, until its consumers have moved over.
It will create dist containing the compiled js file, matrixrtc-sdk.js.
This file needs to be hosted. Locally (via npx serve -l 81234 --cors) or on a remote server.
Now you just need to add the widget to element web via:
/addwidget http://localhost:3000?widgetId=$matrix_widget_id&userId=$matrix_user_id&deviceId=$org.matrix.msc3819.matrix_device_id&baseUrl=$org.matrix.msc4039.matrix_base_url&roomId=$matrix_room_id
Widgets
The sdk mode is particularly interesting to be used in widgets. In widgets you do not need to pay attention to matrix login/cs api ...
To create a widget see the example index.html file in this folder. And add it to EW via:
/addwidget <widgetUrl> (see url parameters for more details on <widgetUrl>)
url parameters
The url parameters are needed to pass initial data to the widget. They will automatically be used by the matrixRTCSdk to start the postmessage widget api (communication between the client (e.g. Element Web) and the widget)
widgetId = $matrix_widget_id
userId = $matrix_user_id
deviceId = $org.matrix.msc3819.matrix_device_id
baseUrl = $org.matrix.msc4039.matrix_base_url
parentUrl = // will be inserted automatically
Full template use as <widgetUrl>:
http://localhost:3000?widgetId=$matrix_widget_id&userId=$matrix_user_id&deviceId=$org.matrix.msc3819.matrix_device_id&baseUrl=$org.matrix.msc4039.matrix_base_url&roomId=$matrix_room_id
the $ prefixed variables will be replaced by EW on widget instantiation. (e.g. $matrix_user_id -> @user:example.com (url encoding will also be applied automatically by EW) -> %40user%3Aexample.com)