LineageOS/android_development
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge changes I0345e5d1,I64c8a80b

Browse Source 
* changes:
  Support panning in rects view
  Rename Angular components internal/wrapped properties
This commit is contained in:
Kean Mariotti
2022-12-22 12:59:55 +00:00
committed by Android (Google) Code Review
parent d763256765 a8d7d1e2d1
commit 653c91a241
6 changed files with 104 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
tools/winscope-ng/src/app/components/timeline/timeline.component.spec.ts
View File

@@ -122,22 +122,22 @@ describe("TimelineComponent", () => {
it("processes active trace input and updates selected traces", () => {
component.activeViewTraceTypes = [TraceType.SURFACE_FLINGER];
expect(component.wrappedActiveTrace).toEqual(TraceType.SURFACE_FLINGER);
expect(component.internalActiveTrace).toEqual(TraceType.SURFACE_FLINGER);
expect(component.selectedTraces).toEqual([TraceType.SURFACE_FLINGER]);
component.activeViewTraceTypes = [TraceType.SURFACE_FLINGER];
expect(component.wrappedActiveTrace).toEqual(TraceType.SURFACE_FLINGER);
expect(component.internalActiveTrace).toEqual(TraceType.SURFACE_FLINGER);
expect(component.selectedTraces).toEqual([TraceType.SURFACE_FLINGER]);
component.activeViewTraceTypes = [TraceType.TRANSACTIONS];
expect(component.wrappedActiveTrace).toEqual(TraceType.TRANSACTIONS);
expect(component.internalActiveTrace).toEqual(TraceType.TRANSACTIONS);
expect(component.selectedTraces).toEqual([
TraceType.SURFACE_FLINGER,
TraceType.TRANSACTIONS
]);
component.activeViewTraceTypes = [TraceType.WINDOW_MANAGER];
expect(component.wrappedActiveTrace).toEqual(TraceType.WINDOW_MANAGER);
expect(component.internalActiveTrace).toEqual(TraceType.WINDOW_MANAGER);
expect(component.selectedTraces).toEqual([
TraceType.SURFACE_FLINGER,
TraceType.TRANSACTIONS,
@@ -145,7 +145,7 @@ describe("TimelineComponent", () => {
]);
component.activeViewTraceTypes = [TraceType.PROTO_LOG];
expect(component.wrappedActiveTrace).toEqual(TraceType.PROTO_LOG);
expect(component.internalActiveTrace).toEqual(TraceType.PROTO_LOG);
expect(component.selectedTraces).toEqual([
TraceType.TRANSACTIONS,
TraceType.WINDOW_MANAGER,
@@ -155,15 +155,15 @@ describe("TimelineComponent", () => {
it("handles undefined active trace input", () => {
component.activeViewTraceTypes = undefined;
expect(component.wrappedActiveTrace).toBeUndefined();
expect(component.internalActiveTrace).toBeUndefined();
expect(component.selectedTraces).toEqual([]);
component.activeViewTraceTypes = [TraceType.SURFACE_FLINGER];
expect(component.wrappedActiveTrace).toEqual(TraceType.SURFACE_FLINGER);
expect(component.internalActiveTrace).toEqual(TraceType.SURFACE_FLINGER);
expect(component.selectedTraces).toEqual([TraceType.SURFACE_FLINGER]);
component.activeViewTraceTypes = undefined;
expect(component.wrappedActiveTrace).toEqual(TraceType.SURFACE_FLINGER);
expect(component.internalActiveTrace).toEqual(TraceType.SURFACE_FLINGER);
expect(component.selectedTraces).toEqual([TraceType.SURFACE_FLINGER]);
});

30
tools/winscope-ng/src/app/components/timeline/timeline.component.ts
View File

@@ -284,10 +284,10 @@ export class TimelineComponent implements TimelineComponentDependencyInversion {
throw Error("Timeline component doesn't support viewers with dependencies length !== 1");
}
this.wrappedActiveTrace = types[0];
this.internalActiveTrace = types[0];
if (!this.selectedTraces.includes(this.wrappedActiveTrace)) {
this.selectedTraces.push(this.wrappedActiveTrace);
if (!this.selectedTraces.includes(this.internalActiveTrace)) {
this.selectedTraces.push(this.internalActiveTrace);
}
if (this.selectedTraces.length > this.MAX_SELECTED_TRACES) {
@@ -297,7 +297,7 @@ export class TimelineComponent implements TimelineComponentDependencyInversion {
this.selectedTracesFormControl.setValue(this.selectedTraces);
}
public wrappedActiveTrace: TraceType|undefined = undefined;
public internalActiveTrace: TraceType|undefined = undefined;
@Input() timelineData!: TimelineData;
@Input() availableTraces: TraceType[] = [];
@@ -404,7 +404,7 @@ export class TimelineComponent implements TimelineComponentDependencyInversion {
}
isOptionDisabled(trace: TraceType) {
if (this.wrappedActiveTrace === trace) {
if (this.internalActiveTrace === trace) {
return true;
}
@@ -440,33 +440,33 @@ export class TimelineComponent implements TimelineComponentDependencyInversion {
}
hasPrevEntry(): boolean {
if (!this.wrappedActiveTrace ||
(this.timelineData.getTimelines().get(this.wrappedActiveTrace)?.length ?? 0) === 0) {
if (!this.internalActiveTrace ||
(this.timelineData.getTimelines().get(this.internalActiveTrace)?.length ?? 0) === 0) {
return false;
}
return this.timelineData.getPreviousTimestampFor(this.wrappedActiveTrace) !== undefined;
return this.timelineData.getPreviousTimestampFor(this.internalActiveTrace) !== undefined;
}
hasNextEntry(): boolean {
if (!this.wrappedActiveTrace ||
(this.timelineData.getTimelines().get(this.wrappedActiveTrace)?.length ?? 0) === 0) {
if (!this.internalActiveTrace ||
(this.timelineData.getTimelines().get(this.internalActiveTrace)?.length ?? 0) === 0) {
return false;
}
return this.timelineData.getNextTimestampFor(this.wrappedActiveTrace) !== undefined;
return this.timelineData.getNextTimestampFor(this.internalActiveTrace) !== undefined;
}
moveToPreviousEntry() {
if (!this.wrappedActiveTrace) {
if (!this.internalActiveTrace) {
return;
}
this.timelineData.moveToPreviousTimestampFor(this.wrappedActiveTrace);
this.timelineData.moveToPreviousTimestampFor(this.internalActiveTrace);
}
moveToNextEntry() {
if (!this.wrappedActiveTrace) {
if (!this.internalActiveTrace) {
return;
}
this.timelineData.moveToNextTimestampFor(this.wrappedActiveTrace);
this.timelineData.moveToNextTimestampFor(this.internalActiveTrace);
}
humanElapsedTimeInputChange(event: Event) {

15
tools/winscope-ng/src/viewers/components/rects/canvas.ts
View File

@@ -16,7 +16,6 @@
import {Rectangle} from "viewers/common/rectangle";
import * as THREE from "three";
import {CSS2DObject, CSS2DRenderer} from "three/examples/jsm/renderers/CSS2DRenderer";
import {OrbitControls} from "three/examples/jsm/controls/OrbitControls";
import {ViewerEvents} from "viewers/common/viewer_events";
import {Circle3D, ColorType, Label3D, Point3D, Rect3D, Scene3D, Transform3D} from "./types3d";
@@ -58,16 +57,22 @@ export class Canvas {
widthAspectRatioAdjustFactor = 1;
}
const cameraWidth = Canvas.TARGET_SCENE_DIAGONAL * widthAspectRatioAdjustFactor;
const cameraHeight = Canvas.TARGET_SCENE_DIAGONAL * heightAspectRatioAdjustFactor;
const panFactorX = scene.camera.panScreenDistance.dx / this.canvasRects.clientWidth;
const panFactorY = scene.camera.panScreenDistance.dy / this.canvasRects.clientHeight;
this.scene = new THREE.Scene();
const scaleFactor = Canvas.TARGET_SCENE_DIAGONAL / scene.boundingBox.diagonal * scene.camera.zoomFactor;
this.scene.scale.set(scaleFactor, -scaleFactor, scaleFactor);
this.scene.translateX(scaleFactor * -scene.boundingBox.center.x);
this.scene.translateY(scaleFactor * scene.boundingBox.center.y);
this.scene.translateX(scaleFactor * -scene.boundingBox.center.x + cameraWidth * panFactorX);
this.scene.translateY(scaleFactor * scene.boundingBox.center.y - cameraHeight * panFactorY);
this.scene.translateZ(scaleFactor * -scene.boundingBox.center.z);
this.camera = new THREE.OrthographicCamera(
-Canvas.TARGET_SCENE_DIAGONAL / 2 * widthAspectRatioAdjustFactor, Canvas.TARGET_SCENE_DIAGONAL / 2 * widthAspectRatioAdjustFactor,
Canvas.TARGET_SCENE_DIAGONAL / 2 * heightAspectRatioAdjustFactor, -Canvas.TARGET_SCENE_DIAGONAL / 2 * heightAspectRatioAdjustFactor,
- cameraWidth / 2, cameraWidth / 2,
cameraHeight / 2, - cameraHeight / 2,
0, 100,
);

22
tools/winscope-ng/src/viewers/components/rects/mapper3d.ts
View File

@@ -15,7 +15,16 @@
*/
import {Rectangle} from "viewers/common/rectangle";
import {Box3D, ColorType, Label3D, Point3D, Rect3D, Scene3D, Transform3D} from "./types3d";
import {
Box3D,
ColorType,
Distance2D,
Label3D,
Point3D,
Rect3D,
Scene3D,
Transform3D
} from "./types3d";
class Mapper3D {
private static readonly CAMERA_ROTATION_FACTOR_INIT = 1;
@@ -34,6 +43,7 @@ class Mapper3D {
private cameraRotationFactor = Mapper3D.CAMERA_ROTATION_FACTOR_INIT;
private zSpacingFactor = Mapper3D.Z_SPACING_FACTOR_INIT;
private zoomFactor = Mapper3D.ZOOM_FACTOR_INIT;
private panScreenDistance: Distance2D = new Distance2D(0, 0);
private showOnlyVisibleMode = false; // by default show all
private showVirtualMode = false; // by default don't show virtual displays
private currentDisplayId = 0; // default stack id is usually 0
@@ -72,10 +82,17 @@ class Mapper3D {
this.zoomFactor = Math.max(this.zoomFactor, Mapper3D.ZOOM_FACTOR_MIN);
}
addPanScreenDistance(distance: Distance2D) {
this.panScreenDistance.dx += distance.dx;
this.panScreenDistance.dy += distance.dy;
}
resetCamera() {
this.cameraRotationFactor = Mapper3D.CAMERA_ROTATION_FACTOR_INIT;
this.zSpacingFactor = Mapper3D.Z_SPACING_FACTOR_INIT;
this.zoomFactor = Mapper3D.ZOOM_FACTOR_INIT;
this.panScreenDistance.dx = 0;
this.panScreenDistance.dy = 0;
}
getShowOnlyVisibleMode(): boolean {
@@ -112,7 +129,8 @@ class Mapper3D {
boundingBox: boundingBox,
camera: {
rotationFactor: this.cameraRotationFactor,
zoomFactor: this.zoomFactor
zoomFactor: this.zoomFactor,
panScreenDistance: this.panScreenDistance,
},
rects: rects3d,
labels: labels3d

51
tools/winscope-ng/src/viewers/components/rects/rects.component.ts
View File

@@ -13,11 +13,12 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import {Component, Input, OnDestroy, Inject, ElementRef, SimpleChanges, OnInit, HostListener} from "@angular/core";
import {Rectangle} from "viewers/common/rectangle";
import {Component, Input, OnDestroy, Inject, ElementRef, OnInit, HostListener} from "@angular/core";
import {Rectangle, Point} from "viewers/common/rectangle";
import {Canvas} from "./canvas";
import {ViewerEvents} from "viewers/common/viewer_events";
import {Mapper3D} from "./mapper3d";
import {Distance2D} from "./types3d";
@Component({
selector: "rects-view",
@@ -99,10 +100,10 @@ import {Mapper3D} from "./mapper3d";
<div class="canvas-labels">
</div>
</div>
<div *ngIf="wrappedDisplayIds.length > 1"
<div *ngIf="internalDisplayIds.length > 1"
class="display-button-container">
<button
*ngFor="let displayId of wrappedDisplayIds"
*ngFor="let displayId of internalDisplayIds"
color="primary"
mat-raised-button
(click)="onDisplayIdChange(displayId)"
@@ -177,33 +178,35 @@ import {Mapper3D} from "./mapper3d";
export class RectsComponent implements OnInit, OnDestroy {
@Input() title = "title";
@Input() set rects(rects: Rectangle[]) {
this.wrappedRects = rects;
this.internalRects = rects;
this.drawScene();
}
@Input() set displayIds(ids: number[]) {
this.wrappedDisplayIds = ids;
if (!this.wrappedDisplayIds.includes(this.mapper3d.getCurrentDisplayId())) {
this.mapper3d.setCurrentDisplayId(this.wrappedDisplayIds[0]);
this.internalDisplayIds = ids;
if (!this.internalDisplayIds.includes(this.mapper3d.getCurrentDisplayId())) {
this.mapper3d.setCurrentDisplayId(this.internalDisplayIds[0]);
this.drawScene();
}
}
@Input() set highlightedItems(ids: string[]) {
this.wrappedHighlightedItems = ids.map(id => Number(id));
this.mapper3d.setHighlightedRectIds(this.wrappedHighlightedItems);
this.internalHighlightedItems = ids.map(id => Number(id));
this.mapper3d.setHighlightedRectIds(this.internalHighlightedItems);
this.drawScene();
}
private wrappedRects: Rectangle[] = [];
private wrappedDisplayIds: number[] = [];
private wrappedHighlightedItems: number[] = [];
private internalRects: Rectangle[] = [];
private internalDisplayIds: number[] = [];
private internalHighlightedItems: number[] = [];
private mapper3d: Mapper3D;
private canvas?: Canvas;
private resizeObserver: ResizeObserver;
private canvasRects?: HTMLCanvasElement;
private canvasLabels?: HTMLElement;
private mouseMoveListener = (event: MouseEvent) => this.onMouseMove(event);
private mouseUpListener = (event: MouseEvent) => this.onMouseUp(event);
constructor(
@Inject(ElementRef) private elementRef: ElementRef,
@@ -222,7 +225,9 @@ export class RectsComponent implements OnInit, OnDestroy {
this.canvasLabels = canvasContainer.querySelector(".canvas-labels");
this.canvas = new Canvas(this.canvasRects, this.canvasLabels!);
this.mapper3d.setCurrentDisplayId(this.wrappedDisplayIds[0] ?? 0);
this.canvasRects.addEventListener("mousedown", event => this.onCanvasMouseDown(event));
this.mapper3d.setCurrentDisplayId(this.internalDisplayIds[0] ?? 0);
this.drawScene();
}
@@ -254,6 +259,22 @@ export class RectsComponent implements OnInit, OnDestroy {
}
}
public onCanvasMouseDown(event: MouseEvent) {
document.addEventListener("mousemove", this.mouseMoveListener);
document.addEventListener("mouseup", this.mouseUpListener);
}
public onMouseMove(event: MouseEvent) {
const distance = new Distance2D(event.movementX, event.movementY);
this.mapper3d.addPanScreenDistance(distance);
this.drawScene();
}
public onMouseUp(event: MouseEvent) {
document.removeEventListener("mousemove", this.mouseMoveListener);
document.removeEventListener("mouseup", this.mouseUpListener);
}
public onZoomInClick() {
this.doZoomIn();
}
@@ -308,7 +329,7 @@ export class RectsComponent implements OnInit, OnDestroy {
// (rotation, spacing, ...) we can just update the camera and/or update the mesh positions.
// We'd probably need to get rid of the intermediate layer (Scene3D, Rect3D, ... types) and
// work directly with three.js's meshes.
this.mapper3d.setRects(this.wrappedRects);
this.mapper3d.setRects(this.internalRects);
this.canvas?.draw(this.mapper3d.computeScene());
}

26
tools/winscope-ng/src/viewers/components/rects/types3d.ts
View File

@@ -14,13 +14,18 @@
* limitations under the License.
*/
enum ColorType {
export enum ColorType {
VISIBLE,
NOT_VISIBLE,
HIGHLIGHTED
}
interface Box3D {
export class Distance2D{
constructor(public dx: number, public dy: number) {
}
}
export interface Box3D {
width: number,
height: number,
depth: number,
@@ -28,7 +33,7 @@ interface Box3D {
diagonal: number;
}
interface Rect3D {
export interface Rect3D {
id: number;
center: Point3D;
width: number;
@@ -39,7 +44,7 @@ interface Rect3D {
transform: Transform3D;
}
interface Transform3D {
export interface Transform3D {
dsdx: number;
dsdy: number;
tx: number;
@@ -48,13 +53,13 @@ interface Transform3D {
ty: number;
}
interface Point3D {
export interface Point3D {
x: number;
y: number;
z: number;
}
interface Label3D {
export interface Label3D {
circle: Circle3D;
linePoints: Point3D[];
textCenter: Point3D;
@@ -63,21 +68,20 @@ interface Label3D {
rectId: number;
}
interface Circle3D {
export interface Circle3D {
radius: number;
center: Point3D;
}
interface Scene3D {
export interface Scene3D {
boundingBox: Box3D;
camera: Camera;
rects: Rect3D[];
labels: Label3D[];
}
interface Camera {
export interface Camera {
rotationFactor: number;
zoomFactor: number;
panScreenDistance: Distance2D;
}
export {Box3D, Circle3D, ColorType, Label3D, Point3D, Rect3D, Scene3D, Transform3D};