@shijiu/jsview 1.9.719

package/dom/jsview-dom/src/engine-js/browser/render_bridge.js

@@ -0,0 +1,128 @@
+/* eslint-disable no-unused-vars */
+import Forge from "../ForgeDefine";
+
+class RenderBridge {
+  constructor() {
+    this._ScreenInfo = {
+      width: 160,
+      height: 90,
+      x: 2 / 160,
+      y: 2 / 90,
+      perspective: 2 / 160,
+      scaleRatio: 1.0 /* display scale ratio */,
+      designedWidth: 1280 /* designed map width */
+    };
+
+    this._FrameLoopFunc = null;
+    this._CallbacksPerFrame = new Set();
+
+    this._WillSwapCallbacks = new Map();
+    this._DoWillSwapCallback = this._OnWillSwap.bind(this); // 提前声明WillSwapCallback函数对象，提高调用速度
+  }
+
+  BeginHtmlFrameLoop() {
+    if (this._FrameLoopFunc !== null) {
+      // Already started
+      return;
+    }
+
+    if (window.requestAnimationFrame) {
+      this._FrameLoopFunc = this._OnAnimation.bind(this);
+      window.requestAnimationFrame(this._FrameLoopFunc);
+    }
+  }
+
+  _OnAnimation() {
+    let keep_loop = false;
+
+    // 碰撞检测
+    if (Forge.sViewSensorManager.HtmlHasActiveSensor()) {
+      Forge.sViewSensorManager.HtmlDoWorkOnFrame();
+
+      // Check if need continue frame loop
+      if (Forge.sViewSensorManager.HtmlHasActiveSensor()) {
+        keep_loop = true;
+      }
+    }
+
+    // 进度Repeat检测
+    if (this._CallbacksPerFrame.size > 0) {
+      for (const callback of this._CallbacksPerFrame) {
+        callback();
+      }
+      // 再次检测，因为可能在callback中触发了队列个数变化
+      if (this._CallbacksPerFrame.size > 0) {
+        keep_loop = true;
+      }
+    }
+
+    if (keep_loop) {
+      window.requestAnimationFrame(this._FrameLoopFunc);
+    } else {
+      this._FrameLoopFunc = null;
+    }
+  }
+
+  GetScreenInfo() {
+    return this._ScreenInfo;
+  }
+
+  InitScreenBuffer(display_scale_ratio, designed_map_width) {
+    if (isNaN(display_scale_ratio)) {
+      display_scale_ratio = 1.0;
+    }
+    if (isNaN(designed_map_width)) {
+      designed_map_width = 1280;
+    }
+    const buffer_width = designed_map_width * display_scale_ratio;
+    const buffer_height = buffer_width / 16 * 9;
+    this._ScreenInfo.width = Math.floor(buffer_width);
+    this._ScreenInfo.height = Math.floor(buffer_height);
+    this._ScreenInfo.x = 2.0 / this._ScreenInfo.width;
+    this._ScreenInfo.y = 2.0 / this._ScreenInfo.height;
+    this._ScreenInfo.perspective = this._ScreenInfo.x;
+    this._ScreenInfo.scaleRatio = display_scale_ratio;
+    this._ScreenInfo.designedWidth = designed_map_width;
+  }
+
+  RequestSwap() {
+    if (!this._OnRequesting) {
+      this._OnRequesting = true;
+      Promise.resolve().then(this._DoRequestSwap.bind(this));
+    }
+  }
+
+  SetGlobalConfig(json) {}
+
+  AddWillSwapListener(alias, callback) {
+    this._WillSwapCallbacks.set(alias, callback);
+  }
+
+  _DoRequestSwap() {
+    if (this._WillSwapCallbacks.size > 0) {
+      this._WillSwapCallbacks.forEach(this._DoWillSwapCallback);
+    }
+    this._OnRequesting = false;
+  }
+
+  InstantPerformSwap() {
+    if (this._OnRequesting) {
+      this._OnRequesting = false;
+      this._DoRequestSwap(false);
+    }
+  }
+
+  _OnWillSwap(callback) {
+    callback();
+  }
+
+  RegisterPerFrameCallback(callback) {
+    this._CallbacksPerFrame.add(callback);
+  }
+
+  UnregisterPerFrameCallback(callback) {
+    this._CallbacksPerFrame.delete(callback);
+  }
+}
+Forge.RenderBridge = RenderBridge;
+Forge.sRenderBridge = new Forge.RenderBridge();

