@shijiu/jsview-vue 2.0.1021 → 2.0.1073

package/utils/JsViewEngineWidget/TemplateParser/TemplateItemAdder.ts

@@ -0,0 +1,147 @@
+
+import { MetroTemplate, TemplateItem } from "./MetroTemplate";
+import { HORIZONTAL } from "../WidgetCommon";
+class TemplateItemAdder {
+  private _MetroTemplate: MetroTemplate;
+  private _Data: Array<object>;
+  private _PageRange: number;
+  private _MeasureFunc: Function;
+  private _CurIndex: number;
+  private _CurPage: number;
+  private _SideEffect: Function;
+  private _Key: string;
+  private _ID: number;
+
+  constructor(
+    template_parser: MetroTemplate,
+    data: Array<object>,
+    measure_func: Function,
+    page_range: number,
+    side_effect: Function,
+    id: number
+  ) {
+    this._MetroTemplate = template_parser;
+    this._Data = data;
+    this._PageRange = page_range;
+    this._MeasureFunc = measure_func;
+    this._CurIndex = 0;
+    this._CurPage = 0;
+    this._SideEffect = side_effect;
+    this._Key =
+      this._MetroTemplate.direction === HORIZONTAL
+        ? "left"
+        : "top";
+    this._ID = id;
+  }
+
+  private addDataToTemplate(data: Array<object>, index: number) {
+    const itemData = data[index];
+    const measureObj = this._MeasureFunc(itemData);
+
+    let templateItem = this._MetroTemplate.addItem(measureObj);
+    this._SideEffect?.(itemData, templateItem, measureObj);
+    return templateItem;
+  }
+
+  public tryAddItem(cur_item: TemplateItem | null = null, page_num: number = 1) {
+    let added = false;
+    if (
+      this._CurIndex < this._Data.length &&
+      (!cur_item ||
+        cur_item[this._Key] >= (this._CurPage - 1) * this._PageRange)
+    ) {
+      while (this._CurIndex < this._Data.length) {
+        try {
+          let item = this.addDataToTemplate(this._Data, this._CurIndex);
+          this._CurIndex++;
+          if (item[this._Key] >= (this._CurPage + page_num) * this._PageRange) {
+            this._CurPage += page_num;
+            break;
+          }
+        } catch (e) {
+          console.error(
+            `MetroWidget: ${this._ID} parse template item ${this._CurIndex} failed. data: `,
+            this._Data
+          );
+          throw e;
+        }
+      }
+      this._MetroTemplate.calculateNeighborWhenAddStop();
+      added = true;
+    }
+    // 添加完成需要计算neighbor
+    return added;
+  }
+
+  tryAddItemByPosition(position: number) {
+    const page_num = Math.ceil(position / this._PageRange + 1);
+    if (page_num > this._CurPage) {
+      this.tryAddItem(null, page_num - this._CurPage);
+    }
+  }
+
+  tryAddItemByIndex(index: number) {
+    let _index = Math.min(index, this._Data.length - 1);
+    let added = false;
+    while (this._CurIndex <= _index) {
+      added = true;
+      try {
+        let item = this.addDataToTemplate(this._Data, this._CurIndex);
+        this._CurIndex++;
+        if (item[this._Key] >= (this._CurPage + 1) * this._PageRange) {
+          this._CurPage++;
+        }
+      } catch (e) {
+        console.error(
+          `MetroWidget: ${this._ID} parse template item ${this._CurIndex} failed. data:`,
+          this._Data
+        );
+        throw e;
+      }
+    }
+    if (added) {
+      this._MetroTemplate.calculateNeighborWhenAddStop();
+    }
+    //再添加一屏
+    this.tryAddItem(this._MetroTemplate.getItemByIndex(index), 2);
+  }
+
+  tryAddItemById(id: number) {
+    let _id = Math.min(id, this._Data.length - 1); // id小于等于index, 因此为了避免过界取小值
+    const last_id = this._MetroTemplate.focusableSize - 1;
+    if (last_id < _id) {
+      let added = false;
+      let cur_id = last_id;
+      while (cur_id < _id && this._CurIndex < this._Data.length) {
+        added = true;
+        try {
+          let item = this.addDataToTemplate(this._Data, this._CurIndex);
+          cur_id = item.id;
+          if (item[this._Key] >= (this._CurPage + 1) * this._PageRange) {
+            this._CurPage++;
+          }
+          this._CurIndex++;
+        } catch (e) {
+          console.error(
+            `MetroWidget: ${this._ID} parse template item ${this._CurIndex} failed. data:`,
+            this._Data
+          );
+          throw e;
+        }
+      }
+      if (added) {
+        this._MetroTemplate.calculateNeighborWhenAddStop();
+      }
+    }
+    //再添加一屏
+    this.tryAddItem(this._MetroTemplate.getItemById(id), 2);
+  }
+
+  updateData(data: Array<object>) {
+    this._Data = data;
+  }
+}
+
+export {
+  TemplateItemAdder,
+}

