From cfcb72a255726bb9b91765546b60772bfa8e80d3 Mon Sep 17 00:00:00 2001 From: Michael An <2331806369@qq.com> Date: Wed, 10 Jul 2019 11:46:02 +0800 Subject: [PATCH 1/7] Published repo style (#3832) * fix FF style * change anonymous user search --- frontend/src/components/search/search.js | 6 +++--- frontend/src/css/search.css | 2 +- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/frontend/src/components/search/search.js b/frontend/src/components/search/search.js index e6d273b3d6..481793ba16 100644 --- a/frontend/src/components/search/search.js +++ b/frontend/src/components/search/search.js @@ -2,7 +2,7 @@ import React, { Component, Fragment } from 'react'; import PropTypes from 'prop-types'; import MediaQuery from 'react-responsive'; import { seafileAPI } from '../../utils/seafile-api'; -import { gettext, siteRoot } from '../../utils/constants'; +import { gettext, siteRoot, username } from '../../utils/constants'; import SearchResultItem from './search-result-item'; import editorUtilities from '../../utils/editor-utilties'; import More from '../more'; @@ -276,7 +276,7 @@ class Search extends Component { onChange={this.onChangeHandler} autoComplete="off" /> - {this.state.isCloseShow && + {(this.state.isCloseShow && username) && } @@ -309,7 +309,7 @@ class Search extends Component { onChange={this.onChangeHandler} autoComplete="off" /> - {this.state.isCloseShow && + {(this.state.isCloseShow && username) && } diff --git a/frontend/src/css/search.css b/frontend/src/css/search.css index 194b2da077..8810d25311 100644 --- a/frontend/src/css/search.css +++ b/frontend/src/css/search.css @@ -84,8 +84,8 @@ } .search-result-item .item-content { flex: 1; - width: 0; margin-left: 0.25rem; + overflow-x: hidden; } .item-content .item-name a { color: #EA8102 !important; From cb683d1e91c1666fede1c15e5f5720f8a0894136 Mon Sep 17 00:00:00 2001 From: zxj96 <35951769+zxj96@users.noreply.github.com> Date: Wed, 10 Jul 2019 14:33:28 +0800 Subject: [PATCH 2/7] repair save-share-file-dialog bug (#3826) * repair save-share-file-dialog bug * repair click bug * Remove extra code --- frontend/src/components/file-chooser/file-chooser.js | 8 ++++---- .../src/components/file-chooser/tree-list-item.js | 11 +++++++++-- 2 files changed, 13 insertions(+), 6 deletions(-) diff --git a/frontend/src/components/file-chooser/file-chooser.js b/frontend/src/components/file-chooser/file-chooser.js index 33ed33bcb5..28213524e7 100644 --- a/frontend/src/components/file-chooser/file-chooser.js +++ b/frontend/src/components/file-chooser/file-chooser.js @@ -110,9 +110,9 @@ class FileChooser extends React.Component { } } - onCurrentRepoToggle = () => [ - this.setState({isCurrentRepoShow: !this.state.isCurrentRepoShow}) - ] + onCurrentRepoToggle = () => { + this.setState({isCurrentRepoShow: !this.state.isCurrentRepoShow}); + } onDirentItemClick = (repo, filePath, dirent) => { this.props.onDirentItemClick(repo, filePath, dirent); @@ -310,7 +310,7 @@ class FileChooser extends React.Component { selectedItemInfo: selectedItemInfo }); - if (item.repo_id === this.props.repoID) { + if (this.props.repoID && item.repo_id === this.props.repoID) { seafileAPI.getRepoInfo(this.props.repoID).then(res => { // need to optimized let repoInfo = new RepoInfo(res.data); diff --git a/frontend/src/components/file-chooser/tree-list-item.js b/frontend/src/components/file-chooser/tree-list-item.js index bc5ccc1e9a..b3e201c53d 100644 --- a/frontend/src/components/file-chooser/tree-list-item.js +++ b/frontend/src/components/file-chooser/tree-list-item.js @@ -36,7 +36,11 @@ class TreeViewItem extends React.Component { onItemClick = (e) => { e.stopPropagation(); // need prevent event popup - let isCurrentRepo = this.props.selectedRepo.repo_id === this.props.repo.repo_id; + let isCurrentRepo = false; + if (this.props.selectedRepo) { + isCurrentRepo = this.props.selectedRepo.repo_id === this.props.repo.repo_id; + } + if (isCurrentRepo) { if (this.props.selectedPath !== this.state.filePath) { this.props.onDirentItemClick(this.state.filePath, this.props.node.object); @@ -77,7 +81,10 @@ class TreeViewItem extends React.Component { render() { let { node } = this.props; - let isCurrentRepo = this.props.selectedRepo.repo_id === this.props.repo.repo_id; + let isCurrentRepo = false; + if (this.props.selectedRepo) { + isCurrentRepo = this.props.selectedRepo.repo_id === this.props.repo.repo_id; + } let isCurrentPath = this.props.selectedPath === this.state.filePath; const fileName = node.object.name; From 514302a7b233a68a91f99671f86127ace8dbb357 Mon Sep 17 00:00:00 2001 From: llj Date: Wed, 10 Jul 2019 15:04:00 +0800 Subject: [PATCH 3/7] [file view] rewrote it (#3820) * [file view] rewrote it * fixup for tiff/tif/psd file view * handled tiff/tif/psd history/trash file view * [file view] rewrote it for xmind file * [file view] rewrote it for 'Unknown' files --- frontend/config/webpack.config.dev.js | 40 ++------- frontend/config/webpack.config.prod.js | 8 +- .../src/components/file-content-view/image.js | 37 +++++++- frontend/src/file-view.js | 55 ++++++++++++ frontend/src/history-trash-file-view.js | 2 +- frontend/src/view-file-audio.js | 47 ---------- frontend/src/view-file-image.js | 86 ------------------- frontend/src/view-file-pdf.js | 36 -------- frontend/src/view-file-svg.js | 36 -------- frontend/src/view-file-unknown.js | 27 ------ frontend/src/view-file-video.js | 47 ---------- frontend/src/view-file-xmind.js | 35 -------- seahub/templates/audio_file_view_react.html | 15 ---- seahub/templates/common_file_view_react.html | 37 ++++++++ seahub/templates/file_view_react.html | 1 - seahub/templates/image_file_view_react.html | 18 ---- seahub/templates/pdf_file_view_react.html | 23 ----- seahub/templates/svg_file_view_react.html | 15 ---- seahub/templates/unknown_file_view_react.html | 14 --- seahub/templates/video_file_view_react.html | 15 ---- seahub/templates/xmind_file_view_react.html | 15 ---- seahub/utils/__init__.py | 2 +- seahub/views/file.py | 4 +- 23 files changed, 137 insertions(+), 478 deletions(-) create mode 100644 frontend/src/file-view.js delete mode 100644 frontend/src/view-file-audio.js delete mode 100644 frontend/src/view-file-image.js delete mode 100644 frontend/src/view-file-pdf.js delete mode 100644 frontend/src/view-file-svg.js delete mode 100644 frontend/src/view-file-unknown.js delete mode 100644 frontend/src/view-file-video.js delete mode 100644 frontend/src/view-file-xmind.js delete mode 100644 seahub/templates/audio_file_view_react.html create mode 100644 seahub/templates/common_file_view_react.html delete mode 100644 seahub/templates/image_file_view_react.html delete mode 100644 seahub/templates/pdf_file_view_react.html delete mode 100644 seahub/templates/svg_file_view_react.html delete mode 100644 seahub/templates/unknown_file_view_react.html delete mode 100644 seahub/templates/video_file_view_react.html delete mode 100644 seahub/templates/xmind_file_view_react.html diff --git a/frontend/config/webpack.config.dev.js b/frontend/config/webpack.config.dev.js index f666dab59e..4965ca03ab 100644 --- a/frontend/config/webpack.config.dev.js +++ b/frontend/config/webpack.config.dev.js @@ -149,31 +149,16 @@ module.exports = { require.resolve('react-dev-utils/webpackHotDevClient'), paths.appSrc + "/history-trash-file-view.js", ], + fileView: [ + require.resolve('./polyfills'), + require.resolve('react-dev-utils/webpackHotDevClient'), + paths.appSrc + "/file-view.js", + ], viewFileText: [ require.resolve('./polyfills'), require.resolve('react-dev-utils/webpackHotDevClient'), paths.appSrc + "/view-file-text.js", ], - viewFileImage: [ - require.resolve('./polyfills'), - require.resolve('react-dev-utils/webpackHotDevClient'), - paths.appSrc + "/view-file-image.js", - ], - viewFileXmind: [ - require.resolve('./polyfills'), - require.resolve('react-dev-utils/webpackHotDevClient'), - paths.appSrc + "/view-file-xmind.js", - ], - viewFileVideo: [ - require.resolve('./polyfills'), - require.resolve('react-dev-utils/webpackHotDevClient'), - paths.appSrc + "/view-file-video.js", - ], - viewFilePDF: [ - require.resolve('./polyfills'), - require.resolve('react-dev-utils/webpackHotDevClient'), - paths.appSrc + "/view-file-pdf.js", - ], viewFileDocument: [ require.resolve('./polyfills'), require.resolve('react-dev-utils/webpackHotDevClient'), @@ -184,21 +169,6 @@ module.exports = { require.resolve('react-dev-utils/webpackHotDevClient'), paths.appSrc + "/view-file-spreadsheet.js", ], - viewFileSVG: [ - require.resolve('./polyfills'), - require.resolve('react-dev-utils/webpackHotDevClient'), - paths.appSrc + "/view-file-svg.js", - ], - viewFileAudio: [ - require.resolve('./polyfills'), - require.resolve('react-dev-utils/webpackHotDevClient'), - paths.appSrc + "/view-file-audio.js", - ], - viewFileUnknown: [ - require.resolve('./polyfills'), - require.resolve('react-dev-utils/webpackHotDevClient'), - paths.appSrc + "/view-file-unknown.js", - ], settings: [ require.resolve('./polyfills'), require.resolve('react-dev-utils/webpackHotDevClient'), diff --git a/frontend/config/webpack.config.prod.js b/frontend/config/webpack.config.prod.js index 45cde571f6..50c0fdb53e 100644 --- a/frontend/config/webpack.config.prod.js +++ b/frontend/config/webpack.config.prod.js @@ -78,16 +78,10 @@ module.exports = { sharedFileViewSpreadsheet: [require.resolve('./polyfills'), paths.appSrc + "/shared-file-view-spreadsheet.js"], sharedFileViewUnknown: [require.resolve('./polyfills'), paths.appSrc + "/shared-file-view-unknown.js"], historyTrashFileView: [require.resolve('./polyfills'), paths.appSrc + "/history-trash-file-view.js"], + fileView: [require.resolve('./polyfills'), paths.appSrc + "/file-view.js"], viewFileText: [require.resolve('./polyfills'), paths.appSrc + "/view-file-text.js"], - viewFileImage: [require.resolve('./polyfills'), paths.appSrc + "/view-file-image.js"], - viewFileXmind: [require.resolve('./polyfills'), paths.appSrc + "/view-file-xmind.js"], - viewFileVideo: [require.resolve('./polyfills'), paths.appSrc + "/view-file-video.js"], - viewFilePDF: [require.resolve('./polyfills'), paths.appSrc + "/view-file-pdf.js"], viewFileDocument: [require.resolve('./polyfills'), paths.appSrc + "/view-file-document.js"], viewFileSpreadsheet: [require.resolve('./polyfills'), paths.appSrc + "/view-file-spreadsheet.js"], - viewFileSVG: [require.resolve('./polyfills'), paths.appSrc + "/view-file-svg.js"], - viewFileAudio: [require.resolve('./polyfills'), paths.appSrc + "/view-file-audio.js"], - viewFileUnknown: [require.resolve('./polyfills'), paths.appSrc + "/view-file-unknown.js"], settings: [require.resolve('./polyfills'), paths.appSrc + "/settings.js"], repoHistory: [require.resolve('./polyfills'), paths.appSrc + "/repo-history.js"], repoSnapshot: [require.resolve('./polyfills'), paths.appSrc + "/repo-snapshot.js"], diff --git a/frontend/src/components/file-content-view/image.js b/frontend/src/components/file-content-view/image.js index 395ffa3cb3..ca88426297 100644 --- a/frontend/src/components/file-content-view/image.js +++ b/frontend/src/components/file-content-view/image.js @@ -5,8 +5,11 @@ import { gettext, siteRoot } from '../../utils/constants'; import '../../css/image-file-view.css'; const { - repoID, - fileName, previousImage, nextImage, rawPath + repoID, repoEncrypted, + fileExt, filePath, fileName, + thumbnailSizeForOriginal, + previousImage, nextImage, rawPath, + xmindImageSrc // for xmind file } = window.app.pageOptions; let previousImageUrl, nextImageUrl; @@ -19,6 +22,13 @@ if (nextImage) { class FileContent extends React.Component { + constructor(props) { + super(props); + this.state = { + loadFailed: false + }; + } + componentDidMount() { document.addEventListener('keydown', (e) => { if (previousImage && e.keyCode == 37) { // press '<-' @@ -30,7 +40,28 @@ class FileContent extends React.Component { }); } + handleLoadFailure = () => { + this.setState({ + loadFailed: true + }); + } + render() { + if (this.state.loadFailed) { + return this.props.tip; + } + + // request thumbnails for some files + // only for 'file view'. not for 'history/trash file view' + let thumbnailURL = ''; + const fileExtList = ['tif', 'tiff', 'psd']; + if (this.props.canUseThumbnail && !repoEncrypted && fileExtList.includes(fileExt)) { + thumbnailURL = `${siteRoot}thumbnail/${repoID}/${thumbnailSizeForOriginal}${Utils.encodePath(filePath)}`; + } + + // for xmind file + const xmindSrc = xmindImageSrc ? `${siteRoot}${xmindImageSrc}` : ''; + return (
{previousImage && ( @@ -39,7 +70,7 @@ class FileContent extends React.Component { {nextImage && ( )} - {fileName} + {fileName}
); } diff --git a/frontend/src/file-view.js b/frontend/src/file-view.js new file mode 100644 index 0000000000..51690e675e --- /dev/null +++ b/frontend/src/file-view.js @@ -0,0 +1,55 @@ +import React from 'react'; +import ReactDOM from 'react-dom'; +import FileView from './components/file-view/file-view'; +import FileViewTip from './components/file-view/file-view-tip'; +import Image from './components/file-content-view/image'; +import SVG from './components/file-content-view/svg'; +import PDF from './components/file-content-view/pdf'; +import Video from './components/file-content-view/video'; +import Audio from './components/file-content-view/audio'; + +const { + fileType, err +} = window.app.pageOptions; + +class InnerFileView extends React.Component { + + render() { + if (err) { + return ( + } /> + ); + } + + let content; + switch (fileType) { + case 'Image': + content = } canUseThumbnail={true} />; + break; + case 'XMind': + content = } />; + break; + case 'SVG': + content = ; + break; + case 'PDF': + content = ; + break; + case 'Video': + content =