package/dom/jsview-dom/src/engine-js/browser/render_texture_proxy.js

@@ -0,0 +1,155 @@
+/* eslint-disable no-unused-vars */
+/* eslint-disable no-prototype-builtins */
+import Forge from "../ForgeDefine";
+
+class RenderTextureDelegateManager {
+  constructor() {
+    this._IdTokenGenerator = 66;
+    Forge.sRenderTextureDelegateManager = this;
+    this._CheckExpiredTime = 0;
+  }
+
+  CreateTextureHeadStatus() {
+    const texture = new Forge.RenderTextureDelegate(this, 0);
+    texture.DoRef();
+    return texture;
+  }
+
+  CreateTextureStatus() {
+    const texture = new Forge.RenderTextureDelegate(this, 0);
+    texture.DoRef();
+    return texture;
+  }
+
+  CreateTexture() {
+    const texture = new Forge.RenderTextureDelegate(
+      this,
+      this._IdTokenGenerator++
+    );
+    texture.DoRef();
+    return texture;
+  }
+
+  RecycleTexture(texture) {}
+
+  CreateResourceInfo(tm_id, func_name) {
+    const resource_info = {
+      Id: 0,
+      Nam: func_name,
+      Set: null, // 内容由各自Resource创建方式自定义填充
+      TmId: tm_id, // TextureManager ID，
+      NdLd: 0, // need loaded 0:false, 1:true
+    };
+
+    return resource_info;
+  }
+
+  AppendFontStatusIfNeed(settings, string_with_font) {
+    const settings_font_status = {};
+    settings_font_status.Fo = string_with_font.font;
+    settings_font_status.Si = string_with_font.size;
+    settings_font_status.It = string_with_font.italic;
+    settings_font_status.Bo = string_with_font.bold;
+    settings_font_status.Al = string_with_font.alignment;
+    settings_font_status.Ve = string_with_font.vertical_align;
+    settings_font_status.Vaa = string_with_font.vertical_area_align;
+    settings_font_status.Tx = string_with_font.textColour;
+    settings_font_status.Ba = string_with_font.backgroundColour;
+    settings_font_status.En = string_with_font.enableBlend;
+    settings_font_status.Sh = string_with_font.shadow;
+    if (string_with_font.stroke_width) {
+      settings_font_status.Stk = string_with_font.stroke_width;
+    } else {
+      settings_font_status.Stk = -1;
+    }
+    settings.FO = JSON.stringify(settings_font_status);
+  }
+}
+Forge.RenderTextureDelegateManager = RenderTextureDelegateManager;
+Forge.sRenderTextureDelegateManager = new Forge.RenderTextureDelegateManager();
+
+class RenderTextureDelegate {
+  constructor(manager, assigned_id_token) {
+    this.IdToken = assigned_id_token;
+    this._Manager = manager;
+    this._Reference = 0;
+    this._SyncingResourceInfo = null;
+
+    this._OnloadCallbacks = {};
+    this._OnloadCallbacksSize = 0;
+    this._OnloadCallbackIdGenerator = 1;
+
+    // 以下属性只针对有网络请求的Texture有效（例如通过URL获取图片资源的情况）
+    this.Unloaded = true;
+    this.LoadTime = 0;
+    this.RequireTime = 0;
+    this.ForceExpire = false;
+    this.NeedCheckExpired = false;
+
+    const enable_trace = Forge.ForgeDebug.GetTextureTracer();
+    if (enable_trace) {
+      const error_for_stack = new Error();
+      this.Stack = error_for_stack.stack;
+    }
+  }
+
+  DoRef() {
+    this._Reference++;
+  }
+
+  UndoRef() {
+    this._Reference--;
+    if (this._Reference === 0) {
+      // Recycle callbacks
+      if (this._OnloadCallbacksSize > 0) {
+        this._OnloadCallbacks = {};
+      }
+      this._Manager.RecycleTexture(this);
+    }
+  }
+
+  SetResourceInfo(resource_info) {
+    resource_info.Id = this.IdToken;
+    this._SyncingResourceInfo = resource_info;
+  }
+
+  GetResourceInfo() {
+    return this._SyncingResourceInfo;
+  }
+
+  ReadSyncInfo() {
+    const info = this._SyncingResourceInfo;
+    this._SyncingResourceInfo = null;
+    return info;
+  }
+
+  RegisterOnloadCallback(callback) {
+    const id_token = this._OnloadCallbackIdGenerator++;
+    this._OnloadCallbacks[`${id_token}`] = callback;
+    this._OnloadCallbacksSize++;
+    if (this._SyncingResourceInfo !== null) {
+      this._SyncingResourceInfo.NdLd = 1;
+    }
+    return id_token;
+  }
+
+  UnregisterOnloadCallback(callback_id) {
+    delete this._OnloadCallbacks[`${callback_id}`];
+    this._OnloadCallbacksSize--;
+  }
+
+  InvokeOnloadCallbacks() {
+    if (this._OnloadCallbacksSize > 0) {
+      for (const a in this._OnloadCallbacks) {
+        if (this._OnloadCallbacks.hasOwnProperty(a)) {
+          this._OnloadCallbacks[a]();
+        }
+      }
+    }
+  }
+
+  IsLoaded() {
+    return this.LoadTime !== 0 && !this.Unloaded;
+  }
+}
+Forge.RenderTextureDelegate = RenderTextureDelegate;

