From 3f4f876229e5b59bc8117c10faf36219bb5766bf Mon Sep 17 00:00:00 2001 From: Andrew Levans <121060410+ALevansSamsung@users.noreply.github.com> Date: Tue, 25 Jun 2024 14:07:02 -0500 Subject: [PATCH] On a pinned track resize, the mouse and the border being moved are dislocated (#117) * Half resize distance for pinned tracks * Do not half resize on pinned group. Also better compute resize state * rename pinnedGroup to pinnedCopy --- ui/src/frontend/track_group_panel.ts | 13 ++++++----- ui/src/frontend/track_panel.ts | 34 ++++++++++++++++++++++------ ui/src/frontend/viewer_page.ts | 6 ++++- 3 files changed, 39 insertions(+), 14 deletions(-) diff --git a/ui/src/frontend/track_group_panel.ts b/ui/src/frontend/track_group_panel.ts index 1ba5050309..511686c125 100644 --- a/ui/src/frontend/track_group_panel.ts +++ b/ui/src/frontend/track_group_panel.ts @@ -62,7 +62,7 @@ export class TrackGroupPanel extends Panel { // in trackGroupState() below. private lastTrackGroupState: TrackGroupState; - private initialHeight?: number; + private defaultHeight?: number; constructor(protected attrs: m.CVnode) { super(); @@ -77,7 +77,8 @@ export class TrackGroupPanel extends Panel { this.lastTrackGroupState = assertExists( globals.state.trackGroups[this.trackGroupId]); if (this.summaryTrack) { - this.initialHeight = this.summaryTrack.getHeight(); + this.defaultHeight = + this.summaryTrack.getHeight() / this.summaryTrackState.scaleFactor; } } @@ -103,15 +104,15 @@ export class TrackGroupPanel extends Panel { resize = (e: MouseEvent): void => { e.stopPropagation(); e.preventDefault(); - if(!this.summaryTrack){ + if (!this.summaryTrack) { return; } - let y = this.summaryTrack.getHeight() + let y = this.summaryTrack.getHeight(); const mouseMoveEvent = (evMove: MouseEvent): void => { evMove.preventDefault(); y += evMove.movementY; - if (this.attrs && this.initialHeight) { - const newMultiplier = y / this.initialHeight; + if (this.attrs && this.defaultHeight) { + const newMultiplier = y / this.defaultHeight; if (newMultiplier < 1) { this.summaryTrackState.scaleFactor = 1; } else { diff --git a/ui/src/frontend/track_panel.ts b/ui/src/frontend/track_panel.ts index d56b68031f..cb7ebdb9f4 100644 --- a/ui/src/frontend/track_panel.ts +++ b/ui/src/frontend/track_panel.ts @@ -68,6 +68,7 @@ function isSelected(id: string) { interface TrackShellAttrs { track: Track; trackState: TrackState; + pinnedCopy?: boolean; } class TrackShell implements m.ClassComponent { @@ -75,12 +76,13 @@ class TrackShell implements m.ClassComponent { private dragging = false; private dropping: 'before'|'after'|undefined = undefined; private attrs?: TrackShellAttrs; - private initialHeight?: number; + private defaultHeight?: number; oninit(vnode: m.Vnode) { this.attrs = vnode.attrs; if (this.attrs) { - this.initialHeight = this.attrs.track.getHeight(); + this.defaultHeight = + this.attrs.track.getHeight() / this.attrs.trackState.scaleFactor; } } @@ -191,10 +193,18 @@ class TrackShell implements m.ClassComponent { } let y = this.attrs.track.getHeight(); const mouseMoveEvent = (evMove: MouseEvent): void => { + if (!this.attrs) { + return; + } evMove.preventDefault(); - y += evMove.movementY; - if (this.attrs && this.initialHeight) { - const newMultiplier = y / this.initialHeight; + let movementY = evMove.movementY; + if (this.attrs.pinnedCopy !== true && + isPinned(this.attrs.trackState.id)) { + movementY /=2; + } + y += movementY; + if (this.defaultHeight) { + const newMultiplier = y / this.defaultHeight; if (newMultiplier < 1) { this.attrs.trackState.scaleFactor = 1; } else { @@ -386,6 +396,7 @@ export class TrackContent implements m.ClassComponent { interface TrackComponentAttrs { trackState: TrackState; track: Track; + pinnedCopy?: boolean; } class TrackComponent implements m.ClassComponent { view({attrs}: m.CVnode) { @@ -401,7 +412,10 @@ class TrackComponent implements m.ClassComponent { id: 'track_' + attrs.trackState.id, }, [ - m(TrackShell, {track: attrs.track, trackState: attrs.trackState}), + m(TrackShell, { + track: attrs.track, + trackState: attrs.trackState, + pinnedCopy: attrs.pinnedCopy}), m(TrackContent, {track: attrs.track}), ]); } @@ -444,6 +458,7 @@ export class TrackButton implements m.ClassComponent { interface TrackPanelAttrs { id: string; selectable: boolean; + pinnedCopy?: boolean; } export class TrackPanel extends Panel { @@ -452,10 +467,12 @@ export class TrackPanel extends Panel { // has disappeared. private track: Track|undefined; private trackState: TrackState|undefined; + private pinnedCopy?: boolean; constructor(vnode: m.CVnode) { super(); const trackId = vnode.attrs.id; + this.pinnedCopy = vnode.attrs.pinnedCopy; const trackState = globals.state.tracks[trackId]; if (trackState === undefined) { return; @@ -473,7 +490,10 @@ export class TrackPanel extends Panel { if (this.track === undefined || this.trackState === undefined) { return m('div', 'No such track'); } - return m(TrackComponent, {trackState: this.trackState, track: this.track}); + return m(TrackComponent, { + trackState: this.trackState, + track: this.track, + pinnedCopy: this.pinnedCopy}); } oncreate() { diff --git a/ui/src/frontend/viewer_page.ts b/ui/src/frontend/viewer_page.ts index 3d33e55684..c545d807f8 100644 --- a/ui/src/frontend/viewer_page.ts +++ b/ui/src/frontend/viewer_page.ts @@ -314,7 +314,11 @@ class TraceViewer implements m.ClassComponent { m(NotesPanel, {key: 'notes'}), m(TickmarkPanel, {key: 'searchTickmarks'}), ...globals.state.pinnedTracks.map( - (id) => m(TrackPanel, {key: id, id, selectable: true})), + (id) => m(TrackPanel, { + key: id, + id, + selectable: true, + pinnedCopy: true})), ], kind: 'OVERVIEW', })),