diff --git a/Audio-Transcription-Chrome/background.js b/Audio-Transcription-Chrome/background.js index 99848d7..8f51b67 100644 --- a/Audio-Transcription-Chrome/background.js +++ b/Audio-Transcription-Chrome/background.js @@ -190,17 +190,19 @@ async function stopCapture() { * Listens for messages from the runtime and performs corresponding actions. * @param {Object} message - The message received from the runtime. */ -chrome.runtime.onMessage.addListener((message) => { +chrome.runtime.onMessage.addListener(async (message) => { if (message.action === "startCapture") { startCapture(message); } else if (message.action === "stopCapture") { stopCapture(); } else if (message.action === "updateSelectedLanguage") { - console.log("Selected language"); - console.log(message.detectedLanguage); const detectedLanguage = message.detectedLanguage; chrome.runtime.sendMessage({ action: "updateSelectedLanguage", detectedLanguage }); chrome.storage.local.set({ selectedLanguage: detectedLanguage }); + } else if (message.action === "toggleCaptureButtons") { + chrome.runtime.sendMessage({ action: "toggleCaptureButtons", data: false }); + chrome.storage.local.set({ capturingState: { isCapturing: false } }) + stopCapture(); } }); diff --git a/Audio-Transcription-Chrome/content.js b/Audio-Transcription-Chrome/content.js index e8c654f..d1f2c6c 100644 --- a/Audio-Transcription-Chrome/content.js +++ b/Audio-Transcription-Chrome/content.js @@ -6,6 +6,52 @@ var elem_text = null; var segments = []; var text_segments = []; +function initPopupElement() { + if (document.getElementById('popupElement')) { + return; + } + + const popupContainer = document.createElement('div'); + popupContainer.id = 'popupElement'; + popupContainer.style.cssText = 'position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background: white; color: black; padding: 16px; border-radius: 10px; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5); display: none; text-align: center;'; + + const popupText = document.createElement('span'); + popupText.textContent = 'Default Text'; + popupText.className = 'popupText'; + popupText.style.fontSize = '24px'; + popupContainer.appendChild(popupText); + + const buttonContainer = document.createElement('div'); + buttonContainer.style.marginTop = '8px'; + const closePopupButton = document.createElement('button'); + closePopupButton.textContent = 'Close'; + closePopupButton.style.backgroundColor = '#65428A'; + closePopupButton.style.color = 'white'; + closePopupButton.style.border = 'none'; + closePopupButton.style.padding = '8px 16px'; // Add padding for better click area + closePopupButton.style.cursor = 'pointer'; + closePopupButton.addEventListener('click', async () => { + popupContainer.style.display = 'none'; + await browser.runtime.sendMessage({ action: 'toggleCaptureButtons', data: false }); + }); + buttonContainer.appendChild(closePopupButton); + popupContainer.appendChild(buttonContainer); + + document.body.appendChild(popupContainer); +} + + +function showPopup(customText) { + const popup = document.getElementById('popupElement'); + const popupText = popup.querySelector('.popupText'); + + if (popup && popupText) { + popupText.textContent = customText || 'Default Text'; // Set default text if custom text is not provided + popup.style.display = 'block'; + } +} + + function init_element() { if (document.getElementById('transcription')) { return; @@ -128,11 +174,18 @@ chrome.runtime.onMessage.addListener((request, sender, sendResponse) => { remove_element(); sendResponse({data: "STOPPED"}); return; + } else if (type === "showWaitPopup"){ + initPopupElement(); + + showPopup(`Estimated wait time ~ ${Math.round(data)} minutes`); + sendResponse({data: "popup"}); + return; } init_element(); message = JSON.parse(data); + message = message["segments"]; var text = ''; for (var i = 0; i < message.length; i++) { diff --git a/Audio-Transcription-Chrome/options.js b/Audio-Transcription-Chrome/options.js index 9f685b7..fd2489e 100644 --- a/Audio-Transcription-Chrome/options.js +++ b/Audio-Transcription-Chrome/options.js @@ -66,6 +66,16 @@ function resampleTo16kHZ(audioData, origSampleRate = 44100) { return resampledData; } +function generateUUID() { + let dt = new Date().getTime(); + const uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) { + const r = (dt + Math.random() * 16) % 16 | 0; + dt = Math.floor(dt / 16); + return (c === 'x' ? r : (r & 0x3 | 0x8)).toString(16); + }); + return uuid; +} + /** * Starts recording audio from the captured tab. @@ -73,6 +83,7 @@ function resampleTo16kHZ(audioData, origSampleRate = 44100) { */ async function startRecord(option) { const stream = await captureTabAudio(); + const uuid = generateUUID(); if (stream) { // call when the stream inactive @@ -88,6 +99,7 @@ async function startRecord(option) { socket.onopen = function(e) { socket.send( JSON.stringify({ + uid: uuid, multilingual: option.multilingual, language: option.language, task: option.task @@ -96,13 +108,26 @@ async function startRecord(option) { }; socket.onmessage = async (event) => { + const data = JSON.parse(event.data); + if (data["uid"] !== uuid) + return; + + if (data["status"] === "WAIT"){ + await sendMessageToTab(option.currentTabId, { + type: "showWaitPopup", + data: data["message"], + }); + chrome.runtime.sendMessage({ action: "toggleCaptureButtons", data: false }) + chrome.runtime.sendMessage({ action: "stopCapture" }) + return; + } + if (isServerReady === false){ isServerReady = true; return; } if (language === null) { - const data = JSON.parse(event.data); language = data["language"]; // send message to popup.js to update dropdown @@ -115,6 +140,11 @@ async function startRecord(option) { return; } + if (data["message"] === "DISCONNECT"){ + chrome.runtime.sendMessage({ action: "toggleCaptureButtons", data: false }) + return; + } + res = await sendMessageToTab(option.currentTabId, { type: "transcript", data: event.data, @@ -136,7 +166,13 @@ async function startRecord(option) { audioDataCache.push(inputData); // feed inputs and run - socket.send(audioData16kHz); + const base64AudioData = btoa(String.fromCharCode.apply(null, new Uint8Array(audioData16kHz.buffer))); + + socket.send( + JSON.stringify({ + "audio": base64AudioData + }) + ); }; // Prevent page mute diff --git a/Audio-Transcription-Chrome/popup.js b/Audio-Transcription-Chrome/popup.js index ac05d6c..f67f8b7 100644 --- a/Audio-Transcription-Chrome/popup.js +++ b/Audio-Transcription-Chrome/popup.js @@ -119,6 +119,8 @@ document.addEventListener("DOMContentLoaded", function () { startButton.disabled = isCapturing; stopButton.disabled = !isCapturing; useServerCheckbox.disabled = isCapturing; + useMultilingualCheckbox.disabled = isCapturing; + startButton.classList.toggle("disabled", isCapturing); stopButton.classList.toggle("disabled", !isCapturing); } @@ -165,5 +167,12 @@ document.addEventListener("DOMContentLoaded", function () { } } }); + + chrome.runtime.onMessage.addListener(async (request, sender, sendResponse) => { + if (request.action === "toggleCaptureButtons") { + toggleCaptureButtons(false); + chrome.storage.local.set({ capturingState: { isCapturing: false } }) + } + }); });