haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-16 23:29:49 +00:00
Code Issues Releases Wiki Activity

import markdown viewer from seafile-editor (#2572)

Browse Source 
* import markdown viewer from seafile-editor

* refactor code

* page-scroll
This commit is contained in:
C_Q
2018-12-06 10:04:32 +08:00
committed by Daniel Pan
parent 295a9265e0
commit 4b74fcee56
4 changed files with 58 additions and 212 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
frontend/src/pages/repo-wiki-mode/main-panel.js
View File

@@ -10,7 +10,7 @@ import ViewModeToolbar from '../../components/toolbar/view-mode-toolbar';
import DirOperationToolBar from '../../components/toolbar/dir-operation-toolbar';
import MutipleDirOperationToolbar from '../../components/toolbar/mutilple-dir-operation-toolbar';
import CurDirPath from '../../components/cur-dir-path';
import MarkdownViewer from '../../components/markdown-viewer';
import MarkdownContentViewer from '../../components/markdown-viewer';
import DirentListView from '../../components/dirent-list-view/dirent-list-view';
import DirentDetail from '../../components/dirent-detail/dirent-details';
import FileUploader from '../../components/file-uploader/file-uploader';
@@ -34,7 +34,6 @@ const propTypes = {
onSideNavMenuClick: PropTypes.func.isRequired,
onSearchedClick: PropTypes.func.isRequired,
onMainNavBarClick: PropTypes.func.isRequired,
onLinkClick: PropTypes.func.isRequired,
onItemClick: PropTypes.func.isRequired,
onAllDirentSelected: PropTypes.func.isRequired,
onItemSelected: PropTypes.func.isRequired,
@@ -61,7 +60,10 @@ class MainPanel extends Component {
direntPath: '',
currentRepo: null,
isRepoOwner: false,
activeTitleIndex: -1,
};
this.titlesInfo = null;
this.pageScroll = false;
}
componentDidMount() {
@@ -76,6 +78,10 @@ class MainPanel extends Component {
});
});
});
let that = this;
setTimeout(function() {
that.getTitlesInfo();
}, 500);
}
switchViewMode = (mode) => {
@@ -121,6 +127,45 @@ class MainPanel extends Component {
// todo
}
handlePageScroll = (e) => {
if (this.props.pathExist && this.props.isViewFile && !this.pageScroll && this.titlesInfo.length > 0) {
this.pageScroll = true;
let that = this;
setTimeout(function() {
that.pageScroll = false;
}, 100);
const contentScrollTop = this.refs.curViewContent.scrollTop + 180;
let activeTitleIndex;
if (contentScrollTop <= this.titlesInfo[0]) {
activeTitleIndex = 0;
}
else if (contentScrollTop > this.titlesInfo[this.titlesInfo.length - 1]) {
activeTitleIndex = this.titlesInfo.length - 1;
}
else {
for (let i = 0; i < this.titlesInfo.length - 1; i++) {
if (contentScrollTop > this.titlesInfo[i] && this.titlesInfo[i + 1] &&
contentScrollTop < this.titlesInfo[i + 1]) {
activeTitleIndex = i;
break;
}
}
}
this.setState({
activeTitleIndex: activeTitleIndex
});
}
}
getTitlesInfo = () => {
let titlesInfo = [];
let headingList = document.querySelectorAll('h2[id^="user-content"], h3[id^="user-content"]');
for (let i = 0; i < headingList.length; i++) {
titlesInfo.push(headingList[i].offsetTop);
}
this.titlesInfo = titlesInfo;
}
render() {
const ErrMessage = (<div className="message empty-tip err-message"><h2>{gettext('Folder does not exist.')}</h2></div>);
@@ -166,17 +211,17 @@ class MainPanel extends Component {
onPathClick={this.onMainNavBarClick}
/>
</div>
<div className="cur-view-content">
<div className="cur-view-content" onScroll={this.handlePageScroll} ref="curViewContent">
{!this.props.pathExist ?
ErrMessage :
<Fragment>
{ this.props.isViewFile ?
<MarkdownViewer
<MarkdownContentViewer
markdownContent={this.props.content}
latestContributor={this.props.latestContributor}
lastModified = {this.props.lastModified}
onLinkClick={this.props.onLinkClick}
isFileLoading={this.props.isFileLoading}
activeTitleIndex={this.state.activeTitleIndex}
/> :
<Fragment>
<DirentListView