haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-07 01:41:39 +00:00
Code Issues Releases Wiki Activity

update rich editor

Browse Source
This commit is contained in:
cainiao222
2019-04-18 17:22:56 +08:00
parent 582d68de4b
commit 8361b11353
3 changed files with 63 additions and 199 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
frontend/package-lock.json generated
View File

@@ -158,9 +158,9 @@
"integrity": "sha512-YsAX+gnnf1ytv7asZgJP7T56DALQniKtRVtlz0f11PljLV19I1Av+Oz3QcYaRiKhCCB+EMnVKI9Yc14sYKp6lA=="
},
"@seafile/seafile-editor": {
"version": "0.2.14",
"resolved": "https://registry.npmjs.org/@seafile/seafile-editor/-/seafile-editor-0.2.14.tgz",
"integrity": "sha512-i+dZEbW4ncsbj4On9if4V6K77claiXG2XaE4FIPLYffppx3RbKFpTYLkNSXqYYCSGz1htJ88jxuFOgwmao+MRg==",
"version": "0.2.18",
"resolved": "https://registry.npmjs.org/@seafile/seafile-editor/-/seafile-editor-0.2.18.tgz",
"integrity": "sha512-b6VmsJN3OOM6icCic+zjnNsGILO2cC3cQOBAuonqaF522XlMAkl1bww2ShMXtn85ugGfLnnhvh/B3UT60jhL1w==",
"requires": {
"@seafile/slate-react": "^0.1.8",
"autoprefixer": "7.1.6",
@@ -237,9 +237,9 @@
"integrity": "sha512-P0z5IeAH6qHHGkJIXWw0xC2HNEgkx/9uWWBQw64FJj3/ol14VYdfVGWWr0fXfjhhv3TKVIqUq65os6O4GUNksA=="
},
"react-select": {
"version": "2.4.2",
"resolved": "https://registry.npmjs.org/react-select/-/react-select-2.4.2.tgz",
"integrity": "sha512-5xFOQ6JJktkY5NTaHrc6x9mKwIjhNIiBkGic1j71uyY+ulFpRFra6f4WKLd9fuCylk4WjLpO5zDhdF4CAcwFzA==",
"version": "2.4.3",
"resolved": "https://registry.npmjs.org/react-select/-/react-select-2.4.3.tgz",
"integrity": "sha512-cmxNaiHpviRYkojeW9rGEUJ4jpX7QTmPe2wcscwA4d1lStzw/cJtr4ft5H2O/YhfpkrcwaLghu3XmEYdXhBo8Q==",
"requires": {
"classnames": "^2.2.5",
"emotion": "^9.1.2",
@@ -338,9 +338,9 @@
}
},
"@types/node": {
"version": "11.13.4",
"resolved": "https://registry.npmjs.org/@types/node/-/node-11.13.4.tgz",
"integrity": "sha512-+rabAZZ3Yn7tF/XPGHupKIL5EcAbrLxnTr/hgQICxbeuAfWtT0UZSfULE+ndusckBItcv4o6ZeOJplQikVcLvQ=="
"version": "11.13.5",
"resolved": "https://registry.npmjs.org/@types/node/-/node-11.13.5.tgz",
"integrity": "sha512-/OMMBnjVtDuwX1tg2pkYVSqRIDSmNTnvVvmvP/2xiMAAWf4a5+JozrApCrO4WCAILmXVxfNoQ3E+0HJbNpFVGg=="
},
"@videojs/http-streaming": {
"version": "1.5.1",
@@ -765,7 +765,7 @@
},
"axios": {
"version": "0.18.0",
"resolved": "http://registry.npmjs.org/axios/-/axios-0.18.0.tgz",
"resolved": "https://registry.npmjs.org/axios/-/axios-0.18.0.tgz",
"integrity": "sha1-MtU+SFHv3AoRmTts0AB4nXDAUQI=",
"requires": {
"follow-redirects": "^1.3.0",
@@ -3858,12 +3858,9 @@
}
},
"comma-separated-tokens": {
"version": "1.0.5",
"resolved": "https://registry.npmjs.org/comma-separated-tokens/-/comma-separated-tokens-1.0.5.tgz",
"integrity": "sha512-Cg90/fcK93n0ecgYTAz1jaA3zvnQ0ExlmKY1rdbyHqAx6BHxwoJc+J7HDu0iuQ7ixEs1qaa+WyQ6oeuBpYP1iA==",
"requires": {
"trim": "0.0.1"
}
"version": "1.0.6",
"resolved": "https://registry.npmjs.org/comma-separated-tokens/-/comma-separated-tokens-1.0.6.tgz",
"integrity": "sha512-f20oA7jsrrmERTS70r3tmRSxR8IJV2MTN7qe6hzgX+3ARfXrdMJFvGWvWQK0xpcBurg9j9eO2MiqzZ8Y+/UPCA=="
},
"commander": {
"version": "2.14.1",
@@ -6799,7 +6796,7 @@
},
"git-up": {
"version": "1.2.1",
"resolved": "http://registry.npmjs.org/git-up/-/git-up-1.2.1.tgz",
"resolved": "https://registry.npmjs.org/git-up/-/git-up-1.2.1.tgz",
"integrity": "sha1-JkSAoAax2EJhrB/gmjpRacV+oZ0=",
"requires": {
"is-ssh": "^1.0.0",
@@ -6808,7 +6805,7 @@
},
"git-url-parse": {
"version": "5.0.1",
"resolved": "http://registry.npmjs.org/git-url-parse/-/git-url-parse-5.0.1.tgz",
"resolved": "https://registry.npmjs.org/git-url-parse/-/git-url-parse-5.0.1.tgz",
"integrity": "sha1-/j15xnRq4FBIz6UIyB553du6OEM=",
"requires": {
"git-up": "^1.0.0"
@@ -9769,7 +9766,7 @@
},
"node-status-codes": {
"version": "1.0.0",
"resolved": "http://registry.npmjs.org/node-status-codes/-/node-status-codes-1.0.0.tgz",
"resolved": "https://registry.npmjs.org/node-status-codes/-/node-status-codes-1.0.0.tgz",
"integrity": "sha1-WuVUHQJGRdMqWPzdyc7s6nrjrC8="
},
"noop6": {
@@ -10140,7 +10137,7 @@
},
"package.json": {
"version": "2.0.1",
"resolved": "http://registry.npmjs.org/package.json/-/package.json-2.0.1.tgz",
"resolved": "https://registry.npmjs.org/package.json/-/package.json-2.0.1.tgz",
"integrity": "sha1-+IYFnSpJ7QduZIg2ldc7K0bSHW0=",
"requires": {
"git-package-json": "^1.4.0",
@@ -10150,7 +10147,7 @@
"dependencies": {
"got": {
"version": "5.7.1",
"resolved": "http://registry.npmjs.org/got/-/got-5.7.1.tgz",
"resolved": "https://registry.npmjs.org/got/-/got-5.7.1.tgz",
"integrity": "sha1-X4FjWmHkplifGAVp6k44FoClHzU=",
"requires": {
"create-error-class": "^3.0.1",
@@ -10172,7 +10169,7 @@
},
"package-json": {
"version": "2.4.0",
"resolved": "http://registry.npmjs.org/package-json/-/package-json-2.4.0.tgz",
"resolved": "https://registry.npmjs.org/package-json/-/package-json-2.4.0.tgz",
"integrity": "sha1-DRW9Z9HLvduyyiIv8u24a8sxqLs=",
"requires": {
"got": "^5.0.0",
@@ -13855,12 +13852,9 @@
}
},
"space-separated-tokens": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/space-separated-tokens/-/space-separated-tokens-1.1.2.tgz",
"integrity": "sha512-G3jprCEw+xFEs0ORweLmblJ3XLymGGr6hxZYTYZjIlvDti9vOBUjRQa1Rzjt012aRrocKstHwdNi+F7HguPsEA==",
"requires": {
"trim": "0.0.1"
}
"version": "1.1.3",
"resolved": "https://registry.npmjs.org/space-separated-tokens/-/space-separated-tokens-1.1.3.tgz",
"integrity": "sha512-/M5RAdBuQlSDPNfA5ube+fkHbHyY08pMuADLmsAQURzo56w90r681oiOoz3o3ZQyWdSeNucpTFjL+Ggd5qui3w=="
},
"spdx-correct": {
"version": "1.0.2",
@@ -15312,13 +15306,13 @@
"dependencies": {
"ansi-regex": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-1.1.1.tgz",
"resolved": "http://registry.npmjs.org/ansi-regex/-/ansi-regex-1.1.1.tgz",
"integrity": "sha1-QchHGUZGN15qGl0Qw8oFTvn8mA0=",
"dev": true
},
"strip-ansi": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-2.0.1.tgz",
"resolved": "http://registry.npmjs.org/strip-ansi/-/strip-ansi-2.0.1.tgz",
"integrity": "sha1-32LBqpTtLxFOHQ8h/R1QSCt5pg4=",
"dev": true,
"requires": {

2
frontend/package.json
View File

@@ -7,7 +7,7 @@
"@seafile/react-data-grid": "^6.0.1",
"@seafile/react-data-grid-addons": "^6.0.1",
"@seafile/resumablejs": "^1.1.9",
"@seafile/seafile-editor": "^0.2.14",
"@seafile/seafile-editor": "^0.2.18",
"MD5": "^1.3.0",
"autoprefixer": "7.1.6",
"classnames": "^2.2.6",

156
frontend/src/view-file-cdoc.js
View File

@@ -6,8 +6,8 @@ import { seafileAPI } from './utils/seafile-api';
import io from 'socket.io-client';
import { gettext } from './utils/constants';
import ModalPortal from './components/modal-portal';
import { RichEditor } from './src/editor/editor';
import CDOCTypeChooser from './src/components/codc-type-chooser';
import { RichEditor } from '@seafile/seafile-editor';
import CDOCTypeChooser from '@seafile/seafile-editor/dist/components/codc-type-chooser';
import { Value } from 'slate';
import CDOCTopbar from './components/toolbar/cdoc-editor-topbar';
import ShareDialog from './components/dialog/share-dialog';
@@ -16,13 +16,13 @@ import { translate } from 'react-i18next';
import { EditorUtilities } from '@seafile/seafile-editor/dist/editorUtilities';
import toaster from './components/toast';
import { RichEditorUtils } from '@seafile/seafile-editor/dist/rich-editor-utils';
import './css/markdown-viewer/markdown-editor.css';
import './assets/css/fa-solid.css';
import './assets/css/fa-regular.css';
import './assets/css/fontawesome.css';
import './index.css';
const JSZip = require('jszip');
const request = require('request');
const CryptoJS = require('crypto-js');
@@ -39,7 +39,8 @@ class CDOCEditor extends React.Component {
constructor(props) {
super(props);
this.collabServer = seafileCollabServer ? seafileCollabServer : null
this.collabServer = seafileCollabServer ? seafileCollabServer : null;
this.richEditorUtils = new RichEditorUtils(editorUtilities, this)
this.state = {
value: Value.create({}),
collabUsers: userInfo ?
@@ -69,12 +70,6 @@ class CDOCEditor extends React.Component {
}
}
resetContentChange = () => {
this.setState({
contentChanged: false
})
}
componentDidMount() {
if (userInfo && this.socket) {
const { repoID, path } = this.state.fileInfo;
@@ -184,8 +179,7 @@ class CDOCEditor extends React.Component {
}
openDialogs = (option) => {
switch(option)
{
switch (option) {
case 'help':
window.richEditor.showHelpDialog();
break;
@@ -206,49 +200,8 @@ class CDOCEditor extends React.Component {
}
}
initialContent(){
const that = this;
editorUtilities.getFileDownloadLink().then((res) => {
request({ method : 'GET', url : res.data, encoding: null}, function (error, response, body) {
if (error || response.statusCode !== 200) {
console.log(error);
return;
}
if (body.length === 0 ) {
that.setState({
isShowTypeChooser: true,
});
return;
}
JSZip.loadAsync(body).then((zip) => {
if (zip.file('content.json')) {
zip.file('content.json').async('string').then((res) => {
const value = { object: 'value', document: JSON.parse(res) };
that.setState({
value: Value.create(value),
});
}, (err) => {
console.log(err);
});
}
if (zip.file('info.json')) {
zip.file('info.json').async('string').then((res) => {
that.setState({
zipVersion: JSON.parse(res).version,
});
this.documentType = JSON.parse(res).type;
}, (err) => {
console.log(err);
});
}
// const assets = zip.folder('assets/'); // get images in the future
});
});
});
}
componentWillMount() {
this.initialContent();
this.richEditorUtils.initialContent();
editorUtilities.getFileInfo().then((response) => {
this.setState({
fileInfo: Object.assign({}, this.state.fileInfo, {
@@ -264,89 +217,6 @@ class CDOCEditor extends React.Component {
});
}
onChange = (editor) => {
const ops = editor.operations
.filter(o => o.type !== 'set_selection' && o.type !== 'set_value');
if (ops.size !== 0) {
this.setState({
contentChanged: true,
value: editor.value
})
}
}
onSave = (editor) => {
const info = { 'version': 1, type: this.documentType };
let zip = new JSZip();
this.setState({
isSaving: true
});
zip.file('info.json', JSON.stringify(info));
zip.file('content.json', JSON.stringify(this.state.value.document));
zip.folder('assets');
zip.generateAsync({ type: 'blob' }).then((blob) => {
editorUtilities.saveContent(blob).then(() =>{
this.setState({
isSaving: false,
contentChanged: false
});
toaster.success(this.props.t('file_saved'), {
duration: 2,
});
editorUtilities.getFileInfo().then((res) => {
this.setFileInfoMtime(res.data);
});
}, (err) => {
this.setState({
isSaving: false
});
});
}, function (err) {
this.setState({
isSaving: false
});
console.log(err);
});
}
setFileInfoMtime = (fileInfo) => {
this.setState({
fileInfo: Object.assign({}, this.state.fileInfo, { mtime: fileInfo.mtime, id: fileInfo.id, lastModifier: fileInfo.last_modifier_name })
});
};
setDocument = (type, value) => {
this.setState({
value: value,
});
this.documentType = type;
// save the document type
{
const info = { 'version': 1, type: type};
let zip = new JSZip();
zip.file('info.json', JSON.stringify(info));
zip.file('content.json', JSON.stringify(value.document));
zip.folder('assets');
zip.generateAsync({ type: 'blob' }).then((blob) => {
editorUtilities.saveContent(blob).then(() =>{
editorUtilities.getFileInfo().then((res) => {
this.setFileInfoMtime(res.data);
});
}, (err) => {
});
}, function (err) {
console.log(err);
});
}
this.toggleTypeChooser();
}
toggleTypeChooser = () => {
this.setState({
isShowTypeChooser: !this.state.isShowTypeChooser
});
}
render() {
return (
<React.Fragment>
@@ -361,14 +231,14 @@ class CDOCEditor extends React.Component {
showFileHistory={this.state.isShowHistory ? false : true}
toggleHistory={this.toggleHistory}
saving={this.state.isSaving}
onSave={this.onSave}
onSave={this.richEditorUtils.onSave}
contentChanged={this.state.contentChanged}
/>
<RichEditor
onSave = {this.onSave}
resetContentChange = {this.resetContentChange}
onSave={this.richEditorUtils.onSave}
resetContentChange={this.richEditorUtils.resetContentChange}
value={this.state.value}
onChange = {this.onChange}
onChange={this.richEditorUtils.onChange}
editorUtilities={editorUtilities}
/>
{this.state.showShareLinkDialog &&
@@ -388,7 +258,7 @@ class CDOCEditor extends React.Component {
this.state.isShowTypeChooser &&
<CDOCTypeChooser
showTypeChooser={this.state.isShowTypeChooser}
setDocument = {this.setDocument}
setDocument={this.richEditorUtils.setDocument}
/>
}
</React.Fragment>