mirror of
https://github.com/element-hq/element-web.git
synced 2024-12-16 05:31:46 +03:00
Don't duplicate code
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
This commit is contained in:
parent
0bf2b01f84
commit
941a6e1c1b
1 changed files with 19 additions and 48 deletions
|
@ -152,36 +152,37 @@ export default class CallPreview extends React.Component<IProps, IState> {
|
||||||
}
|
}
|
||||||
|
|
||||||
private onWindowSizeChanged = () => {
|
private onWindowSizeChanged = () => {
|
||||||
|
this.setTranslation(this.state.translationX, this.state.translationY);
|
||||||
|
}
|
||||||
|
|
||||||
|
private setTranslation(inTranslationX: number, inTranslationY: number) {
|
||||||
const width = this.callViewWrapper.current.clientWidth || PIP_VIEW_WIDTH;
|
const width = this.callViewWrapper.current.clientWidth || PIP_VIEW_WIDTH;
|
||||||
const height = this.callViewWrapper.current.clientHeight || PIP_VIEW_HEIGHT;
|
const height = this.callViewWrapper.current.clientHeight || PIP_VIEW_HEIGHT;
|
||||||
|
|
||||||
const precalculatedLastX = this.state.translationX;
|
let outTranslationX;
|
||||||
const precalculatedLastY = this.state.translationY;
|
let outTranslationY;
|
||||||
|
|
||||||
let translationX;
|
|
||||||
let translationY;
|
|
||||||
|
|
||||||
// Avoid overflow on the x axis
|
// Avoid overflow on the x axis
|
||||||
if (precalculatedLastX + width >= window.innerWidth) {
|
if (inTranslationX + width >= window.innerWidth) {
|
||||||
translationX = window.innerWidth - width;
|
outTranslationX = window.innerWidth - width;
|
||||||
} else if (precalculatedLastX <= 0) {
|
} else if (inTranslationX <= 0) {
|
||||||
translationX = 0;
|
outTranslationX = 0;
|
||||||
} else {
|
} else {
|
||||||
translationX = precalculatedLastX;
|
outTranslationX = inTranslationX;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Avoid overflow on the y axis
|
// Avoid overflow on the y axis
|
||||||
if (precalculatedLastY + height >= window.innerHeight) {
|
if (inTranslationY + height >= window.innerHeight) {
|
||||||
translationY = window.innerHeight - height;
|
outTranslationY = window.innerHeight - height;
|
||||||
} else if (precalculatedLastY <= 0) {
|
} else if (inTranslationY <= 0) {
|
||||||
translationY = 0;
|
outTranslationY = 0;
|
||||||
} else {
|
} else {
|
||||||
translationY = precalculatedLastY;
|
outTranslationY = inTranslationY;
|
||||||
}
|
}
|
||||||
|
|
||||||
this.setState({
|
this.setState({
|
||||||
translationX: translationX,
|
translationX: outTranslationX,
|
||||||
translationY: translationY,
|
translationY: outTranslationY,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -246,37 +247,7 @@ export default class CallPreview extends React.Component<IProps, IState> {
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
event.stopPropagation();
|
event.stopPropagation();
|
||||||
|
|
||||||
const width = this.callViewWrapper.current.clientWidth;
|
this.setTranslation(event.pageX - this.initX, event.pageY - this.initY);
|
||||||
const height = this.callViewWrapper.current.clientHeight;
|
|
||||||
|
|
||||||
const precalculatedLastX = event.pageX - this.initX;
|
|
||||||
const precalculatedLastY = event.pageY - this.initY;
|
|
||||||
|
|
||||||
let translationX;
|
|
||||||
let translationY;
|
|
||||||
|
|
||||||
// Avoid overflow on the x axis
|
|
||||||
if (precalculatedLastX + width >= window.innerWidth) {
|
|
||||||
translationX = window.innerWidth - width;
|
|
||||||
} else if (precalculatedLastX <= 0) {
|
|
||||||
translationX = 0;
|
|
||||||
} else {
|
|
||||||
translationX = precalculatedLastX;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Avoid overflow on the y axis
|
|
||||||
if (precalculatedLastY + height >= window.innerHeight) {
|
|
||||||
translationY = window.innerHeight - height;
|
|
||||||
} else if (precalculatedLastY <= 0) {
|
|
||||||
translationY = 0;
|
|
||||||
} else {
|
|
||||||
translationY = precalculatedLastY;
|
|
||||||
}
|
|
||||||
|
|
||||||
this.setState({
|
|
||||||
translationX: translationX,
|
|
||||||
translationY: translationY,
|
|
||||||
});
|
|
||||||
};
|
};
|
||||||
|
|
||||||
private onEndMoving = () => {
|
private onEndMoving = () => {
|
||||||
|
|
Loading…
Reference in a new issue