prettier
This commit is contained in:
@@ -12,12 +12,12 @@ export interface Props {
|
|||||||
}
|
}
|
||||||
|
|
||||||
interface TouchStart {
|
interface TouchStart {
|
||||||
x: number;
|
x: number;
|
||||||
y: number;
|
y: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface State {
|
export interface State {
|
||||||
touchStart?: TouchStart | null;
|
touchStart?: TouchStart | null;
|
||||||
}
|
}
|
||||||
|
|
||||||
export class BigPicture extends React.PureComponent<Props, State> {
|
export class BigPicture extends React.PureComponent<Props, State> {
|
||||||
@@ -85,24 +85,24 @@ export class BigPicture extends React.PureComponent<Props, State> {
|
|||||||
};
|
};
|
||||||
|
|
||||||
private _onTouchStart = (e: React.TouchEvent) => {
|
private _onTouchStart = (e: React.TouchEvent) => {
|
||||||
const touch = e.touches[0];
|
const touch = e.touches[0];
|
||||||
this.setState({ touchStart: { x: touch.screenX, y: touch.screenY }});
|
this.setState({ touchStart: { x: touch.screenX, y: touch.screenY } });
|
||||||
}
|
};
|
||||||
|
|
||||||
private _onTouchEnd = (e: React.TouchEvent) => {
|
private _onTouchEnd = (e: React.TouchEvent) => {
|
||||||
const touch = e.changedTouches[0];
|
const touch = e.changedTouches[0];
|
||||||
const touchStart = this.state.touchStart as TouchStart;
|
const touchStart = this.state.touchStart as TouchStart;
|
||||||
|
|
||||||
const dx = touch.screenX - touchStart.x;
|
const dx = touch.screenX - touchStart.x;
|
||||||
|
|
||||||
if (Math.abs(dx) / window.innerWidth > 0.05) {
|
if (Math.abs(dx) / window.innerWidth > 0.05) {
|
||||||
if (dx < 0) {
|
if (dx < 0) {
|
||||||
this.props.showNext();
|
this.props.showNext();
|
||||||
} else {
|
} else {
|
||||||
this.props.showPrevious();
|
this.props.showPrevious();
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
this.setState({ touchStart: null });
|
this.setState({ touchStart: null });
|
||||||
}
|
};
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -192,18 +192,20 @@ export class Root extends React.PureComponent<Props, State> {
|
|||||||
};
|
};
|
||||||
|
|
||||||
private _showNextBigPicture = () => {
|
private _showNextBigPicture = () => {
|
||||||
const images: Model.Image[] = this.state.selectedSet?.images as Model.Image[];
|
const images: Model.Image[] = this.state.selectedSet
|
||||||
|
?.images as Model.Image[];
|
||||||
const current = images.indexOf(this.state.selectedImage as Model.Image);
|
const current = images.indexOf(this.state.selectedImage as Model.Image);
|
||||||
const next = current + 1 >= images.length ? 0 : current + 1;
|
const next = current + 1 >= images.length ? 0 : current + 1;
|
||||||
this._onImageSelected(images[next]);
|
this._onImageSelected(images[next]);
|
||||||
}
|
};
|
||||||
|
|
||||||
private _showPreviousBigPicture = () => {
|
private _showPreviousBigPicture = () => {
|
||||||
const images: Model.Image[] = this.state.selectedSet?.images as Model.Image[];
|
const images: Model.Image[] = this.state.selectedSet
|
||||||
|
?.images as Model.Image[];
|
||||||
const current = images.indexOf(this.state.selectedImage as Model.Image);
|
const current = images.indexOf(this.state.selectedImage as Model.Image);
|
||||||
const previous = current - 1 < 0 ? images.length - 1 : current - 1;
|
const previous = current - 1 < 0 ? images.length - 1 : current - 1;
|
||||||
this._onImageSelected(images[previous]);
|
this._onImageSelected(images[previous]);
|
||||||
}
|
};
|
||||||
|
|
||||||
private _setGridHeight = (grid: number) => (height: number) => {
|
private _setGridHeight = (grid: number) => (height: number) => {
|
||||||
if (this.state.gridHeights[grid] === height) {
|
if (this.state.gridHeights[grid] === height) {
|
||||||
|
|||||||
Reference in New Issue
Block a user