stash tweaks to the test widgets

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
Michael Telatynski 2020-09-28 12:28:59 +01:00
parent eb9a29cec5
commit 66bd562c21
4 changed files with 20 additions and 20 deletions

View file

@ -5,8 +5,7 @@
<title>Dummy Widget</title>
</head>
<body>
<button id="demoBtn">Click me to show a temp widget</button>
<p>This isn't using the neat theme stuff over the widget API</p>
<button id="demoBtn">Click me to show a modal widget</button>
<p id="answer"><!-- populated with js --></p>
</body>
</html>

View file

@ -18,7 +18,7 @@ limitations under the License.
require("./index.scss");
import * as qs from 'querystring';
import { Capability, KnownWidgetActions, WidgetApi } from 'matrix-react-sdk/src/widgets/WidgetApi';
import {ButtonKind, KnownWidgetActions, WidgetApi} from 'matrix-react-sdk/src/widgets/WidgetApi';
let widgetApi: WidgetApi;
(async function() {
@ -37,15 +37,19 @@ let widgetApi: WidgetApi;
// Set this up as early as possible because Element will be hitting it almost immediately.
widgetApi = new WidgetApi(qsParam('parentUrl'), qsParam('widgetId'), []);
widgetApi.on(KnownWidgetActions.ClosedWidgetResponse, req => {
document.getElementById("answer").innerText = "RESPONSE FROM TEMP WIDGET: " + JSON.stringify(req.data);
widgetApi.on(KnownWidgetActions.CloseModalWidget, req => {
document.getElementById("answer").innerText = "Response from Modal: " + JSON.stringify(req.data);
});
document.getElementById("demoBtn").onclick = () => {
const url = new URL(window.location.href);
url.pathname = "/theme_widget.html";
url.pathname = url.pathname.substr(0, url.pathname.lastIndexOf("/")) + "/theme_widget.html";
url.search = "";
widgetApi.openTempWidget(url.toString(), {question: "Answer to everything?"});
widgetApi.openModalWidget(url.toString(), "Test Modal Widget", [
{id: "m.close", kind: ButtonKind.Danger, label: "Danger"},
{id: "org.secondary", kind: ButtonKind.Secondary, label: "Secondary"},
{id: "org.primary", kind: ButtonKind.Primary, label: "Primary"},
], {question: "Answer to everything?"});
};
} catch (e) {
console.error("Error setting up Jitsi widget", e);

View file

@ -19,7 +19,7 @@
<div>
<h2>Metadata</h2>
<p id="question"><!-- populated with js --></p>
<p id="theme"><!-- populated with js --></p>
<p id="button"><!-- populated with js --></p>
</div>
</body>
</html>

View file

@ -37,24 +37,21 @@ let widgetApi: WidgetApi;
// Set this up as early as possible because Element will be hitting it almost immediately.
widgetApi = new WidgetApi(qsParam('parentUrl'), qsParam('widgetId'), []);
widgetApi.on(KnownWidgetActions.UpdateThemeInfo, (themeInfo) => {
console.log("Got theme info: ", themeInfo);
document.getElementById("theme").innerText = "THEME: " + JSON.stringify(themeInfo.data);
const clientName = themeInfo.data.clientName || "element-web";
const isDark = themeInfo.data.isDark || false;
const accentColour = themeInfo.data.accentColor || "#03b381";
document.body.className = `client-${clientName} ${isDark ? 'is-dark' : ''}`;
document.body.style.setProperty("--accent-color", accentColour);
widgetApi.on(KnownWidgetActions.ButtonClicked, req => {
console.log("@@ clickety", req);
document.getElementById("button").innerText = "BUTTON CLICKED: " + JSON.stringify(req.data);
setTimeout(() => {
widgetApi.closeModalWidget(req.data);
}, 3000);
});
widgetApi.on(KnownWidgetActions.SendWidgetConfig, (config) => {
widgetApi.on(KnownWidgetActions.GetWidgetConfig, (config) => {
console.log("Got widget config: ", config);
document.getElementById("question").innerText = "INIT PARAMS: " + JSON.stringify(config.data);
});
document.getElementById("closeButton").onclick = () => {
widgetApi.closeWidget({answer: 42});
widgetApi.closeModalWidget({answer: 42});
};
} catch (e) {
console.error("Error setting up Jitsi widget", e);