1/* 2 * Copyright (C) 2022 Huawei Device Co., Ltd. 3 * Licensed under the Apache License, Version 2.0 (the "License"); 4 * you may not use this file except in compliance with the License. 5 * You may obtain a copy of the License at 6 * 7 * http://www.apache.org/licenses/LICENSE-2.0 8 * 9 * Unless required by applicable law or agreed to in writing, software 10 * distributed under the License is distributed on an "AS IS" BASIS, 11 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 12 * See the License for the specific language governing permissions and 13 * limitations under the License. 14 */ 15 16import {RangeSelectStruct, TraceRow} from "./TraceRow.js"; 17import {Rect} from "../timer-shaft/Rect.js"; 18 19export class RangeSelect { 20 rowsEL: HTMLDivElement | undefined | null; 21 isMouseDown: boolean = false; 22 public rangeTraceRow: Array<TraceRow<any>> | undefined 23 public selectHandler: ((ds: Array<TraceRow<any>>) => void) | undefined; 24 private rowA: TraceRow<any> | undefined 25 private rowB: TraceRow<any> | undefined 26 private startX: number = 0 27 private endX: number = 0; 28 private startY: number = 0 29 private endY: number = 0; 30 31 constructor() { 32 } 33 34 printFrame(div: HTMLElement) { 35 console.log("offset frame:", div.offsetLeft, div.offsetTop, div.offsetWidth, div.offsetHeight) 36 console.log("client frame:", div.clientLeft, div.clientTop, div.clientWidth, div.clientHeight) 37 console.log("scroll frame:", div.scrollLeft, div.scrollTop, div.scrollWidth, div.scrollHeight) 38 } 39 40 printEventFrame(ev: MouseEvent) { 41 console.log("mouse event normal:", ev.x, ev.y) 42 console.log("mouse event offset:", ev.offsetX, ev.offsetY) 43 console.log("mouse event client:", ev.clientX, ev.clientY) 44 console.log("mouse event page :", ev.pageX, ev.pageY) 45 console.log("mouse event movement:", ev.movementX, ev.movementY) 46 console.log("mouse event screen :", ev.screenX, ev.screenY) 47 } 48 49 isInRowsEl(ev: MouseEvent): boolean { 50 return (ev.offsetY > this.rowsEL!.offsetTop! && 51 ev.offsetY < this.rowsEL!.offsetTop + this.rowsEL!.offsetHeight && 52 ev.offsetX > this.rowsEL!.offsetLeft! && 53 ev.offsetX < this.rowsEL!.offsetLeft + this.rowsEL!.offsetWidth 54 ) 55 } 56 57 mouseDown(ev: MouseEvent) { 58 this.rangeTraceRow = []; 59 if (this.isInRowsEl(ev)) { 60 this.isMouseDown = true; 61 this.startX = ev.offsetX - this.rowsEL!.offsetLeft!; 62 this.startY = ev.offsetY - this.rowsEL!.offsetTop!; 63 } 64 } 65 66 mouseUp(ev: MouseEvent) { 67 if (this.isInRowsEl(ev) && this.isDrag()) { 68 this.endX = ev.offsetX - this.rowsEL!.offsetLeft!; 69 this.endY = ev.offsetY - this.rowsEL!.clientTop! + this.rowsEL!.offsetTop!; 70 if (this.selectHandler) { 71 this.selectHandler(this.rangeTraceRow || []) 72 } 73 } 74 this.isMouseDown = false; 75 } 76 77 isDrag(): boolean { 78 return this.startX != this.endX && this.startY != this.endY; 79 } 80 81 mouseMove(rows: Array<TraceRow<any>>, ev: MouseEvent) { 82 if (!this.isMouseDown) return; 83 this.endX = ev.offsetX - this.rowsEL!.offsetLeft!; 84 this.endY = ev.offsetY - this.rowsEL!.offsetTop!; 85 let scrollTop = this.rowsEL?.scrollTop || 0 86 let xMin = this.startX < this.endX ? this.startX : this.endX; 87 let xMax = this.startX > this.endX ? this.startX : this.endX; 88 let yMin = this.startY < this.endY ? this.startY : this.endY; 89 let yMax = this.startY > this.endY ? this.startY : this.endY; 90 let rangeSelect: RangeSelectStruct | undefined; 91 this.rangeTraceRow = rows.filter(it => { 92 let rt = new Rect(xMin - (it.canvasContainer?.offsetLeft || 0), yMin - (it.canvasContainer?.offsetTop || 0) + scrollTop + this.rowsEL!.offsetTop, xMax - xMin, yMax - yMin); 93 if (Rect.intersect(it.frame, rt)) { 94 if (!rangeSelect) { 95 rangeSelect = new RangeSelectStruct(); 96 let startX = Math.floor(rt.x <= 0 ? 0 : rt.x); 97 let endX = Math.floor((rt.x + rt.width) > it.frame.width ? it.frame.width : (rt.x + rt.width)); 98 rangeSelect.startNS = Math.floor((TraceRow.range!.endNS - TraceRow.range!.startNS) * startX / it.frame.width + TraceRow.range!.startNS!); 99 rangeSelect.endNS = Math.floor((TraceRow.range!.endNS - TraceRow.range!.startNS) * endX / it.frame.width + TraceRow.range!.startNS!); 100 } 101 TraceRow.rangeSelectObject = rangeSelect; 102 it.rangeSelect = true; 103 return true 104 } else { 105 it.rangeSelect = false; 106 return false; 107 } 108 }) 109 } 110} 111