PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 4

Don't use percanteages

Browse source 
I was an idiot to use them in the first place

Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
This commit is contained in:
Šimon Brandner 2021-04-24 08:35:45 +02:00
parent 4523b8c7b8
commit f8af9831a9
No known key found for this signature in database
GPG key ID: 9760693FDD98A790
1 changed files with 5 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
src/components/views/elements/ImageView.tsx
View file

@ -120,10 +120,10 @@ export default class ImageView extends React.Component<IProps, IState> {
// TODO: What if we don't have width and height props? // TODO: What if we don't have width and height props?
const imageWrapper = document.getElementsByClassName(IMAGE_WRAPPER_CLASS)[0]; const imageWrapper = document.getElementsByClassName(IMAGE_WRAPPER_CLASS)[0];
const zoomX = (imageWrapper.clientWidth / this.props.width) * 100; const zoomX = imageWrapper.clientWidth / this.props.width;
const zoomY = (imageWrapper.clientHeight / this.props.height) * 100; const zoomY = imageWrapper.clientHeight / this.props.height;
const minZoom = Math.min(zoomX, zoomY) * MAX_SCALE; const minZoom = Math.min(zoomX, zoomY) * MAX_SCALE;
const maxZoom = minZoom >= 100 ? minZoom : 100; const maxZoom = minZoom >= 1 ? minZoom : 1;
if (this.state.zoom <= this.state.minZoom) this.setState({zoom: minZoom}); if (this.state.zoom <= this.state.minZoom) this.setState({zoom: minZoom});
this.setState({ this.setState({
@ -323,7 +323,7 @@ export default class ImageView extends React.Component<IProps, IState> {
cursor = "zoom-out"; cursor = "zoom-out";
} }
const rotationDegrees = this.state.rotation + "deg"; const rotationDegrees = this.state.rotation + "deg";
const zoomPercentage = this.state.zoom/100; const zoom = this.state.zoom;
const translatePixelsX = this.state.translationX + "px"; const translatePixelsX = this.state.translationX + "px";
const translatePixelsY = this.state.translationY + "px"; const translatePixelsY = this.state.translationY + "px";
// The order of the values is important! // The order of the values is important!
@ -335,7 +335,7 @@ export default class ImageView extends React.Component<IProps, IState> {
transition: this.state.moving ? null : "transform 200ms ease 0s", transition: this.state.moving ? null : "transform 200ms ease 0s",
transform: `translateX(${translatePixelsX}) transform: `translateX(${translatePixelsX})
translateY(${translatePixelsY}) translateY(${translatePixelsY})
scale(${zoomPercentage}) scale(${zoom})
rotate(${rotationDegrees})`, rotate(${rotationDegrees})`,
}; };