Merge pull request #701 from nature-heart-software/feat/add-engines-o…

…ptions Add more engines options
nature-heart-software · Oct 4, 2024 · 5ea794e · 5ea794e
2 parents 2fd6494 + 6a327b5
commit 5ea794e
Show file tree

Hide file tree

Showing 6 changed files with 186 additions and 75 deletions.
diff --git a/apps/app/src/plugins/speech-engines/google-cloud/NvSettings.vue b/apps/app/src/plugins/speech-engines/google-cloud/NvSettings.vue
@@ -1,36 +1,110 @@
 <template>
   <NvAccessBlocker
-    :allowed="
+      :allowed="
       (speechStore.hasUniversalApiCredentials && !getProperty('useLocalCredentials')) ||
       !!getProperty('apiKey', true)
     "
-    reason="Credentials required"
+      reason="Credentials required"
   >
-    <NvFormItem label="Voice">
-      <NvVoiceSelect />
-    </NvFormItem>
+    <NvStack spacing="5">
+      <NvFormItem label="Voice">
+        <NvVoiceSelect/>
+      </NvFormItem>
+      <NvDivider direction="horizontal"/>
+      <NvFormItem label="Speaking Rate">
+        <NvGroup>
+          <NvRangeInput
+              :max="4"
+              :min="0.25"
+              :step=".01"
+              class="!grow"
+              v-bind="{
+                modelValue: getProperty('speakingRate'),
+                'onUpdate:modelValue': (value) => setProperty('speakingRate', value),
+              }"
+          />
+          <NvNumberInput
+              :max="4"
+              :min="0.25"
+              :step=".01"
+              v-bind="{
+                modelValue: getProperty('speakingRate'),
+                'onUpdate:modelValue': (value) => setProperty('speakingRate', value),
+              }"
+          />
+        </NvGroup>
+      </NvFormItem>
+      <NvDivider direction="horizontal"/>
+      <NvFormItem label="Pitch">
+        <NvGroup>
+          <NvRangeInput
+              :max="20"
+              :min="-20"
+              :step=".1"
+              class="!grow"
+              v-bind="{
+                modelValue: getProperty('pitch'),
+                'onUpdate:modelValue': (value) => setProperty('pitch', value),
+              }"
+          />
+          <NvNumberInput
+              :max="20"
+              :min="-20"
+              :step=".1"
+              v-bind="{
+                modelValue: getProperty('pitch'),
+                'onUpdate:modelValue': (value) => setProperty('pitch', value),
+              }"
+          />
+        </NvGroup>
+      </NvFormItem>
+      <NvDivider direction="horizontal"/>
+      <NvFormItem label="Volume Gain (Db)">
+        <NvGroup>
+          <NvRangeInput
+              :max="16"
+              :min="-96"
+              :step=".1"
+              class="!grow"
+              v-bind="{
+                modelValue: getProperty('volumeGainDb'),
+                'onUpdate:modelValue': (value) => setProperty('volumeGainDb', value),
+              }"
+          />
+          <NvNumberInput
+              :max="20"
+              :min="-20"
+              :step=".1"
+              v-bind="{
+                modelValue: getProperty('volumeGainDb'),
+                'onUpdate:modelValue': (value) => setProperty('volumeGainDb', value),
+              }"
+          />
+        </NvGroup>
+      </NvFormItem>
+    </NvStack>
   </NvAccessBlocker>
   <template v-if="speechStore.hasUniversalApiCredentials">
-    <NvDivider direction="horizontal" />
+    <NvDivider direction="horizontal"/>
     <NvGroup justify="apart" no-wrap spacing="5">
       <NvStack>
         <NvText type="label">Use my own credentials</NvText>
       </NvStack>
       <NvSwitch
-        :modelValue="getProperty('useLocalCredentials')"
-        @update:modelValue="(value) => setProperty('useLocalCredentials', value)"
+          :modelValue="getProperty('useLocalCredentials')"
+          @update:modelValue="(value) => setProperty('useLocalCredentials', value)"
       />
     </NvGroup>
   </template>
   <template v-if="getProperty('useLocalCredentials') || !speechStore.hasUniversalApiCredentials">
