tessera-learn 0.0.1 → 0.0.2

package/src/runtime/App.svelte

@@ -29,6 +29,8 @@
   const nav = new NavigationState(manifest, progress, config);
   let duration = $state(new DurationTracker(0));
 
+  const gradedQuizIndices = manifest.pages.filter(p => p.quiz?.graded).map(p => p.index);
+
   // Page loading state
   let PageComponent = $state(null);
   let pageLoading = $state(true);
@@ -125,21 +127,18 @@
   }
 
   // ---- Branding ----
-  function parseColor(ctx, color) {
-    ctx.fillStyle = '#000';
-    ctx.fillStyle = color;
-    if (ctx.fillStyle === '#000000'
-        && color.trim().toLowerCase() !== '#000000'
-        && color.trim().toLowerCase() !== '#000'
-        && color.trim().toLowerCase() !== 'black') {
+  function parseColor(color) {
+    if (typeof CSS !== 'undefined' && CSS.supports && !CSS.supports('color', color)) {
       return null;
     }
-    const hex = ctx.fillStyle;
-    return {
-      r: parseInt(hex.slice(1, 3), 16),
-      g: parseInt(hex.slice(3, 5), 16),
-      b: parseInt(hex.slice(5, 7), 16),
-    };
+    const el = document.createElement('span');
+    el.style.color = color;
+    document.documentElement.appendChild(el);
+    const computed = getComputedStyle(el).color;
+    el.remove();
+    const match = computed.match(/^rgba?\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)/);
+    if (!match) return null;
+    return { r: +match[1], g: +match[2], b: +match[3] };
   }
 
   function rgbToHsl(r, g, b) {
@@ -160,11 +159,7 @@
     const el = document.documentElement;
     if (cfg.branding?.primaryColor) {
       el.style.setProperty('--tessera-primary', cfg.branding.primaryColor);
-      // Create the canvas once here rather than inside parseColor to avoid
-      // allocating a new element for every color resolved.
-      const canvas = document.createElement('canvas');
-      const ctx = canvas.getContext('2d');
-      const rgb = ctx ? parseColor(ctx, cfg.branding.primaryColor) : null;
+      const rgb = parseColor(cfg.branding.primaryColor);
       if (rgb) {
         const hsl = rgbToHsl(rgb.r, rgb.g, rgb.b);
         el.style.setProperty('--tessera-primary-light', `hsl(${hsl.h}, ${Math.min(hsl.s + 10, 100)}%, 90%)`);
@@ -297,14 +292,14 @@
   $effect(() => {
     const scores = progress.quizScores;
     if (!persistenceReady || scores.size === 0) return;
+    if (gradedQuizIndices.length === 0) return;
 
-    const gradedQuizIndices = manifest.pages.filter(p => p.quiz?.graded).map(p => p.index);
     const completedGraded = gradedQuizIndices.filter(i => scores.has(i));
     if (completedGraded.length === 0) return;
 
     // Divide by total graded count — incomplete quizzes count as 0, matching
     // the recalculateSuccess logic in progress.svelte.ts.
-    const average = completedGraded.reduce((sum, i) => sum + scores.get(i), 0) / gradedQuizIndices.length;
+    const average = completedGraded.reduce((sum, i) => sum + (scores.get(i) ?? 0), 0) / gradedQuizIndices.length;
 
     untrack(() => {
       adapter.setScore(Math.round(average));

package/src/runtime/ErrorPage.svelte

@@ -8,7 +8,7 @@
   {#if error?.message}
     <p><small>{error.message}</small></p>
   {/if}
-  <button class="tessera-error-retry" onclick={onretry}>
+  <button class="tessera-btn-primary tessera-error-retry" onclick={onretry}>
     Retry
   </button>
 </div>

package/src/runtime/adapters/retry.ts

@@ -10,6 +10,42 @@ export interface LMSErrorReporter {
   message(code: string): string;
 }
 
+/** Default attempt count for LMS retry loops (one initial + two retries). */
+export const RETRY_ATTEMPTS = 3;
+
+/** Exponential backoff (0-indexed): 100, 200, 400, … ms. */
+export function backoffMs(attempt: number): number {
+  return 100 * Math.pow(2, attempt);
+}
+
+// SCORM SetValue may return string "false" or boolean false; everything else is success.
+function lmsCallSucceeded(result: unknown): boolean {
+  return result !== false && result !== 'false';
+}
+
+function readLastErrorCode(reporter: LMSErrorReporter | undefined): string {
+  if (!reporter) return '';
+  try { return reporter.code(); } catch { return ''; }
+}
+
+function logRetryGiveUp(
+  errorReporter: LMSErrorReporter | undefined,
+  lastErrCode: string,
+  context: string | undefined
+): void {
+  let detail = '';
+  if (errorReporter && lastErrCode && lastErrCode !== '0') {
+    try {
+      const msg = errorReporter.message(lastErrCode);
+      detail = ` (LMS error ${lastErrCode}${msg ? `: ${msg}` : ''})`;
+    } catch {}
+  }
+  const ctx = context ? ` [${context}]` : '';
+  console.warn(
+    `Tessera: LMS call failed after retries${ctx}${detail}, continuing without persistence`
+  );
+}
+
 /**
  * Retry wrapper for LMS API calls.
  * Retries up to maxRetries times with exponential backoff.
@@ -27,36 +63,23 @@ export interface LMSErrorReporter {
  */
 export async function withRetry(
   fn: () => any,
-  maxRetries = 3,
+  maxRetries = RETRY_ATTEMPTS,
   errorReporter?: LMSErrorReporter,
   context?: string
 ): Promise<boolean> {
   let lastErrCode = '';
   for (let attempt = 0; attempt < maxRetries; attempt++) {
     try {
-      const result = fn();
-      if (result !== false && result !== 'false') return true;
+      if (lmsCallSucceeded(fn())) return true;
     } catch {
       // API call threw — treat as failure
     }
-    if (errorReporter) {
-      try { lastErrCode = errorReporter.code(); } catch {}
-    }
+    lastErrCode = readLastErrorCode(errorReporter);
     if (attempt < maxRetries - 1) {
-      await new Promise((r) => setTimeout(r, 100 * Math.pow(2, attempt)));
+      await new Promise((r) => setTimeout(r, backoffMs(attempt)));
     }
   }
-  let detail = '';
-  if (errorReporter && lastErrCode && lastErrCode !== '0') {
-    try {
-      const msg = errorReporter.message(lastErrCode);
-      detail = ` (LMS error ${lastErrCode}${msg ? `: ${msg}` : ''})`;
-    } catch {}
-  }
-  const ctx = context ? ` [${context}]` : '';
-  console.warn(
-    `Tessera: LMS call failed after retries${ctx}${detail}, continuing without persistence`
-  );
+  logRetryGiveUp(errorReporter, lastErrCode, context);
   return false;
 }
 
@@ -66,8 +89,7 @@ export async function withRetry(
  */
 export function callSync(fn: () => any): boolean {
   try {
-    const result = fn();
-    return result !== false && result !== 'false';
+    return lmsCallSucceeded(fn());
   } catch {
     return false;
   }
@@ -122,8 +144,6 @@ export class WriteQueue {
     this.#flushing = true;
     this.#aborted = false;
 
-    const MAX_ATTEMPTS = 3;
-
     while (this.#queue.length > 0) {
       if (this.#aborted) {
         this.#flushing = false;
@@ -134,11 +154,10 @@ export class WriteQueue {
       let succeeded = false;
       let lastErrCode = '';
 
-      for (let attempt = 0; attempt < MAX_ATTEMPTS; attempt++) {
+      for (let attempt = 0; attempt < RETRY_ATTEMPTS; attempt++) {
         let ok = false;
         try {
-          const result = entry.fn();
-          ok = result !== false && result !== 'false';
+          ok = lmsCallSucceeded(entry.fn());
         } catch {
           // API call threw — treat as failure
         }
@@ -146,15 +165,13 @@ export class WriteQueue {
           succeeded = true;
           break;
         }
-        if (this.errorReporter) {
-          try { lastErrCode = this.errorReporter.code(); } catch {}
-        }
-        if (attempt < MAX_ATTEMPTS - 1) {
+        lastErrCode = readLastErrorCode(this.errorReporter);
+        if (attempt < RETRY_ATTEMPTS - 1) {
           // The next attempt is gated on a backoff timer that won't fire
           // during page unload. Mark in-flight so drainSync can re-run
           // the entry synchronously if it interrupts here.
           this.#inFlight = entry;
-          await new Promise((r) => setTimeout(r, 100 * Math.pow(2, attempt)));
+          await new Promise((r) => setTimeout(r, backoffMs(attempt)));
           this.#inFlight = null;
           if (this.#aborted) {
             this.#flushing = false;
@@ -164,17 +181,7 @@ export class WriteQueue {
       }
 
       if (!succeeded) {
-        let detail = '';
-        if (this.errorReporter && lastErrCode && lastErrCode !== '0') {
-          try {
-            const msg = this.errorReporter.message(lastErrCode);
-            detail = ` (LMS error ${lastErrCode}${msg ? `: ${msg}` : ''})`;
-          } catch {}
-        }
-        const ctx = entry.context ? ` [${entry.context}]` : '';
-        console.warn(
-          `Tessera: LMS call failed after retries${ctx}${detail}, continuing without persistence`
-        );
+        logRetryGiveUp(this.errorReporter, lastErrCode, entry.context);
         this.#queue.unshift(entry);
         this.#flushing = false;
         return;

package/src/runtime/adapters/scorm-base.ts

@@ -0,0 +1,143 @@
+import type { PersistenceAdapter, SavedState } from '../persistence.js';
+import type { Interaction } from '../interaction.js';
+import { buildScormInteractionFields } from '../interaction-format.js';
+import { WriteQueue, callSync, withRetry } from './retry.js';
+
+/** Per-version differences shared between SCORM 1.2 and SCORM 2004 adapters. */
+export interface ScormDialect<TApi> {
+  /** SCORM 1.2: `cmi.core.session_time`. SCORM 2004: `cmi.session_time`. */
+  sessionTimeKey: string;
+  /** Format `seconds` for the session-time field — HHMMSS for 1.2, ISO8601 for 2004. */
+  formatDuration(seconds: number): string;
+  /** Per-interaction-row field config passed to `buildScormInteractionFields`. */
+  interactionFields: {
+    responseField: 'student_response' | 'learner_response';
+    timestampField: 'time' | 'timestamp';
+    /** Build the per-call timestamp string (HH:MM:SS for 1.2, ISO8601 for 2004). */
+    timestamp(): string;
+    typeValue(type: Interaction['type']): string;
+    resultLabels: { correct: string; incorrect: string };
+  };
+  /** API method wrappers — abstract over the `LMS*`-prefixed and bare names. */
+  initialize(api: TApi): string;
+  terminate(api: TApi): string;
+  getValue(api: TApi, key: string): string;
+  setValue(api: TApi, key: string, value: string): string;
+  commit(api: TApi): string;
+  getLastError(api: TApi): string;
+  getErrorString(api: TApi, code: string): string;
+}
+
+export abstract class BaseScormAdapter<TApi> implements PersistenceAdapter {
+  protected readonly api: TApi;
+  protected readonly dialect: ScormDialect<TApi>;
+  protected readonly queue = new WriteQueue();
+  #state: SavedState | null = null;
+  #terminated = false;
+  protected interactionCount = 0;
+
+  constructor(api: TApi, dialect: ScormDialect<TApi>) {
+    this.api = api;
+    this.dialect = dialect;
+    // Wire up GetLastError/GetErrorString so retry warnings can name the
+    // real LMS failure (e.g. "201 Invalid argument error") instead of a
+    // generic "LMS call failed" — production triage needs the code.
+    this.queue.errorReporter = {
+      code: () => this.dialect.getLastError(this.api),
+      message: (c) => this.dialect.getErrorString(this.api, c),
+    };
+  }
+
+  /** Expose the underlying SCORM API so xAPI actor synthesis can read learner fields. */
+  getAPI(): TApi {
+    return this.api;
+  }
+
+  async init(): Promise<void> {
+    await withRetry(() => this.dialect.initialize(this.api));
+
+    try {
+      const raw = this.dialect.getValue(this.api, 'cmi.suspend_data');
+      if (raw && raw.trim()) {
+        this.#state = JSON.parse(raw);
+      }
+    } catch {
+      this.#state = null;
+    }
+
+    // Continue cmi.interactions.n indexing where the previous session left
+    // off. Restarting at 0 would overwrite prior records (the LMS uses n
+    // as the array key, not an upsert field).
+    try {
+      const count = this.dialect.getValue(this.api, 'cmi.interactions._count');
+      const n = parseInt(count, 10);
+      if (Number.isFinite(n) && n >= 0) this.interactionCount = n;
+    } catch {
+      // Some LMSes throw on _count when no interactions exist — fall back to 0.
+    }
+  }
+
+  getState(): SavedState | null {
+    return this.#state;
+  }
+
+  saveState(state: SavedState): void {
+    this.#state = state;
+    const json = JSON.stringify(state);
+    this.queue.enqueue(() =>
+      this.dialect.setValue(this.api, 'cmi.suspend_data', json)
+    );
+  }
+
+  setDuration(seconds: number): void {
+    const formatted = this.dialect.formatDuration(seconds);
+    this.queue.enqueue(() =>
+      this.dialect.setValue(this.api, this.dialect.sessionTimeKey, formatted)
+    );
+  }
+
+  reportInteraction(
+    questionId: string,
+    interaction: Interaction,
+    correct: boolean | null
+  ): void {
+    const n = this.interactionCount++;
+    const fields = buildScormInteractionFields(
+      `cmi.interactions.${n}`,
+      questionId,
+      interaction,
+      correct,
+      {
+        responseField: this.dialect.interactionFields.responseField,
+        timestampField: this.dialect.interactionFields.timestampField,
+        timestamp: this.dialect.interactionFields.timestamp(),
+        typeValue: this.dialect.interactionFields.typeValue(interaction.type),
+        resultLabels: this.dialect.interactionFields.resultLabels,
+      }
+    );
+    for (const [key, value] of fields) {
+      this.queue.enqueue(() => this.dialect.setValue(this.api, key, value));
+    }
+  }
+
+  commit(): void {
+    this.queue.enqueue(() => this.dialect.commit(this.api));
+  }
+
+  terminate(): void {
+    if (this.#terminated) return;
+    this.#terminated = true;
+    // During page unload, async retries can't run.
+    // Drain any pending queue operations synchronously (single attempt each),
+    // then commit and finish synchronously.
+    this.queue.drainSync();
+    callSync(() => this.dialect.commit(this.api));
+    callSync(() => this.dialect.terminate(this.api));
+  }
+
+  // The four operations that genuinely diverge between SCORM versions.
+  abstract setScore(score: number): void;
+  abstract setCompletionStatus(status: 'incomplete' | 'complete'): void;
+  abstract setSuccessStatus(status: 'passed' | 'failed' | 'unknown'): void;
+  abstract setExit(mode: 'suspend' | 'normal'): void;
+}

package/src/runtime/adapters/scorm12.ts

@@ -1,7 +1,6 @@
-import type { PersistenceAdapter, SavedState } from '../persistence.js';
-import type { Interaction } from '../interaction.js';
-import { buildScormInteractionFields, scorm12Type } from '../interaction-format.js';
-import { WriteQueue, callSync, withRetry, formatHHMMSS } from './retry.js';
+import { scorm12Type } from '../interaction-format.js';
+import { BaseScormAdapter, type ScormDialect } from './scorm-base.js';
+import { formatHHMMSS } from './retry.js';
 
 /**
  * SCORM 1.2 API interface.
@@ -17,84 +16,51 @@ export interface SCORM12API {
   LMSGetDiagnostic(errorCode: string): string;
 }
 
+const SCORM12_DIALECT: ScormDialect<SCORM12API> = {
+  sessionTimeKey: 'cmi.core.session_time',
+  formatDuration: formatHHMMSS,
+  interactionFields: {
+    responseField: 'student_response',
+    timestampField: 'time',
+    timestamp: () => new Date().toTimeString().slice(0, 8),
+    typeValue: (t) => scorm12Type(t),
+    resultLabels: { correct: 'correct', incorrect: 'wrong' },
+  },
+  initialize: (api) => api.LMSInitialize(''),
+  terminate: (api) => api.LMSFinish(''),
+  getValue: (api, key) => api.LMSGetValue(key),
+  setValue: (api, key, value) => api.LMSSetValue(key, value),
+  commit: (api) => api.LMSCommit(''),
+  getLastError: (api) => api.LMSGetLastError(),
+  getErrorString: (api, code) => api.LMSGetErrorString(code),
+};
+
 /**
  * SCORM 1.2 persistence adapter.
  *
  * Uses a sequential write queue for all LMS SetValue/Commit calls.
  * On terminate, the queue is drained synchronously (single attempt)
  * since async retries cannot complete during page unload.
+ *
+ * SCORM 1.2 collapses completion + success into a single `lesson_status`
+ * field, so the two setters track their values separately and write the
+ * combined result through `#flushLessonStatus`.
  */
-export class SCORM12Adapter implements PersistenceAdapter {
-  #api: SCORM12API;
-  #queue = new WriteQueue();
-  #state: SavedState | null = null;
-  #terminated = false;
-
-  // SCORM 1.2 combines completion and success into a single lesson_status field
+export class SCORM12Adapter extends BaseScormAdapter<SCORM12API> {
+  // SCORM 1.2 combines completion and success into a single lesson_status field.
   #completionStatus: string = 'incomplete';
   #successStatus: string | null = null;
-  #interactionCount = 0;
 
   constructor(api: SCORM12API) {
-    this.#api = api;
-    // Wire up GetLastError/GetErrorString so retry warnings can name the
-    // real LMS failure (e.g. "201 Invalid argument error") instead of a
-    // generic "LMS call failed" — production triage needs the code.
-    this.#queue.errorReporter = {
-      code: () => this.#api.LMSGetLastError(),
-      message: (c) => this.#api.LMSGetErrorString(c),
-    };
-  }
-
-  /** Expose the underlying SCORM 1.2 API so xAPI actor synthesis can read learner fields. */
-  getAPI(): SCORM12API {
-    return this.#api;
-  }
-
-  async init(): Promise<void> {
-    await withRetry(() => this.#api.LMSInitialize(''));
-
-    try {
-      const raw = this.#api.LMSGetValue('cmi.suspend_data');
-      if (raw && raw.trim()) {
-        this.#state = JSON.parse(raw);
-      }
-    } catch {
-      this.#state = null;
-    }
-
-    // Continue cmi.interactions.n indexing where the previous session left
-    // off. Restarting at 0 would overwrite prior records (the LMS uses n
-    // as the array key, not an upsert field).
-    try {
-      const count = this.#api.LMSGetValue('cmi.interactions._count');
-      const n = parseInt(count, 10);
-      if (Number.isFinite(n) && n >= 0) this.#interactionCount = n;
-    } catch {
-      // Some LMSes throw on _count when no interactions exist — fall back to 0.
-    }
-  }
-
-  getState(): SavedState | null {
-    return this.#state;
-  }
-
-  saveState(state: SavedState): void {
-    this.#state = state;
-    const json = JSON.stringify(state);
-    this.#queue.enqueue(() => this.#api.LMSSetValue('cmi.suspend_data', json));
+    super(api, SCORM12_DIALECT);
   }
 
   setScore(score: number): void {
-    this.#queue.enqueue(() =>
-      this.#api.LMSSetValue('cmi.core.score.raw', String(score))
-    );
-    this.#queue.enqueue(() =>
-      this.#api.LMSSetValue('cmi.core.score.min', '0')
-    );
-    this.#queue.enqueue(() =>
-      this.#api.LMSSetValue('cmi.core.score.max', '100')
+    this.queue.enqueue(() =>
+      this.api.LMSSetValue('cmi.core.score.raw', String(score))
     );
+    this.queue.enqueue(() => this.api.LMSSetValue('cmi.core.score.min', '0'));
+    this.queue.enqueue(() => this.api.LMSSetValue('cmi.core.score.max', '100'));
   }
 
   setCompletionStatus(status: 'incomplete' | 'complete'): void {
@@ -110,17 +76,10 @@ export class SCORM12Adapter implements PersistenceAdapter {
   }
 
   #flushLessonStatus(): void {
-    // Success status takes priority — it's the more specific status
+    // Success status takes priority — it's the more specific status.
     const value = this.#successStatus ?? this.#completionStatus;
-    this.#queue.enqueue(() =>
-      this.#api.LMSSetValue('cmi.core.lesson_status', value)
-    );
-  }
-
-  setDuration(seconds: number): void {
-    const formatted = formatHHMMSS(seconds);
-    this.#queue.enqueue(() =>
-      this.#api.LMSSetValue('cmi.core.session_time', formatted)
+    this.queue.enqueue(() =>
+      this.api.LMSSetValue('cmi.core.lesson_status', value)
     );
   }
 
@@ -128,45 +87,6 @@ export class SCORM12Adapter implements PersistenceAdapter {
     // SCORM 1.2 §4.2.2 vocabulary: time-out, suspend, logout, "" (normal).
     // We only map 'suspend' and the empty/normal case.
     const value = mode === 'suspend' ? 'suspend' : '';
-    this.#queue.enqueue(() => this.#api.LMSSetValue('cmi.core.exit', value));
-  }
-
-  reportInteraction(
-    questionId: string,
-    interaction: Interaction,
-    correct: boolean | null
-  ): void {
-    const n = this.#interactionCount++;
-    const fields = buildScormInteractionFields(
-      `cmi.interactions.${n}`,
-      questionId,
-      interaction,
-      correct,
-      {
-        responseField: 'student_response',
-        timestampField: 'time',
-        timestamp: new Date().toTimeString().slice(0, 8),
-        typeValue: scorm12Type(interaction.type),
-        resultLabels: { correct: 'correct', incorrect: 'wrong' },
-      }
-    );
-    for (const [key, value] of fields) {
-      this.#queue.enqueue(() => this.#api.LMSSetValue(key, value));
-    }
-  }
-
-  commit(): void {
-    this.#queue.enqueue(() => this.#api.LMSCommit(''));
-  }
-
-  terminate(): void {
-    if (this.#terminated) return;
-    this.#terminated = true;
-    // During page unload, async retries can't run.
-    // Drain any pending queue operations synchronously (single attempt each),
-    // then commit and finish synchronously.
-    this.#queue.drainSync();
-    callSync(() => this.#api.LMSCommit(''));
-    callSync(() => this.#api.LMSFinish(''));
+    this.queue.enqueue(() => this.api.LMSSetValue('cmi.core.exit', value));
   }
 }