better interactions between texts and toc

assets/css/app.scss

@@ -346,6 +346,7 @@ section[role="main-content"]{
           h4.toc-title{font-size: 0.882em;}
           h5.toc-title{font-size: 0.882em;}
           h6.toc-title{font-size: 0.882em;}
+          span.toc-title{font-size: 0.882em;}
         }
       }
 

src/components/Content/EdText.vue

@@ -21,7 +21,7 @@ export default {
     }
   },
   beforeMount () {
-    console.log('EdText beforeMount')
+    // console.log('EdText beforeMount')
     if (this.tei) {
       this.buildTemplate()
     }
@@ -48,7 +48,7 @@ export default {
     },
     parseLinks () {
       let links = this.html.match(/<a[^<]+<\/a>/g)
-      console.log('links', links)
+      // console.log('links', links)
       if (links) {
         // let domparser = new DOMParser()
         // let domlink
@@ -98,7 +98,7 @@ export default {
     }
   },
   render (h) {
-    console.log('EdText render()')
+    // console.log('EdText render()')
     if (!this.template) {
       return h('span', 'Loading ...')
     } else {

src/components/Content/EdToc.vue

@@ -30,9 +30,11 @@ export default {
     toc: Array,
     loadedtextsuuids: Array
   },
-  data: () => ({
+  // watch: {
-
+  //   loadedtextsuuids (n, o) {
-  }),
+  //     console.log('EdToc watch loadedtxtsuuids', o, n)
+  //   }
+  // },
   methods: {
     onClickTocItem (uuid) {
       this.$emit('onClickTocItem', uuid)

src/components/Content/TocItem.vue

@@ -52,9 +52,9 @@ export default {
     editionid: String,
     loadedtextsuuids: Array
   },
-  // data: () => ({
+  data: () => ({
-  //
+    isOpened: false
-  // })
+  }),
   computed: {
     children () {
       // check if children exists and if it is an array
@@ -70,7 +70,7 @@ export default {
       }
     },
     titlelevel () {
-      return 'h' + this.level
+      return this.level < 7 ? `h${this.level}` : `span`
     },
     nextLevel () {
       return this.level + 1
@@ -83,21 +83,25 @@ export default {
         return false
       }
     },
-    isOpened () {
-      // console.log('opened', this.$route.params.textid.indexOf(this.item.uuid) >= 0)
-      if (typeof this.$route.params.textid !== 'undefined') {
-        return this.$route.params.textid.indexOf(this.item.uuid) >= 0
-      } else {
-        return false
-      }
-    },
     isLoaded () {
+      // this is updated when loadedtextsuuids is changing
+      // but not for isOpened (had to use a watcher + beforeMount)
+      // don't now why ?
       return this.loadedtextsuuids.indexOf(this.item.uuid) !== -1
     }
   },
+  watch: {
+    loadedtextsuuids (n, o) {
+      // console.log('EdTocItem watch loadedtxtsuuids', o, n)
+      this.isOpened = this.loadedtextsuuids.some(e => e.indexOf(this.item.uuid) >= 0)
+    }
+  },
   // beforeCreate () {
   //   console.log('editionid', this.editionid)
   // },
+  beforeMount () {
+    this.isOpened = this.$route.params.textid.indexOf(this.item.uuid) >= 0
+  },
   methods: {
     onclick (e) {
       console.log('clicked on toc text', this.editionid, e)