package/dom/jsview-dom/src/engine-js/browser/renderer_deprecated.js

@@ -0,0 +1,75 @@
+import Forge from "../ForgeDefine";
+
+class DeprecatedRenderer {
+  constructor() {
+    Forge.sDeprecatedRenderer = this;
+    // Create shared texture manager
+    this._SharedTextureManager = this.CreateTextureManager();
+  }
+
+  SetUserId(user_id) {
+    Forge.sRenderBridge.UpdateUserId(user_id);
+  }
+
+  GetScreenInfo() {
+    return Forge.sRenderBridge.GetScreenInfo();
+  }
+
+  StringWithFont() {
+    return Forge.sTextUtils.StringWithFont.apply(this, arguments);
+  }
+
+  GetTextWidth() {
+    return Forge.sTextUtils.GetTextWidth.apply(this, arguments);
+  }
+
+  GetTextUtils() {
+    return Forge.sTextUtils;
+  }
+
+  RectArea(x, y, w, h) {
+    return new Forge.RectArea(x, y, w, h);
+  }
+
+  TextAttr() {
+    return Forge.sTextUtils.TextAttr.apply(this, arguments);
+  }
+
+  GarbageCollect() {
+    Forge.LogM("GarbageCollect called");
+  }
+
+  TriggerFrameDraw() {
+    Forge.sRenderBridge.RequestSwap();
+  }
+
+  /**
+     * 全局共享的TextureManager
+     *
+     * @public
+     * @func GetSharedTextureManager
+     * @memberof Forge.DeprecatedRenderer
+     * @instance
+     * @return {Forge.TextureManager} texture管理对象
+     * */
+  GetSharedTextureManager() {
+    return this._SharedTextureManager;
+  }
+
+  /**
+     * 创建一个TextureManager<br>
+     *     请注意：使用Activity时，TextureManager已经在Activity内部进行构建，请不要额外构建
+     *
+     * @public
+     * @func CreateTextureManager
+     * @memberof Forge.DeprecatedRenderer
+     * @instance
+     * @return {Forge.TextureManager} texture管理对象
+     * */
+  CreateTextureManager() {
+    const texture_manager = new Forge.TextureManager();
+    return texture_manager;
+  }
+}
+Forge.DeprecatedRenderer = DeprecatedRenderer;
+Forge.sDeprecatedRenderer = null;

