@afeefa/vue-app 0.0.97 → 0.0.99

package/.afeefa/package/release/version.txt

@@ -1 +1 @@
-0.0.97
+0.0.99

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@afeefa/vue-app",
-  "version": "0.0.97",
+  "version": "0.0.99",
   "description": "",
   "author": "Afeefa Kollektiv <kollektiv@afeefa.de>",
   "license": "MIT",

package/src/components/ARichTextArea.vue

@@ -32,24 +32,6 @@
           <v-icon>{{ strikeIcon }}</v-icon>
         </v-btn>
 
-        <v-btn
-          small
-          :class="['menu-button', {'is-active': editorFocus && editor.isActive('heading', {level: 1})}]"
-          title="überschrift 1"
-          @click="editor.chain().focus().toggleHeading({level: 1}).run()"
-        >
-          <v-icon>{{ h1Icon }}</v-icon>
-        </v-btn>
-
-        <v-btn
-          small
-          :class="['menu-button', {'is-active': editorFocus && editor.isActive('heading', {level: 2})}]"
-          title="pberschrift 2"
-          @click="editor.chain().focus().toggleHeading({level: 2}).run()"
-        >
-          <v-icon>{{ h2Icon }}</v-icon>
-        </v-btn>
-
         <v-btn
           small
           :class="['menu-button', {'is-active': editorFocus && editor.isActive('bulletList')}]"
@@ -80,10 +62,10 @@
         <v-btn
           small
           class="menu-button"
-          :class="{ 'is-active': editorFocus && editorSelectionIs('#0000FF')}"
-          title="blau"
-          color="blue--text"
-          @click="editorSelectionIs('#0000FF') ? editor.chain().focus().unsetColor().run() : editor.chain().focus().setColor('#0000FF').run()"
+          :class="{ 'is-active': editorFocus && editor.isActive('highlight', { color: '#00FF00' })}"
+          title="grün"
+          color="green--text"
+          @click="editor.chain().focus().toggleHighlight({ color: '#00FF00' }).run()"
         >
           <v-icon>$paletteIcon</v-icon>
         </v-btn>
@@ -91,10 +73,21 @@
         <v-btn
           small
           class="menu-button"
-          :class="{ 'is-active': editorFocus && editorSelectionIs('#FF0000')}"
+          :class="{ 'is-active': editorFocus && editor.isActive('highlight', { color: '#FF0000' })}"
           title="rot"
           color="red--text"
-          @click="editorSelectionIs('#FF0000') ? editor.chain().focus().unsetColor().run() : editor.chain().focus().setColor('#FF0000').run()"
+          @click="editor.chain().focus().toggleHighlight({ color: '#FF0000' }).run()"
+        >
+          <v-icon>$paletteIcon</v-icon>
+        </v-btn>
+
+        <v-btn
+          small
+          class="menu-button"
+          :class="{ 'is-active': editorFocus && editor.isActive('highlight', { color: '#FFFF00' })}"
+          title="gelb"
+          color="yellow--text"
+          @click="editor.chain().focus().toggleHighlight({ color: '#FFFF00' }).run()"
         >
           <v-icon>$paletteIcon</v-icon>
         </v-btn>
@@ -141,7 +134,7 @@ import {
   mdiRotateRight
 } from '@mdi/js'
 import { Color } from '@tiptap/extension-color'
-import TextStyle from '@tiptap/extension-text-style'
+import Highlight from '@tiptap/extension-highlight'
 
 @Component({
   props: ['value', 'validator', 'focus'],
@@ -183,7 +176,7 @@ export default class ARichTextArea extends Vue {
       autofocus: this.focus ? 'end' : false,
       extensions: [
         StarterKit,
-        TextStyle,
+        Highlight.configure({ multicolor: true }),
         Color
       ],
       onUpdate: () => {
@@ -204,10 +197,6 @@ export default class ARichTextArea extends Vue {
     this.editor.destroy()
   }
 
-  editorSelectionIs (color) {
-    return this.editor.isActive('textStyle', { color: color })
-  }
-
   /**
    * reset the text area to disable the undo button
    * e.g. after saving the form while keeping it open

package/src/services/escape/CascadingWindowEventDispatcher.js

@@ -5,6 +5,7 @@
  */
 
 class CascadingWindowEventDispatcher {
+  windowListeners = {}
   listeners = {}
 
   addEventListener (event, listener) {
@@ -12,9 +13,7 @@ class CascadingWindowEventDispatcher {
       this.listeners[event] = []
     }
 
-    if (!this.listeners[event].length) {
-      this.listeners[event] = []
-
+    if (!this.windowListeners[event]) {
       window.addEventListener(event, e => {
         for (const listener of this.listeners[event]) {
           const result = listener(e)
@@ -23,6 +22,8 @@ class CascadingWindowEventDispatcher {
           }
         }
       })
+
+      this.windowListeners[event] = true
     }
 
     this.listeners[event].unshift(listener)

package/src-admin/components/FlyingContextContainer.vue

@@ -87,7 +87,6 @@ export default class FlyingContextContainer extends Vue {
   position: fixed;
   z-index: 200;
   right: 0;
-  width: 50vw;
   height: 100%;
   top: 0;
   background: white;