Merge pull request #128 from lightwastak3n/firefox_remove_multilingual

Firefox remove multilingual
collabora · Feb 5, 2024 · ec9074d · ec9074d
2 parents 3a25db4 + f383121
commit ec9074d
Show file tree

Hide file tree

Showing 9 changed files with 104 additions and 133 deletions.
diff --git a/Audio-Transcription-Chrome/README.md b/Audio-Transcription-Chrome/README.md
@@ -26,7 +26,6 @@ To capture the audio in the current tab, we used the chrome `tabCapture` API to
 ### Options
 When using the Audio Transcription extension, you have the following options:
  - **Use Collabora Server**: We provide a demo server which runs the whisper small model.
- - **Use Multilingual Model**: Enable this option to utilize the multilingual capabilities of OpenAI-whisper.
  - **Language**: Select the target language for transcription or translation. You can choose from a variety of languages supported by OpenAI-whisper.
  - **Task:** Choose the specific task to perform on the audio. You can select either "transcribe" for transcription or "translate" to translate the audio to English.
  - **Model Size**: Select the whisper model size to run the server with.

diff --git a/Audio-Transcription-Chrome/content.js b/Audio-Transcription-Chrome/content.js
@@ -59,7 +59,7 @@ function init_element() {
 
     elem_container = document.createElement('div');
     elem_container.id = "transcription";
-    elem_container.style.cssText = 'padding-top:16px;font-size:18px;position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);z-index: 9999;line-height:18px;width:500px;height:90px;opacity:0.9;z-index:100;background:black;border-radius:10px;color:white;';
+    elem_container.style.cssText = 'padding-top:16px;font-size:18px;position: fixed; top: 85%; left: 50%; transform: translate(-50%, -50%);line-height:18px;width:500px;height:90px;opacity:0.9;z-index:100;background:black;border-radius:10px;color:white;';
 
     for (var i = 0; i < 4; i++) {
         elem_text = document.createElement('span');

diff --git a/Audio-Transcription-Chrome/popup.js b/Audio-Transcription-Chrome/popup.js
@@ -120,6 +120,7 @@ document.addEventListener("DOMContentLoaded", function () {
     stopButton.disabled = !isCapturing;
     useServerCheckbox.disabled = isCapturing; 
     modelSizeDropdown.disabled = isCapturing;
+    languageDropdown.disabled = isCapturing;
     taskDropdown.disabled = isCapturing; 
     startButton.classList.toggle("disabled", isCapturing);
     stopButton.classList.toggle("disabled", !isCapturing);

diff --git a/Audio-Transcription-Firefox/README.md b/Audio-Transcription-Firefox/README.md
@@ -24,7 +24,6 @@ To capture the audio in the current tab, we used the chrome `tabCapture` API to
 ### Options
 When using the Audio Transcription extension, you have the following options:
  - **Use Collabora Server**: We provide a demo server which runs the whisper small model.
- - **Use Multilingual Model**: Enable this option to utilize the multilingual capabilities of OpenAI-whisper.
  - **Language**: Select the target language for transcription or translation. You can choose from a variety of languages supported by OpenAI-whisper.
  - **Task:** Choose the specific task to perform on the audio. You can select either "transcribe" for transcription or "translate" to translate the audio to English.
   - **Model Size**: Select the whisper model size to run the server with.

diff --git a/Audio-Transcription-Firefox/content.js b/Audio-Transcription-Firefox/content.js
@@ -66,16 +66,12 @@ function resampleTo16kHZ(audioData, origSampleRate = 44100) {
 function startRecording(data) {
     socket = new WebSocket(`ws://${data.host}:${data.port}/`);
     language = data.language;
-    if (language === null && !data.useMultilingual) {
-      language = 'en';
-    }
 
     const uuid = generateUUID();
     socket.onopen = function(e) { 
       socket.send(
         JSON.stringify({
             uid: uuid,
-            multilingual: data.useMultilingual,
             language: data.language,
             task: data.task,
             model: data.modelSize
@@ -201,7 +197,7 @@ function init_element() {
 
     elem_container = document.createElement('div');
     elem_container.id = "transcription";
-    elem_container.style.cssText = 'padding-top:16px;font-size:18px;line-height:18px;top:0px;position:absolute;width:500px;height:90px;opacity:0.9;z-index:100;background:black;border-radius:10px;color:white;';
+    elem_container.style.cssText = 'padding-top:16px;font-size:18px;line-height:18px;position:fixed;top:85%;left:50%;transform:translate(-50%,-50%);width:500px;height:90px;opacity:0.9;z-index:100;background:black;border-radius:10px;color:white;';
 
     for (var i = 0; i < 4; i++) {
         elem_text = document.createElement('span');

diff --git a/Audio-Transcription-Firefox/popup.html b/Audio-Transcription-Firefox/popup.html
@@ -16,113 +16,109 @@
     <label for="useServerCheckbox">Use Collabora Whisper-Live Server</label>
   </div>
   <textarea id="waitTextBox" style="display: none;"></textarea>
-
-  <div class="checkbox-container">
-    <input type="checkbox" id="useMultilingualCheckbox">
-    <label for="useMultilingualCheckbox">Use Multilingual Model</label>
-  </div>
   <div class="dropdown-container">
     <label for="languageDropdown">Select Language:</label>
-    <select id="languageDropdown" disabled>
-      <option value="">Select Language</option>
-      <option value="zh">Chinese</option>
-      <option value="de">German</option>
-      <option value="es">Spanish</option>
-      <option value="ru">Russian</option>
-      <option value="ko">Korean</option>
-      <option value="fr">French</option>
-      <option value="ja">Japanese</option>
-      <option value="pt">Portuguese</option>
-      <option value="tr">Turkish</option>
-      <option value="pl">Polish</option>
+    <select id="languageDropdown">
+      <option value="" selected>Automatically detect</option>
+      <option value="af">Afrikaans</option>
+      <option value="sq">Albanian</option>
+      <option value="am">Amharic</option>
+      <option value="ar">Arabic</option>
+      <option value="hy">Armenian</option>
+      <option value="as">Assamese</option>
+      <option value="az">Azerbaijani</option>
+      <option value="ba">Bashkir</option>
+      <option value="eu">Basque</option>
+      <option value="be">Belarusian</option>
+      <option value="bn">Bengali</option>
+      <option value="bs">Bosnian</option>
+      <option value="br">Breton</option>
+      <option value="bg">Bulgarian</option>
       <option value="ca">Catalan</option>
+      <option value="zh">Chinese</option>
+      <option value="hr">Croatian</option>
+      <option value="cs">Czech</option>
+      <option value="da">Danish</option>
       <option value="nl">Dutch</option>
-      <option value="ar">Arabic</option>
-      <option value="sv">Swedish</option>
-      <option value="it">Italian</option>
-      <option value="id">Indonesian</option>
-      <option value="hi">Hindi</option>
+      <option value="en">English</option>
+      <option value="et">Estonian</option>
+      <option value="fo">Faroese</option>
       <option value="fi">Finnish</option>
-      <option value="vi">Vietnamese</option>
-      <option value="he">Hebrew</option>
-      <option value="uk">Ukrainian</option>
+      <option value="fr">French</option>
+      <option value="gl">Galician</option>
+      <option value="ka">Georgian</option>
+      <option value="de">German</option>
       <option value="el">Greek</option>
-      <option value="ms">Malay</option>
-      <option value="cs">Czech</option>
-      <option value="ro">Romanian</option>
-      <option value="da">Danish</option>
+      <option value="gu">Gujarati</option>
+      <option value="ht">Haitian Creole</option>
+      <option value="ha">Hausa</option>
+      <option value="haw">Hawaiian</option>
+      <option value="he">Hebrew</option>
+      <option value="hi">Hindi</option>
       <option value="hu">Hungarian</option>
-      <option value="ta">Tamil</option>
-      <option value="no">Norwegian</option>
-      <option value="th">Thai</option>
-      <option value="ur">Urdu</option>
-      <option value="hr">Croatian</option>
-      <option value="bg">Bulgarian</option>
-      <option value="lt">Lithuanian</option>
+      <option value="is">Icelandic</option>
+      <option value="id">Indonesian</option>
+      <option value="it">Italian</option>
+      <option value="ja">Japanese</option>
+      <option value="jw">Javanese</option>
+      <option value="kn">Kannada</option>
+      <option value="kk">Kazakh</option>
+      <option value="km">Khmer</option>
+      <option value="ko">Korean</option>
+      <option value="lo">Lao</option>
       <option value="la">Latin</option>
-      <option value="mi">Maori</option>
-      <option value="ml">Malayalam</option>
-      <option value="cy">Welsh</option>
-      <option value="sk">Slovak</option>
-      <option value="te">Telugu</option>
-      <option value="fa">Persian</option>
       <option value="lv">Latvian</option>
-      <option value="bn">Bengali</option>
-      <option value="sr">Serbian</option>
-      <option value="az">Azerbaijani</option>
-      <option value="sl">Slovenian</option>
-      <option value="kn">Kannada</option>
-      <option value="et">Estonian</option>
+      <option value="ln">Lingala</option>
+      <option value="lt">Lithuanian</option>
+      <option value="lb">Luxembourgish</option>
       <option value="mk">Macedonian</option>
-      <option value="br">Breton</option>
-      <option value="eu">Basque</option>
-      <option value="is">Icelandic</option>
-      <option value="hy">Armenian</option>
-      <option value="ne">Nepali</option>
-      <option value="mn">Mongolian</option>
-      <option value="bs">Bosnian</option>
-      <option value="kk">Kazakh</option>
-      <option value="sq">Albanian</option>
-      <option value="sw">Swahili</option>
-      <option value="gl">Galician</option>
+      <option value="mg">Malagasy</option>
+      <option value="ms">Malay</option>
+      <option value="ml">Malayalam</option>
+      <option value="mt">Maltese</option>
+      <option value="mi">Maori</option>
       <option value="mr">Marathi</option>
-      <option value="pa">Punjabi</option>
-      <option value="si">Sinhala</option>
-      <option value="km">Khmer</option>
-      <option value="sn">Shona</option>
-      <option value="yo">Yoruba</option>
-      <option value="so">Somali</option>
-      <option value="af">Afrikaans</option>
+      <option value="mn">Mongolian</option>
+      <option value="my">Myanmar</option>
+      <option value="ne">Nepali</option>
+      <option value="no">Norwegian</option>
+      <option value="nn">Nynorsk</option>
       <option value="oc">Occitan</option>
-      <option value="ka">Georgian</option>
-      <option value="be">Belarusian</option>
-      <option value="tg">Tajik</option>
-      <option value="sd">Sindhi</option>
-      <option value="gu">Gujarati</option>
-      <option value="am">Amharic</option>
-      <option value="yi">Yiddish</option>
-      <option value="lo">Lao</option>
-      <option value="uz">Uzbek</option>
-      <option value="fo">Faroese</option>
-      <option value="ht">Haitian Creole</option>
       <option value="ps">Pashto</option>
-      <option value="tk">Turkmen</option>
-      <option value="nn">Nynorsk</option>
-      <option value="mt">Maltese</option>
+      <option value="fa">Persian</option>
+      <option value="pl">Polish</option>
+      <option value="pt">Portuguese</option>
+      <option value="pa">Punjabi</option>
+      <option value="ro">Romanian</option>
+      <option value="ru">Russian</option>
       <option value="sa">Sanskrit</option>
-      <option value="lb">Luxembourgish</option>
-      <option value="my">Myanmar</option>
-      <option value="bo">Tibetan</option>
+      <option value="sr">Serbian</option>
+      <option value="sn">Shona</option>
+      <option value="sd">Sindhi</option>
+      <option value="si">Sinhala</option>
+      <option value="sk">Slovak</option>
+      <option value="sl">Slovenian</option>
+      <option value="so">Somali</option>
+      <option value="es">Spanish</option>
+      <option value="su">Sundanese</option>
+      <option value="sw">Swahili</option>
+      <option value="sv">Swedish</option>
       <option value="tl">Tagalog</option>
-      <option value="mg">Malagasy</option>
-      <option value="as">Assamese</option>
+      <option value="tg">Tajik</option>
+      <option value="ta">Tamil</option>
       <option value="tt">Tatar</option>
-      <option value="haw">Hawaiian</option>
-      <option value="ln">Lingala</option>
-      <option value="ha">Hausa</option>
-      <option value="ba">Bashkir</option>
-      <option value="jw">Javanese</option>
-      <option value="su">Sundanese</option>
+      <option value="te">Telugu</option>
+      <option value="th">Thai</option>
+      <option value="bo">Tibetan</option>
+      <option value="tr">Turkish</option>
+      <option value="tk">Turkmen</option>
+      <option value="uk">Ukrainian</option>
+      <option value="ur">Urdu</option>
+      <option value="uz">Uzbek</option>
+      <option value="vi">Vietnamese</option>
+      <option value="cy">Welsh</option>
+      <option value="yi">Yiddish</option>
+      <option value="yo">Yoruba</option>
     </select>
   </div>
   <div class="dropdown-container">
@@ -136,14 +132,18 @@
   <div class="dropdown-container">
     <label for="modelSizeDropdown">Select Model Size:</label>
     <select id="modelSizeDropdown">
-      <option value="">Select Task</option>
-      <option value="tiny">Tiny</option>
+      <option value="">Select model</option>
+      <option value="tiny">Tiny </option>
+      <option value="tiny.en">Tiny (English-only)</option>
       <option value="base">Base</option>
+      <option value="base.en">Base (English-only)</option>
       <option value="small" selected>Small</option>
+      <option value="small.en">Small (English-only)</option>
       <option value="medium">Medium</option>
+      <option value="medium.en">Medium (English-only)</option>
       <option value="large-v2">Large-v2</option>
       <option value="large-v3">Large-v3</option>
     </select>
   </div>
 </body>
-</html>
+</html>
diff --git a/Audio-Transcription-Firefox/popup.js b/Audio-Transcription-Firefox/popup.js
@@ -3,7 +3,6 @@ document.addEventListener("DOMContentLoaded", function() {
   const stopButton = document.getElementById("stopCapture");
 
   const useServerCheckbox = document.getElementById("useServerCheckbox");
-  const useMultilingualCheckbox = document.getElementById('useMultilingualCheckbox');
   const languageDropdown = document.getElementById('languageDropdown');
   const taskDropdown = document.getElementById('taskDropdown');
   const modelSizeDropdown = document.getElementById('modelSizeDropdown');
@@ -35,14 +34,6 @@ document.addEventListener("DOMContentLoaded", function() {
     }
   });
 
-  browser.storage.local.get("useMultilingualModelState", ({ useMultilingualModelState }) => {
-    if (useMultilingualModelState !== undefined) {
-      useMultilingualCheckbox.checked = useMultilingualModelState;
-      languageDropdown.disabled = !useMultilingualModelState;
-      taskDropdown.disabled = !useMultilingualModelState;
-    }
-  });
-
   browser.storage.local.get("selectedLanguage", ({ selectedLanguage: storedLanguage }) => {
     if (storedLanguage !== undefined) {
       languageDropdown.value = storedLanguage;
@@ -83,7 +74,6 @@ document.addEventListener("DOMContentLoaded", function() {
             data: {
               host: host,
               port: port,
-              useMultilingual: useMultilingualCheckbox.checked,
               language: selectedLanguage,
               task: selectedTask,
               modelSize: selectedModelSize
@@ -125,9 +115,9 @@ document.addEventListener("DOMContentLoaded", function() {
     startButton.disabled = isCapturing;
     stopButton.disabled = !isCapturing;
     useServerCheckbox.disabled = isCapturing;
-    useMultilingualCheckbox.disabled = isCapturing;
     modelSizeDropdown.disabled = isCapturing;
-
+    languageDropdown.disabled = isCapturing;
+    taskDropdown.disabled = isCapturing; 
     startButton.classList.toggle("disabled", isCapturing);
     stopButton.classList.toggle("disabled", !isCapturing);
   }
@@ -138,18 +128,6 @@ document.addEventListener("DOMContentLoaded", function() {
     browser.storage.local.set({ useServerState });
   });
 
-  useMultilingualCheckbox.addEventListener('change', function() {
-    const useMultilingualModelState = useMultilingualCheckbox.checked;
-    if (useMultilingualModelState) {
-      languageDropdown.disabled = false;
-      taskDropdown.disabled = false;
-    } else {
-      languageDropdown.disabled = true;
-      taskDropdown.disabled = true;
-    }
-    browser.storage.local.set({ useMultilingualModelState });
-  });
-
   languageDropdown.addEventListener('change', function() {
     if (languageDropdown.value === "") {
       selectedLanguage = null;

diff --git a/Audio-Transcription-Firefox/style.css b/Audio-Transcription-Firefox/style.css
@@ -108,4 +108,4 @@ label {
 
 .dropdown-container {
   padding: 10px; 
-}
+}
diff --git a/README.md b/README.md
@@ -56,38 +56,36 @@ from whisper_live.client import TranscriptionClient
 client = TranscriptionClient(
   "localhost",
   9090,
-  is_multilingual=False,
   lang="en",
   translate=False,
   model="small"
 )
 
 client("tests/jfk.wav")
 ```
-This command transcribes the specified audio file (audio.wav) using the Whisper model. It connects to the server running on localhost at port 9090. It can also enable the multilingual feature, allowing transcription in multiple languages. The language option specifies the target language for transcription, in this case, English ("en"). The translate option should be set to `True` if we want to translate from the source language to English and `False` if we want to transcribe in the source language.
+This command transcribes the specified audio file (audio.wav) using the Whisper model. It connects to the server running on localhost at port 9090. Using a multilingual model, language for the transcription will be automatically detected. You can also use the language option to specify the target language for the transcription, in this case, English ("en"). The translate option should be set to `True` if we want to translate from the source language to English and `False` if we want to transcribe in the source language.
 
 - To transcribe from microphone:
 ```python
 from whisper_live.client import TranscriptionClient
 client = TranscriptionClient(
   "localhost",
   9090,
-  is_multilingual=True,
   lang="hi",
   translate=True,
   model="small"
 )
 client()
 ```
-This command captures audio from the microphone and sends it to the server for transcription. It uses the multilingual option with `hi` as the selected language, enabling the multilingual feature and specifying the target language and task. We use whisper `small` by default but can be changed to any other option based on the requirements and the hardware running the server.
+This command captures audio from the microphone and sends it to the server for transcription. It uses the multilingual model with `hi` as the selected language. We use whisper `small` by default but can be changed to any other option based on the requirements and the hardware running the server.
 
 - To transcribe from a HLS stream:
 ```python
 from whisper_live.client import TranscriptionClient
-client = TranscriptionClient(host, port, is_multilingual=True, lang="en", translate=False) 
+client = TranscriptionClient(host, port, lang="en", translate=False) 
 client(hls_url="http://as-hls-ww-live.akamaized.net/pool_904/live/ww/bbc_1xtra/bbc_1xtra.isml/bbc_1xtra-audio%3d96000.norewind.m3u8") 
 ```
-This command streams audio into the server from a HLS stream. It uses the same options as the previous command, enabling the multilingual feature and specifying the target language and task.
+This command streams audio into the server from a HLS stream. It uses the same options as the previous command, using the multilingual model and specifying the target language and task.
 
 ## Transcribe audio from browser
 - Run the server with your desired backend as shown [here](https://github.com/collabora/WhisperLive?tab=readme-ov-file#running-the-server)