diff --git a/public/src/components/Editor/Editor.sass b/public/src/components/Editor/Editor.sass index 26491258..597fa8b5 100644 --- a/public/src/components/Editor/Editor.sass +++ b/public/src/components/Editor/Editor.sass @@ -34,7 +34,6 @@ flex-direction: column gap: 10px position: relative - padding-left: 20px @media screen and (max-width: $lg) padding-left: 10px @@ -79,7 +78,7 @@ animation: fadeIn 0.3s .img - width: 75% + max-width: 50% min-width: 300px @media screen and (max-width: $sm) diff --git a/public/src/components/Editor/EditorWrapper.tsx b/public/src/components/Editor/EditorWrapper.tsx index d41e4c91..a0bacc2e 100644 --- a/public/src/components/Editor/EditorWrapper.tsx +++ b/public/src/components/Editor/EditorWrapper.tsx @@ -12,6 +12,9 @@ import {AppToasts} from "../../modules/toasts"; import {AppUserStore} from "../../modules/stores/UserStore"; import {Viewer} from "./Viewer"; import {AppNotesStore} from "../../modules/stores/NotesStore"; +import {NoteType} from "../../utils/types"; +import {PluginProps} from "./Plugin"; +import {parseNoteTitle} from "../../modules/utils"; window['mobileCheck'] = function() { let check = false; @@ -33,7 +36,16 @@ type EditorState = { youtube: boolean } -export class EditorWrapper extends Component { +type EditorProps = { + open: boolean, + note: NoteType, + isOwner: boolean, + isEditable: boolean, + onChangeTitle: (value: string) => void, + onChangeContent: (value: PluginProps[]) => void +} + +export class EditorWrapper extends Component { state = { tippyOpen: false, tippyPos: { @@ -69,7 +81,6 @@ export class EditorWrapper extends Component { updateState = (store:NoteStoreState) => { this.syncTitle(store.note.title) - console.log(this.props.note) if (!this.props.isOwner && this.props.note?.public) { this.self.innerHTML = "" new Viewer( @@ -89,6 +100,11 @@ export class EditorWrapper extends Component { } syncTitle = (title:string) => { + if (!this.props.isEditable) { + this.noteTitleRef.textContent = parseNoteTitle(title) + return + } + this.noteTitleRef.textContent = title if (this.noteTitleRef.textContent.length == 0) { @@ -101,7 +117,7 @@ export class EditorWrapper extends Component { openDropdown = (elem: HTMLElement) => { const editor = document.querySelector(".note-editor-wrapper") const offsetBottom = editor.clientHeight - elem.getBoundingClientRect().top - const dropdownOffsetTop = offsetBottom < 225 ? -225 : 20 + const dropdownOffsetTop = offsetBottom < 255 ? -225 : 20 this.setState(state => ({ ...state, @@ -114,7 +130,6 @@ export class EditorWrapper extends Component { } closeDropdown = () => { - this.setState(state => ({ ...state, dropdownOpen: false @@ -182,7 +197,7 @@ export class EditorWrapper extends Component { } handleClose={this.closeYoutube}/>
-
this.noteTitleRef = ref}>
+
this.noteTitleRef = ref}>
this.self = elem}>
diff --git a/public/src/components/Editor/Plugin.ts b/public/src/components/Editor/Plugin.ts index 8ed8359a..404ab9f0 100644 --- a/public/src/components/Editor/Plugin.ts +++ b/public/src/components/Editor/Plugin.ts @@ -502,6 +502,8 @@ export const defaultPlugins: EditorPlugin[] = [ AppNoteRequests.GetImage(id, AppUserStore.state.JWT, AppUserStore.state.csrf).then(url => { img.src = url; AppDispatcher.dispatch(NoteStoreActions.PUT_TO_CACHE, {key: id, value: url}) + }).catch(error => { + console.log(error) }) } @@ -517,12 +519,16 @@ export const defaultPlugins: EditorPlugin[] = [ img.dataset.imgid = id; + // TODO: если вставить битую фотку, то пустой img останется в заметке + AppNoteRequests.GetImage(id, AppUserStore.state.JWT, AppUserStore.state.csrf).then(url => { img.src = url; AppDispatcher.dispatch(NoteStoreActions.PUT_TO_CACHE, {key: id, value: url}) + }).catch(error => { + console.log(error) }) - return img; + return img } }, { @@ -888,8 +894,8 @@ export const insertBlockPlugin = (pluginName: string, ...args: any) => { plugin = val; } }); - // - if (plugin === undefined || plugin.insertNode === undefined) { + + if (plugin === undefined || !plugin.insertNode) { return; } const self: string[] = [plugin.pluginName, plugin.type]; @@ -906,8 +912,11 @@ export const insertBlockPlugin = (pluginName: string, ...args: any) => { }); } const newNode = plugin.insertNode([], args); - (nodeToReplace as HTMLElement).replaceWith(newNode); - document.getSelection().setPosition(newNode, 0); + console.log(newNode) + if (newNode) { + (nodeToReplace as HTMLElement).replaceWith(newNode); + document.getSelection().setPosition(newNode, 0); + } } } diff --git a/public/src/components/Header/Header.tsx b/public/src/components/Header/Header.tsx index 2abf70dc..1342ff1c 100644 --- a/public/src/components/Header/Header.tsx +++ b/public/src/components/Header/Header.tsx @@ -45,7 +45,7 @@ export class Header extends ScReact.Component{ render() { return ( -