diff --git a/src/vector/dummy_widget/index.ts b/src/vector/dummy_widget/index.ts index 3f9025bd67..67716388bb 100644 --- a/src/vector/dummy_widget/index.ts +++ b/src/vector/dummy_widget/index.ts @@ -18,7 +18,12 @@ limitations under the License. require("./index.scss"); import * as qs from 'querystring'; -import {ModalButtonKind, WidgetApi, WidgetApiToWidgetAction} from 'matrix-widget-api'; +import { + ModalButtonKind, + WidgetApi, + WidgetApiToWidgetAction, + IModalWidgetCloseNotificationRequest, +} from 'matrix-widget-api'; let widgetApi: WidgetApi; (async function() { @@ -38,9 +43,13 @@ let widgetApi: WidgetApi; const parentOrigin = new URL(qsParam('parentUrl')).origin; widgetApi = new WidgetApi(qsParam("widgetId"), parentOrigin); - widgetApi.addEventListener(WidgetApiToWidgetAction.CloseModalWidget, (req: CustomEvent) => { - document.getElementById("answer").innerText = "Response from Modal: " + JSON.stringify(req.detail); - }); + widgetApi.on(`action:${WidgetApiToWidgetAction.CloseModalWidget}`, + (ev: CustomEvent) => { + ev.preventDefault(); + document.getElementById("answer").innerText = "Response from Modal: " + JSON.stringify(ev.detail); + widgetApi.transport.reply(ev.detail, {}); // ack + }, + ); widgetApi.start(); diff --git a/src/vector/theme_widget/index.ts b/src/vector/theme_widget/index.ts index bad100e68a..fffaa33138 100644 --- a/src/vector/theme_widget/index.ts +++ b/src/vector/theme_widget/index.ts @@ -18,7 +18,12 @@ limitations under the License. require("./index.scss"); import * as qs from 'querystring'; -import {WidgetApi, WidgetApiToWidgetAction, IWidgetApiRequest} from 'matrix-widget-api'; +import { + WidgetApi, + WidgetApiToWidgetAction, + IModalWidgetButtonClickedRequest, + IModalWidgetOpenRequest, +} from 'matrix-widget-api'; let widgetApi: WidgetApi; (async function() { @@ -38,22 +43,26 @@ let widgetApi: WidgetApi; const parentOrigin = new URL(qsParam('parentUrl')).origin; widgetApi = new WidgetApi(qsParam("widgetId"), parentOrigin); - widgetApi.addEventListener( + widgetApi.on( `action:${WidgetApiToWidgetAction.ButtonClicked}`, - (ev: CustomEvent) => { + (ev: CustomEvent) => { + ev.preventDefault(); console.log("@@ clickety", ev.detail); document.getElementById("button").innerText = "BUTTON CLICKED: " + JSON.stringify(ev.detail.data); setTimeout(() => { widgetApi.closeModalWidget(ev.detail.data); }, 3000); + widgetApi.transport.reply(ev.detail, {}); // ack }, ); - widgetApi.addEventListener( + widgetApi.on( `action:${WidgetApiToWidgetAction.WidgetConfig}`, - (ev: CustomEvent) => { + (ev: CustomEvent) => { + ev.preventDefault(); console.log("Got widget config: ", ev.detail.data); document.getElementById("question").innerText = "INIT PARAMS: " + JSON.stringify(ev.detail.data); + widgetApi.transport.reply(ev.detail, {}); // ack }, ); widgetApi.start();