From deb8099de1382bb7a710c718799100eae6e71d61 Mon Sep 17 00:00:00 2001
From: Andrea Vos <andrea@avris.it>
Date: Mon, 5 Oct 2020 18:35:17 +0200
Subject: [PATCH] #65 info about the group on pronoun page

---
 pages/index.vue     |  2 +-
 routes/template.vue | 45 +++++++++++++++++++++++++++++++++++++++++----
 src/classes.js      | 11 +++++++++++
 3 files changed, 53 insertions(+), 5 deletions(-)

diff --git a/pages/index.vue b/pages/index.vue
index a8322b331..a0cfe7a4f 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -266,7 +266,7 @@
             },
             addSlash(link) {
                 return link + (link.substr(link.length - 1) === '*' ? '/' : '');
-            }
+            },
         },
     }
 </script>
diff --git a/routes/template.vue b/routes/template.vue
index 5a0a81cd8..2e94d8764 100644
--- a/routes/template.vue
+++ b/routes/template.vue
@@ -44,6 +44,36 @@
             </div>
         </section>
 
+        <section v-if="templateGroup && templateGroup.group.description">
+            <ul class="list-group mt-4">
+                <li class="list-group-item">
+                    <p class="h5">
+                        {{ templateGroup.group.name }}
+                    </p>
+                    <div class="small my-1">
+                        <Icon v="info-circle"/>
+                        <em v-html="templateGroup.group.description"></em>
+                    </div>
+                    <ul class="list-unstyled">
+                        <li v-for="template in templateGroup.groupTemplates" :key="template.canonicalName">
+                            <nuxt-link v-if="typeof template === 'string'" :to="'/' + template">
+                                <strong>{{template.replace(/&/g, ' ' + $t('template.or') + ' ')}}</strong>
+                            </nuxt-link>
+                            <nuxt-link v-else :to="addSlash('/' + template.canonicalName)">
+                                <strong>{{template.name(glue)}}</strong>
+                                –
+                                <small>{{template.description}}</small>
+                            </nuxt-link>
+                            <NormativeBadge v-if="template.normative"/>
+                        </li>
+                    </ul>
+                </li>
+                <nuxt-link to="/" class="list-group-item list-group-item-action text-center">
+                    <Icon v="ellipsis-h-alt"/>
+                </nuxt-link>
+            </ul>
+        </section>
+
         <section>
             <Share :title="`${$t('template.intro')}: ${selectedTemplate.name(glue)}`"/>
         </section>
@@ -65,7 +95,7 @@
 </template>
 
 <script>
-    import { examples, templates, getSources } from "~/src/data";
+    import { examples, templates, getSources, templateLibrary } from "~/src/data";
     import { buildTemplate } from "../src/buildTemplate";
     import { head } from "../src/helpers";
     import GrammarTables from "../data/GrammarTables";
@@ -73,12 +103,14 @@
     export default {
         components: { GrammarTables },
         data() {
+            const selectedTemplate = buildTemplate(templates, this.$route.path.substr(1).replace(/\/$/, ''));
             return {
-                examples: examples,
-                templates: templates,
+                examples,
+                templates,
                 glue: ' ' + this.$t('template.or') + ' ',
 
-                selectedTemplate: buildTemplate(templates, this.$route.path.substr(1).replace(/\/$/, '')),
+                selectedTemplate,
+                templateGroup: templateLibrary.find(selectedTemplate),
 
                 counter: 0,
             }
@@ -94,6 +126,11 @@
                 banner: `banner${this.$route.path.replace(/\/$/, '')}.png`,
             }) : {};
         },
+        methods: {
+            addSlash(link) {
+                return link + (link.substr(link.length - 1) === '*' ? '/' : '');
+            },
+        },
         computed: {
             sources() {
                 return getSources(this.selectedTemplate);
diff --git a/src/classes.js b/src/classes.js
index f64157bbc..94e1b8d93 100644
--- a/src/classes.js
+++ b/src/classes.js
@@ -258,6 +258,17 @@ export class TemplateLibrary {
             }),
         ];
     }
+
+    find(template) {
+        for (let [group, groupTemplates] of this.split()) {
+            for (let t of groupTemplates) {
+                if (t.canonicalName === template.canonicalName) {
+                    return {group, groupTemplates};
+                }
+            }
+        }
+        return null;
+    }
 }
 
 export class Noun {