Bläddra i källkod

icons for index item in text #1265

bach 2 år sedan
förälder
incheckning
b1424982f5
2 ändrade filer med 38 tillägg och 1 borttagningar
  1. 10 1
      assets/css/app.scss
  2. 28 0
      src/components/Content/EdText.vue

+ 10 - 1
assets/css/app.scss

@@ -684,7 +684,15 @@ section[role="main-content"]{
           span.placeName,
           span.objectName,
           span.persName{
-            font-weight: 600;
+            font-weight: 500;
+          }
+          span.mdi.index-item-icon{
+            font-size: 0.630em;
+            vertical-align: super;
+          }
+
+          span.no-wrap{
+            // white-space: nowrap;
           }
 
 
@@ -696,6 +704,7 @@ section[role="main-content"]{
             font-size: 1.134em;
             line-height: $base-line;
             margin-bottom: $base-line / 2;
+
             span.persName,
             span.placeName,
             span.objectName{

+ 28 - 0
src/components/Content/EdText.vue

@@ -85,12 +85,40 @@ export default {
     // },
     parseTei () {
       this.teiparsed = this.tei
+
+      this.parseIndexItems()
       this.parseLinks()
       this.parseFigures()
+
       if (this.textid === this.uuid) {
         this.parseExtract()
       }
     },
+    parseIndexItems () {
+      let items = this.teiparsed.match(/<span[^>]*class="(persName|objectName|placeName)"[^>]*>[^<]+<\/span>/g)
+      console.log('items', items)
+      if (items) {
+        let itemparts, icon, newspan
+        for (var i = 0; i < items.length; i++) {
+          itemparts = RegExp(/<span[^>]*class="([^"]+)"[^>]*>.+<\/span>/g).exec(items[i], 'g')
+          console.log('itemparts', itemparts)
+          switch (itemparts[1]) {
+            case 'placeName':
+              icon = '<span class="index-item-icon mdi mdi-map-marker"></span>'
+              break
+            case 'objectName':
+              icon = '<span class="index-item-icon mdi mdi-card-bulleted"></span>'
+              break
+            case 'persName':
+              icon = '<span class="index-item-icon mdi mdi-account"></span>'
+              break
+          }
+          // newspan = `<span class="no-wrap">${items[i]}${icon}</span>`
+          newspan = `${items[i]}&nbsp;${icon}`
+          this.teiparsed = this.teiparsed.replace(items[i], newspan)
+        }
+      }
+    },
     parseLinks () {
       let links = this.teiparsed.match(/<a[^<]+<\/a>/g)
       // console.log('links', links)