Commit 57b3b022 authored by 李维's avatar 李维

fixed the bug of not support touch pc

parent dff26fd1
...@@ -96,6 +96,7 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -96,6 +96,7 @@ export class PlayComponent implements OnInit, OnDestroy {
g_enableMapDown = true; // 触摸使能 g_enableMapDown = true; // 触摸使能
g_enableMapUp = true; // 抬起使能 g_enableMapUp = true; // 抬起使能
g_enableMapMove = true; // 移动ss使能 g_enableMapMove = true; // 移动ss使能
g_firstTouch = true;
g_canvasLeft; g_canvasLeft;
g_canvasTop; g_canvasTop;
g_animationId: any; g_animationId: any;
...@@ -1229,70 +1230,93 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -1229,70 +1230,93 @@ export class PlayComponent implements OnInit, OnDestroy {
initListener() { initListener() {
const element = this.canvas.nativeElement;
this.g_winResizeEventStream.pipe(debounceTime(500)).subscribe(data => { this.g_winResizeEventStream.pipe(debounceTime(500)).subscribe(data => {
this.renderAfterResize(); this.renderAfterResize();
}); });
if (this.IsPC()) { const addTouchListener = () => {
this.canvas.nativeElement.addEventListener("mousedown", event => { element.addEventListener('touchstart', touchDownFunc);
setMxMyByMouse(event); element.addEventListener('touchmove', touchMoveFunc);
this.mapDown(event); element.addEventListener('touchend', touchUpFunc);
}); element.addEventListener('touchcancel', touchUpFunc);
};
this.canvas.nativeElement.addEventListener("mousemove", event => { const removeTouchListener = () => {
setMxMyByMouse(event); element.removeEventListener('touchstart', touchDownFunc);
this.mapMove(event); element.removeEventListener('touchmove', touchMoveFunc);
}); element.removeEventListener('touchend', touchUpFunc);
element.removeEventListener('touchcancel', touchUpFunc);
this.canvas.nativeElement.addEventListener("mouseup", event => { };
setMxMyByMouse(event);
this.mapUp(event); const addMouseListener = () => {
}); element.addEventListener('mousedown', mouseDownFunc);
element.addEventListener('mousemove', mouseMoveFunc);
const setMxMyByMouse = event => { element.addEventListener('mouseup', mouseUpFunc);
this.g_clickX = event.offsetX; };
this.g_clickY = event.offsetY; const removeMouseListener = () => {
}; element.removeEventListener('mousedown', mouseDownFunc);
} else { element.removeEventListener('mousemove', mouseMoveFunc);
this.canvas.nativeElement.addEventListener("touchstart", event => { element.removeEventListener('mouseup', mouseUpFunc);
setMxMyByTouch(event); };
this.mapDown(event);
}); const touchDownFunc = (e) => {
if (this.g_firstTouch) {
this.canvas.nativeElement.addEventListener("touchmove", event => { this.g_firstTouch = false;
setMxMyByTouch(event); removeMouseListener();
this.mapMove(event); }
}); setMxMyByTouch(e);
this.mapDown(e);
this.canvas.nativeElement.addEventListener("touchend", event => { };
setMxMyByTouch(event); const touchMoveFunc = (e) => {
this.mapUp(event); setMxMyByTouch(e);
}); this.mapMove(e);
};
this.canvas.nativeElement.addEventListener("touchcancel", event => { const touchUpFunc = (e) => {
setMxMyByTouch(event); setMxMyByTouch(e);
this.mapUp(event); this.mapUp(e);
}); };
const setMxMyByTouch = event => { const mouseDownFunc = (e) => {
if (event.touches.length <= 0) { if (this.g_firstTouch) {
return; this.g_firstTouch = false;
} removeTouchListener();
}
if (this.g_canvasLeft == null) { setMxMyByMouse(e);
setParentOffset(); this.mapDown(e);
} };
const mouseMoveFunc = (e) => {
this.g_clickX = event.touches[0].pageX - this.g_canvasLeft; setMxMyByMouse(e);
this.g_clickY = event.touches[0].pageY - this.g_canvasTop; this.mapMove(e);
}; };
const mouseUpFunc = (e) => {
const setParentOffset = () => { setMxMyByMouse(e);
const rect = this.canvas.nativeElement.getBoundingClientRect(); this.mapUp(e);
this.g_canvasLeft = rect.left; };
this.g_canvasTop = rect.top;
}; const setMxMyByTouch = event => {
} if (event.touches.length <= 0) {
return;
}
if (this.g_canvasLeft == null) {
setParentOffset();
}
this.g_clickX = event.touches[0].pageX - this.g_canvasLeft;
this.g_clickY = event.touches[0].pageY - this.g_canvasTop;
};
const setParentOffset = () => {
const rect = this.canvas.nativeElement.getBoundingClientRect();
this.g_canvasLeft = rect.left;
this.g_canvasTop = rect.top;
};
const setMxMyByMouse = (event) => {
this.g_clickX = event.offsetX;
this.g_clickY = event.offsetY;
};
addMouseListener();
addTouchListener();
} }
showArr(arr) { showArr(arr) {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment