external-repos/squoosh
1
0
Fork 1
mirror of https://github.com/GoogleChromeLabs/squoosh.git synced 2025-11-11 16:26:20 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add keyboard shortcuts for moving the split view separator

Browse Source
This commit is contained in:
Sámal Rasmussen
2020-08-27 23:14:05 +01:00
parent c3d05e0e2d
commit b958d46086
1 changed files with 25 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
src/client/lazy-app/Compress/Output/custom-els/TwoUp/index.ts
View File

@@ -68,6 +68,8 @@ export default class TwoUp extends HTMLElement {
);
},
});
window.addEventListener('keydown', event => this._onKeyDown(event));
}
connectedCallback() {
@@ -94,6 +96,29 @@ export default class TwoUp extends HTMLElement {
}
}
// KeyDown event handler
private _onKeyDown(event: KeyboardEvent) {
if (event.code === 'Digit1' || event.code === 'Numpad1') {
this._position = 0;
this._relativePosition = 0;
this._setPosition();
} else if (event.code === 'Digit2' || event.code === 'Numpad2') {
const dimensionAxis = this.orientation === 'vertical' ? 'height' : 'width';
const bounds = this.getBoundingClientRect();
this._position = bounds[dimensionAxis] / 2;
this._relativePosition = (this._position / bounds[dimensionAxis]) / 2;
this._setPosition();
} else if (event.code === 'Digit3' || event.code === 'Numpad3') {
const dimensionAxis = this.orientation === 'vertical' ? 'height' : 'width';
const bounds = this.getBoundingClientRect();
this._position = bounds[dimensionAxis];
this._relativePosition = this._position / bounds[dimensionAxis];
this._setPosition();
}
}
private _resetPosition() {
// Set the initial position of the handle.
requestAnimationFrame(() => {