@media-quest/engine 0.0.14 → 0.0.15

package/src/engine/SchemaEngine.ts

@@ -1,51 +1,39 @@
-import { SchemaDto } from "../dto/SchemaDto";
-import { DMediaManager } from "../services/DMedia-manager";
-import { DCommandBus } from "../commands/DCommandBus";
-import { EventBus } from "../events/event-bus";
-import { DPlayer } from "../player/dplayer";
-import { AnsweredQuestion } from "../player/history-que";
-import { DTimestamp } from "../common/DTimestamp";
-import { DPage } from "./DPage";
+import { SchemaDto } from "./SchemaDto";
+import { DPlayer } from "./dplayer";
 import { ScaleService } from "./scale";
-import { ResourceProvider } from "../services/resource-provider";
-import { StateService } from "../state/state-service";
-import { DCommand, StateCommand } from "../commands/DCommand";
-import { DEvent } from "../events/DEvents";
+// import { DEvent } from "../events/DEvents";
+import { Page } from "../page/Page";
+import { TaskManager } from "../page/task-manager";
+// import { AnsweredQuestion, PageHistory } from "./history-que";
+import { PageResult } from "../page/page-result";
 
 export interface EngineLogger {
   error(message: string): void;
   warn(message: string): void;
-  appEvent(event: DEvent): void;
-  appCommand(command: DCommand): void;
+  // appEvent(event: DEvent): void;
 }
 
 export interface SchemaResult {
-  readonly eventLog: ReadonlyArray<DEvent>;
-  readonly commandLog: ReadonlyArray<DCommand>;
+  readonly eventLog: ReadonlyArray<any>;
   readonly answers: ReadonlyArray<any>;
 }
 export interface ISchemaEngine {
   onComplete(handler: (result: SchemaResult) => void): void;
-  onCommandOrEvent(item: DEvent | DCommand): void;
+  // onCommandOrEvent(item: DEvent | DCommand): void;
   setSchema(schema: SchemaDto): void;
   onFatalError(handler: (error: { message: string }) => void): void;
 }
 
 export class SchemaEngine implements ISchemaEngine {
   private readonly TAG = "[ SCHEMA_ENGINE ] :";
-  private readonly commandBus = new DCommandBus();
-  private readonly eventBus = new EventBus();
-  private readonly mediaManager: DMediaManager;
   private readonly scale: ScaleService;
   private readonly hostElement: HTMLDivElement;
-  private readonly uiContainer: HTMLDivElement = document.createElement("div");
-  private readonly mediaContainer: HTMLDivElement = document.createElement("div");
-  private readonly resourceProvider: ResourceProvider;
-  private readonly stateService: StateService;
-  private readonly globalEventToStateHandlers = new Map<string, ReadonlyArray<StateCommand>>();
+  private readonly taskManager: TaskManager;
+  private readonly uiLayer: HTMLDivElement = document.createElement("div");
+  private readonly mediaLayer: HTMLDivElement = document.createElement("div");
   private player: DPlayer;
-  private currentPage: DPage | false = false;
-  private readonly subs: Array<() => void> = [];
+  private currentPage: Page | false = false;
+  private readonly tickerRef: number | false = false;
 
   constructor(
     hostEl: HTMLDivElement,
@@ -53,79 +41,32 @@ export class SchemaEngine implements ISchemaEngine {
     private readonly width: number,
     private readonly schema: SchemaDto,
   ) {
+    this.tickerRef = window.setInterval(() => {
+      if (this.currentPage) {
+        this.currentPage.tick();
+      }
+    }, 100);
     this.hostElement = hostEl;
-    this.hostElement.appendChild(this.uiContainer);
-    this.hostElement.appendChild(this.mediaContainer);
-    const stateProps = this.schema.stateProps ?? [];
-    const stateQueries = this.schema.stateQueries ?? [];
-    this.stateService = new StateService(this.eventBus, this.commandBus, stateProps, stateQueries);
+    this.hostElement.appendChild(this.mediaLayer);
+    this.hostElement.appendChild(this.uiLayer);
     this.scale = new ScaleService({
       baseHeight: schema.baseHeight,
       baseWidth: schema.baseWidth,
       containerWidth: width,
       containerHeight: height,
     });
-    // this.commandBus.logCommands = true;
-    const globalEventHandlers = schema.stateFromEvent ?? [];
-
-    globalEventHandlers.forEach((h) => {
-      this.globalEventToStateHandlers.set(h.onEvent, h.thenExecute);
-    });
-
-    const resources = SchemaDto.getResources(this.schema);
-    this.resourceProvider = new ResourceProvider({ videos: resources.videoList, audio: resources.audioList });
-    this.mediaManager = new DMediaManager(
-      this.mediaContainer,
-      this.commandBus,
-      this.eventBus,
-      this.resourceProvider,
-      this.scale,
-    );
     this.player = new DPlayer(this.schema);
+    this.taskManager = new TaskManager(this.mediaLayer, this.scale, (error) => {
+      console.log(error);
+    });
     this.styleSelf();
+    this.handlePageCompleted = this.handlePageCompleted.bind(this);
     this.nextPage();
-    this.hookUpListeners();
   }
 
-  private hookUpListeners() {
-    const eventSubscription = this.eventBus.subscribe((ev) => {
-      this.onCommandOrEvent(ev);
-      const globalHandlers = this.globalEventToStateHandlers.get(ev.kind) ?? [];
-      globalHandlers.forEach((stateCommand) => {
-        this.commandBus.emit(stateCommand);
-      });
-    }, this.TAG + "HOOK_UP_LISTENERS");
-    const commandSubscription = this.commandBus.subscribe((command) => {
-      // switch (command.kind) {
-      //
-      // }
-      this.onCommandOrEvent(command);
-      if (command.kind === "PAGE_QUE_NEXT_PAGE_COMMAND") {
-        this.nextPage();
-      }
-
-      if (command.kind === "ENGINE_LEAVE_PAGE_COMMAND") {
-        console.log(this.TAG + "SEQUENCE STARTED -- TODO EVENT FOR THIS??");
-        console.log(command);
-        const pageId = command.payload.pageId;
-        const facts = command.payload.factsCollected;
-        const timestamp = DTimestamp.now();
-        const ans: AnsweredQuestion[] = facts.map((f) => ({
-          timestamp,
-          fact: f,
-        }));
-        this.player.saveHistory({
-          answeredQuestions: ans,
-          pageId,
-        });
-
-        this.nextPage();
-        // const history: PageHistory = { page: {}, answeredQuestions: [] };
-      }
-    }, this.TAG);
-
-    this.subs.push(commandSubscription);
-    this.subs.push(eventSubscription);
+  private handlePageCompleted(result: PageResult) {
+    this.player.saveHistory(result);
+    this.nextPage();
   }
 
   private styleSelf() {
@@ -140,61 +81,48 @@ export class SchemaEngine implements ISchemaEngine {
       div.style.position = "static";
     };
 
-    makeStatic(this.uiContainer);
-    makeStatic(this.mediaContainer);
+    makeStatic(this.uiLayer);
+    this.uiLayer.style.zIndex = "10";
+    this.mediaLayer.style.zIndex = "8";
+    makeStatic(this.mediaLayer);
   }
 
   private nextPage() {
-    // TODO SHOULD THIS BE PART OF THE SCHEMA?? THIS IS CLEANUP LOGIC
-    // this.commandBus.emit({ kind: "VIDEO_PAUSE_COMMAND", target: "VIDEO", targetId: "VIDEO", payload: {} });
-    // this.commandBus.emit({ kind: "AUDIO_PAUSE_COMMAND", target: "AUDIO", targetId: "AUDIO", payload: {} });
-    // const currPageId = this.currentPage ? this.currentPage.id : "NO_PAGE";
-    // console.groupCollapsed("NEXT_PAGE FROM: " + currPageId);
-    // console.log(this.TAG + " NEXT_PAGE STARTED AT: " + currPageId);
-    this.mediaManager.clearAllMedia();
     const nextPage = this.player.getNextPage();
-    // const state = this.stateService.getState();
-    // console.log(state);
-    // TODO CLEAN UP PAGE COMPONENTS this.page.CleanUp()
     if (this.currentPage) {
       this.currentPage.destroy();
-      this.uiContainer.innerHTML = "";
+
+      this.uiLayer.innerHTML = "";
     }
+
     if (!nextPage) {
+      // console.log("NO MORE PAGES");
       // TODO FIGURE OUT WHAQT TO DO AT END OF TEST!! Start over??
       this.player = new DPlayer(this.schema);
-      if (this.schema.pages.length > 0) {
+      if (this.player.pageCount > 0) {
         this.nextPage();
       }
       return false;
     }
-    const newPage = new DPage(nextPage, this.eventBus, this.commandBus, this.scale);
+
+    const newPage = new Page(nextPage, this.taskManager, this.scale, (result) => {
+      this.handlePageCompleted(result);
+    });
+
+    // console.log("APPENDING PAGE");
 
     this.currentPage = newPage;
-    newPage.appendYourself(this.uiContainer);
+    // this.uiContainer.innerHTML = "";
 
-    this.mediaManager.setPage(nextPage);
-    const s1 = this.stateService.getState();
-    // console.log(s1);
-    // console.log("Next-page: " + newPage.id);
-    // console.groupEnd();
+    newPage.appendYourself(this.uiLayer);
     return true;
   }
 
   destroy() {
     if (this.currentPage) {
       this.currentPage.destroy();
-      this.uiContainer.innerHTML = "";
+      this.uiLayer.innerHTML = "";
     }
-    this.mediaManager.destroy();
-    this.stateService.destroy();
-    this.subs.forEach((sub) => {
-      sub();
-    });
-    const evStats = this.eventBus.getStats();
-    const cmdStats = this.commandBus.getStats();
-    console.assert(evStats.subscribersCount === 0, this.TAG + " Eventbus should have no subscribers ", evStats);
-    console.assert(cmdStats.subscribersCount === 0, this.TAG + "Commandbus should have no subscribers", cmdStats);
   }
   onComplete(handler: (result: SchemaResult) => void) {
     console.log(handler);
@@ -204,7 +132,7 @@ export class SchemaEngine implements ISchemaEngine {
     console.log(handler);
   }
 
-  onCommandOrEvent(_event_or_command: DEvent | DCommand) {}
+  onCommandOrEvent(_event_or_command: any) {}
 
   setSchema(schema: SchemaDto): void {
     console.log(schema);

package/src/{player → engine}/dplayer.spec.ts

@@ -1,13 +1,15 @@
 import { DPlayer, DPlayerData } from "./dplayer";
-import { PageDto, PageSequenceDto } from "../dto/SchemaDto";
+import { PageSequenceDto } from "./SchemaDto";
 import { Rule } from "../rules/rule";
-import { PageHistory } from "./history-que";
+// import { PageHistory } from "./history-que";
 import { DTimestamp } from "../common/DTimestamp";
-import { PageQueCommand } from "../commands/DCommand";
-import { PageID } from "../utils/ID";
+import { PageQueCommand } from "./DCommand";
+import { PageDto } from "../page/Page";
+import { PageResult } from "../page/page-result";
 
 const page = (id: number): PageDto => {
-  return { id: PageID.create(), elements: [] };
+  return PageDto.createDummy(id);
+  // return { id: PageID.create(), elements: [] };
 };
 const p1 = page(1);
 const p2 = page(2);
@@ -31,7 +33,7 @@ const data = (
   pages: PageDto[],
   pageSequences: PageSequenceDto[] = [],
   rules: Rule<PageQueCommand, never>[] = [],
-): DPlayerData => ({ pages, pageSequences, rules });
+): DPlayerData => ({ pages: pages, pageSequences, rules });
 // const seq = (pages: PageDto[], rules: Rule[]) => {};
 beforeEach(() => {
   // data = { pages: [], rules: [], pageSequences: [] };
@@ -85,24 +87,25 @@ describe("DPlayer", () => {
 
   it("Save history", () => {
     const player = new DPlayer(data(all));
+
     const curr = player.getNextPage() as PageDto;
 
-    const history: PageHistory = {
+    const result: PageResult = {
       pageId: curr.id,
-      answeredQuestions: [
+      pageEntered: DTimestamp.now(),
+      pageExited: DTimestamp.now(),
+      pageTime: DTimestamp.diff(DTimestamp.now(), DTimestamp.now()),
+      collectedFacts: [
         {
-          timestamp: DTimestamp.now(),
-          fact: {
-            referenceId: "as",
-            referenceLabel: "as-label",
-            kind: "numeric-fact",
-            label: "litt",
-            value: 2,
-          },
+          referenceId: "as",
+          referenceLabel: "as-label",
+          kind: "numeric-fact",
+          label: "litt",
+          value: 2,
         },
       ],
     };
-    player.saveHistory(history);
+    player.saveHistory(result);
     expect(player.getNextPage()).toBe(p2);
     expect(player.getResults().length).toBe(1);
   });

package/src/{player → engine}/dplayer.ts

@@ -1,31 +1,35 @@
-import { AnsweredQuestion, HistoryQue, PageHistory } from "./history-que";
+import { HistoryQue } from "./history-que";
 import { RuleEngine } from "../rules/rule-engine";
 import { NextQue } from "./next-que";
-import { PageDto, SchemaDto } from "../dto/SchemaDto";
-import { NavigationCommand, PageQueCommand } from "../commands/DCommand";
+import { SchemaDto } from "./SchemaDto";
+import { NavigationCommand, PageQueCommand } from "./DCommand";
 import { DUtil } from "../utils/DUtil";
+import { PageDto } from "../page/Page";
+import { PageResult } from "../page/page-result";
+import { Fact } from "../rules/fact";
 
 export type DPlayerData = Pick<SchemaDto, "pages" | "pageSequences" | "rules">;
 export class DPlayer {
   private history = new HistoryQue();
-  private ruleEngine = new RuleEngine<PageQueCommand, PageQueCommand>();
+  private ruleEngine = new RuleEngine<PageQueCommand, never>();
   private nextQue = new NextQue();
   private data: DPlayerData;
 
   constructor(data: DPlayerData) {
     this.data = data;
-    this.nextQue.resetQue(data.pages);
+    const pages = data.pages ?? [];
+    this.nextQue.resetQue(pages);
   }
 
-  saveHistory(pageHistory: PageHistory) {
-    console.log("SAVE HISTORY", pageHistory);
+  saveHistory(pageHistory: PageResult) {
+    // console.log("SAVE HISTORY", pageHistory);
     this.history.addToHistory(pageHistory);
     const facts = this.history.getFacts();
     const result = this.ruleEngine.solveAll(this.data.rules, facts);
     const matchingRules = result.matching;
     const actions = matchingRules.map((r) => r.actionList).flat(1);
     actions.forEach((a) => {
-      console.log(a.payload);
+      // console.log(a.payload);
       switch (a.kind) {
         case "PAGE_QUE_JUMP_TO_PAGE_COMMAND":
           this.nextQue.jumpToPageById(a.payload.pageId);
@@ -41,11 +45,11 @@ export class DPlayer {
           const check: never = a;
       }
     });
-    console.log(actions);
+    // console.log(actions);
   }
 
-  getResults(): AnsweredQuestion[] {
-    return this.history.getAnswers();
+  getResults(): Fact[] {
+    return this.history.getFacts();
   }
 
   private goToPageById(pageId: string) {
@@ -54,9 +58,6 @@ export class DPlayer {
 
   handleNavigationCommand(command: NavigationCommand) {
     switch (command.kind) {
-      case "PAGE_QUE_NEXT_PAGE_COMMAND":
-        // NO NEED TO DO ANYTHING
-        break;
       case "PAGE_QUE_GO_TO_PAGE_COMMAND":
         this.goToPageById(command.payload.pageId);
         break;
@@ -69,9 +70,21 @@ export class DPlayer {
     }
   }
 
+  // getNextPage():
+  //   | { kind: "first-page"; readonly page: PageDto }
+  //   | { kind: "next-page"; readonly page: PageDto }
+  //   | { kind: "no-more-pages" } {
+  //   const next = this.nextQue.pop();
+  //   const a = this.nextQue.
+  // if (next) {
+  //   return { kind: "next-page", page: next };
+  // }
+  // return { kind: "no-more-pages" };
+  // }
+
   getNextPage(): PageDto | false {
-    // TODO HANDLE RULES!!
-    return this.nextQue.pop();
+    const next = this.nextQue.pop();
+    return next ?? false;
   }
 
   private insertSequenceById(id: string) {

package/src/engine/history-que.spec.ts

@@ -0,0 +1,59 @@
+import { HistoryQue } from "./history-que";
+import { DTimestamp } from "../common/DTimestamp";
+import { PageID } from "../utils/ID";
+import { PageDto } from "../page/Page";
+import { PageResult } from "../page/page-result";
+
+const p = (id: number): PageDto => {
+  return { id: PageID.create(), components: [], initialTasks: [], staticElements: [], background: "", tags: [] };
+};
+
+const pageResult = (id: number, value: number): PageResult => {
+  const pageEntered = DTimestamp.now();
+  const pageExited = DTimestamp.addMills(pageEntered, 1000);
+  const pageTime = DTimestamp.diff(pageEntered, pageExited);
+
+  const result: PageResult = {
+    pageId: "_dummyId" + id,
+    pageEntered,
+    pageExited,
+    pageTime,
+    collectedFacts: [
+      {
+        referenceId: "" + id,
+        referenceLabel: "label-for-" + id,
+        value,
+        label: "value-label " + value,
+        kind: "numeric-fact",
+      },
+    ],
+  };
+  return result;
+};
+// const h = (page: PageDto, answeredQuestions: AnsweredQuestion[]): PageResult => ({
+//   pageId: page.id,
+//   answeredQuestions,
+// });
+const p1 = p(1);
+const p2 = p(2);
+const p3 = p(3);
+const p4 = p(4);
+const p5 = p(5);
+const p6 = p(6);
+const all = [p1, p2, p3, p4, p5, p6];
+
+let history = new HistoryQue();
+beforeEach(() => {
+  history = new HistoryQue();
+});
+
+describe("HistoryQue", () => {
+  it("should create an instance", () => {
+    expect(history).toBeTruthy();
+  });
+
+  it("Can add history, and get facts back", () => {
+    history.addToHistory(pageResult(1, 2));
+    expect(history.getFacts().length).toBe(1);
+  });
+});

package/src/engine/history-que.ts

@@ -0,0 +1,39 @@
+import { Fact } from "../rules/fact";
+import { DTimestamp } from "../common/DTimestamp";
+import { PageResult } from "../page/page-result";
+
+// export interface AnsweredQuestion {
+//   readonly timestamp: DTimestamp;
+//   readonly fact: Fact;
+// }
+
+// export namespace AnsweredQuestion {
+//     export const eq = (a: AnsweredQuestion, b: AnsweredQuestion): boolean => {
+//         return a.fact === b.fact;
+//     };
+// }
+
+// export interface PageHistory {
+//   readonly pageId: string;
+//   readonly answeredQuestions: AnsweredQuestion[];
+// }
+
+export class HistoryQue {
+  private history: PageResult[] = [];
+
+  getFacts(): Array<Fact> {
+    const answers = this.history.map((h) => h.collectedFacts).flat(1);
+    // const facts = answers.map((a) => a.fact);
+    // TODO FIND LATEST FACT (answer) if have multiple.
+    return answers;
+  }
+
+  // get(): Array<AnsweredQuestion> {
+  //   const answers = this.history.map((h) => h.answeredQuestions).flat(1);
+  //   return answers;
+  // }
+
+  addToHistory(result: PageResult) {
+    this.history.push(result);
+  }
+}

package/src/{player → engine}/next-que.spec.ts

@@ -1,19 +1,30 @@
 import { NextQue } from "./next-que";
-import { PageDto } from "../dto/SchemaDto";
 import { PageID } from "../utils/ID";
+import { PageDto } from "../page/Page";
 
 const tag1 = "tag1";
 const tag2 = "tag2";
 const tag3 = "tag3";
 
 let que = new NextQue();
-const createPage = () => {};
-const p1: PageDto = { id: PageID.create(), elements: [], tags: [tag1] };
-const p2: PageDto = { id: PageID.create(), elements: [], tags: [] };
-const p3: PageDto = { id: PageID.create(), elements: [], tags: [tag2] };
-const p4: PageDto = { id: PageID.create(), elements: [], tags: [] };
-const p5: PageDto = { id: PageID.create(), elements: [], tags: [tag3, tag2] };
-const p6: PageDto = { id: PageID.create(), elements: [], tags: [tag3] };
+const createPage = (tags: string[]): PageDto => {
+  const dto: PageDto = {
+    id: PageID.create(),
+    staticElements: [],
+    background: "white",
+    components: [],
+    initialTasks: [],
+    tags,
+  };
+  return dto;
+};
+
+const p1 = createPage([tag1]);
+const p2 = createPage([]);
+const p3 = createPage([tag2]);
+const p4 = createPage([]);
+const p5 = createPage([tag3, tag2]);
+const p6 = createPage([tag3]);
 const all = [p1, p2, p3, p4, p5, p6];
 
 beforeEach(() => {

package/src/engine/next-que.ts

@@ -0,0 +1,93 @@
+import { PageDto } from "../page/Page";
+
+export class NextQue {
+  private originalOrder: ReadonlyArray<string> = [];
+  private allPages: PageDto[] = [];
+  private excludedTags = new Set<string>();
+  private excludedByPageId = new Set<string>();
+  private remaining: PageDto[] = [];
+  constructor(pages: PageDto[] = []) {
+    this.resetQue(pages);
+  }
+
+  /**
+   * Will reset que with the new pages.
+   * @param pages
+   */
+  resetQue(pages: PageDto[]) {
+    this.allPages = [...pages];
+    this.remaining = [...pages];
+    this.excludedTags = new Set();
+    this.excludedByPageId = new Set();
+    this.originalOrder = this.allPages.map((p) => p.id);
+  }
+
+  pop(): PageDto | false {
+    const next = this.remaining.shift();
+    // TODO CLONE??
+    return next ?? false;
+  }
+
+  peek(): PageDto | false {
+    const next = this.remaining[0];
+    return next ?? false;
+  }
+
+  jumpToPageById(pageId: string): boolean {
+    const index = this.remaining.findIndex((p) => p.id === pageId);
+    if (index < 0) {
+      return false;
+    }
+    this.remaining = this.remaining.slice(index);
+    return true;
+  }
+
+  removeByTag(tag: string | string[]) {
+    if (Array.isArray(tag)) {
+      tag.forEach((tag) => {
+        this.excludedTags.add(tag);
+      });
+    } else {
+      this.excludedTags.add(tag);
+    }
+    this.filterRemaining();
+  }
+
+  /**
+   * Will not be included
+   * @param pages
+   */
+  insertAsNextByForce(pages: PageDto[]) {
+    this.remaining.unshift(...pages);
+  }
+
+  removeByPageId(pageId: string | string[]) {
+    if (Array.isArray(pageId)) {
+      pageId.forEach((id) => {
+        this.excludedByPageId.add(id);
+      });
+    } else {
+      this.excludedByPageId.add(pageId);
+    }
+    this.filterRemaining();
+    // this.excludedByPageId.add(pageId);
+  }
+
+  private filterRemaining() {
+    this.remaining = this.remaining.filter((p) => {
+      const tags = p.tags ?? [];
+      const isIncluededByTag = !tags.some((tag) => this.excludedTags.has(tag));
+      const isIncludedByPageId = !this.excludedByPageId.has(p.id);
+      return isIncludedByPageId && isIncluededByTag;
+    });
+  }
+  get isEmpty(): boolean {
+    return this.remaining.length === 0;
+  }
+  get size(): number {
+    return this.remaining.length;
+  }
+  get pageCount(): number {
+    return this.originalOrder.length;
+  }
+}