@vnejs/plugins.text 0.1.3 → 0.1.5

package/modules/cycle.js

@@ -14,31 +14,42 @@ export class TextCycle extends Module {
 
   init = () => this.emit(this.EVENTS.SETTINGS.INIT, { name: this.SETTINGS.TEXT.TOKEN_RENDER_SPEED, value: this.PARAMS.TEXT.DEFAULT_TOKEN_RENDER_SPEED });
 
-  onCicle = ({ tokens = [] } = {}) => this.setUpdateTextRaf(tokens, new Date().getTime());
+  onCicle = ({ tokens = [] } = {}) => {
+    this.setState({ tokens, lastTs: new Date().getTime() });
+    this.setUpdateTextRaf();
+  };
 
-  setUpdateTextRaf = (tokens, ts) => {
-    this.textUpdateRaf = requestAnimationFrame(this.createUpdateTextFunc(tokens, ts));
+  setUpdateTextRaf = () => {
+    this.textUpdateRaf = requestAnimationFrame(this.createUpdateTextFunc);
   };
 
-  createUpdateTextFunc = (tokens, lastTs) => async () => {
+  createUpdateTextFunc = async () => {
+    const { lastTs, tokens = [] } = this.state;
+
     const ts = new Date().getTime();
     const diff = ts - lastTs;
 
     const delayForOneChar = this.PARAMS.TEXT.TOKEN_RENDER_DELAY / this.shared.settings[this.SETTINGS.TEXT.TOKEN_RENDER_SPEED];
 
-    if (diff < delayForOneChar) return this.setUpdateTextRaf(tokens, lastTs);
+    if (diff < delayForOneChar) return this.setUpdateTextRaf();
 
     this.globalState.text.tokensVisible += Math.floor(diff / delayForOneChar);
 
     const { tokens: currentTokens, tokensVisible = 0, uid = "" } = this.globalState.text;
     const { wall = [] } = this.globalState["text.wall"];
 
-    if (currentTokens !== tokens) return;
-    if (tokensVisible > tokens.length) return this.emit(this.EVENTS.TEXT.EMIT_END, { isForced: false });
+    if (currentTokens !== tokens) return this.setDefaultState();
+    if (tokensVisible >= tokens.length) {
+      this.setDefaultState();
+
+      return this.emit(this.EVENTS.TEXT.EMIT_END, { isForced: false });
+    }
 
     await this.emit(this.EVENTS.TEXT.CHANGED, { tokens, tokensVisible, uid, wall });
 
-    return this.setUpdateTextRaf(tokens, ts - (diff % delayForOneChar));
+    this.updateState({ lastTs: ts - (diff % delayForOneChar) });
+
+    return this.setUpdateTextRaf();
   };
 
   cancelRaf = () => cancelAnimationFrame(this.textUpdateRaf);

package/modules/interact.js

@@ -27,7 +27,7 @@ export class TextInteract extends Module {
     await this.emit(state === this.CONST.TEXT.INTERACT_STATES.SHOWED ? this.EVENTS.INTERACT.PUSH : this.EVENTS.INTERACT.POP, this.interactArgShowed);
   };
 
-  onStateSet = ({ [this.name]: state }) => this.emit(this.EVENTS.TEXT.INTERACT, state);
+  onStateSet = async ({ [this.name]: state } = {}) => this.emit(this.EVENTS.TEXT.INTERACT, await this.emitOne(this.EVENTS.VENDORS.CLONE, state));
   onStateClear = () => this.emit(this.EVENTS.TEXT.INTERACT, this.getDefaultState());
 
   getDefaultState = () => ({ state: this.CONST.TEXT.INTERACT_STATES.EMPTY });

package/modules/meet.js

@@ -8,7 +8,7 @@ export class TextMeet extends Module {
   subscribe = () => {
     this.on(this.EVENTS.TEXT.MEET, this.onMeet);
 
-    this.on(this.EVENTS.STATE.SET, this.setStateFromGlobalState);
+    this.on(this.EVENTS.STATE.SET, this.onStateSet);
     this.on(this.EVENTS.STATE.CLEAR, this.setDefaultState);
   };
 
@@ -22,11 +22,13 @@ export class TextMeet extends Module {
     this.emit(this.EVENTS.SCENARIO.NEXT, { module: this.name });
   };
 
-  onMeet = ({ char, value = 1 }) => {
+  onMeet = ({ char, value = 1 } = {}) => {
     this.emit(this.EVENTS.LOGS.EMIT, { module: this.name, value: { char, value } });
 
     this.state[char] = this.state[char] ? this.state[char] + Number(value) : Number(value);
   };
 
+  onStateSet = async ({ [this.name]: state } = {}) => this.setState(await this.emitOne(this.EVENTS.VENDORS.CLONE, state));
+
   getDefaultState = () => ({ default: 0 });
 }

package/modules/speaker.js

@@ -9,23 +9,14 @@ export class TextSpeaker extends Module {
     this.on(this.EVENTS.STATE.CLEAR, this.onStateClear);
     this.on(this.EVENTS.STATE.SET, this.onStateSet);
   };
-  init = () => this.emit(this.EVENTS.SCENARIO.LINE_EXEC_REG, { module: "text", handler: this.onLineTextHandler });
-  onLineTextHandler = async (line, args) => {
-    const { speaker: lineSpeaker } = line.match(this.CONST.TEXT.LINE_REG).groups;
 
-    const speaker = lineSpeaker || this.PARAMS.TEXT.DEFAULT_SPEAKER_NAME;
-    const meet = this.globalState["text.meet"][speaker] ?? 0;
-
-    return this.emit(this.EVENTS.TEXT.SPEAKER, { speaker, meet, args });
-  };
-
-  onTextSpeaker = ({ speaker, meet, ...args }) => {
+  onTextSpeaker = ({ speaker, meet, ...args } = {}) => {
     this.setState({ speaker, meet, args });
 
     this.emit(this.EVENTS.TEXT.SPEAKER_CHANGED, { speaker, meet });
   };
 
-  onStateSet = ({ [this.name]: state }) => this.setNewState(state);
+  onStateSet = async ({ [this.name]: state } = {}) => this.setNewState(await this.emitOne(this.EVENTS.VENDORS.CLONE, state));
   onStateClear = () => this.setNewState(this.getDefaultState());
 
   setNewState = ({ speaker, meet, args } = {}) => this.emit(this.EVENTS.TEXT.SPEAKER, { speaker, meet, ...args });

package/modules/text.js

@@ -22,13 +22,17 @@ export class Text extends Module {
     return this.emit(this.EVENTS.SCENARIO.LINE_EXEC_REG, { module: this.name, handler: this.onLineHandler });
   };
   onLineHandler = async (line, args) => {
-    const { text } = line.match(this.CONST.TEXT.LINE_REG).groups;
+    const { text, speaker: lineSpeaker } = line.match(this.CONST.TEXT.LINE_REG).groups;
+
+    const speaker = lineSpeaker || this.PARAMS.TEXT.DEFAULT_SPEAKER_NAME;
+    const meet = this.globalState["text.meet"][speaker] ?? 0;
 
     await this.emit(this.EVENTS.TEXT.EMIT_BEFORE);
-    await this.emit(this.EVENTS.TEXT.EMIT, { text, ...args });
+
+    return Promise.all([this.emit(this.EVENTS.TEXT.SPEAKER, { speaker, meet, args }), this.emit(this.EVENTS.TEXT.EMIT, { text, ...args })]);
   };
 
-  onTextEmit = async ({ text, ...args }) => {
+  onTextEmit = async ({ text, ...args } = {}) => {
     const [uid, tokens] = [await this.emitOne(this.EVENTS.VENDORS.UID), textToTokens(await this.getRealText(text))];
     const tokensVisible = this.shared.textNoAnimationSources.length ? BIG_VALUE : 0;
 
@@ -59,7 +63,7 @@ export class Text extends Module {
 
     return this.emitTextChanged();
   };
-  onStateSet = ({ [this.name]: state }) => this.setNewState(state);
+  onStateSet = async ({ [this.name]: state } = {}) => this.setNewState(await this.emitOne(this.EVENTS.VENDORS.CLONE, state));
   onStateClear = () => this.setNewState(this.getDefaultState());
 
   setNewState = (state) => this.emit(this.EVENTS.TEXT.EMIT, { text: state.text, ...state.args });

package/modules/utils.js

@@ -29,7 +29,7 @@ export const textToTokens = (str) => {
       i += j + 1;
     } else {
       i++;
-      tokens.push({ char: curChar, marks: { ...marks } });
+      tokens.push({ token: curChar, marks: { ...marks } });
     }
   }
 

package/modules/wall.js

@@ -6,39 +6,46 @@ export class TextWall extends Module {
   name = "text.wall";
 
   subscribe = () => {
-    this.on(this.EVENTS.TEXT.INTERACT, this.onTextInteract);
+    this.on(this.EVENTS.TEXT.EMIT_BEFORE, this.onTextEmitBefore);
 
     this.on(this.EVENTS.TEXT.RECALC, this.onTextRecalc);
 
     this.on(this.EVENTS.STATE.CLEAR, this.setDefaultState);
-    this.on(this.EVENTS.STATE.SET, this.setStateFromGlobalState);
+    this.on(this.EVENTS.STATE.SET, this.onStateSet);
   };
   init = () => this.emit(this.EVENTS.SCENARIO.LINE_EXEC_REG, { module: this.name, handler: this.onLineHandler });
   onLineHandler = (line) => {
-    if (line === "clear") this.updateState({ wall: [] });
-    if (line === "start") this.updateState({ wall: [], isWallStarted: true });
-    if (line === "end") this.updateState({ wall: [], isWallStarted: false });
+    if (line === "clear") this.updateState({ wall: [], shouldSkip: false });
+    if (line === "start") this.updateState({ wall: [], isStarted: true, shouldSkip: true });
+    if (line === "end") this.updateState({ wall: [], isStarted: false, shouldSkip: true });
 
     this.emit(this.EVENTS.SCENARIO.NEXT, { module: this.name });
   };
 
-  onTextInteract = ({ state } = {}) => {
-    if (state !== this.CONST.TEXT.INTERACT_STATES.NEXT || !this.state.isWallStarted) return;
+  onTextEmitBefore = async () => {
+    if (this.state.shouldSkip) return this.updateState({ shouldSkip: false });
+    if (!this.state.isStarted) return;
 
     const { text, tokens, uid, args } = this.globalState.text;
     const { speaker, meet } = this.globalState["text.speaker"];
 
-    this.updateState({ wall: [...this.state.wall, { text, tokens, uid, args, speaker, meet }] });
+    const wallElement = await this.emitOne(this.EVENTS.VENDORS.CLONE, { text, tokens, uid, args, speaker, meet });
+    const wall = await this.emitOne(this.EVENTS.VENDORS.CLONE, this.state.wall);
+
+    this.updateState({ wall: [...wall, wallElement] });
   };
   onTextRecalc = async () => {
-    this.updateState({
-      wall: await Promise.all(this.state.wall.map(async (wallObj) => ({ ...wallObj, tokens: textToTokens(await this.getRealText(wallObj.text)) }))),
-    });
+    if (!this.state.wall.length) return;
+
+    this.updateState({ wall: await Promise.all(this.state.wall.map(this.recalcWallObjToken)) });
 
     return this.emit(this.EVENTS.TEXT.CHANGED, { ...this.globalState.text, wall: this.state.wall });
   };
 
+  onStateSet = async ({ [this.name]: state } = {}) => this.setState(await this.emitOne(this.EVENTS.VENDORS.CLONE, state));
+
   getRealText = (text) => this.emitOne(this.EVENTS.TEXT.REPLACE, { text, label: this.globalState.scenario.label, state: this.globalState });
+  recalcWallObjToken = async (wallObj) => ({ ...wallObj, tokens: textToTokens(await this.getRealText(wallObj.text)) });
 
-  getDefaultState = () => ({ wall: [], isWallStarted: false });
+  getDefaultState = () => ({ wall: [], isStarted: false, shouldSkip: false });
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vnejs/plugins.text",
-  "version": "0.1.3",
+  "version": "0.1.5",
   "main": "index.js",
   "types": "index.d.ts",
   "scripts": {