-    <NvDivider direction="horizontal" />
+    <NvDivider direction="horizontal"/>
     <NvStack spacing="5">
       <NvFormItem label="API Key">
         <NvInput
-          :modelValue="getProperty('apiKey', true)"
-          show-password
-          type="password"
-          @update:modelValue="(value) => setProperty('apiKey', value, true)"
+            :modelValue="getProperty('apiKey', true)"
+            show-password
+            type="password"
+            @update:modelValue="(value) => setProperty('apiKey', value, true)"
         />
       </NvFormItem>
     </NvStack>
@@ -42,7 +116,7 @@ import {
   NvDivider,
   NvFormItem,
   NvGroup,
-  NvInput,
+  NvInput, NvNumberInput, NvRangeInput,
   NvStack,
   NvSwitch,
   NvText,

diff --git a/apps/app/src/plugins/speech-engines/google-cloud/register.ts b/apps/app/src/plugins/speech-engines/google-cloud/register.ts
@@ -8,60 +8,63 @@ import { ENGINE_ID, ENGINE_NAME, getVoiceName } from './shared'
 import { getProperty, setProperty } from './store'
 
 const getCredentials = () => ({
-  apiKey: getProperty('apiKey', true),
+    apiKey: getProperty('apiKey', true),
 })
 
 const getSelectedVoice = () => getProperty('selectedVoice')
 registerEngine({
-  id: ENGINE_ID,
-  name: ENGINE_NAME,
-  category: 'cloud',
-  getSelectedVoice,
-  getVoiceName,
-  getCredentials,
-  hasCredentials() {
-    const speechStore = useSpeechStore()
-    return (
-      speechStore.hasUniversalApiCredentials ||
-      Object.values(getCredentials()).every(Boolean)
-    )
-  },
-  getPayload({ text, translatedText, voice: v }) {
-    const selectedVoice = getSelectedVoice()
-    const voice: any = pick(v || selectedVoice, [
-      'name',
-      'ssmlGender',
-      'languageCode',
-    ])
-    // eslint-disable-next-line prefer-destructuring
-    voice.languageCode = selectedVoice.languageCodes[0]
-    return {
-      input: {
-        text: translatedText || text,
-      },
-      voice,
-      audioConfig: {
-        audioEncoding: 'LINEAR16',
-        volumeGainDb: 0,
-      },
-    }
-  },
-  getLanguageCode(voice) {
-    return (voice || getSelectedVoice()).languageCodes[0]
-  },
-  synthesizeSpeech({ credentials, payload }) {
-    return api(
-      getProperty('useLocalCredentials') ? 'local' : 'remote',
-    ).post<Blob>(
-      '/tts/google-cloud/synthesize-speech',
-      {
-        credentials,
-        payload,
-      },
-      { responseType: 'blob' },
-    )
-  },
-  voiceSelectComponent: NvVoiceSelect,
-  settingsComponent: NvSettings,
-  store: { setProperty, getProperty },
+    id: ENGINE_ID,
+    name: ENGINE_NAME,
+    category: 'cloud',
+    getSelectedVoice,
+    getVoiceName,
+    getCredentials,
+    hasCredentials() {
+        const speechStore = useSpeechStore()
+        return (
+            speechStore.hasUniversalApiCredentials ||
+            Object.values(getCredentials()).every(Boolean)
+        )
+    },
+    getPayload({ text, translatedText, voice: v }) {
+        const selectedVoice = getSelectedVoice()
+        const voice: any = pick(v || selectedVoice, [
+            'name',
+            'ssmlGender',
+            'languageCode',
+        ])
+        // eslint-disable-next-line prefer-destructuring
+        voice.languageCode = selectedVoice.languageCodes[0]
+        return {
+            input: {
+                text: translatedText || text,
+            },
+            voice,
+            audioConfig: {
+                audioEncoding: 'LINEAR16',
+                speakingRate: Number(getProperty('speakingRate')),
+                pitch: Number(getProperty('pitch')),
+                volumeGainDb: Number(getProperty('volumeGainDb')),
+
+            },
+        }
+    },
+    getLanguageCode(voice) {
+        return (voice || getSelectedVoice()).languageCodes[0]
+    },
+    synthesizeSpeech({ credentials, payload }) {
+        return api(
+            getProperty('useLocalCredentials') ? 'local' : 'remote',
+        ).post<Blob>(
+            '/tts/google-cloud/synthesize-speech',
+            {
+                credentials,
+                payload,
+            },
+            { responseType: 'blob' },
+        )
+    },
+    voiceSelectComponent: NvVoiceSelect,
+    settingsComponent: NvSettings,
+    store: { setProperty, getProperty },
 })
diff --git a/apps/app/src/plugins/speech-engines/google-cloud/store.ts b/apps/app/src/plugins/speech-engines/google-cloud/store.ts
@@ -2,12 +2,15 @@ import { definePluginStore } from '@/store'
 import { ENGINE_ID } from './shared'
 
 export const { setProperty, getProperty } = definePluginStore(ENGINE_ID, {
-  apiKey: '',
-  selectedVoice: {
-    languageCodes: ['en-GB'],
-    ssmlGender: 'FEMALE',
-    name: 'en-GB-Wavenet-A',
-  },
-  useLocalCredentials: false,
-  favoriteVoiceIds: [],
+    apiKey: '',
+    selectedVoice: {
+        languageCodes: ['en-GB'],
+        ssmlGender: 'FEMALE',
+        name: 'en-GB-Wavenet-A',
+    },
+    useLocalCredentials: false,
+    favoriteVoiceIds: [],
+    speakingRate: 1,
+    pitch: 0,
+    volumeGainDb: 0,
 })
diff --git a/apps/app/src/plugins/speech-engines/say/NvSettings.vue b/apps/app/src/plugins/speech-engines/say/NvSettings.vue
@@ -2,8 +2,37 @@
   <NvFormItem label="Voice">
     <NvVoiceSelect />
   </NvFormItem>
+  <NvDivider direction="horizontal" />
+  <NvFormItem label="Speed">
+    <NvGroup>
+      <NvRangeInput
+        :max="300"
+        :min="1"
+        class="!grow"
+        v-bind="{
+          modelValue: getProperty('speed'),
+          'onUpdate:modelValue': (value) => setProperty('speed', value),
+        }"
+      />
+      <NvNumberInput
+        :max="300"
+        :min="1"
+        v-bind="{
+          modelValue: getProperty('speed'),
+          'onUpdate:modelValue': (value) => setProperty('speed', value),
+        }"
+      />
+    </NvGroup>
+  </NvFormItem>
 </template>
 <script lang="ts" setup>
-import { NvFormItem } from '@packages/ui'
+import {
+  NvDivider,
+  NvFormItem,
+  NvGroup,
+  NvNumberInput,
+  NvRangeInput,
+} from '@packages/ui'
 import NvVoiceSelect from './NvVoiceSelect'
+import { getProperty, setProperty } from '@/plugins/speech-engines/say/store.ts'
 </script>
diff --git a/apps/app/src/plugins/speech-engines/say/register.ts b/apps/app/src/plugins/speech-engines/say/register.ts
@@ -20,6 +20,7 @@ registerEngine({
     return {
       text: translatedText || text,
       voice: voice || getSelectedVoice(),
+      speed: getProperty('speed') / 100,
     }
   },
   getLanguageCode() {

diff --git a/apps/app/src/plugins/speech-engines/say/store.ts b/apps/app/src/plugins/speech-engines/say/store.ts
@@ -4,4 +4,5 @@ import { ENGINE_ID } from './shared'
 export const { setProperty, getProperty } = definePluginStore(ENGINE_ID, {
   selectedVoice: null,
   favoriteVoiceIds: [],
+  speed: 100,
 })