mirror of
https://github.com/mickael-kerjean/filestash
synced 2026-01-04 14:52:36 +01:00
feature (postMessage): iframe RPC via postMessage
This commit is contained in:
parent
b787403a1e
commit
f268d27967
2 changed files with 41 additions and 11 deletions
|
|
@ -3,6 +3,7 @@ import rxjs, { effect } from "../../lib/rx.js";
|
|||
import { loadCSS } from "../../helpers/loader.js";
|
||||
import notification from "../../components/notification.js";
|
||||
import t from "../../locales/index.js";
|
||||
import ctrlError from "../ctrl_error.js";
|
||||
|
||||
import { getCurrentPath } from "./common.js";
|
||||
|
||||
|
|
@ -16,16 +17,28 @@ export default function(render, { endpoint = "" }) {
|
|||
|
||||
effect(rxjs.fromEvent(window, "message").pipe(
|
||||
rxjs.filter((event) => event.origin === location.origin),
|
||||
rxjs.tap((event) => {
|
||||
switch (event.data.type) {
|
||||
case "notify::info":
|
||||
notification.info(t(event.data.message));
|
||||
break;
|
||||
rxjs.map((event) => JSON.parse(event.data)),
|
||||
rxjs.tap(({ type, msg }) => {
|
||||
switch (type) {
|
||||
case "error":
|
||||
throw new Error(msg);
|
||||
case "notify::error":
|
||||
notification.error(t(event.data.message));
|
||||
notification.error(t(msg));
|
||||
break;
|
||||
case "notify::info":
|
||||
notification.info(t(msg));
|
||||
break;
|
||||
case "notify::success":
|
||||
notification.success(t(msg));
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}),
|
||||
rxjs.catchError((err) => {
|
||||
notification.error(t(err.message));
|
||||
return ctrlError()(err);
|
||||
}),
|
||||
));
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -131,17 +131,34 @@ func IframeContentHandler(ctx *App, res http.ResponseWriter, req *http.Request)
|
|||
<body>
|
||||
<style> body { margin: 0; } body, html{ height: 100%; } iframe { width: 100%; height: 100%; background: white; } </style>
|
||||
<iframe frameborder="0" src="{{ .server }}" class="hidden"></iframe>
|
||||
|
||||
<script type="module" src="/assets/components/loader.js"></script>
|
||||
<component-loader />
|
||||
<script>
|
||||
const postChild = (data) => $iframe.contentWindow.postMessage(JSON.stringify(data), "*");
|
||||
const postParent = (data) => window.parent.postMessage(JSON.stringify(data));
|
||||
|
||||
const $iframe = document.querySelector("iframe");
|
||||
window.post = (data) => $iframe.contentWindow.postMessage(JSON.stringify(data), "*");
|
||||
$iframe.onerror = () => postParent({type: "error", msg: "Not Found" });
|
||||
|
||||
window.addEventListener("message", (event) => {
|
||||
let msg = JSON.parse(event.data);
|
||||
if (!msg) return;
|
||||
if (msg.MessageId === "App_LoadingStatus" && msg.Values.Status === "Initialized") {
|
||||
requestAnimationFrame(() => $iframe.classList.remove("hidden"));
|
||||
post({ MessageId: "Host_PostmessageReady" });
|
||||
switch(msg.MessageId) {
|
||||
case "App_LoadingStatus": if (msg.Values.Status === "Initialized") {
|
||||
postChild({ MessageId: "Host_PostmessageReady" });
|
||||
requestAnimationFrame(() => $iframe.classList.remove("hidden"));
|
||||
document.querySelector("component-loader").remove();
|
||||
}
|
||||
break;
|
||||
case "Action_Load_Resp": if (msg.Values.errorMsg) {
|
||||
postParent({ type: "error", msg: msg.Values.errorMsg });
|
||||
}
|
||||
break;
|
||||
default:
|
||||
console.log("postMessage:", msg);
|
||||
break;
|
||||
}
|
||||
console.log("MESSAGE WINDOW", msg); // TODO: loader handling
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
|
|
|
|||
Loading…
Reference in a new issue