Support and send the config over to capable widgets
For https://github.com/vector-im/riot-web/pull/12845
This commit is contained in:
parent
26bda5933b
commit
bdcb65de77
5 changed files with 64 additions and 6 deletions
|
@ -24,6 +24,8 @@ import {MatrixClientPeg} from "./MatrixClientPeg";
|
||||||
import RoomViewStore from "./stores/RoomViewStore";
|
import RoomViewStore from "./stores/RoomViewStore";
|
||||||
import {IntegrationManagers} from "./integrations/IntegrationManagers";
|
import {IntegrationManagers} from "./integrations/IntegrationManagers";
|
||||||
import SettingsStore from "./settings/SettingsStore";
|
import SettingsStore from "./settings/SettingsStore";
|
||||||
|
import {Capability, KnownWidgetActions} from "./widgets/WidgetApi";
|
||||||
|
import SdkConfig from "./SdkConfig";
|
||||||
|
|
||||||
const WIDGET_API_VERSION = '0.0.2'; // Current API version
|
const WIDGET_API_VERSION = '0.0.2'; // Current API version
|
||||||
const SUPPORTED_WIDGET_API_VERSIONS = [
|
const SUPPORTED_WIDGET_API_VERSIONS = [
|
||||||
|
@ -213,11 +215,18 @@ export default class FromWidgetPostMessageApi {
|
||||||
const data = event.data.data;
|
const data = event.data.data;
|
||||||
const val = data.value;
|
const val = data.value;
|
||||||
|
|
||||||
if (ActiveWidgetStore.widgetHasCapability(widgetId, 'm.always_on_screen')) {
|
if (ActiveWidgetStore.widgetHasCapability(widgetId, Capability.AlwaysOnScreen)) {
|
||||||
ActiveWidgetStore.setWidgetPersistence(widgetId, val);
|
ActiveWidgetStore.setWidgetPersistence(widgetId, val);
|
||||||
}
|
}
|
||||||
} else if (action === 'get_openid') {
|
} else if (action === 'get_openid') {
|
||||||
// Handled by caller
|
// Handled by caller
|
||||||
|
} else if (action === KnownWidgetActions.GetRiotWebConfig) {
|
||||||
|
if (ActiveWidgetStore.widgetHasCapability(widgetId, Capability.GetRiotWebConfig)) {
|
||||||
|
this.sendResponse(event, {
|
||||||
|
api: INBOUND_API_NAME,
|
||||||
|
config: SdkConfig.get(),
|
||||||
|
});
|
||||||
|
}
|
||||||
} else {
|
} else {
|
||||||
console.warn('Widget postMessage event unhandled');
|
console.warn('Widget postMessage event unhandled');
|
||||||
this.sendError(event, {message: 'The postMessage was unhandled'});
|
this.sendError(event, {message: 'The postMessage was unhandled'});
|
||||||
|
|
|
@ -27,6 +27,7 @@ import {MatrixClientPeg} from "./MatrixClientPeg";
|
||||||
import SettingsStore from "./settings/SettingsStore";
|
import SettingsStore from "./settings/SettingsStore";
|
||||||
import WidgetOpenIDPermissionsDialog from "./components/views/dialogs/WidgetOpenIDPermissionsDialog";
|
import WidgetOpenIDPermissionsDialog from "./components/views/dialogs/WidgetOpenIDPermissionsDialog";
|
||||||
import WidgetUtils from "./utils/WidgetUtils";
|
import WidgetUtils from "./utils/WidgetUtils";
|
||||||
|
import {KnownWidgetActions} from "./widgets/WidgetApi";
|
||||||
|
|
||||||
if (!global.mxFromWidgetMessaging) {
|
if (!global.mxFromWidgetMessaging) {
|
||||||
global.mxFromWidgetMessaging = new FromWidgetPostMessageApi();
|
global.mxFromWidgetMessaging = new FromWidgetPostMessageApi();
|
||||||
|
@ -75,6 +76,16 @@ export default class WidgetMessaging {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Tells the widget that the client is ready to handle further widget requests.
|
||||||
|
*/
|
||||||
|
flagReadyToContinue() {
|
||||||
|
return this.messageToWidget({
|
||||||
|
api: OUTBOUND_API_NAME,
|
||||||
|
action: KnownWidgetActions.ClientReady,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Request a screenshot from a widget
|
* Request a screenshot from a widget
|
||||||
* @return {Promise} To be resolved with screenshot data when it has been generated
|
* @return {Promise} To be resolved with screenshot data when it has been generated
|
||||||
|
|
|
@ -419,6 +419,12 @@ export default class AppTile extends React.Component {
|
||||||
if (this.props.onCapabilityRequest) {
|
if (this.props.onCapabilityRequest) {
|
||||||
this.props.onCapabilityRequest(requestedCapabilities);
|
this.props.onCapabilityRequest(requestedCapabilities);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// We only tell Jitsi widgets that we're ready because they're realistically the only ones
|
||||||
|
// using this custom extension to the widget API.
|
||||||
|
if (this.props.type === 'jitsi') {
|
||||||
|
widgetMessaging.flagReadyToContinue();
|
||||||
|
}
|
||||||
}).catch((err) => {
|
}).catch((err) => {
|
||||||
console.log(`Failed to get capabilities for widget type ${this.props.type}`, this.props.id, err);
|
console.log(`Failed to get capabilities for widget type ${this.props.type}`, this.props.id, err);
|
||||||
});
|
});
|
||||||
|
|
|
@ -28,6 +28,7 @@ const WIDGET_WAIT_TIME = 20000;
|
||||||
import SettingsStore from "../settings/SettingsStore";
|
import SettingsStore from "../settings/SettingsStore";
|
||||||
import ActiveWidgetStore from "../stores/ActiveWidgetStore";
|
import ActiveWidgetStore from "../stores/ActiveWidgetStore";
|
||||||
import {IntegrationManagers} from "../integrations/IntegrationManagers";
|
import {IntegrationManagers} from "../integrations/IntegrationManagers";
|
||||||
|
import {Capability} from "../widgets/WidgetApi";
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Encodes a URI according to a set of template variables. Variables will be
|
* Encodes a URI according to a set of template variables. Variables will be
|
||||||
|
@ -454,12 +455,15 @@ export default class WidgetUtils {
|
||||||
static getCapWhitelistForAppTypeInRoomId(appType, roomId) {
|
static getCapWhitelistForAppTypeInRoomId(appType, roomId) {
|
||||||
const enableScreenshots = SettingsStore.getValue("enableWidgetScreenshots", roomId);
|
const enableScreenshots = SettingsStore.getValue("enableWidgetScreenshots", roomId);
|
||||||
|
|
||||||
const capWhitelist = enableScreenshots ? ["m.capability.screenshot"] : [];
|
const capWhitelist = enableScreenshots ? [Capability.Screenshot] : [];
|
||||||
|
|
||||||
// Obviously anyone that can add a widget can claim it's a jitsi widget,
|
// Obviously anyone that can add a widget can claim it's a jitsi widget,
|
||||||
// so this doesn't really offer much over the set of domains we load
|
// so this doesn't really offer much over the set of domains we load
|
||||||
// widgets from at all, but it probably makes sense for sanity.
|
// widgets from at all, but it probably makes sense for sanity.
|
||||||
if (appType == 'jitsi') capWhitelist.push("m.always_on_screen");
|
if (appType === 'jitsi') {
|
||||||
|
capWhitelist.push(Capability.AlwaysOnScreen);
|
||||||
|
capWhitelist.push(Capability.GetRiotWebConfig);
|
||||||
|
}
|
||||||
|
|
||||||
return capWhitelist;
|
return capWhitelist;
|
||||||
}
|
}
|
||||||
|
|
|
@ -23,6 +23,7 @@ export enum Capability {
|
||||||
Screenshot = "m.capability.screenshot",
|
Screenshot = "m.capability.screenshot",
|
||||||
Sticker = "m.sticker",
|
Sticker = "m.sticker",
|
||||||
AlwaysOnScreen = "m.always_on_screen",
|
AlwaysOnScreen = "m.always_on_screen",
|
||||||
|
GetRiotWebConfig = "im.vector.web.riot_config",
|
||||||
}
|
}
|
||||||
|
|
||||||
export enum KnownWidgetActions {
|
export enum KnownWidgetActions {
|
||||||
|
@ -33,7 +34,10 @@ export enum KnownWidgetActions {
|
||||||
UpdateVisibility = "visibility",
|
UpdateVisibility = "visibility",
|
||||||
ReceiveOpenIDCredentials = "openid_credentials",
|
ReceiveOpenIDCredentials = "openid_credentials",
|
||||||
SetAlwaysOnScreen = "set_always_on_screen",
|
SetAlwaysOnScreen = "set_always_on_screen",
|
||||||
|
GetRiotWebConfig = "im.vector.web.riot_config",
|
||||||
|
ClientReady = "im.vector.ready",
|
||||||
}
|
}
|
||||||
|
|
||||||
export type WidgetAction = KnownWidgetActions | string;
|
export type WidgetAction = KnownWidgetActions | string;
|
||||||
|
|
||||||
export enum WidgetApiType {
|
export enum WidgetApiType {
|
||||||
|
@ -63,10 +67,15 @@ export interface FromWidgetRequest extends WidgetRequest {
|
||||||
*/
|
*/
|
||||||
export class WidgetApi {
|
export class WidgetApi {
|
||||||
private origin: string;
|
private origin: string;
|
||||||
private inFlightRequests: {[requestId: string]: (reply: FromWidgetRequest) => void} = {};
|
private inFlightRequests: { [requestId: string]: (reply: FromWidgetRequest) => void } = {};
|
||||||
private readyPromise: Promise<any>;
|
private readyPromise: Promise<any>;
|
||||||
private readyPromiseResolve: () => void;
|
private readyPromiseResolve: () => void;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Set this to true if your widget is expecting a ready message from the client. False otherwise (default).
|
||||||
|
*/
|
||||||
|
public expectingExplicitReady = false;
|
||||||
|
|
||||||
constructor(currentUrl: string, private widgetId: string, private requestedCapabilities: string[]) {
|
constructor(currentUrl: string, private widgetId: string, private requestedCapabilities: string[]) {
|
||||||
this.origin = new URL(currentUrl).origin;
|
this.origin = new URL(currentUrl).origin;
|
||||||
|
|
||||||
|
@ -83,7 +92,14 @@ export class WidgetApi {
|
||||||
|
|
||||||
if (payload.action === KnownWidgetActions.GetCapabilities) {
|
if (payload.action === KnownWidgetActions.GetCapabilities) {
|
||||||
this.onCapabilitiesRequest(<ToWidgetRequest>payload);
|
this.onCapabilitiesRequest(<ToWidgetRequest>payload);
|
||||||
|
if (!this.expectingExplicitReady) {
|
||||||
this.readyPromiseResolve();
|
this.readyPromiseResolve();
|
||||||
|
}
|
||||||
|
} else if (payload.action === KnownWidgetActions.ClientReady) {
|
||||||
|
this.readyPromiseResolve();
|
||||||
|
|
||||||
|
// Automatically acknowledge so we can move on
|
||||||
|
this.replyToRequest(<ToWidgetRequest>payload, {});
|
||||||
} else {
|
} else {
|
||||||
console.warn(`[WidgetAPI] Got unexpected action: ${payload.action}`);
|
console.warn(`[WidgetAPI] Got unexpected action: ${payload.action}`);
|
||||||
}
|
}
|
||||||
|
@ -126,7 +142,10 @@ export class WidgetApi {
|
||||||
data: payload,
|
data: payload,
|
||||||
response: {}, // Not used at this layer - it's used when the client responds
|
response: {}, // Not used at this layer - it's used when the client responds
|
||||||
};
|
};
|
||||||
|
|
||||||
|
if (callback) {
|
||||||
this.inFlightRequests[request.requestId] = callback;
|
this.inFlightRequests[request.requestId] = callback;
|
||||||
|
}
|
||||||
|
|
||||||
console.log(`[WidgetAPI] Sending request: `, request);
|
console.log(`[WidgetAPI] Sending request: `, request);
|
||||||
window.parent.postMessage(request, "*");
|
window.parent.postMessage(request, "*");
|
||||||
|
@ -134,7 +153,16 @@ export class WidgetApi {
|
||||||
|
|
||||||
public setAlwaysOnScreen(onScreen: boolean): Promise<any> {
|
public setAlwaysOnScreen(onScreen: boolean): Promise<any> {
|
||||||
return new Promise<any>(resolve => {
|
return new Promise<any>(resolve => {
|
||||||
this.callAction(KnownWidgetActions.SetAlwaysOnScreen, {value: onScreen}, resolve);
|
this.callAction(KnownWidgetActions.SetAlwaysOnScreen, {value: onScreen}, null);
|
||||||
|
resolve(); // SetAlwaysOnScreen is currently fire-and-forget, but that could change.
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
public getRiotConfig(): Promise<any> {
|
||||||
|
return new Promise<any>(resolve => {
|
||||||
|
this.callAction(KnownWidgetActions.GetRiotWebConfig, {}, response => {
|
||||||
|
resolve(response.response.config);
|
||||||
|
});
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue