4 files changed, 13 insertions, 17 deletions
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 @@
       <a id="makeImage" class="btn btn-sm btn-dark text-uppercase" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false" title="Image">
           <i class="fa fa-image fa-fw"></i>
       </a>
+      <span id="uploadImage" class="btn btn-sm btn-dark btn-file ui-upload-image" title="Upload Image">
+          <i class="fa fa-upload fa-fw"></i><input type="file" accept="image/*" name="upload" multiple>
+      </span>
       <a id="makeTable" class="btn btn-sm btn-dark text-uppercase" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false" title="Table">
           <i class="fa fa-table fa-fw"></i>
       </a>
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'),