diff --git a/application.tsx b/application.tsx index 963115c..748f7a1 100644 --- a/application.tsx +++ b/application.tsx @@ -13,7 +13,7 @@ import { FontFamily, FontSize } from './style' const enum SortOrder { CHRONO, - ALPHA + LEFT_HEAVY } interface ApplicationState { @@ -76,9 +76,13 @@ export class Application extends ReloadableComponent<{}, ApplicationState> { } onWindowKeyPress = (ev: KeyboardEvent) => { - if (ev.key == 'a') { + if (ev.key === '1') { this.setState({ - sortOrder: this.state.sortOrder === SortOrder.CHRONO ? SortOrder.ALPHA : SortOrder.CHRONO + sortOrder: SortOrder.CHRONO + }) + } else if (ev.key === '2') { + this.setState({ + sortOrder: SortOrder.LEFT_HEAVY }) } } diff --git a/flamechart-view.tsx b/flamechart-view.tsx index 1701526..887b203 100644 --- a/flamechart-view.tsx +++ b/flamechart-view.tsx @@ -540,6 +540,28 @@ export class FlamechartPanZoomView extends ReloadableComponent { + if (!this.canvas) return + const {width, height} = this.canvas.getBoundingClientRect() + + if (ev.key === '=' || ev.key === '+') { + this.zoom(new Vec2(width / 2, height / 2), 0.5) + ev.preventDefault() + } else if (ev.key === '-' || ev.key === '_') { + this.zoom(new Vec2(width / 2, height / 2), 2) + ev.preventDefault() + } else if (ev.key === 'ArrowRight' || ev.key === 'd') { + this.pan(new Vec2(100, 0)) + } else if (ev.key === 'ArrowLeft' || ev.key === 'a') { + this.pan(new Vec2(-100, 0)) + } else if (ev.key === 'ArrowUp' || ev.key === 'w') { + this.pan(new Vec2(0, -100)) + } else if (ev.key === 'ArrowDown' || ev.key === 's') { + this.pan(new Vec2(0, 100)) + } + } + + shouldComponentUpdate() { return false } componentWillReceiveProps(nextProps: FlamechartPanZoomViewProps) { if (this.props.flamechart !== nextProps.flamechart) { @@ -552,10 +574,12 @@ export class FlamechartPanZoomView extends ReloadableComponent