feat(editor): image extension

donotebase · Apr 21, 2020 · a9e9be1 · a9e9be1
1 parent c1d7cbd
commit a9e9be1
Show file tree

Hide file tree

Showing 13 changed files with 667 additions and 7 deletions.
diff --git a/quasar.conf.js b/quasar.conf.js
@@ -48,6 +48,7 @@ module.exports = function (ctx) {
         'QTooltip',
         'QBtn',
         'QBtnDropdown',
+        'QBtnToggle',
         'QIcon',
         'QList',
         'QItem',

diff --git a/src/components/QuasarTiptap.vue b/src/components/QuasarTiptap.vue
@@ -47,7 +47,7 @@ import {
   Focus,
   HorizontalRule,
   TrailingNode,
-  Image
+  // Image
 } from 'tiptap-extensions'
 
 import java from 'highlight.js/lib/languages/java'
@@ -73,6 +73,7 @@ import {
   OKatexInline,
   OFormatClear,
   OPrint,
+  OImage,
   RecommendedExtensions
 } from 'src/extentions'
 

diff --git a/src/components/menubars/OEditorMenuBubble.vue b/src/components/menubars/OEditorMenuBubble.vue
@@ -1,7 +1,10 @@
 <template>
   <editor-menu-bubble :editor="editor" v-slot="editorContext">
     <section class="tiptap-menububble"
-             :class="{ 'is-active': editorContext.menu.isActive && selectedCellSize === 0 }"
+             :class="{ 'is-active': editorContext.focused &&
+                                    editorContext.menu.isActive &&
+                                    selectedCellSize === 0 &&
+                                    !editorContext.isActive.image() }"
              :style="`left: ${editorContext.menu.left}px; bottom: ${editorContext.menu.bottom + 8}px;`">
       <template v-for="(item, index) of bubbleToolbar">
         <q-separator vertical inset :key="index" v-if="item==='separator'" />
@@ -63,6 +66,10 @@ export default {
     selectedCellSize: {
       type: Number,
       default: 0
+    },
+    imgSelected: {
+      type: Boolean,
+      default: false
     }
   },
   components: {