#144 [es] allow multiple pronunciations

components/Example.vue

@@ -7,11 +7,14 @@
         <small v-if="link">
             (<nuxt-link :to="'/' + pronoun.canonicalName">{{ pronoun.canonicalName }}</nuxt-link>)
         </small>
-        <a v-if="config.pronunciation.enabled && pronounce && pronoun.pronounceable && example.pronounce(pronoun)"
-           :href="pronunciationLink"
-           @click.prevent="pronounce">
-            <Icon v="volume"/>
-        </a>
+        <template v-if="config.pronunciation.enabled && pronounce && pronoun.pronounceable && example.pronounce(pronoun)">
+            <a v-for="(link, name) in pronunciationLinks"
+               class="mr-2"
+               :href="link"
+               @click.prevent="pronounce(link)">
+                <Icon v="volume"/><sub v-if="name">{{name}}</sub>
+            </a>
+        </template>
     </span>
 </template>
 
@@ -27,8 +30,8 @@
             pronunciation: { type: Boolean },
         },
         methods: {
-            pronounce() {
-                const sound = new Audio(this.pronunciationLink);
+            pronounce(link) {
+                const sound = new Audio(link);
                 sound.play();
             }
         },
@@ -52,8 +55,15 @@
             pronounToString() {
                 return this.pronounBase && pronouns[this.pronounBase].equals(this.pronoun) ? this.pronounBase : this.pronoun.toString();
             },
-            pronunciationLink() {
-                return `/api/pronounce/${this.pronounToString}?example=${encodeURIComponent(this.example.toString())}`;
+            pronunciationLinks() {
+                const justOne = Object.keys(this.config.pronunciation.voices).length === 1;
+
+                const links = {};
+                for (let country in this.config.pronunciation.voices) {
+                    if (!this.config.pronunciation.voices.hasOwnProperty(country)) { continue; }
+                    links[justOne ? '' : country] = `/api/pronounce/${country}/${this.pronounToString}?example=${encodeURIComponent(this.example.toString())}`;
+                }
+                return links;
             }
         }
     }

locale/en/config.suml

@@ -40,9 +40,11 @@ pronouns:
 
 pronunciation:
     enabled: true
-    language: 'en-GB'
-    voice: 'Emma'
-    engine: 'neural'
+    voices:
+        GB:
+            language: 'en-GB'
+            voice: 'Emma'
+            engine: 'neural'
 
 sources:
     enabled: true

locale/es/config.suml

@@ -20,9 +20,15 @@ pronouns:
 
 pronunciation:
     enabled: true
-    language: 'es-ES'
-    voice: 'Lucia'
-    engine: 'standard'
+    voices:
+        ES:
+            language: 'es-ES'
+            voice: 'Lucia'
+            engine: 'standard'
+        MX:
+            language: 'es-MX'
+            voice: 'Mia'
+            engine: 'standard'
 
 sources:
     enabled: true

locale/pl/config.suml

@@ -44,9 +44,11 @@ pronouns:
 
 pronunciation:
     enabled: true
-    language: 'pl-PL'
-    voice: 'Ewa'
-    engine: 'standard'
+    voices:
+        PL:
+            language: 'pl-PL'
+            voice: 'Ewa'
+            engine: 'standard'
 
 sources:
     enabled: true

server/routes/pronounce.js

@@ -10,7 +10,7 @@ import S3 from 'aws-sdk/clients/s3';
 
 const router = Router();
 
-router.get('/pronounce/:pronoun*', async (req, res) => {
+router.get('/pronounce/:voice/:pronoun*', async (req, res) => {
     const pronounString = req.params.pronoun + req.params[0];
     const pronoun = buildPronoun(
         parsePronouns(loadTsv('pronouns/pronouns')),
@@ -34,10 +34,17 @@ router.get('/pronounce/:pronoun*', async (req, res) => {
         return res.status(404).json({error: 'Not found'});
     }
 
+    const voice = req.config.pronunciation.voices[req.params.voice];
+    if (!voice) {
+        return res.status(404).json({error: 'Not found'});
+    }
+
     const s3 = new S3(awsConfig);
     const polly = new Polly(awsConfig);
 
-    const key = `pronunciation/${req.config.locale}/${pronounString}/${sha1(text)}.mp3`;
+    const key = `pronunciation/${req.config.locale}-${req.params.voice}/${pronounString}/${sha1(text)}.mp3`;
+
+    console.log(key, voice);
 
     try {
         const s3getResponse = await s3.getObject({Key: key}).promise();
@@ -47,9 +54,9 @@ router.get('/pronounce/:pronoun*', async (req, res) => {
             TextType: 'ssml',
             Text: text,
             OutputFormat: 'mp3',
-            LanguageCode: req.config.pronunciation.language,
-            VoiceId: req.config.pronunciation.voice,
-            Engine: req.config.pronunciation.engine,
+            LanguageCode: voice.language,
+            VoiceId: voice.voice,
+            Engine: voice.engine,
         }).promise();
 
         const s3putResponse = await s3.putObject({