@missing-elements/h5p-embed 0.3.1 → 0.3.2

package/README.md

@@ -66,6 +66,7 @@ It works at a domain's root or under a path, over https. Serve `h5p-sw.js` with
 | `preload=auto` | Start fetching media at once |
 | `activity-id=<IRI>` | The xAPI object id, instead of the package URL |
 | `custom-css=<url>` | A stylesheet loaded into the content |
+| `lang=<tag>` | The language of H5P's own buttons and dialogs, such as `de` or `pt-BR`. Default: English |
 | `xapi=<origin>` | Relay statements to the embedding page |
 
 A custom script and a learner's name cannot be set on the address. Opened unframed, the page asks

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@missing-elements/h5p-embed",
-  "version": "0.3.1",
+  "version": "0.3.2",
   "description": "Self-hosted H5P embeds: writes the H5P embed page as a static site for a player domain of your own, then any site frames it with an iframe and one script line. No H5P server, no third-party service; optional allowlists for package hosts and embedding sites.",
   "license": "MIT",
   "repository": {
@@ -44,8 +44,8 @@
   ],
   "dependencies": {
     "@missing-elements/h5p-libraries": "^0.1.1",
-    "@missing-elements/h5p-offline-player": "^0.6.1",
-    "@missing-elements/h5p-runtime": "^0.1.1"
+    "@missing-elements/h5p-offline-player": "^0.6.2",
+    "@missing-elements/h5p-runtime": "^0.1.2"
   },
   "devDependencies": {
     "@types/node": "^26.6.4",

package/site/embed.js

@@ -7,7 +7,7 @@
  *
  *   ?src=<package url>[&libraries=pack|<url> …|none][&preload=auto][&xapi=<parent origin>]
  *    [&frame][&copyright][&export][&icon][&reporting][&fullscreen=off]
- *    [&activity-id=<IRI>][&custom-css=<stylesheet url>]
+ *    [&activity-id=<IRI>][&custom-css=<stylesheet url>][&lang=<language tag>]
  *
  * Upward it speaks H5P's own resizer protocol — the `hello` / `resize` exchange that h5p.org's
  * embed code and its `h5p-resizer.js` use — so a page that already resizes h5p.org iframes
@@ -243,9 +243,10 @@ export function startEmbed({ librariesPack = null, packages = null, defaultLibra
    * The element's display options, by their attribute names, for the embedding page to ask for:
    * `&frame&copyright&export` shows H5P's action bar with those buttons, `&fullscreen=off` takes
    * that one away, `&activity-id=` names the statements' object and `&custom-css=` restyles the
-   * content to the embedding site's taste. Not `custom-js`, `embed-code` or `user`: a script is
-   * a capability on this origin that a link should not hand out, the embed is the embed, and a
-   * learner's name has no place in a URL.
+   * content to the embedding site's taste. `&lang=` is the embedding page's language, which this
+   * page cannot read across origins: H5P's own buttons and dialogs follow it. Not `custom-js`,
+   * `embed-code` or `user`: a script is a capability on this origin that a link should not hand
+   * out, the embed is the embed, and a learner's name has no place in a URL.
    */
   const applyOptions = () => {
     for (const name of ['frame', 'copyright', 'export', 'icon', 'reporting']) {
@@ -256,6 +257,8 @@ export function startEmbed({ librariesPack = null, packages = null, defaultLibra
       const value = params.get(name)?.trim()
       if (value) player.setAttribute(name, value)
     }
+    const lang = params.get('lang')?.trim().replaceAll('_', '-')
+    if (lang && /^[A-Za-z]{2,8}(?:-[A-Za-z0-9]{1,8})*$/.test(lang)) player.setAttribute('lang', lang)
   }
 
   const start = (value, libraries) => {