diff --git a/frontend/src/pages/repo-wiki-mode/main-panel.js b/frontend/src/pages/repo-wiki-mode/main-panel.js index 4b82a8fe94..d38f583ef6 100644 --- a/frontend/src/pages/repo-wiki-mode/main-panel.js +++ b/frontend/src/pages/repo-wiki-mode/main-panel.js @@ -1,12 +1,10 @@ import React, { Component } from 'react'; -import { gettext, repoID, serviceUrl, slug, siteRoot } from '../../components/constance'; +import { gettext, repoID, serviceUrl, slug, siteRoot, isPro } from '../../components/constance'; import Search from '../../components/search'; import Account from '../../components/account'; import MarkdownViewer from '../../components/markdown-viewer'; import TreeDirView from '../../components/tree-dir-view/tree-dir-view'; -// const repoName = window.repo.config.repo_name - class MainPanel extends Component { onMenuClick = () => { @@ -60,15 +58,17 @@ class MainPanel extends Component {
- + {isPro && + }
- {gettext("Libraries")} + {gettext("Libraries")} / {slug} {pathElem} diff --git a/frontend/src/pages/repo-wiki-mode/side-panel.js b/frontend/src/pages/repo-wiki-mode/side-panel.js index 8250c85a2c..cd0c22dd99 100644 --- a/frontend/src/pages/repo-wiki-mode/side-panel.js +++ b/frontend/src/pages/repo-wiki-mode/side-panel.js @@ -3,6 +3,9 @@ import TreeView from '../../components/tree-view/tree-view'; import { siteRoot, logoPath, mediaUrl, siteTitle, logoWidth, logoHeight } from '../../components/constance'; import NodeMenu from '../../components/menu-component/node-menu'; import MenuControl from '../../components/menu-component/node-menu-control'; +import Delete from '../../components/menu-component/menu-dialog/delete-dialog'; +import Rename from '../../components/menu-component/menu-dialog/rename-dialog'; +import CreateFlieFolder from '../../components/menu-component/menu-dialog/create-fileforder-dialog'; const gettext = window.gettext; @@ -19,7 +22,11 @@ class SidePanel extends Component { top: 0 }, isLoadFailed: false, - isMenuIconShow: false + isMenuIconShow: false, + showDelete: false, + showAddFileFolder: false, + showRename: false, + isFile: false } this.searchedPath = null; } @@ -71,26 +78,52 @@ class SidePanel extends Component { } onHideContextMenu = () => { + if (!this.state.isShowMenu) { + return; + } this.setState({ isShowMenu: false, isNodeItemFrezee: false }) } - onAddFolderNode = (dirPath) => { - this.props.onAddFolderNode(dirPath); + toggleAddFileFolder = (flag) => { + let isFile = flag === true ? true : false; + this.setState({ + showAddFileFolder: !this.state.showAddFileFolder, + isFile: isFile + }); + this.onHideContextMenu(); + } + + toggleRename = () => { + this.setState({showRename: !this.state.showRename}); + this.onHideContextMenu(); + } + + toggleDelete = () => { + this.setState({showDelete: !this.state.showDelete}); + this.onHideContextMenu(); } + onAddFolderNode = (dirPath) => { + this.setState({showAddFileFolder: !this.state.showAddFileFolder}); + this.props.onAddFolderNode(dirPath); + } + onAddFileNode = (filePath) => { + this.setState({showAddFileFolder: !this.state.showAddFileFolder}); this.props.onAddFileNode(filePath); } onRenameNode = (newName) => { + this.setState({showRename: !this.state.showRename}) let node = this.state.currentNode; this.props.onRenameNode(node, newName) } onDeleteNode = () => { + this.setState({showDelete: !this.state.showDelete}) let node = this.state.currentNode; this.props.onDeleteNode(node); } @@ -109,6 +142,22 @@ class SidePanel extends Component { document.removeEventListener('click', this.onHideContextMenu); } + addFolderCancel = () => { + this.setState({showAddFileFolder: !this.state.showAddFileFolder}); + } + + addFileCancel = () => { + this.setState({showAddFileFolder: !this.state.showAddFileFolder}); + } + + deleteCancel = () => { + this.setState({showDelete: !this.state.showDelete}) + } + + renameCancel = () => { + this.setState({showRename: !this.state.showRename}) + } + render() { return (
@@ -135,7 +184,6 @@ class SidePanel extends Component {
{this.props.treeData && } + {this.state.isShowMenu && + } + {this.state.showDelete && + + } + {this.state.showAddFileFolder && + + } + {this.state.showRename && + + }
diff --git a/frontend/src/repo-wiki-mode.js b/frontend/src/repo-wiki-mode.js index b8f9756ba7..38d7697b99 100644 --- a/frontend/src/repo-wiki-mode.js +++ b/frontend/src/repo-wiki-mode.js @@ -5,8 +5,8 @@ import SidePanel from './pages/repo-wiki-mode/side-panel'; import MainPanel from './pages/repo-wiki-mode/main-panel'; import moment from 'moment'; import { slug, repoID, serviceUrl, initialFilePath } from './components/constance'; -import editorUtilities from './utils/editor-utilties'; -import { seafileAPI } from './utils/editor-utilties'; +import editorUtilities from './utils/editor-utilties'; +import { seafileAPI } from './utils/editor-utilties'; import Node from './components/tree-view/node' import Tree from './components/tree-view/tree' import 'seafile-ui'; @@ -47,6 +47,7 @@ class Wiki extends Component { treeData.parseListToTree(files); let node = treeData.getNodeByPath(filePath); + treeData.expandNode(node); if (node.isDir()) { this.exitViewFileState(treeData, node); this.setState({isFileLoading: false}); @@ -60,6 +61,7 @@ class Wiki extends Component { lastModified: moment.unix(mtime).fromNow(), permission: permission, filePath: filePath, + isFileLoading: false }) seafileAPI.getFileDownloadLink(repoID, filePath).then((res) => { @@ -104,11 +106,10 @@ class Wiki extends Component { content: res.data, isFileLoading: false }) - }) - }); + }); + }) }) - let fileUrl = serviceUrl + '/wiki/lib/' + repoID + filePath; window.history.pushState({urlPath: fileUrl, filePath: filePath}, filePath, fileUrl); } @@ -134,6 +135,9 @@ class Wiki extends Component { if (this.isInternalMarkdownLink(url)) { let path = this.getPathFromInternalMarkdownLink(url); this.initMainPanelData(path); + } else if (this.isInternalDirLink(url)) { + let path = this.getPathFromInternalDirLink(url); + this.initWikiData(path); } else { window.location.href = url; } @@ -151,17 +155,15 @@ class Wiki extends Component { let tree = this.state.tree_data.clone(); let node = tree.getNodeByPath(path); - tree.setNodeToActivated(node); - - let path = node.path; //node is file - this.enterViewFileState(tree, node, path); + tree.expandNode(node); + this.enterViewFileState(tree, node, node.path); } } onMainNavBarClick = (nodePath) => { let tree = this.state.tree_data.clone(); let node = tree.getNodeByPath(nodePath); - tree.setNodeToActivated(node); + tree.expandNode(node); this.exitViewFileState(tree, node); @@ -172,7 +174,7 @@ class Wiki extends Component { onMainNodeClick = (node) => { let tree = this.state.tree_data.clone(); - tree.setNodeToActivated(node); + tree.expandNode(node); if (node.isMarkdown()) { this.initMainPanelData(node.path); this.enterViewFileState(tree, node, node.path); @@ -192,6 +194,13 @@ class Wiki extends Component { this.enterViewFileState(tree, node, node.path); } else if(node instanceof Node && node.isDir()){ let tree = this.state.tree_data.clone(); + if (this.state.filePath === node.path) { + if (node.isExpanded) { + tree.collapseNode(node); + } else { + tree.expandNode(node); + } + } this.exitViewFileState(tree, node); } else { const w=window.open('about:blank'); @@ -232,7 +241,7 @@ class Wiki extends Component { let parentNode = tree.getNodeByPath(parentPath); tree.addNodeToParent(node, parentNode); if (this.state.isViewFileState) { - tree.setNodeToActivated(node); + tree.expandNode(node); this.setState({ tree_data: tree, changedNode: node @@ -256,7 +265,7 @@ class Wiki extends Component { let parentNode = tree.getNodeByPath(parentPath); tree.addNodeToParent(node, parentNode); if (this.state.isViewFileState) { - tree.setNodeToActivated(node); + tree.expandNode(node); this.setState({ tree_data: tree, changedNode: node @@ -272,15 +281,17 @@ class Wiki extends Component { let filePath = node.path; if (node.isMarkdown()) { editorUtilities.renameFile(filePath, newName).then(res => { - let date = new Date().getTime()/1000; + let cloneNode = node.clone(); + tree.updateNodeParam(node, "name", newName); node.name = newName; + let date = new Date().getTime()/1000; tree.updateNodeParam(node, "last_update_time", moment.unix(date).fromNow()); - node.last_update_time = moment.unix(date).fromNow(); + if (this.state.isViewFileState) { - if (this.isModifyCurrentFile(node)) { - tree.setNodeToActivated(node); + if (this.isModifyCurrentFile(cloneNode)) { + tree.expandNode(node); this.setState({ tree_data: tree, changedNode: node @@ -290,23 +301,29 @@ class Wiki extends Component { this.setState({tree_data: tree}); } } else { - this.setState({tree_data: tree}); + let parentNode = tree.findNodeParentFromTree(node); + this.setState({ + tree_data: tree, + changedNode: parentNode + }); } }) } else if (node.isDir()) { editorUtilities.renameDir(filePath, newName).then(res => { - let currentFilePath = this.state.filePath;// the sequence is must right + + let currentFilePath = this.state.filePath; let currentFileNode = tree.getNodeByPath(currentFilePath); - - let isPathEqual = (node.path === currentFilePath); - let date = new Date().getTime()/1000; + let nodePath = node.path; + tree.updateNodeParam(node, "name", newName); - node.name = newName; // just synchronization node data && tree data; + node.name = newName; + let date = new Date().getTime()/1000; tree.updateNodeParam(node, "last_update_time", moment.unix(date).fromNow()); node.last_update_time = moment.unix(date).fromNow(); + if (this.state.isViewFileState) { - if (this.isModifyContainsCurrentFile(node)) { - tree.setNodeToActivated(currentFileNode); + if (currentFilePath.indexOf(nodePath) > -1) { + tree.expandNode(currentFileNode); this.setState({ tree_data: tree, changedNode: currentFileNode @@ -316,8 +333,11 @@ class Wiki extends Component { this.setState({tree_data: tree}); } } else { - if (isPathEqual || node.path.indexOf(currentFilePath) > -1) { - tree.setNodeToActivated(currentFileNode); + if (nodePath === currentFilePath) { // old node + tree.expandNode(node); + this.exitViewFileState(tree, node); + } else if (node.path.indexOf(currentFilePath) > -1) { // new node + tree.expandNode(currentFileNode); this.exitViewFileState(tree, currentFileNode); } else { this.setState({tree_data: tree}); @@ -349,7 +369,7 @@ class Wiki extends Component { if (this.state.isViewFileState) { if (isCurrentFile) { let homeNode = this.getHomeNode(tree); - tree.setNodeToActivated(homeNode); + tree.expandNode(homeNode); this.setState({ tree_data: tree, changedNode: homeNode @@ -451,6 +471,11 @@ class Wiki extends Component { return re.test(url); } + isInternalDirLink(url) { + var re = new RegExp(serviceUrl + '/#[a-z\-]*?/lib/' + repoID + '/.*'); + return re.test(url); + } + getPathFromInternalMarkdownLink(url) { var re = new RegExp(serviceUrl + '/lib/' + repoID + '/file' + "(.*\.md)"); var array = re.exec(url); @@ -458,6 +483,22 @@ class Wiki extends Component { return path; } + getPathFromInternalDirLink(url) { + var re = new RegExp(serviceUrl + '/#[a-z\-]*?/lib/' + repoID + "(/.*)"); + var array = re.exec(url); + var path = decodeURIComponent(array[1]); + + var dirPath = path.substring(1); + var re = new RegExp("(^/.*)"); + if (re.test(dirPath)) { + path = dirPath; + } else { + path = '/' + dirPath + } + + return path; + } + render() { return (
@@ -466,7 +507,6 @@ class Wiki extends Component { closeSideBar={this.state.closeSideBar} onCloseSide ={this.onCloseSide} treeData={this.state.tree_data} - permission={this.state.permission} currentFilePath={this.state.filePath} changedNode={this.state.changedNode} onAddFolderNode={this.onAddFolderNode}