Support Display Options settings

Add Larivaar support Pull latest HTML
KhalisFoundation · Apr 21, 2017 · 600e3c5 · 600e3c5
1 parent d3f5786
commit 600e3c5
Show file tree

Hide file tree

Showing 4 changed files with 37 additions and 2 deletions.
diff --git a/www/core b/www/core
diff --git a/www/js/defaults.json b/www/js/defaults.json
@@ -13,6 +13,9 @@
         "display-translation": true,
         "display-transliteration": true,
         "display-teeka": true
+      },
+      "display-options": {
+        "larivaar": false
       }
     }
   },

diff --git a/www/js/viewer.js b/www/js/viewer.js
@@ -57,11 +57,24 @@ module.exports = {
           if (rows.length > 0) {
             const cards = [];
             rows.forEach((row) => {
+              const gurmukhiShabads = row.Gurmukhi.split(' ');
+              let taggedGurmukhi = '';
+              gurmukhiShabads.forEach((val) => {
+                let tag;
+                if (val.indexOf(']') !== -1) {
+                  tag = 'i';
+                } else {
+                  tag = 'span';
+                }
+                taggedGurmukhi += `<${tag}>${val}${tag === 'i' ? ' ' : ''}</${tag}> `;
+              });
+              const gurmukhiContainer = document.createElement('div');
+              gurmukhiContainer.innerHTML = taggedGurmukhi;
               cards.push(
                 h(
                   `div#slide${row.ID}.slide${row.ID === lineID ? '.active' : ''}`,
                   [
-                    h('h1.gurbani.gurmukhi', row.Gurmukhi),
+                    h('h1.gurbani.gurmukhi', gurmukhiContainer),
                     h('h2.translation', row.English),
                     h('h2.transliteration', row.Transliteration),
                     h('h2.teeka', row.PunjabiUni),

diff --git a/www/src/scss/viewer.scss b/www/src/scss/viewer.scss
@@ -88,6 +88,25 @@ h2 {
   font-size: 9vh;
   font-weight: normal;
   line-height: 1.3em;
+
+  i {
+    font-style: normal;
+  }
+}
+
+.larivaar {
+  .gurbani {
+    div {
+      font-size: 0;
+    }
+
+    i,
+    span {
+      font-size: 9vh;
+      vertical-align: bottom;
+      white-space: nowrap;
+    }
+  }
 }
 
 .translation,