Export Web/SCORM : port complet du runtime jouable côté navigateur
Phase 1.2 de la feuille de route produit — un paquet SCORM tourne seul dans le LMS du client, sans serveur Forge Engine disponible. Ajoute static/js/play/offline/ (miroir JS de screens/rendering/ et data_actions/, sous window.FORGE_OFFLINE) pour que variables, score, données d'objet, répéteurs et conditions de visibilité fonctionnent entièrement en mémoire côté navigateur ; branche actions.js et bindings.js dessus au lieu d'un fetch() serveur. Ajoute publish/build_scorm_package.py (paquet statique + imsmanifest.xml SCORM 1.2 + wrapper API SCORM) et le bouton "Exporter (Web/SCORM)". Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
william
co-authored by
Claude Sonnet 5
Claude Sonnet 5
parent
9776fbc057
commit
f3b72d73c9
@@ -0,0 +1,143 @@
|
||||
// Export Web/SCORM (voir le plan "port complet du runtime jouable côté
|
||||
// navigateur") — étape 4 : port des widgets à "special_render" les plus
|
||||
// simples (screens/rendering/render_checkbox_or_radio.py, render_select.py,
|
||||
// render_fieldset.py, render_table.py, render_icone.py, render_onglets.py).
|
||||
// Jauge/Superposition/Personnage/Répéteur (logique/données plus lourde)
|
||||
// vivent dans des fichiers dédiés (render-jauge.js, render-repeater.js).
|
||||
// Dépend de render-element.js (forgeVisibleAttrs/forgeStyleString/
|
||||
// forgeAttrString/forgeApplyCtx/forgeHtmlEscape/forgeAutoId/
|
||||
// forgeParentFlexDirection/forgeRenderChildren), chargé avant ce fichier.
|
||||
|
||||
function forgeRenderCheckboxOrRadio(el, meta, gameData, childrenMap, ctx, parentFlexDirection) {
|
||||
var inputType = el.widget === "case_a_cocher" ? "checkbox" : "radio";
|
||||
var attrs = forgeVisibleAttrs(el, meta, ctx);
|
||||
attrs.type = inputType;
|
||||
var style = forgeStyleString(el, parentFlexDirection, el.widget) + " display:flex; align-items:center; gap:8px;";
|
||||
var content = forgeApplyCtx(el.content || "", ctx);
|
||||
return '<label ' + forgeAttrString({ class: inputType }, style) + '><input ' + forgeAttrString(attrs, "") + '> ' + forgeHtmlEscape(content) + '</label>';
|
||||
}
|
||||
|
||||
function forgeRenderSelect(el, meta, gameData, childrenMap, ctx, parentFlexDirection) {
|
||||
var outerAttrs = forgeVisibleAttrs(el, meta, ctx);
|
||||
var bulmaClasses = outerAttrs.class || "";
|
||||
var selectAttrs = {}, wrapperAttrs = {};
|
||||
Object.keys(outerAttrs).forEach(function (k) {
|
||||
if (k === "id" || k === "data-element-id" || k === "data-anim-target") wrapperAttrs[k] = outerAttrs[k];
|
||||
else if (k !== "class") selectAttrs[k] = outerAttrs[k];
|
||||
});
|
||||
var style = forgeStyleString(el, parentFlexDirection, el.widget) + " display:flex;";
|
||||
var content = forgeApplyCtx(el.content || "", ctx);
|
||||
var options = content.split("\n").map(function (o) { return o.trim(); }).filter(Boolean);
|
||||
var optsHtml = options.map(function (o) {
|
||||
var esc = forgeHtmlEscape(o);
|
||||
return '<option value="' + esc + '">' + esc + '</option>';
|
||||
}).join("");
|
||||
var selectHtml = '<select ' + forgeAttrString(selectAttrs, "") + '>' + optsHtml + '</select>';
|
||||
var selectWrapClass = forgeHtmlEscape(("select is-fullwidth " + bulmaClasses).trim());
|
||||
return '<div ' + forgeAttrString(wrapperAttrs, style) + '><div class="' + selectWrapClass + '">' + selectHtml + '</div></div>';
|
||||
}
|
||||
|
||||
function forgeRenderFieldset(el, meta, gameData, childrenMap, ctx, parentFlexDirection) {
|
||||
var attrs = forgeVisibleAttrs(el, meta, ctx);
|
||||
var style = forgeStyleString(el, parentFlexDirection, el.widget);
|
||||
var content = forgeApplyCtx(el.content || "", ctx) || "Groupe de champs";
|
||||
var childHtml = forgeRenderChildren(el, gameData, childrenMap, ctx);
|
||||
return '<fieldset ' + forgeAttrString(attrs, style) + '><legend>' + forgeHtmlEscape(content) + '</legend>' + childHtml + '</fieldset>';
|
||||
}
|
||||
|
||||
function forgeRenderTable(el, meta, gameData, childrenMap, ctx, parentFlexDirection) {
|
||||
var attrs = forgeVisibleAttrs(el, meta, ctx);
|
||||
var headerRow = ["1", "true", "on"].indexOf((el.attributes || {})._header_row) !== -1;
|
||||
var content = forgeApplyCtx(el.content || "", ctx);
|
||||
var style = forgeStyleString(el, parentFlexDirection, el.widget);
|
||||
var rows = content.split("\n").filter(function (r) { return r.trim(); });
|
||||
var htmlRows = rows.map(function (r, i) {
|
||||
var cells = r.split(";");
|
||||
var cellTag = (headerRow && i === 0) ? "th" : "td";
|
||||
var cellsHtml = cells.map(function (c) {
|
||||
return "<" + cellTag + ">" + forgeHtmlEscape(c.trim()) + "</" + cellTag + ">";
|
||||
}).join("");
|
||||
return "<tr>" + cellsHtml + "</tr>";
|
||||
}).join("");
|
||||
return '<table ' + forgeAttrString(attrs, style) + '>' + htmlRows + '</table>';
|
||||
}
|
||||
|
||||
function forgeRenderIcone(el, meta, gameData, childrenMap, ctx, parentFlexDirection) {
|
||||
// Contrairement au serveur, ne revalide pas _icon_slug contre le
|
||||
// catalogue curaté (screens/widgets/fontawesome_icons.py) : une valeur
|
||||
// invalide ne peut être enregistrée que depuis l'éditeur, qui la valide
|
||||
// déjà à la sauvegarde — un jeu EXPORTÉ n'en produit jamais.
|
||||
var rawAttrs = el.attributes || {};
|
||||
var iconSlug = rawAttrs._icon_slug || "star";
|
||||
var attrs = forgeVisibleAttrs(el, meta, ctx);
|
||||
var existingClass = attrs.class || "";
|
||||
delete attrs.class;
|
||||
attrs.class = (existingClass + " icon-svg").trim();
|
||||
var iconUrl = "/static/icons/" + iconSlug + ".svg";
|
||||
var style = forgeStyleString(el, parentFlexDirection, el.widget) + " --icon-url:url('" + iconUrl + "');";
|
||||
return "<i " + forgeAttrString(attrs, style) + "></i>";
|
||||
}
|
||||
|
||||
function forgeRenderOnglets(el, meta, gameData, childrenMap, ctx, parentFlexDirection) {
|
||||
var tabs = (childrenMap && childrenMap[el.id]) || [];
|
||||
var attrs = forgeVisibleAttrs(el, meta, ctx);
|
||||
var tabsExtraClasses = attrs.class || "";
|
||||
delete attrs.class;
|
||||
var style = forgeStyleString(el, parentFlexDirection, el.widget) + " display:flex; flex-direction:column;";
|
||||
var groupId = forgeAutoId(el);
|
||||
|
||||
if (!tabs.length) {
|
||||
return '<div ' + forgeAttrString(attrs, style) + '><em style="opacity:.6;">Onglets — ajoute au moins un onglet dans ses réglages.</em></div>';
|
||||
}
|
||||
|
||||
var flexDir = forgeParentFlexDirection(el);
|
||||
var barItems = [], panels = [];
|
||||
tabs.forEach(function (tab, i) {
|
||||
var label = tab.name || ("Onglet " + (i + 1));
|
||||
var active = i === 0;
|
||||
var tabHtml = forgeRenderElementHtml(tab, gameData, childrenMap, ctx, flexDir);
|
||||
var targetId = "tabpanel-" + tab.id;
|
||||
barItems.push(
|
||||
'<li class="' + (active ? "is-active" : "") + '" data-tab-btn="' + groupId + '" data-tab-target="' + targetId +
|
||||
'" onclick="forgeShowTab(this)"><a>' + forgeHtmlEscape(String(label)) + '</a></li>'
|
||||
);
|
||||
var hiddenStyle = active ? "" : ' style="display:none;"';
|
||||
panels.push('<div class="forgeTabPanel" id="' + targetId + '" data-tab-group="' + groupId + '"' + hiddenStyle + '>' + tabHtml + '</div>');
|
||||
});
|
||||
|
||||
var tabsClass = forgeHtmlEscape(("tabs " + tabsExtraClasses).trim());
|
||||
return (
|
||||
'<div ' + forgeAttrString(attrs, style) + '>' +
|
||||
'<div class="' + tabsClass + '"><ul>' + barItems.join("") + '</ul></div>' +
|
||||
'<div class="forgeTabPanels" style="flex:1 1 auto; min-height:0;">' + panels.join("") + '</div>' +
|
||||
'</div>'
|
||||
);
|
||||
}
|
||||
|
||||
// Port de render_personnage.py — lit directement gameData.personnage_animations
|
||||
// (déjà résolu une fois par full_game_payload.py, à l'export) au lieu de
|
||||
// re-résoudre la bibliothèque de sprites Forge/l'URL personnalisée : ce
|
||||
// travail est fait UNE fois, à la génération du paquet, jamais à chaque
|
||||
// rendu côté client.
|
||||
function forgeRenderPersonnage(el, meta, gameData, childrenMap, ctx, parentFlexDirection) {
|
||||
var attrs = forgeVisibleAttrs(el, meta, ctx);
|
||||
attrs["data-personnage"] = "1";
|
||||
var animations = gameData.personnage_animations && gameData.personnage_animations[String(el.id)];
|
||||
var frames = animations ? (animations.idle || animations[Object.keys(animations)[0]]) : null;
|
||||
var idleFrame = frames && frames.length ? frames[0] : "";
|
||||
if (idleFrame) attrs.src = idleFrame;
|
||||
var style = forgeStyleString(el, parentFlexDirection, el.widget);
|
||||
return "<img " + forgeAttrString(attrs, style) + ">";
|
||||
}
|
||||
|
||||
if (typeof module !== 'undefined' && module.exports) {
|
||||
module.exports = {
|
||||
forgeRenderCheckboxOrRadio, forgeRenderSelect, forgeRenderFieldset, forgeRenderTable,
|
||||
forgeRenderIcone, forgeRenderOnglets, forgeRenderPersonnage,
|
||||
};
|
||||
var renderMod = require('./render-element.js');
|
||||
["forgeVisibleAttrs", "forgeStyleString", "forgeAttrString", "forgeApplyCtx", "forgeHtmlEscape",
|
||||
"forgeAutoId", "forgeParentFlexDirection", "forgeRenderChildren", "forgeRenderElementHtml"].forEach(function (name) {
|
||||
global[name] = global[name] || renderMod[name];
|
||||
});
|
||||
}
|
||||
Reference in New Issue
Block a user