IlyaSobolev/DocSpace-client
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'feature/files' of https://github.com/ONLYOFFICE/CommunityServer-AspNetCore into feature/files

Browse Source
This commit is contained in:
Nikita Gopienko 2020-07-02 11:50:40 +03:00
commit 939f059157
3 changed files with 41 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/ASC.Web.Common/package.json
View File

@ -1,6 +1,6 @@
{
"name": "asc-web-common",
"version": "1.0.170",
"version": "1.0.171",
"description": "Ascensio System SIA common components and solutions library",
"license": "AGPL-3.0",
"files": [

44
web/ASC.Web.Common/src/components/MediaViewer/MediaViewer.js
View File

@ -42,14 +42,24 @@ class MediaViewer extends React.Component {
var ext = this.getFileExtension(fileTitle) ? this.getFileExtension(fileTitle) : this.getFileExtension(url);
var _this = this;
this.hammer && this.hammer.off('swipeleft', this.nextMedia)
this.hammer && this.hammer.off('swiperight', this.prevMedia)
if(this.hammer){
this.hammer.off('swipeleft', this.nextMedia);
this.hammer.off('swiperight', this.prevMedia);
this.hammer.off('pinchout', this.prevMedia);
this.hammer.off('pinchin', this.prevMedia);
this.hammer.off('pinchend', this.prevMedia);
}
this.hammer = null;
setTimeout(function () {
if (_this.canImageView(ext)) {
var pinch = new Hammer.Pinch();
_this.hammer = Hammer(document.getElementsByClassName('react-viewer-canvas')[0]);
} else if (_this.mapSupplied[ext] && _this.mapSupplied[ext].type == mediaTypes.video) {
_this.hammer = Hammer(document.getElementsByClassName('playerWrapper')[0]);
_this.hammer.add([pinch]);
_this.hammer.on('pinchout', _this.handleZoomOut);
_this.hammer.on('pinchin', _this.handleZoomIn);
_this.hammer.on('pinchend', _this.handleZoomEnd);
} else if (_this.mapSupplied[ext] && (_this.mapSupplied[ext].type == mediaTypes.video || _this.mapSupplied[ext].type == mediaTypes.audio)) {
_this.hammer = Hammer(document.getElementsByClassName('videoViewerOverlay')[0]);
}
if (_this.hammer) {
_this.hammer.on('swipeleft', _this.nextMedia);
@ -104,8 +114,13 @@ class MediaViewer extends React.Component {
setTimeout(function () {
if (document.getElementsByClassName('react-viewer-canvas').length > 0) {
_this.hammer = Hammer(document.getElementsByClassName('react-viewer-canvas')[0])
var pinch = new Hammer.Pinch();
_this.hammer.add([pinch]);
_this.hammer.on('pinchout', _this.handleZoomOut);
_this.hammer.on('pinchin', _this.handleZoomIn);
_this.hammer.on('pinchend', _this.handleZoomEnd);
} else {
_this.hammer = Hammer(document.getElementsByClassName('playerWrapper')[0])
_this.hammer = Hammer(document.getElementsByClassName('videoViewerOverlay')[0])
}
if (_this.hammer) {
_this.hammer.on('swipeleft', _this.nextMedia);
@ -117,6 +132,9 @@ class MediaViewer extends React.Component {
componentWillUnmount() {
this.hammer.off('swipeleft', this.nextMedia)
this.hammer.off('swiperight', this.prevMedia)
this.hammer.off('pinchout', this.prevMedia)
this.hammer.off('pinchin', this.prevMedia)
this.hammer.off('pinchend', this.prevMedia)
}
mapSupplied = {
@ -164,6 +182,22 @@ class MediaViewer extends React.Component {
return 0 <= posExt ? fileTitle.substring(posExt).trim().toLowerCase() : "";
};
zoom = 1;
handleZoomEnd = () =>{
this.zoom = 1;
}
handleZoomIn = (e) =>{
if(this.zoom - e.scale > 0.1){
this.zoom = e.scale;
document.querySelector('li[data-key="zoomOut"]').click()
}
}
handleZoomOut = (e) =>{
if(e.scale - this.zoom > 0.3){
this.zoom = e.scale;
document.querySelector('li[data-key="zoomIn"]').click()
}
}
prevMedia = () => {
let currentPlaylistPos = this.state.playlistPos;

1
web/ASC.Web.Common/src/components/MediaViewer/sub-components/image-viewer.js
View File

@ -193,6 +193,7 @@ class ImageViewer extends React.Component {
<StyledViewer
inactive={inactive}
visible={visible}
zoomSpeed={0.1}
customToolbar={(toolbars) => {
return customToolbar;
}}