Merge pull request #12980 from vector-im/dbkr/jitsi_fix_popout_rel

Fix popout support for jitsi widgets
This commit is contained in:
David Baker 2020-04-01 13:59:48 +01:00 committed by GitHub
commit 511d18abec
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 24 additions and 24 deletions

View file

@ -53,7 +53,6 @@
"breadcrumbs": true
},
"jitsi": {
"preferredDomain": "jitsi.riot.im",
"externalApiUrl": "https://jitsi.riot.im/libs/external_api.min.js"
"preferredDomain": "jitsi.riot.im"
}
}

View file

@ -88,9 +88,6 @@ For a good example, see https://riot.im/develop/config.json.
1. `preferredDomain`: The domain name of the preferred Jitsi instance. Defaults
to `jitsi.riot.im`. This is used whenever a user clicks on the voice/video
call buttons - integration managers may use a different domain.
1. `externalApiUrl`: The URL to the Jitsi Meet API script. This is required
for showing any Jitsi widgets, no matter the source. Defaults to
`https://jitsi.riot.im/libs/external_api.min.js`.
Note that `index.html` also has an og:image meta tag that is set to an image
hosted on riot.im. This is the image used if links to your copy of Riot

View file

@ -38,8 +38,9 @@
"clean": "rimraf lib webapp electron_app/dist",
"build": "yarn clean && yarn build:genfiles && yarn build:compile && yarn build:types && yarn build:bundle",
"build-stats": "yarn clean && yarn build:genfiles && yarn build:compile && yarn build:types && yarn build:bundle-stats",
"build:jitsi": "curl -s https://jitsi.riot.im/libs/external_api.min.js > ./webapp/jitsi_external_api.min.js",
"build:res": "node scripts/copy-res.js",
"build:genfiles": "yarn reskindex && yarn build:res",
"build:genfiles": "yarn reskindex && yarn build:res && yarn build:jitsi",
"build:modernizr": "modernizr -c .modernizr.json -d src/vector/modernizr.js",
"build:compile": "babel -d lib --verbose --extensions \".ts,.js,.tsx\" src",
"build:bundle": "cross-env NODE_ENV=production webpack -p --progress --bail --mode production",
@ -52,7 +53,7 @@
"install:electron": "electron-builder install-app-deps",
"dist": "scripts/package.sh",
"start": "concurrently --kill-others-on-fail --prefix \"{time} [{name}]\" -n reskindex,reskindex-react,res,riot-js \"yarn reskindex:watch\" \"yarn reskindex:watch-react\" \"yarn start:res\" \"yarn start:js\"",
"start:res": "node scripts/copy-res.js -w",
"start:res": "yarn build:jitsi && node scripts/copy-res.js -w",
"start:js": "webpack-dev-server --host=0.0.0.0 --output-filename=bundles/_dev_/[name].js --output-chunk-filename=bundles/_dev_/[name].js -w --progress --mode development",
"electron": "yarn build && yarn install:electron && electron .",
"lint": "yarn lint:types && yarn lint:ts && yarn lint:js && yarn lint:style",

View file

@ -15,5 +15,7 @@
</div>
</div>
</div>
<!-- This script is not webpacked, and the script is downloaded at build time -->
<script src="./jitsi_external_api.min.js"></script>
</body>
</html>

View file

@ -49,12 +49,19 @@ let widgetApi: WidgetApi;
return <string>query[name];
};
// If we have these params, expect a widget API to be available (ie. to be in an iframe
// inside a matrix client). Otherwise, assume we're on our own, eg. have been popped
// out into a browser.
const parentUrl = qsParam('parentUrl', true);
const widgetId = qsParam('widgetId', true);
// Set this up as early as possible because Riot will be hitting it almost immediately.
widgetApi = new WidgetApi(qsParam('parentUrl'), qsParam('widgetId'), [
Capability.AlwaysOnScreen,
Capability.GetRiotWebConfig,
]);
widgetApi.expectingExplicitReady = true;
if (parentUrl && widgetId) {
widgetApi = new WidgetApi(qsParam('parentUrl'), qsParam('widgetId'), [
Capability.AlwaysOnScreen,
]);
widgetApi.expectingExplicitReady = true;
}
// Populate the Jitsi params now
jitsiDomain = qsParam('conferenceDomain');
@ -63,16 +70,10 @@ let widgetApi: WidgetApi;
avatarUrl = qsParam('avatarUrl', true); // http not mxc
userId = qsParam('userId');
await widgetApi.waitReady();
await widgetApi.setAlwaysOnScreen(false); // start off as detachable from the screen
const riotConfig = await widgetApi.getRiotConfig();
// Get the Jitsi Meet API loaded up as fast as possible, but ensure that the widget's postMessage
// receiver (WidgetApi) is up and running first.
const scriptTag = document.createElement("script");
scriptTag.src = riotConfig['jitsi']['externalApiUrl'];
document.body.appendChild(scriptTag);
if (widgetApi) {
await widgetApi.waitReady();
await widgetApi.setAlwaysOnScreen(false); // start off as detachable from the screen
}
// TODO: register widgetApi listeners for PTT controls (https://github.com/vector-im/riot-web/issues/12795)
@ -94,7 +95,7 @@ function joinConference() { // event handler bound in HTML
switchVisibleContainers();
// noinspection JSIgnoredPromiseFromCall
widgetApi.setAlwaysOnScreen(true); // ignored promise because we don't care if it works
if (widgetApi) widgetApi.setAlwaysOnScreen(true); // ignored promise because we don't care if it works
const meetApi = new JitsiMeetExternalAPI(jitsiDomain, {
width: "100%",
@ -116,7 +117,7 @@ function joinConference() { // event handler bound in HTML
switchVisibleContainers();
// noinspection JSIgnoredPromiseFromCall
widgetApi.setAlwaysOnScreen(false); // ignored promise because we don't care if it works
if (widgetApi) widgetApi.setAlwaysOnScreen(false); // ignored promise because we don't care if it works
document.getElementById("jitsiContainer").innerHTML = "";
});