Unfloyded/Legamunt
0
0
Fork 0
Code Activity

Add expand/compress image button on image view box (#15068)

Browse source 
* add zoom image button

* enhance zoom algorithm & add translation

* code structure

* code structure

* code structure

* enhance grab performance

* rm useless state

* fix behavior on Firefox & scroll lock & horizontal scroll with mousewheel

* remove scroll lock on MouseWheelEvent

* code structure

* enhance algorithm and code structure

* rm Gemfile.lock from tree

* codeclimate

* fix a stupid mistake
This commit is contained in:
Mashiro 2020-11-03 04:16:38 +08:00 • committed by GitHub
parent 4b2ec4a2dc
commit 6a2db10f76
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
79 changed files with 2029 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

24
app/javascript/mastodon/features/ui/components/media_modal.js
View file

@ -38,23 +38,39 @@ class MediaModal extends ImmutablePureComponent {
state = {
index: null,
navigationHidden: false,
zoomButtonHidden: false,
};
handleSwipe = (index) => {
this.setState({ index: index % this.props.media.size });
}
handleTransitionEnd = () => {
this.setState({
zoomButtonHidden: false,
});
}
handleNextClick = () => {
this.setState({ index: (this.getIndex() + 1) % this.props.media.size });
this.setState({
index: (this.getIndex() + 1) % this.props.media.size,
zoomButtonHidden: true,
});
}
handlePrevClick = () => {
this.setState({ index: (this.props.media.size + this.getIndex() - 1) % this.props.media.size });
this.setState({
index: (this.props.media.size + this.getIndex() - 1) % this.props.media.size,
zoomButtonHidden: true,
});
}
handleChangeIndex = (e) => {
const index = Number(e.currentTarget.getAttribute('data-index'));
this.setState({ index: index % this.props.media.size });
this.setState({
index: index % this.props.media.size,
zoomButtonHidden: true,
});
}
handleKeyDown = (e) => {
@ -149,6 +165,7 @@ class MediaModal extends ImmutablePureComponent {
alt={image.get('description')}
key={image.get('url')}
onClick={this.toggleNavigation}
zoomButtonHidden={this.state.zoomButtonHidden}
/>
);
} else if (image.get('type') === 'video') {
@ -212,6 +229,7 @@ class MediaModal extends ImmutablePureComponent {
style={swipeableViewsStyle}
containerStyle={containerStyle}
onChangeIndex={this.handleSwipe}
onTransitionEnd={this.handleTransitionEnd}
index={index}
disabled={disableSwiping}
>