2024-04-24 15:56:11 +00:00
|
|
|
|
import QuizAnswerer from "@/components/QuizAnswerer";
|
|
|
|
|
import { Root, createRoot } from "react-dom/client";
|
2024-05-04 16:18:56 +00:00
|
|
|
|
import { pollForSelector } from "../shared/pollForSelector";
|
2024-04-24 15:56:11 +00:00
|
|
|
|
|
|
|
|
|
|
|
|
|
|
export class ContainerWidget {
|
|
|
|
|
root: Root | undefined;
|
|
|
|
|
|
2024-04-28 13:25:59 +00:00
|
|
|
|
constructor({ selector, quizId, selectorPollingTimeLimit = 60 }: {
|
2024-04-24 15:56:11 +00:00
|
|
|
|
quizId: string;
|
|
|
|
|
selector: string;
|
2024-04-28 13:25:59 +00:00
|
|
|
|
/**
|
|
|
|
|
* In seconds, null - polling disabled
|
|
|
|
|
*/
|
|
|
|
|
selectorPollingTimeLimit?: number | null;
|
2024-04-24 15:56:11 +00:00
|
|
|
|
}) {
|
2024-04-25 14:06:42 +00:00
|
|
|
|
const element = document.querySelector(selector);
|
2024-04-28 13:25:59 +00:00
|
|
|
|
if (element) {
|
|
|
|
|
this.root = createRoot(element);
|
|
|
|
|
this.root.render(
|
|
|
|
|
<QuizAnswerer
|
|
|
|
|
quizId={quizId}
|
|
|
|
|
changeFaviconAndTitle={false}
|
|
|
|
|
disableGlobalCss
|
|
|
|
|
/>
|
|
|
|
|
);
|
2024-04-24 15:56:11 +00:00
|
|
|
|
|
2024-04-28 13:25:59 +00:00
|
|
|
|
return;
|
|
|
|
|
}
|
2024-04-24 15:56:11 +00:00
|
|
|
|
|
2024-04-28 13:25:59 +00:00
|
|
|
|
if (!selectorPollingTimeLimit) {
|
|
|
|
|
console.error(`Не удалось найти элемент ${selector} для вставки виджета`);
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
pollForSelector(selector, selectorPollingTimeLimit, (element) => {
|
|
|
|
|
this.root = createRoot(element);
|
|
|
|
|
this.root.render(
|
|
|
|
|
<QuizAnswerer
|
|
|
|
|
quizId={quizId}
|
|
|
|
|
changeFaviconAndTitle={false}
|
|
|
|
|
disableGlobalCss
|
|
|
|
|
/>
|
|
|
|
|
);
|
|
|
|
|
});
|
2024-04-24 15:56:11 +00:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
destroy() {
|
|
|
|
|
if (this.root) this.root.unmount();
|
|
|
|
|
}
|
|
|
|
|
}
|