hyperbook 0.49.4 → 0.50.1

package/dist/assets/directive-geogebra/client.js

@@ -0,0 +1,37 @@
+hyperbook.geogebra = (function () {
+  async function init(root) {
+    const els = root.getElementsByTagName("hyperbook-geogebra");
+    for (const el of els) {
+      const id = el.getAttribute("data-id");
+
+      const result = await store.geogebra.get(id);
+      if (result && result.state) {
+        el.setBase64(result.state);
+      }
+
+      el.registerUpdateListener(() => {
+        el.getBase64((b) => {
+          store.geogebra.put({ id, state: b });
+        });
+      });
+    }
+  }
+
+  const observer = new MutationObserver((mutations) => {
+    mutations.forEach((mutation) => {
+      mutation.addedNodes.forEach((node) => {
+        if (
+          node.nodeType === 1 &&
+          node.classList.contains("directive-geogebra")
+        ) {
+          // Element node
+          init(node);
+        }
+      });
+    });
+  });
+
+  observer.observe(document.body, { childList: true, subtree: true });
+
+  init(document);
+})();

package/dist/assets/directive-geogebra/style.css

@@ -1,10 +1,3 @@
 .directive-geogebra {
-  display: flex;
-  justify-content: center;
-  margin-bottom: 12px;
-}
-
-.directive-geogebra hyperbook-geogebra {
-  overflow: hidden;
-  border-radius: 8px;
+  margin: 12px auto;
 }

package/dist/assets/directive-h5p/client.js

@@ -0,0 +1,55 @@
+hyperbook.h5p = (function () {
+  /**
+   * Initialize H5P elements within the given root element.
+   * @param {HTMLElement} [root=document] - The root element to initialize.
+   */
+
+  const save = (id) =>
+    H5P.getUserData(id, "state", (error, userData) => {
+      if (!error) {
+        store.h5p.put({ id, userData });
+      }
+    });
+
+  const init = async (root) => {
+    const els = root.getElementsByClassName("directive-h5p");
+    const assets = `${HYPERBOOK_ASSETS}directive-h5p`;
+
+    const h5pBaseOptions = {
+      frameJs: `${assets}/frame.bundle.js`,
+      frameCss: `${assets}/styles/h5p.css`,
+      librariesPath: `${assets}/libraries`,
+      saveFreq: 1,
+      contentUserData: undefined,
+      frame: false,
+      copyright: false,
+      export: false,
+      icon: false,
+      embed: false,
+    };
+
+    for (const el of els) {
+      const h5pFrame = el.querySelector(".h5p-frame");
+      const src = el.getAttribute("data-src");
+      const id = el.getAttribute("data-id");
+      if (h5pFrame && src) {
+        const result = await store.h5p.get(id);
+        const h5pOptions = {
+          ...h5pBaseOptions,
+          id,
+          h5pJsonPath: src,
+          contentUserData: result
+            ? [{ state: JSON.stringify(result.userData) }]
+            : undefined,
+        };
+
+        new H5PStandalone.H5P(h5pFrame, h5pOptions);
+
+        // save from time to time
+        setInterval(() => save(id), 1000);
+      }
+    }
+  };
+
+  init(document);
+})();