package/dom/jsview-dom/src/engine-js/browser/sound_pool.js

@@ -0,0 +1,139 @@
+/*
+ * @Author: ChenChanghua
+ * @Date: 2020-07-20 09:37:37
+ * @LastEditors: ChenChanghua
+ * @LastEditTime: 2020-09-21 13:47:49
+ * @Description: file content
+ */
+/* eslint-disable no-unused-vars */
+import URL from "./url";
+
+const AudioContext = window.AudioContext || window.webkitAudioContext;
+if (AudioContext) {
+  const audioContext = new AudioContext();
+  let soundIdCount = 0;
+  let streamIdCount = 0;
+
+  class Stream {
+    constructor(context, bufferSource, gain) {
+      this._Context = context;
+      this._BufferSource = bufferSource;
+      this._Gain = gain;
+      this._BufferSource.connect(this._Gain);
+      this._Gain.connect(this._Context.destination);
+    }
+
+    start(when, offset, duration) {
+      this._BufferSource.start(when, offset, duration);
+    }
+
+    setVolume(volume) {
+      this._Gain.gain.setValueAtTime(volume, this._Context.currentTime);
+    }
+
+    stop(when) {
+      this._BufferSource.stop(when);
+    }
+  }
+
+  class SoundPool {
+    constructor() {
+      this._SoundBufferMap = {};
+      this._StreamMap = {};
+    }
+
+    load(url, netsetting, priority, callback) {
+      const realUrl = new URL(url).href;
+      const soundId = soundIdCount++;
+      this._requestBuffer(realUrl, (status, response) => {
+        if (status === 0) {
+          audioContext.decodeAudioData(response, (buffer) => {
+            this._SoundBufferMap[soundId] = buffer;
+            callback(soundId, 0);
+          });
+        } else {
+          callback(-1, -1);
+        }
+      });
+      return soundId;
+    }
+
+    unload(soundId) {
+      delete this._SoundBufferMap[soundId];
+    }
+
+    autoPause() { }
+
+    autoResume() { }
+
+    play(soundId, leftVolume, rightVolume, priority, loop, rate) {
+      if (this._SoundBufferMap[soundId]) {
+        const streamId = streamIdCount++;
+        const bufferSource = audioContext.createBufferSource();
+        bufferSource.buffer = this._SoundBufferMap[soundId];
+        bufferSource.playbackRate.value = rate;
+        bufferSource.onended = (event) => {
+          this.stop(streamId);
+        };
+        if (loop > 0) {
+          bufferSource.loop = true;
+        }
+        const gainNode = audioContext.createGain();
+        gainNode.gain.setValueAtTime(leftVolume, audioContext.currentTime);
+        const stream = new Stream(audioContext, bufferSource, gainNode);
+        this._StreamMap[streamId] = stream;
+        console.log("loop test", (loop + 1) * this._SoundBufferMap[soundId].duration);
+        stream.start(0, 0, (loop + 1) * this._SoundBufferMap[soundId].duration);
+        return streamId;
+      }
+      return -1;
+    }
+
+    pause(streamId) { }
+
+    resume(streamId) { }
+
+    stop(streamId) {
+      if (this._StreamMap[streamId]) {
+        this._StreamMap[streamId].stop();
+        delete this._StreamMap[streamId];
+      }
+    }
+
+    release() {
+      this._SoundBufferMap = {};
+      this._StreamMap = {};
+    }
+
+    setVolume(streamId, leftVolume, rightVolume) {
+      if (this._StreamMap[streamId]) {
+        this._StreamMap[streamId].setVolume(leftVolume);
+      }
+    }
+
+    setPriority(streamId, priority) { }
+
+    setRate(streamId, rate) { }
+
+    setLoop(streamId, loop) { }
+
+    _requestBuffer(url, callback) {
+      const xhr = new XMLHttpRequest();
+      xhr.open('GET', url, true);
+      xhr.responseType = 'arraybuffer';
+      xhr.onload = () => {
+        if (xhr.status === 200) {
+          console.log("http request succeed");
+          callback(0, xhr.response);
+        } else {
+          console.error(`download audio ${url} failed.`, xhr.status);
+          callback(-1, null);
+        }
+      };
+      xhr.send();
+    }
+  }
+  window.SoundPool = SoundPool;
+} else {
+  window.SoundPool = null;
+}

