From 02d38fd8242aefb5a375df0f8a8256e33583b66c Mon Sep 17 00:00:00 2001 From: Yuan <294065614@qq.com> Date: Thu, 20 Jun 2024 12:02:05 +0800 Subject: [PATCH 1/5] 1 --- sdk/src/TouchHandler.js | 23 +++++++++++++++++++++++ 1 file changed, 23 insertions(+) diff --git a/sdk/src/TouchHandler.js b/sdk/src/TouchHandler.js index 886bbb8..dd59ed6 100644 --- a/sdk/src/TouchHandler.js +++ b/sdk/src/TouchHandler.js @@ -48,6 +48,8 @@ const KEYBOARD_MODE = { export default class TouchHandler { constructor({player, isMobile, sendHandler, isDebug, autoRotate, inputId = ''}) { + // 监听鼠标是否离开当前画面 + this.mouseLeave = false; // 监听触控鼠键事件的Dom this.displayDom = player; // 事件回调，可通过该函数获取模拟事件 @@ -122,6 +124,8 @@ export default class TouchHandler { this.util.bind(this.displayDom, 'mouseup', this.onMouseUp.bind(this)); this.util.bind(this.displayDom, 'mousemove', this.util.throttle( this.onMouseMove.bind(this), MOVE_THROTTLE_DELAY, this).bind(this)); + this.util.bind(document, 'mousemove', this.util.throttle( + this.onMouseLeave.bind(this), MOVE_THROTTLE_DELAY, this).bind(this)); this.util.bind(this.displayDom, 'contextmenu', () => false); } @@ -293,6 +297,25 @@ export default class TouchHandler { } } + onMouseLeave(event) { + const pos = this.getCurrentMousePos(event); + if ( + pos.x > this.displayBox.width || + pos.x < 0 || + pos.y < 0 || + pos.y > this.displayBox.height + ) { + if (!this.mouseLeave) { + this.mouseLeave = true; + } + } else { + if (this.mouseLeave) { + this._mouseAction(event, "UP"); + this.mouseLeave = false; + } + } + } + onMouseUp(event) { event = event || window.event; this.preventDefault(event); -- Gitee From bf305ad28abcd16cca28d2d67b7efdd8f7676c17 Mon Sep 17 00:00:00 2001 From: Yuan <294065614@qq.com> Date: Thu, 20 Jun 2024 16:46:19 +0800 Subject: [PATCH 2/5] 1 --- sdk/src/TouchHandler.js | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) diff --git a/sdk/src/TouchHandler.js b/sdk/src/TouchHandler.js index dd59ed6..3c449e1 100644 --- a/sdk/src/TouchHandler.js +++ b/sdk/src/TouchHandler.js @@ -307,14 +307,21 @@ export default class TouchHandler { ) { if (!this.mouseLeave) { this.mouseLeave = true; + this.sendTouchMsg( + { + x: 0, + y: 0, + vId: undefined, + }, + "UP" + ); } } else { if (this.mouseLeave) { - this._mouseAction(event, "UP"); this.mouseLeave = false; } } - } + } onMouseUp(event) { event = event || window.event; -- Gitee From 324c02d503234dfcc6fbb2856f3468deab9cb529 Mon Sep 17 00:00:00 2001 From: Yuan <294065614@qq.com> Date: Thu, 20 Jun 2024 20:04:35 +0800 Subject: [PATCH 3/5] 1 --- sdk/src/AppController.js | 3 ++- sdk/src/TouchHandler.js | 47 ++++++++++++++++------------------------ 2 files changed, 21 insertions(+), 29 deletions(-) diff --git a/sdk/src/AppController.js b/sdk/src/AppController.js index a2d0cc9..e17a82c 100644 --- a/sdk/src/AppController.js +++ b/sdk/src/AppController.js @@ -365,7 +365,8 @@ class AppController { sendHandler: this.send, isDebug: this.options.isDebug, autoRotate: this.options.autoRotate, - inputId: this.keyboardInput && this.keyboardInput.inputId || '' + inputId: this.keyboardInput && this.keyboardInput.inputId || '', + containerId: this.options.containerId, }); this.touchHandler.start(); if (this.options.keycodeInput && !this.options.isMobile) { diff --git a/sdk/src/TouchHandler.js b/sdk/src/TouchHandler.js index 3c449e1..77a282d 100644 --- a/sdk/src/TouchHandler.js +++ b/sdk/src/TouchHandler.js @@ -47,9 +47,10 @@ const KEYBOARD_MODE = { }; export default class TouchHandler { - constructor({player, isMobile, sendHandler, isDebug, autoRotate, inputId = ''}) { - // 监听鼠标是否离开当前画面 - this.mouseLeave = false; + constructor({player, isMobile, sendHandler, isDebug, autoRotate, inputId = '', containerId}) { + // 离开画面前最后一次鼠标操作 + this.lastMouseAction = ''; + this.containerId = containerId; // 监听触控鼠键事件的Dom this.displayDom = player; // 事件回调，可通过该函数获取模拟事件 @@ -124,8 +125,7 @@ export default class TouchHandler { this.util.bind(this.displayDom, 'mouseup', this.onMouseUp.bind(this)); this.util.bind(this.displayDom, 'mousemove', this.util.throttle( this.onMouseMove.bind(this), MOVE_THROTTLE_DELAY, this).bind(this)); - this.util.bind(document, 'mousemove', this.util.throttle( - this.onMouseLeave.bind(this), MOVE_THROTTLE_DELAY, this).bind(this)); + this.util.bind(document.getElementById(this.containerId), 'mouseleave', this.onMouseLeave.bind(this)); this.util.bind(this.displayDom, 'contextmenu', () => false); } @@ -250,6 +250,7 @@ export default class TouchHandler { } _mouseAction(event, action) { + this.lastMouseAction = action; const mouseCode = event.button; const pos = this.getCurrentMousePos(event); let mouseState = this.simulationState.mouse; @@ -297,31 +298,21 @@ export default class TouchHandler { } } - onMouseLeave(event) { - const pos = this.getCurrentMousePos(event); - if ( - pos.x > this.displayBox.width || - pos.x < 0 || - pos.y < 0 || - pos.y > this.displayBox.height - ) { - if (!this.mouseLeave) { - this.mouseLeave = true; + onMouseLeave() { + if(this.lastMouseAction === 'DOWN'){ + this.lastMouseAction ="UP"; + this.freeVirtualTouchId(0); + this.simulationState.mouse={}; this.sendTouchMsg( - { - x: 0, - y: 0, - vId: undefined, - }, - "UP" + { + x: 0, + y: 0, + vId: 0, + }, + "UP" ); - } - } else { - if (this.mouseLeave) { - this.mouseLeave = false; - } - } - } + } + } onMouseUp(event) { event = event || window.event; -- Gitee From 9ee3599a0d434a45723d3ef9ad5b05f020e0c23e Mon Sep 17 00:00:00 2001 From: Yuan <294065614@qq.com> Date: Fri, 21 Jun 2024 12:07:00 +0800 Subject: [PATCH 4/5] 1 --- sdk/src/TouchHandler.js | 30 ++++++++++++++++++------------ 1 file changed, 18 insertions(+), 12 deletions(-) diff --git a/sdk/src/TouchHandler.js b/sdk/src/TouchHandler.js index 77a282d..c50f885 100644 --- a/sdk/src/TouchHandler.js +++ b/sdk/src/TouchHandler.js @@ -225,6 +225,9 @@ export default class TouchHandler { ...pos, vId: existTouch && existTouch.vId || 0 }, 'MOVE'); + if((pos.x > this.displayBox.width || pos.x < 0 || pos.y < 0 || pos.y > this.displayBox.height)){ + this.clearTouchAndMouse() + } } } @@ -262,7 +265,6 @@ export default class TouchHandler { vId = this.allocVirtualTouchId(); mouseState[mouseCode] = vId; } - this.sendTouchMsg({ ...pos, vId @@ -301,16 +303,7 @@ export default class TouchHandler { onMouseLeave() { if(this.lastMouseAction === 'DOWN'){ this.lastMouseAction ="UP"; - this.freeVirtualTouchId(0); - this.simulationState.mouse={}; - this.sendTouchMsg( - { - x: 0, - y: 0, - vId: 0, - }, - "UP" - ); + this.clearTouchAndMouse() } } @@ -507,7 +500,6 @@ export default class TouchHandler { if (touch.x > this.displayBox.width || touch.x < 0 || touch.y < 0 || touch.y > this.displayBox.height) { return; } - let finalOrientation; if (this.isMobile) { finalOrientation = ORIENTATION_ORIGIN_MOBILE[this.orientation]; @@ -536,6 +528,20 @@ export default class TouchHandler { const msgBuf = this.getKeyCodeEventMsgBuf(msg); this.sendHandler(msgBuf); } + + clearTouchAndMouse() { + this.freeVirtualTouchId(0); + this.simulationState.touch = {}; + this.simulationState.mouse = {}; + this.sendTouchMsg( + { + x: 0, + y: 0, + vId: 0, + }, + "UP" + ); + } destroy() { this.util.unbind(window, 'resize'); -- Gitee From bd41d479967ef3a75498ed6d18c060d84dc6558c Mon Sep 17 00:00:00 2001 From: Yuan <294065614@qq.com> Date: Mon, 24 Jun 2024 15:58:14 +0800 Subject: [PATCH 5/5] 1 --- README.md | 13 ++++++++----- sdk/demo/demo.html | 11 +++++++++-- sdk/package.json | 1 - 3 files changed, 17 insertions(+), 8 deletions(-) diff --git a/README.md b/README.md index 6a8453c..48ecdaf 100644 --- a/README.md +++ b/README.md @@ -102,7 +102,7 @@ Chrome restricts the usage of WebCryptographyApi to secure origins. It means 'ht - 参数介绍 - @param {string} containerId：渲染游戏视图的 DOM 元素 id，必选 + @param {string} containerId：渲染游戏视图的 DOM 元素 id，必选。暂时不支持修改，可能导致JS获取不到DOM @param {object} params：启动相关配置，必选 @@ -114,9 +114,9 @@ Chrome restricts the usage of WebCryptographyApi to secure origins. It means 'ht | ticket | 是 | String | 随机数 | | aes_key | 是 | String | 对称秘钥 | | auth_ts | 是 | String | 验签时间戳 | - | background_timeout | 是 | String | home时长 | - | available_playtime | 是 | String | 试玩时长 | - | touch_timeout | 否 | String | 无触控时长 | + | background_timeout | 是 | String | 页面非活跃状态超时时长 (值为0时，无超时判断) | + | available_playtime | 是 | String | 单次连接可用时长 (值为0时，无超时判断) | + | touch_timeout | 否 | String | 无触控时长 (值为0时，无超时判断) | | user_id | 否 | String | 用户id | | auto_rotate | 否 | Boolean | 是否根据真机方向和应用方向自适应旋转画面 | | media_config | 否 | Object | 可配置虚拟分辨率宽高（stream_width、stream_height）和 真机物理宽高(physical_width、physical_height) | @@ -341,11 +341,14 @@ Chrome restricts the usage of WebCryptographyApi to secure origins. It means 'ht ### 6. FAQ - 部署后页面访问地址中需要携带目标html的完整名称。如：https://110.123.23.34:1001/enter.html -- 出现AESGCMCrypto undefined的相关错误，是由于浏览器安全策略限制。需要使用HTTPS协议访问项目。 +- 出现AESGCMCrypto undefined的相关错误，是由于浏览器安全策略限制。需要使用HTTPS协议访问项目, 或使用localhost:XXXX、127.0.0.1:XXXX访问项目。 - 使用iframe嵌入项目，报SecurityError:The operation is insecure.相关错误。需要设置iframe标签的属性sandbox为allow-scripts。 - 使用iframe嵌入项目，报错Failed to read the 'localStorage' property from 'Window'.相关错误。需要给iframe标签添加allow-same-origin属性。 - 项目报错：Failed to execute 'importScripts' on 'WorkerGlobalScope': The URL '/xxx/xxx/lib/libffmpeg_264_265.js' is invalid。请检查demo.html中libPath(编解码库文件的地址)参数的值是否正确。libPath可以不用修改。如果用户需要修改，要写完整的目录路径，如：'https://110.123.23.34:1001/lib/'。验证目录地址配置是否正确，可在浏览器中输入'https://110.123.23.34:1001/lib/libffmpeg_264_265.js'访问，可成功访问文件内容，则配置正确。 +- 部署后页面提示样式找不到。如：style is null | undefined +- 请检查是否修改了demo.html中DOM元素的ID，当前ID与逻辑绑定，正在优化中。若要修改，请确保JS操作DOM时，对应的ID参数也一并进行了修改。 + ### 7. license Apache License 2.0。 diff --git a/sdk/demo/demo.html b/sdk/demo/demo.html index 925923e..af06a31 100644 --- a/sdk/demo/demo.html +++ b/sdk/demo/demo.html @@ -589,10 +589,17 @@ Copyright 2022 Huawei Cloud Computing Technology Co., Ltd. STARTED: 2048, RESUMED: 5120, MEDIA_CONFIG_SUCCESS: 8448, - BACK_HOME: 6400 + RETRY_SUCCESS: 3072, + BACK_HOME: 6400, }; - var normalStates = [STATE_CONFIG.STARTED, STATE_CONFIG.RESUMED, STATE_CONFIG.MEDIA_CONFIG_SUCCESS, STATE_CONFIG.BACK_HOME]; + var normalStates = [ + STATE_CONFIG.STARTED, + STATE_CONFIG.RESUMED, + STATE_CONFIG.MEDIA_CONFIG_SUCCESS, + STATE_CONFIG.BACK_HOME, + STATE_CONFIG.RETRY_SUCCESS, + ]; document.getElementById("loading").style.display = normalStates.includes(state) ? 'none' : 'block'; showAlertModal(data); startsuccessCallBack(data); diff --git a/sdk/package.json b/sdk/package.json index d3968af..e4b01bd 100644 --- a/sdk/package.json +++ b/sdk/package.json @@ -6,7 +6,6 @@ "scripts": { "build": "webpack --config webpack.config.js", "dev": "webpack-dev-server --config webpack.dev.js --progress", - "server": "webpack-dev-server", "eslint": "eslint src/** *.js -f html -o eslint-report.html", "esfix": "eslint src/** *.js --fix", "test": "jest --watchAll --coverage" -- Gitee