package/utils/JsViewEngineWidget/TemplateParser/index.ts

@@ -0,0 +1,4 @@
+export * from "./CommonMetroTemplate"
+export * from "./TemplateItemAdder"
+export * from "./ListMetroTemplate"
+export * from "./MetroTemplate"

package/utils/JsViewEngineWidget/{WidgetCommon.js → WidgetCommon.ts}

@@ -5,61 +5,37 @@
  * @LastEditTime: 2022-12-01 16:49:21
  * @Description: file content
  */
-class BaseDispatcher {
+export class BaseDispatcher {
+  private _Component: any;
+
   constructor() {
+    console.error("BaseDispatcher is deprecated and will be removed soon. Use MetroWidget exposed methods instead.");
     this._Component = null;
     this.registerComponent = this.registerComponent.bind(this);
     this.unregisterComponent = this.unregisterComponent.bind(this);
     this.dispatch = this.dispatch.bind(this);
   }
 
-  registerComponent(component) {
+  registerComponent(component: any) {
+    console.error("BaseDispatcher is deprecated and will be removed soon. Use MetroWidget exposed methods instead.");
     this._Component = component;
   }
 
   unregisterComponent() {
+    console.error("BaseDispatcher is deprecated and will be removed soon. Use MetroWidget exposed methods instead.");
     this._Component = null;
   }
 
-  dispatch(event) {
+  dispatch(event: any) {
     if (event && this._Component) {
+      console.error("BaseDispatcher is deprecated and will be removed soon. Use MetroWidget exposed methods instead.");
       this._Component._dispatchEvent(event);
     }
   }
 }
 
-const EdgeDirection = {
-  left: Symbol("left"),
-  right: Symbol("right"),
-  top: Symbol("top"),
-  bottom: Symbol("bottom"),
-
-  opposite: (dir) => {
-    switch (dir) {
-      case EdgeDirection.left:
-        return EdgeDirection.right;
-      case EdgeDirection.right:
-        return EdgeDirection.left;
-      case EdgeDirection.top:
-        return EdgeDirection.bottom;
-      case EdgeDirection.bottom:
-        return EdgeDirection.top;
-    }
-  },
-};
-
-const SlideStyle = {
-  seamLess: Symbol("seamless"),
-  wholePage: Symbol("wholePage"),
-  seamlessFixedId: Symbol("seamlessFixedId"),
-  startBoundaryProtect: 1,
-  endBoundaryProtect: 2,
-};
-
-const VERTICAL = Symbol("vertical");
-const HORIZONTAL = Symbol("horizontal");
-
-const getMeasureObj = (width, height, focusable, hasSub) => {
+export const getMeasureObj = (width: number, height: number, focusable: number, hasSub: number) => {
+  console.error("getMeasureObj is deprecated and will be removed soon.");
   return {
     width: width,
     height: height,
@@ -68,9 +44,8 @@ const getMeasureObj = (width, height, focusable, hasSub) => {
   };
 };
 
-const FDIV_ROUTER_NAME = "fdivRouter";
-
-function getPositionRelativeToView(divElement, targetElement) {
+export function getPositionRelativeToView(divElement: any, targetElement: any) {
+  console.error("getPositionRelativeToView is deprecated and will be removed soon.");
   if (!divElement) {
     return null;
   }
@@ -89,19 +64,54 @@ function getPositionRelativeToView(divElement, targetElement) {
   return position;
 }
 
+export const EdgeDirection = {
+  left: Symbol("left"),
+  right: Symbol("right"),
+  top: Symbol("top"),
+  bottom: Symbol("bottom"),
+
+  opposite: (dir: Symbol) => {
+    switch (dir) {
+      case EdgeDirection.left:
+        return EdgeDirection.right;
+      case EdgeDirection.right:
+        return EdgeDirection.left;
+      case EdgeDirection.top:
+        return EdgeDirection.bottom;
+      case EdgeDirection.bottom:
+        return EdgeDirection.top;
+    }
+  },
+};
+
+export const SlideStyle = {
+  seamLess: Symbol("seamless"),
+  wholePage: Symbol("wholePage"),
+  seamlessFixedId: Symbol("seamlessFixedId"),
+  startBoundaryProtect: 1,
+  endBoundaryProtect: 2,
+};
+
+export const VERTICAL = Symbol("vertical");
+export const HORIZONTAL = Symbol("horizontal");
+
 const defaultSpeed = 1.5;
 const defaultEasing = "";
-
-class SlideSetting {
-  static Type = {
+export class SlideSetting {
+  public static Type = {
     WHOLE_PAGE: 0,
     SEAMLESS: 1,
     FIX_POSITION: 2,
   };
-  static START_PROTECT = 1;
-  static END_PROTECT = 2;
+  public static START_PROTECT = 1;
+  public static END_PROTECT = 2;
+
+  public readonly Type: number;
+  public readonly Speed: number;
+  public readonly Easing: string;
+  public readonly BoundaryProtect: number;
 
-  constructor(type, speed, easing, boundaryProtect) {
+  protected constructor(type: number, speed: number, easing: string, boundaryProtect: number) {
     this.Type = type;
     this.Speed = speed;
     this.Easing = easing;
@@ -121,7 +131,7 @@ class SlideSetting {
  *                                      boundaryProtect: 确定滚动位置能否小于0或者大于最大长度
  *                                    }
  **/
-class WholePageSlide extends SlideSetting {
+export class WholePageSlide extends SlideSetting {
   constructor({
     speed = defaultSpeed,
     easing = defaultEasing,
@@ -145,7 +155,10 @@ class WholePageSlide extends SlideSetting {
  *                                      boundaryProtect: 确定滚动位置能否小于0或者大于最大长度
  *                                    }
  **/
-class SeamlessSlide extends SlideSetting {
+export class SeamlessSlide extends SlideSetting {
+  public readonly StartPercent: number;
+  public readonly EndPercent: number;
+
   constructor({
     startPercent = 0.2,
     endPercent = 0.8,
@@ -172,7 +185,9 @@ class SeamlessSlide extends SlideSetting {
  *                                      boundaryProtect: 确定滚动位置能否小于0或者大于最大长度
  *                                    }
  **/
-class FixPositionSlide extends SlideSetting {
+export class FixPositionSlide extends SlideSetting {
+  public readonly FixPercent: number;
+
   constructor({
     fixPercent = .5,
     speed = defaultSpeed,
@@ -184,32 +199,10 @@ class FixPositionSlide extends SlideSetting {
   }
 }
 
-const FocusMoveType = {
+export const FocusMoveType = {
   NO_ADJUST: 0x00000000,
   COLUMN_LOOP: 0x00000001,
   ROW_LOOP: 0x00000001 << 1,
   COLUMN_FIND_NEAR: 0x00000001 << 2,
   ROW_FIND_NEAR: 0x00000001 << 3,
-};
-
-// randomColor() {
-//   let randomColor = Math.round(Math.random() * 2 ** 24).toString(16);
-//   return (
-//     "#" + new Array(6 - randomColor.length).fill("0").join("") + randomColor
-//   );
-// },
-export {
-  BaseDispatcher,
-  EdgeDirection,
-  SlideStyle,
-  VERTICAL,
-  HORIZONTAL,
-  getMeasureObj,
-  FDIV_ROUTER_NAME,
-  getPositionRelativeToView,
-  SlideSetting,
-  WholePageSlide,
-  SeamlessSlide,
-  FixPositionSlide,
-  FocusMoveType,
-};
+};

package/utils/JsViewEngineWidget/index.js

@@ -10,7 +10,8 @@ export * from "./MetroWidget/Dispatcher";
 
 export { default as SimpleWidget } from "./MetroWidget/MetroWidget.vue";
 export { default as MetroWidget } from "./MetroWidget/MetroWidget.vue";
-export { METRO_WIDGET } from "./MetroWidget/Const.js";
+export { default as ListWidget } from "./MetroWidget/ListWidget.vue";
+export { METRO_WIDGET, METRO_WIDGET_CONST } from "./MetroWidget/Const.ts";
 
 export { default as JsvFocusBlock } from "./JsvFocusBlock.vue";
 export { jsvCreateFocusManager, useFocusHub } from "./JsvFocusManager";

package/utils/JsViewPlugin/JsvAudio/AudioProxy.js

@@ -10,6 +10,11 @@ import Events from "./Events.js"
 
 const TAG = "JsvAudio";
 
+let keyToken = 0;
+const getKeyToken = () => {
+  return ++keyToken;
+}
+
 class AudioManager {
   constructor() {
     this.audioMap = {};
@@ -63,6 +68,8 @@ class AudioProxy {
     this._created = false;
     this._eventListener = {};
     this._propCache = {};
+    this._onVisibilityChange = this.onVisibilityChange.bind(this);
+    window.JsView?.onVisibilityChange(this._onVisibilityChange);
   }
 
   /** 初始化函数, 外部不应该调用 */
@@ -298,8 +305,26 @@ class AudioProxy {
       window.JMD.unsubscribe(this._playerId, this._onEvent);
       JsvAudioBridgeProxy.ReleasePlayer(this._playerId);
       this._audioManager.releaseAudio(this._playerId);
+      window.JsView?.removeEventCallback(this._onVisibilityChange);
+    }
+  }
+
+  onVisibilityChange(state) {
+    console.log(TAG, "audio visibility change", JSON.stringify(state));
+    if (state.status == "show") {
+      if (typeof this._propCache["customerPause"] != "undefined") {
+        const customerPause = this._propCache["customerPause"];
+        delete this._propCache["customerPause"];
+        if (!customerPause) {
+          this.play();
+        }
+      }
+    } else {
+      // pause when invisible
+      this._propCache["customerPause"] = this._propCache["paused"];
+      this.pause();
     }
   }
 }
 
-export { sAudioManager };
+export { sAudioManager, getKeyToken };