Hugging Face's logo

Spaces:
johnpaulbin
/
api-test-stt
Sleeping

App Files Community
johnpaulbin commited on
Commit
54536f2
·
verified ·
1 Parent(s): 7185a56

Update app.py

Browse files
Files changed (1) hide show
  1. app.py +27 -27
app.py CHANGED
@@ -26,7 +26,8 @@ def handle_transcription(username):
26
  @app.route('/')
27
  def home():
28
  html_content = """
29
- <html lang="en"><head>
 
30
  <meta charset="UTF-8">
31
  <title>Speech to Text</title>
32
  <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
@@ -35,32 +36,29 @@ def home():
35
  <h1>Speech Recognition</h1>
36
  <button id="start">Start Listening</button>
37
  <button id="stop">Stop Listening</button>
38
- <div>
39
- <label for="username">Username:</label>
40
- <input type="text" id="username" placeholder="Enter your username">
41
- </div>
42
  <div id="transcription" style="border: 1px solid #ccc; padding: 10px; margin-top: 5px; min-height: 50px;"></div>
43
  <script>
44
- // Check for browser support
45
  window.SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition;
46
  if (!window.SpeechRecognition) {
47
  alert("Your browser does not support Speech Recognition. Try Google Chrome.");
48
  }
49
  let recognition = new window.SpeechRecognition();
50
- recognition.continuous = true; // Keep listening even after getting a result
51
- recognition.interimResults = true; // Show interim results
52
  let liveOutput = document.getElementById('transcription');
53
  let lastTranscription = '';
54
  let intervalId = null;
 
55
  recognition.onresult = (event) => {
56
  let currentTranscription = '';
57
- // Concatenate all the transcriptions
58
  for (const result of event.results) {
59
  currentTranscription += result[0].transcript;
60
  }
61
  liveOutput.textContent = currentTranscription;
62
-
63
- // Check if there's a new transcription
64
  if (lastTranscription !== currentTranscription) {
65
  lastTranscription = currentTranscription;
66
  console.log(currentTranscription);
@@ -69,13 +67,16 @@ def home():
69
  recognition.onerror = (event) => {
70
  console.error('Speech recognition error', event.error);
71
  };
72
- function sendTranscriptionToServer(transcription) {
73
- let username = document.getElementById('username').value;
 
 
 
74
  $.ajax({
75
- url: 'https://johnpaulbin-api-test-stt.hf.space/' + username, // Your server endpoint
76
  type: 'POST',
77
  contentType: 'application/json',
78
- data: JSON.stringify({ transcription: transcription }),
79
  success: function(response) {
80
  console.log('Transcription sent', response);
81
  },
@@ -84,25 +85,24 @@ def home():
84
  }
85
  });
86
  }
87
-
88
- function clearTranscription() {
89
- liveOutput.textContent = '';
90
- currentTranscription = '';
91
- lastTranscription = '';
92
- }
93
-
94
- // Start and stop functions
95
  document.getElementById('start').addEventListener('click', () => {
96
- recognition.start();
97
- intervalId = setInterval(() => sendTranscriptionToServer(lastTranscription), 350);
98
- setInterval(clearTranscription, 3500); // Clear transcription every 2 seconds
99
  });
100
  document.getElementById('stop').addEventListener('click', () => {
101
  recognition.stop();
102
  clearInterval(intervalId);
 
103
  });
104
  </script>
105
- </body></html>
 
 
106
  """
107
  return Response(html_content, mimetype='text/html')
108
 
 
26
  @app.route('/')
27
  def home():
28
  html_content = """
29
+ <html lang="en">
30
+ <head>
31
  <meta charset="UTF-8">
32
  <title>Speech to Text</title>
33
  <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
 
36
  <h1>Speech Recognition</h1>
37
  <button id="start">Start Listening</button>
38
  <button id="stop">Stop Listening</button>
39
+ <div>
40
+ <label for="username">Username:</label>
41
+ <input type="text" id="username" placeholder="Enter your username">
42
+ </div>
43
  <div id="transcription" style="border: 1px solid #ccc; padding: 10px; margin-top: 5px; min-height: 50px;"></div>
44
  <script>
 
45
  window.SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition;
46
  if (!window.SpeechRecognition) {
47
  alert("Your browser does not support Speech Recognition. Try Google Chrome.");
48
  }
49
  let recognition = new window.SpeechRecognition();
50
+ recognition.continuous = true;
51
+ recognition.interimResults = true;
52
  let liveOutput = document.getElementById('transcription');
53
  let lastTranscription = '';
54
  let intervalId = null;
55
+ let delimiterId = null;
56
  recognition.onresult = (event) => {
57
  let currentTranscription = '';
 
58
  for (const result of event.results) {
59
  currentTranscription += result[0].transcript;
60
  }
61
  liveOutput.textContent = currentTranscription;
 
 
62
  if (lastTranscription !== currentTranscription) {
63
  lastTranscription = currentTranscription;
64
  console.log(currentTranscription);
 
67
  recognition.onerror = (event) => {
68
  console.error('Speech recognition error', event.error);
69
  };
70
+
71
+ function sendTranscriptionToServer() {
72
+ let username = document.getElementById('username').value;
73
+ // Extract the latest entry after the last delimiter
74
+ let latestEntry = lastTranscription.substring(lastTranscription.lastIndexOf('DELIMIN') + 7);
75
  $.ajax({
76
+ url: 'https://johnpaulbin-api-test-stt.hf.space/' + username,
77
  type: 'POST',
78
  contentType: 'application/json',
79
+ data: JSON.stringify({ transcription: latestEntry }),
80
  success: function(response) {
81
  console.log('Transcription sent', response);
82
  },
 
85
  }
86
  });
87
  }
88
+
89
+ function appendDelimiter() {
90
+ lastTranscription += 'DELIMIN';
91
+ }
92
+
 
 
 
93
  document.getElementById('start').addEventListener('click', () => {
94
+ intervalId = setInterval(sendTranscriptionToServer, 350);
95
+ delimiterId = setInterval(appendDelimiter, 3500);
 
96
  });
97
  document.getElementById('stop').addEventListener('click', () => {
98
  recognition.stop();
99
  clearInterval(intervalId);
100
+ clearInterval(delimiterId);
101
  });
102
  </script>
103
+ </body>
104
+ </html>
105
+
106
  """
107
  return Response(html_content, mimetype='text/html')
108