-
Notifications
You must be signed in to change notification settings - Fork 370
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* add tldr file type * add tldraw editor render * optimize code * add save mode * update version * update dependence * update dependence * optimize code * optimize code --------- Co-authored-by: 杨顺强 <[email protected]>
- Loading branch information
1 parent
0504d5b
commit 155d303
Showing
21 changed files
with
7,691 additions
and
6,289 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1 @@ | ||
| export const SAVE_INTERVAL_TIME = 3 * 60 * 1000; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,26 @@ | ||
| import { seafileAPI } from '../../utils/seafile-api'; | ||
| import { Utils } from '../../utils/utils'; | ||
|
|
||
| const { repoID, filePath, fileName } = window.app.pageOptions; | ||
| let dirPath = Utils.getDirName(filePath); | ||
|
|
||
| class EditorApi { | ||
|
|
||
| saveContent(content) { | ||
| return seafileAPI.getUpdateLink(repoID, dirPath).then((res) => { | ||
| const uploadLink = res.data; | ||
| return seafileAPI.updateFile(uploadLink, filePath, fileName, content); | ||
| }); | ||
| } | ||
|
|
||
| getFileContent = () => { | ||
| return seafileAPI.getFileDownloadLink(repoID, filePath).then(res => { | ||
| const downLoadUrl = res.data; | ||
| return seafileAPI.getFileContent(downLoadUrl); | ||
| }); | ||
| }; | ||
| } | ||
|
|
||
| const editorApi = new EditorApi(); | ||
|
|
||
| export default editorApi; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,89 @@ | ||
| import React, { useCallback, useState, useEffect, useRef } from 'react'; | ||
| import { SimpleEditor } from '@seafile/stldraw-editor'; | ||
| import isHotkey from 'is-hotkey'; | ||
| import editorApi from './editor-api'; | ||
| import { gettext } from '../../utils/constants'; | ||
| import toaster from '../../components/toast'; | ||
| import { SAVE_INTERVAL_TIME } from './constants'; | ||
|
|
||
| const TldrawEditor = () => { | ||
| const editorRef = useRef(null); | ||
| const isChangedRef = useRef(false); | ||
| const [fileContent, setFileContent] = useState({}); | ||
| const [isFetching, setIsFetching] = useState(true); | ||
|
|
||
| useEffect(() => { | ||
| editorApi.getFileContent().then(res => { | ||
| setFileContent(res.data); | ||
| setIsFetching(false); | ||
| }); | ||
| }, []); | ||
|
|
||
| const saveDocument = useCallback(async () => { | ||
| if (isChangedRef.current) { | ||
| try { | ||
| await editorApi.saveContent(JSON.stringify(editorRef.current)); | ||
| isChangedRef.current = false; | ||
| toaster.success(gettext('Successfully saved'), { duration: 2 }); | ||
| } catch { | ||
| toaster.danger(gettext('Failed to save'), { duration: 2 }); | ||
| } | ||
| } | ||
| }, []); | ||
|
|
||
| useEffect(() => { | ||
| const handleHotkeySave = (event) => { | ||
| if (isHotkey('mod+s')(event)) { | ||
| event.preventDefault(); | ||
| } | ||
| }; | ||
|
|
||
| document.addEventListener('keydown', handleHotkeySave); | ||
| return () => { | ||
| document.removeEventListener('keydown', handleHotkeySave); | ||
| }; | ||
| }, [saveDocument]); | ||
|
|
||
| useEffect(() => { | ||
| const saveInterval = setInterval(() => { | ||
| if (isChangedRef.current) { | ||
| editorApi.saveContent(JSON.stringify(editorRef.current)).then(res => { | ||
| isChangedRef.current = false; | ||
| }); | ||
| } | ||
| }, SAVE_INTERVAL_TIME); | ||
|
|
||
| const handleBeforeUnload = (event) => { | ||
| if (isChangedRef.current) { | ||
| event.preventDefault(); | ||
| event.returnValue = ''; | ||
| } | ||
| }; | ||
|
|
||
| window.addEventListener('beforeunload', handleBeforeUnload); | ||
| return () => { | ||
| clearInterval(saveInterval); | ||
| window.removeEventListener('beforeunload', handleBeforeUnload); | ||
| }; | ||
| }, [saveDocument]); | ||
|
|
||
| const onContentChanged = useCallback((docContent) => { | ||
| editorRef.current = docContent; | ||
| isChangedRef.current = true; | ||
| }, []); | ||
|
|
||
| const onSave = useCallback(() => { | ||
| saveDocument(); | ||
| }, [saveDocument]); | ||
|
|
||
| return ( | ||
| <SimpleEditor | ||
| isFetching={isFetching} | ||
| document={fileContent} | ||
| onContentChanged={onContentChanged} | ||
| onSave={onSave} | ||
| /> | ||
| ); | ||
| }; | ||
|
|
||
| export default TldrawEditor; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,11 @@ | ||
| import React, { Suspense } from 'react'; | ||
| import ReactDOM from 'react-dom'; | ||
| import TldrawEditor from './pages/tldraw-editor'; | ||
| import Loading from './components/loading'; | ||
|
|
||
| ReactDOM.render( | ||
| <Suspense fallback={<Loading />}> | ||
| <TldrawEditor /> | ||
| </Suspense>, | ||
| document.getElementById('wrapper') | ||
| ); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,19 @@ | ||
| {% extends 'file_view_react.html' %} | ||
| {% load render_bundle from webpack_loader %} | ||
|
|
||
|
|
||
| {% block extra_style %} | ||
| {% render_bundle 'tldrawEditor' 'css' %} | ||
| {% endblock %} | ||
|
|
||
| {% block extra_data %} | ||
| docPath: '{{ path|escapejs }}', | ||
| docName: '{{ filename|escapejs }}', | ||
| docUuid: '{{ file_uuid }}', | ||
| lang: '{{ lang }}', | ||
| rawPath: '{{ raw_path|escapejs }}', | ||
| {% endblock %} | ||
|
|
||
| {% block render_bundle %} | ||
| {% render_bundle 'tldrawEditor' 'js' %} | ||
| {% endblock %} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.