From 1544b45af5435fde1190634dc44b65ca6ab55238 Mon Sep 17 00:00:00 2001 From: Sheogorath Date: Mon, 25 Mar 2019 17:41:51 +0100 Subject: Move upload button into toolbar Currently we have the odd situation to have two toolbars. One inside the header and one in the editor. Since we only show the image upload button when the editor is visible we should move the upload button into the editor toolbar. This patch does this by adding the image upload button besides the image tag button. Signed-off-by: Sheogorath --- public/js/index.js | 15 --------------- public/js/lib/editor/index.js | 9 +++++++++ public/js/lib/editor/toolbar.html | 3 +++ public/js/lib/editor/ui-elements.js | 3 +-- 4 files changed, 13 insertions(+), 17 deletions(-) (limited to 'public/js') diff --git a/public/js/index.js b/public/js/index.js index 76f952c1..c59c94d0 100644 --- a/public/js/index.js +++ b/public/js/index.js @@ -304,7 +304,6 @@ var editor = editorInstance.init(textit) // FIXME: global referncing in jquery-textcomplete patch window.editor = editor -var inlineAttach = inlineAttachment.editors.codemirror4.attach(editor) defaultTextHeight = parseInt($('.CodeMirror').css('line-height')) // initalize ui reference @@ -801,7 +800,6 @@ function changeMode (type) { editor.getInputField().blur() } if (appState.currentMode === modeType.edit || appState.currentMode === modeType.both) { - ui.toolbar.uploadImage.fadeIn() // add and update status bar if (!editorInstance.statusBar) { editorInstance.addStatusBar() @@ -814,8 +812,6 @@ function changeMode (type) { // work around foldGutter might not init properly editor.setOption('foldGutter', false) editor.setOption('foldGutter', true) - } else { - ui.toolbar.uploadImage.fadeOut() } if (appState.currentMode !== modeType.edit) { $(document.body).css('background-color', 'white') @@ -1051,17 +1047,6 @@ ui.toolbar.import.snippet.click(function () { ui.spinner.hide() }) }) -// import from clipboard -ui.toolbar.import.clipboard.click(function () { - // na -}) -// upload image -ui.toolbar.uploadImage.bind('change', function (e) { - var files = e.target.files || e.dataTransfer.files - e.dataTransfer = {} - e.dataTransfer.files = files - inlineAttach.onDrop(e) -}) // toc ui.toc.dropdown.click(function (e) { e.stopPropagation() diff --git a/public/js/lib/editor/index.js b/public/js/lib/editor/index.js index f05d01b8..17d30ca4 100644 --- a/public/js/lib/editor/index.js +++ b/public/js/lib/editor/index.js @@ -138,6 +138,7 @@ export default class Editor { } addToolBar () { + var inlineAttach = inlineAttachment.editors.codemirror4.attach(this.editor) this.toolBar = $(toolBarTemplate) this.toolbarPanel = this.editor.addPanel(this.toolBar[0], { position: 'top' @@ -157,6 +158,7 @@ export default class Editor { var makeTable = $('#makeTable') var makeLine = $('#makeLine') var makeComment = $('#makeComment') + var uploadImage = $('#uploadImage') makeBold.click(() => { utils.wrapTextWith(this.editor, this.editor, '**') @@ -217,6 +219,13 @@ export default class Editor { makeComment.click(() => { utils.insertText(this.editor, '> []') }) + uploadImage.bind('change', function (e) { + console.log("tiggered") + var files = e.target.files || e.dataTransfer.files + e.dataTransfer = {} + e.dataTransfer.files = files + inlineAttach.onDrop(e) + }) } addStatusBar () { diff --git a/public/js/lib/editor/toolbar.html b/public/js/lib/editor/toolbar.html index a2ac476f..9ea1aacc 100644 --- a/public/js/lib/editor/toolbar.html +++ b/public/js/lib/editor/toolbar.html @@ -34,6 +34,9 @@ + + + diff --git a/public/js/lib/editor/ui-elements.js b/public/js/lib/editor/ui-elements.js index 29a37782..ce19436b 100644 --- a/public/js/lib/editor/ui-elements.js +++ b/public/js/lib/editor/ui-elements.js @@ -35,8 +35,7 @@ export const getUIElements = () => ({ edit: $('.ui-edit'), view: $('.ui-view'), both: $('.ui-both'), - night: $('.ui-night'), - uploadImage: $('.ui-upload-image') + night: $('.ui-night') }, infobar: { lastchange: $('.ui-lastchange'), -- cgit v1.2.3