package/dom/jsview-dom/src/engine-js/browser/steps_animation.js

@@ -0,0 +1,192 @@
+/**
+ * Created by ludl on 6/11/20.
+ */
+/* eslint-disable no-unused-vars */
+import Forge from "../ForgeDefine";
+import { animationToStyle, getStaticFrameControl } from "./animation_keyframe";
+
+let sKeyFrameTokenGenerator = 0;
+
+class StepsAnimation extends Forge.AnimationDelegate {
+  constructor(type_name, duration) {
+    super(type_name, duration, null); // Easing 只支持linear形式
+    this._StepsCount = 1;
+    this._Running = false; // 记录动画是否被Cancel
+    this._NextStepIndex = 0; // 记录动画运行的进度
+
+    const that = this;
+    this._OnStepEnd = () => {
+      that._NextStep();
+    };
+  }
+
+  SetStepsCount(steps_count) {
+    this._StepsCount = steps_count;
+    this._SplitSteps();
+  }
+
+  Start(layout_view) {
+    super.Start(layout_view);
+
+    // 激活步骤进度监听处理
+    if (!window.jsvInAndroidWebView) {
+      this._LayoutViewRef.Element.addEventListener("animationend", this._OnStepEnd);
+    } else {
+      this._LayoutViewRef.Element.addEventListener("webkitAnimationEnd", this._OnStepEnd);
+    }
+
+    // 开始动画
+    this._Running = true;
+    this._NextStep();
+  }
+
+  Cancel() {
+    // 仅调整状态，在当前步骤的动画完成后，会进入停止处理
+    this._Running = false;
+  }
+
+  _NextStep() {
+    // 回收KeyFrame
+    if (this._KeyFrameName !== null) {
+      getStaticFrameControl().removeRule(this._KeyFrameName);
+      this._KeyFrameName = null;
+    }
+
+    // 校验动画是否停止
+    const on_end = (this._NextStepIndex === this._StepsCount);
+    if (!this._Running || on_end) {
+      // 动画结束
+      this._PerformAnimationEnd(on_end);
+      return;
+    }
+
+    // 描画下一步动画
+    const animation = this._CreateOneStepKeyFrame(this._NextStepIndex);
+    this._KeyFrameName = animation.name;
+    getStaticFrameControl().insertRule(animation.keyFrameString);
+
+    const style_animation = animationToStyle({
+      repeatTimes: this.repeatTimes,
+      easing: this.easing,
+      delayedTime: 0,
+      duration: this.duration / this._StepsCount
+    }, this._KeyFrameName);
+    const html_element = this._LayoutViewRef.Element;
+
+    if (!window.jsvInAndroidWebView) {
+      html_element.style.animation = style_animation;
+    } else {
+      html_element.style.webkitAnimation = style_animation;
+    }
+
+    this._NextStepIndex++;
+  }
+
+  _PerformAnimationEnd(on_end) {
+    // 清理OnEndListener监听，否则会重复收到
+    if (!window.jsvInAndroidWebView) {
+      this._LayoutViewRef.Element.removeEventListener("animationend", this._OnStepEnd);
+    } else {
+      this._LayoutViewRef.Element.removeEventListener("webkitAnimationEnd", this._OnStepEnd);
+    }
+
+    const progress = this._NextStepIndex / this._StepsCount;
+
+    if ((this.enableFlags & Forge.AnimationEnable.KeepTransform) !== 0) {
+      const frozen_transform = this._GetFrozenTransform(this._NextStepIndex - 1);
+      this._LayoutViewRef.ResetCssTransform(
+        frozen_transform.transform,
+        frozen_transform.transformOrigin);
+    }
+
+    // 注意: OnEnd处理放在transform制作之后
+    if (on_end) {
+      this.OnEnd();
+    }
+
+    // 进度信息要异步回调，模拟JsView native的场景
+    window.setTimeout((() => {
+      this.OnFinalProgress(progress);
+    }), 0);
+  }
+
+  _GetFrozenTransform(current_index) {
+    // should override
+    console.warn("Warning:Should override and keep view transform by ResetCssTransform()");
+  }
+
+  _SplitSteps() {
+    // should override
+    console.warn("Warning: should be override by child class");
+  }
+
+  _CreateOneStepKeyFrame(next_step_index) {
+    // should override
+    console.warn("Warning: should be override by child class");
+  }
+}
+
+Forge.TranslateStepAnimation = class extends StepsAnimation {
+  constructor(start_x, end_x, start_y, end_y, duration) {
+    super("TL-S", duration);
+
+    this.startX = start_x;
+    this.startY = start_y;
+    this.endX = end_x;
+    this.endY = end_y;
+    this._StepsArray = null;
+  }
+
+  // Override
+  _SplitSteps() {
+    const steps_count = this._StepsCount;
+    const x_step_distance = (this.endX - this.startX) / steps_count;
+    const y_step_distance = (this.endY - this.startY) / steps_count;
+    this._StepsArray = new Array(steps_count);
+    let x = this.startX;
+    let y = this.startY;
+    for (let i = 0; i < steps_count - 1; i++) {
+      x += x_step_distance;
+      y += y_step_distance;
+      this._StepsArray[i] = {
+        targetX: Math.floor(x),
+        targetY: Math.floor(y),
+      };
+    }
+    // 最后一项
+    this._StepsArray[steps_count - 1] = {
+      targetX: this.endX,
+      targetY: this.endY,
+    };
+  }
+
+  // Override
+  _CreateOneStepKeyFrame(next_step_index) {
+    // 计算动画起始位置
+    let start_x = 0;
+    let start_y = 0;
+    if (next_step_index === 0) {
+      start_x = this.startX;
+      start_y = this.startY;
+    } else {
+      start_x = this._StepsArray[next_step_index - 1].targetX;
+      start_y = this._StepsArray[next_step_index - 1].targetY;
+    }
+
+    // 计算动画结束位置
+    const end_x = this._StepsArray[next_step_index].targetX;
+    const end_y = this._StepsArray[next_step_index].targetY;
+
+    const keyframe_name = `_ForgeStepAnim_TL_${sKeyFrameTokenGenerator++}`;
+    const keyframe_string = `@keyframes ${keyframe_name} {
+      0%{transform:translate3d(${start_x}px,${start_y}px,0);}
+      100%{transform:translate3d(${end_x}px,${end_y}px,0);}}`;
+    return { name: keyframe_name, keyFrameString: keyframe_string };
+  }
+
+  // Override
+  _GetFrozenTransform(current_index) {
+    const transform = `translate3d(${this._StepsArray[current_index].targetX}px,${this._StepsArray[current_index].targetY}px,0)`;
+    return { transform, transformOrigin: null };
+  }
+};