Upload 41 files

Dockerfile

@@ -0,0 +1,43 @@
+FROM python:3.8.10-slim
+
+RUN export DEBIAN_FRONTEND=noninteractive \
+    && apt-get -qq update \
+    && apt install software-properties-common -y \
+    && apt-get install build-essential -y \
+    && python3 --version \
+    && apt update \
+    && apt install ffmpeg -y \
+    && rm -rf /var/lib/apt/lists/* \
+    && apt update \
+    && apt install nginx -y
+
+### Set up user with permissions
+# Set up a new user named "user" with user ID 1000
+RUN useradd -m -u 1000 user
+
+# Switch to the "user" user
+USER user
+
+# Set home to the user's home directory
+ENV HOME=/home/user \
+    PATH=/home/user/.local/bin:$PATH
+
+# Set the working directory to the user's home directory
+WORKDIR $HOME/app
+
+### Set up app-specific content
+COPY requirements.txt requirements.txt
+RUN pip3 install -r requirements.txt
+RUN pip3 install gunicorn
+
+# Copy the current directory contents into the container at $HOME/app setting the owner to the user
+COPY --chown=user app $HOME/app
+
+### Update permissions for the app
+USER root
+RUN chmod 777 ~/app/*
+USER user
+
+# RUN python3 server.py
+ENTRYPOINT ["python3", "app.py"]
+# ENTRYPOINT ["gunicorn", "--timeout 600", "wsgi:app"]

LICENSE

@@ -0,0 +1,201 @@
+                                 Apache License
+                           Version 2.0, January 2004
+                        http://www.apache.org/licenses/
+
+   TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+   1. Definitions.
+
+      "License" shall mean the terms and conditions for use, reproduction,
+      and distribution as defined by Sections 1 through 9 of this document.
+
+      "Licensor" shall mean the copyright owner or entity authorized by
+      the copyright owner that is granting the License.
+
+      "Legal Entity" shall mean the union of the acting entity and all
+      other entities that control, are controlled by, or are under common
+      control with that entity. For the purposes of this definition,
+      "control" means (i) the power, direct or indirect, to cause the
+      direction or management of such entity, whether by contract or
+      otherwise, or (ii) ownership of fifty percent (50%) or more of the
+      outstanding shares, or (iii) beneficial ownership of such entity.
+
+      "You" (or "Your") shall mean an individual or Legal Entity
+      exercising permissions granted by this License.
+
+      "Source" form shall mean the preferred form for making modifications,
+      including but not limited to software source code, documentation
+      source, and configuration files.
+
+      "Object" form shall mean any form resulting from mechanical
+      transformation or translation of a Source form, including but
+      not limited to compiled object code, generated documentation,
+      and conversions to other media types.
+
+      "Work" shall mean the work of authorship, whether in Source or
+      Object form, made available under the License, as indicated by a
+      copyright notice that is included in or attached to the work
+      (an example is provided in the Appendix below).
+
+      "Derivative Works" shall mean any work, whether in Source or Object
+      form, that is based on (or derived from) the Work and for which the
+      editorial revisions, annotations, elaborations, or other modifications
+      represent, as a whole, an original work of authorship. For the purposes
+      of this License, Derivative Works shall not include works that remain
+      separable from, or merely link (or bind by name) to the interfaces of,
+      the Work and Derivative Works thereof.
+
+      "Contribution" shall mean any work of authorship, including
+      the original version of the Work and any modifications or additions
+      to that Work or Derivative Works thereof, that is intentionally
+      submitted to Licensor for inclusion in the Work by the copyright owner
+      or by an individual or Legal Entity authorized to submit on behalf of
+      the copyright owner. For the purposes of this definition, "submitted"
+      means any form of electronic, verbal, or written communication sent
+      to the Licensor or its representatives, including but not limited to
+      communication on electronic mailing lists, source code control systems,
+      and issue tracking systems that are managed by, or on behalf of, the
+      Licensor for the purpose of discussing and improving the Work, but
+      excluding communication that is conspicuously marked or otherwise
+      designated in writing by the copyright owner as "Not a Contribution."
+
+      "Contributor" shall mean Licensor and any individual or Legal Entity
+      on behalf of whom a Contribution has been received by Licensor and
+      subsequently incorporated within the Work.
+
+   2. Grant of Copyright License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      copyright license to reproduce, prepare Derivative Works of,
+      publicly display, publicly perform, sublicense, and distribute the
+      Work and such Derivative Works in Source or Object form.
+
+   3. Grant of Patent License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      (except as stated in this section) patent license to make, have made,
+      use, offer to sell, sell, import, and otherwise transfer the Work,
+      where such license applies only to those patent claims licensable
+      by such Contributor that are necessarily infringed by their
+      Contribution(s) alone or by combination of their Contribution(s)
+      with the Work to which such Contribution(s) was submitted. If You
+      institute patent litigation against any entity (including a
+      cross-claim or counterclaim in a lawsuit) alleging that the Work
+      or a Contribution incorporated within the Work constitutes direct
+      or contributory patent infringement, then any patent licenses
+      granted to You under this License for that Work shall terminate
+      as of the date such litigation is filed.
+
+   4. Redistribution. You may reproduce and distribute copies of the
+      Work or Derivative Works thereof in any medium, with or without
+      modifications, and in Source or Object form, provided that You
+      meet the following conditions:
+
+      (a) You must give any other recipients of the Work or
+          Derivative Works a copy of this License; and
+
+      (b) You must cause any modified files to carry prominent notices
+          stating that You changed the files; and
+
+      (c) You must retain, in the Source form of any Derivative Works
+          that You distribute, all copyright, patent, trademark, and
+          attribution notices from the Source form of the Work,
+          excluding those notices that do not pertain to any part of
+          the Derivative Works; and
+
+      (d) If the Work includes a "NOTICE" text file as part of its
+          distribution, then any Derivative Works that You distribute must
+          include a readable copy of the attribution notices contained
+          within such NOTICE file, excluding those notices that do not
+          pertain to any part of the Derivative Works, in at least one
+          of the following places: within a NOTICE text file distributed
+          as part of the Derivative Works; within the Source form or
+          documentation, if provided along with the Derivative Works; or,
+          within a display generated by the Derivative Works, if and
+          wherever such third-party notices normally appear. The contents
+          of the NOTICE file are for informational purposes only and
+          do not modify the License. You may add Your own attribution
+          notices within Derivative Works that You distribute, alongside
+          or as an addendum to the NOTICE text from the Work, provided
+          that such additional attribution notices cannot be construed
+          as modifying the License.
+
+      You may add Your own copyright statement to Your modifications and
+      may provide additional or different license terms and conditions
+      for use, reproduction, or distribution of Your modifications, or
+      for any such Derivative Works as a whole, provided Your use,
+      reproduction, and distribution of the Work otherwise complies with
+      the conditions stated in this License.
+
+   5. Submission of Contributions. Unless You explicitly state otherwise,
+      any Contribution intentionally submitted for inclusion in the Work
+      by You to the Licensor shall be under the terms and conditions of
+      this License, without any additional terms or conditions.
+      Notwithstanding the above, nothing herein shall supersede or modify
+      the terms of any separate license agreement you may have executed
+      with Licensor regarding such Contributions.
+
+   6. Trademarks. This License does not grant permission to use the trade
+      names, trademarks, service marks, or product names of the Licensor,
+      except as required for reasonable and customary use in describing the
+      origin of the Work and reproducing the content of the NOTICE file.
+
+   7. Disclaimer of Warranty. Unless required by applicable law or
+      agreed to in writing, Licensor provides the Work (and each
+      Contributor provides its Contributions) on an "AS IS" BASIS,
+      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+      implied, including, without limitation, any warranties or conditions
+      of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+      PARTICULAR PURPOSE. You are solely responsible for determining the
+      appropriateness of using or redistributing the Work and assume any
+      risks associated with Your exercise of permissions under this License.
+
+   8. Limitation of Liability. In no event and under no legal theory,
+      whether in tort (including negligence), contract, or otherwise,
+      unless required by applicable law (such as deliberate and grossly
+      negligent acts) or agreed to in writing, shall any Contributor be
+      liable to You for damages, including any direct, indirect, special,
+      incidental, or consequential damages of any character arising as a
+      result of this License or out of the use or inability to use the
+      Work (including but not limited to damages for loss of goodwill,
+      work stoppage, computer failure or malfunction, or any and all
+      other commercial damages or losses), even if such Contributor
+      has been advised of the possibility of such damages.
+
+   9. Accepting Warranty or Additional Liability. While redistributing
+      the Work or Derivative Works thereof, You may choose to offer,
+      and charge a fee for, acceptance of support, warranty, indemnity,
+      or other liability obligations and/or rights consistent with this
+      License. However, in accepting such obligations, You may act only
+      on Your own behalf and on Your sole responsibility, not on behalf
+      of any other Contributor, and only if You agree to indemnify,
+      defend, and hold each Contributor harmless for any liability
+      incurred by, or claims asserted against, such Contributor by reason
+      of your accepting any such warranty or additional liability.
+
+   END OF TERMS AND CONDITIONS
+
+   APPENDIX: How to apply the Apache License to your work.
+
+      To apply the Apache License to your work, attach the following
+      boilerplate notice, with the fields enclosed by brackets "[]"
+      replaced with your own identifying information. (Don't include
+      the brackets!)  The text should be enclosed in the appropriate
+      comment syntax for the file format. We also recommend that a
+      file or class name and description of purpose be included on the
+      same "printed page" as the copyright notice for easier
+      identification within third-party archives.
+
+   Copyright [yyyy] [name of copyright owner]
+
+   Licensed under the Apache License, Version 2.0 (the "License");
+   you may not use this file except in compliance with the License.
+   You may obtain a copy of the License at
+
+       http://www.apache.org/licenses/LICENSE-2.0
+
+   Unless required by applicable law or agreed to in writing, software
+   distributed under the License is distributed on an "AS IS" BASIS,
+   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+   See the License for the specific language governing permissions and
+   limitations under the License.

README.md

@@ -1,11 +1,51 @@
 ---
-title: SpeechEmotionV2
-emoji: 🌖
-colorFrom: blue
-colorTo: pink
+title: Test
+emoji: 👀
+colorFrom: yellow
+colorTo: purple
 sdk: docker
 pinned: false
 license: apache-2.0
 ---
 
 Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
+
+# AI-Powered Mood-Based Music Recommendation System
+
+**Welcome to the AI-Powered Mood-Based Music Recommendation System**, a captivating project developed using Python and its frameworks. This innovative system aims to offer personalized music recommendations based on the user's current mood, creating an immersive and enjoyable music experience.
+
+## Overview
+
+The project opens with an engaging audio prompt asking users, *"How are you feeling today?"* Utilizing the Whisper library, the user's response, is transcribed into text. An advanced AI model trained for emotion classification analyzes this text to precisely identify the user's emotional state.
+
+## Features
+
+- **Audio Prompt:** Engage with an audio message that initiates the interaction.
+- **Speech-to-Text:** Whisper library converts spoken responses into text.
+- **Emotion Classification:** AI model accurately classifies user emotions.
+- **Music Recommendations:** Based on emotions, receive tailored song recommendations.
+- **User-Friendly Interface:** Python frameworks create an intuitive web-based UI.
+
+## Commands
+
+### Build
+```shell
+docker build --tag mood-based --file Dockerfile .
+```
+
+
+### Run 
+```shell
+docker run -dit --name mood-based --network host -v /Users/arunaddagatla/Arun/Adarsh/SpeechEmotionV2/app/:/app/ mood-based:latest
+```
+
+### To go inside docker
+
+```shell
+docker exec -it mood-based bash 
+```
+
+### Stop and remove docker
+```shell
+docker stop mood-based && docker rm mood-based
+```

app/app.py

@@ -0,0 +1,40 @@
+import os
+import uuid
+
+from flask import Flask, flash, render_template, request
+from flask_cors import CORS
+from modules import Module
+
+model = Module()
+
+
+app = Flask(__name__)
+CORS(app)
+
+app.secret_key = "Testing"
+
+@app.route('/')
+def index():
+    flash(" Welcome to My Website")
+    return render_template('index.html')
+
+@app.route('/audio_to_text/')
+def audio_to_text():
+    flash(" Press Start to start recording audio and press Stop to end recording audio")
+    return render_template('audio_to_text.html')
+
+@app.route('/audio', methods=['POST'])
+def audio():
+    try:
+        output_file = f"./tmp/{uuid.uuid4()}.wav"
+        open(output_file, 'wb').write(request.data)
+        text, emotion = model.predict(audio_path=output_file)
+        os.remove(output_file)
+        return_text = f" Transcription: {text} <br> Emotion: {emotion} "
+    except Exception:
+        return_text = " Sorry!!!! Voice not Detected "
+    return return_text
+
+
+if __name__ == "__main__":
+    app.run(debug=True, port=7860, host='0.0.0.0')

app/modules/__init__.py

@@ -0,0 +1,34 @@
+import os
+import time
+
+from modules.emotion import Emotion
+from modules.transcription import Transcription
+
+transcription_model = "tiny.en"
+emotion_model = "joeddav/distilbert-base-uncased-go-emotions-student"
+
+transcription_obj = Transcription(model_name=transcription_model)
+emotion_obj = Emotion(model_name=emotion_model)
+
+class Module:
+
+    def predict(self, audio_path: str) -> str:
+        """Loads audio, gets transcription and detects emotion
+
+        Args:
+            audio_path (str): path to the audio file
+
+        Returns:
+            str: emotion
+        """
+        print("Getting transcription...")
+        start_time = time.time()
+        if text := transcription_obj.transcribe(audio_path=audio_path):
+            print("Text: ", text, time.time() - start_time)
+            
+            start_time = time.time()
+            emotion = emotion_obj.detect_emotion(text=text)
+            print("Emotion: ", emotion, time.time() - start_time)
+            return text, emotion
+        return None
+        

app/modules/audio/__init__.py

@@ -0,0 +1,18 @@
+from typing import Any
+
+import whisper
+
+
+class Audio:
+    @classmethod
+    def load_audio(cls, audio_path: str) -> Any:
+        """Loads audio file from the disk
+
+        Args:
+            audio_path (str): path of the audio file
+
+        Returns:
+            Any: loaded audio file in numbers
+        """
+        return whisper.load_audio(audio_path)
+    

app/modules/emotion/__init__.py

@@ -0,0 +1,24 @@
+from typing import Any
+
+from modules.utils import Pipeline, load_model
+
+
+class Emotion:
+    task: str = "text-classification"
+    
+    def __init__(self, model_name: str) -> None:
+        # model_name: str = "/models/distilbert-base-uncased-go-emotions-student/"
+        print("Loading emotion model...")
+        self.emotion_model: Pipeline = load_model(task=self.task, model=model_name)
+        print("Loaded emotion model")
+    
+    def detect_emotion(self, text: str) -> str:
+        """Detects emotion of the given text
+
+        Args:
+            text (str): text
+
+        Returns:
+            str: emotion
+        """
+        return self.emotion_model(text)[0]['label']

app/modules/transcription/__init__.py

@@ -0,0 +1,30 @@
+import torch
+from faster_whisper import WhisperModel
+
+
+class Transcription:
+
+    def __init__(self, model_name: str) -> None:
+        print("Loading whisper model...")
+        self.whisper_model = self.load_whisper(model_id=model_name)
+        print("Loaded whisper model")
+    
+    def load_whisper(self, model_id: str):
+
+        device = "cuda:0" if torch.cuda.is_available() else "cpu"
+        torch_dtype = "float16" if torch.cuda.is_available() else "float32"
+
+        return WhisperModel(model_id, device=device, compute_type=torch_dtype)
+    
+    def transcribe(self, audio_path: str) -> str:
+        """Transcribes the given audio data
+
+        Args:
+            audio_path (str): audio path
+
+        Returns:
+            str: text
+        """
+        segments, info = self.whisper_model.transcribe(audio_path, language="en")
+        return "".join(segment.text for segment in segments)
+        

app/modules/utils.py

@@ -0,0 +1,20 @@
+import torch
+from transformers import pipeline
+from transformers.pipelines.base import Pipeline
+
+
+def load_model(task: str, model: str) -> Pipeline:
+    """Loads the given transformers model based on the given task
+
+    Args:
+        task (str): NLP task
+        model (str): transformers model
+
+    Returns:
+        Pipeline: transformers pipeline object
+    """
+    return pipeline(
+        task=task, 
+        model=model, 
+        device = 0 if torch.cuda.is_available() else -1
+    )

app/static/audio_to_text.css

@@ -0,0 +1,85 @@
+
+.column1 {
+    float: left;
+    width: 30%;
+    height: 400px; /* Should be removed. Only for demonstration */
+    background-color: #fff;
+  }
+  
+  .column2 {
+    float: left;
+    width: 70%;
+    height: 400px; /* Should be removed. Only for demonstration */
+    background-color: #0f4da6;
+  }
+  
+  /* Clear floats after the columns */
+  .row:after {
+    
+    content: "";
+    display: table;
+    clear: both;
+  }
+  
+  .row{
+    margin-left: 10%;
+    margin-right: 10%;
+    margin-bottom: 3%;
+    background-color: #060073;
+  }
+  /* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
+  @media screen and (max-width: 600px) {
+    .column1 {
+      width: 100%;
+    }
+  }
+  
+  @media screen and (max-width: 600px) {
+    .column2 {
+      width: 100%;
+    }
+  }
+  
+  #imgInp {
+    opacity: 0;
+    position: absolute;
+    z-index: -1;
+  }
+
+  label {
+    cursor: pointer;
+    /* Style as you please, it will become the visible UI component. */
+    padding-left: 10%;
+    padding-right: 10%;
+    padding-top: 2%;
+    padding-bottom: 2%;
+    font-size: 100%;
+    color: #fff;
+    border-radius: 25px;
+    background-color: #0f4da6;
+    
+  }
+
+  #blah{
+      max-width: 60%;
+      max-height: 60%;
+  }
+
+  #image_div1{
+    max-width: 70%;
+      max-height: 70%;
+  }
+
+  #stop,#start{
+    cursor: pointer;
+    /* Style as you please, it will become the visible UI component. */
+    padding-left: 10%;
+    padding-right: 10%;
+    padding-top: 2%;
+    padding-bottom: 2%;
+    font-size: 100%;
+    color: #fff;
+    border-radius: 25px;
+    background-color: #0f4da6;
+    margin-top: 10%;
+  }

app/static/audiodisplay.js

@@ -0,0 +1,18 @@
+function drawBuffer( width, height, context, data ) {
+    var step = Math.ceil( data.length / width );
+    var amp = height / 2;
+    context.fillStyle = "silver";
+    context.clearRect(0,0,width,height);
+    for(var i=0; i < width; i++){
+        var min = 1.0;
+        var max = -1.0;
+        for (j=0; j<step; j++) {
+            var datum = data[(i*step)+j]; 
+            if (datum < min)
+                min = datum;
+            if (datum > max)
+                max = datum;
+        }
+        context.fillRect(i,(1+min)*amp,1,Math.max(1,(max-min)*amp));
+    }
+}

app/static/footer.js

@@ -0,0 +1,8 @@
+function myFunction() {
+    var x = document.getElementById("myFootnav");
+    if (x.className === "footnov") {
+      x.className += " responsive";
+    } else {
+      x.className = "footnov";
+    }
+  }

app/static/footer_file.css

@@ -0,0 +1,51 @@
+
+  .footnov {
+  overflow: hidden;
+  background-color: black;
+}
+
+.footnov a {
+  float: left;
+  display: block;
+  color: #f2f2f2;
+  text-align: center;
+  padding: 14px 16px;
+  text-decoration: none;
+  font-size: 17px;
+}
+
+.footnov a:hover {
+  background-color: #ddd;
+  color: black;
+}
+
+.footnov a.active {
+  background-color:rgb(80, 61, 226);
+  color: white;
+}
+
+.footnov .icon {
+  display: none;
+}
+
+@media screen and (max-width: 100px) {
+  .footnov a:not(:first-child) {display: none;}
+  .footnov a.icon {
+    float: right;
+    display: block;
+  }
+}
+
+@media screen and (max-width: 100px) {
+  .footnov.responsive {position: relative;}
+  .footnov.responsive .icon {
+    position: absolute;
+    right: 0;
+    top: 0;
+  }
+  .footnov.responsive a {
+    float: none;
+    display: block;
+    text-align: left;
+  }
+}

app/static/header.js

@@ -0,0 +1,8 @@
+function myFunction() {
+    var x = document.getElementById("mytopnav");
+    if (x.className === "topnav") {
+      x.className += " responsive";
+    } else {
+      x.className = "topnav";
+    }
+  }

app/static/header_file.css

@@ -0,0 +1,77 @@
+body {
+    margin: 0;
+    font-family: Arial, Helvetica, sans-serif;
+  }
+  
+  .topnav {
+    overflow: hidden;
+    background-color: black;
+  }
+  
+  .topnav a {
+    float: left;
+    display: block;
+    color: #f2f2f2;
+    text-align: center;
+    padding: 14px 16px;
+    text-decoration: none;
+    font-size: 17px;
+  }
+  
+  .topnav a:hover {
+    background-color: #ddd;
+    color: black;
+  }
+  
+  .topnav a.active {
+    background-color: rgb(80, 61, 226);
+    color: white;
+  }
+  
+  .topnav .icon {
+    display: none;
+  }
+  
+  @media screen and (max-width: 600px) {
+    .topnav a:not(:first-child) {display: none;}
+    .topnav a.icon {
+      float: right;
+      display: block;
+    }
+  }
+  
+  @media screen and (max-width: 600px) {
+    .topnav.responsive {position: relative;}
+    .topnav.responsive .icon {
+      position: absolute;
+      right: 0;
+      top: 0;
+    }
+    .topnav.responsive a {
+      float: none;
+      display: block;
+      text-align: left;
+    }
+  }
+
+
+  .alert {
+    padding: 20px;
+    background-color: #f44336;
+    color: white;
+  }
+  
+  .closebtn {
+    margin-left: 15px;
+    color: white;
+    font-weight: bold;
+    float: right;
+    font-size: 22px;
+    line-height: 20px;
+    cursor: pointer;
+    transition: 0.3s;
+  }
+  
+  .closebtn:hover {
+    color: black;
+  }

app/static/main.css

@@ -0,0 +1,83 @@
+#loader{  
+    position:relative;
+    margin:0 auto;
+    clear:left;
+    height:auto;
+    z-index: 0;
+    text-align:center;
+}  
+
+
+.glow {
+    font-size: 50px;
+    color: #fff;
+    text-align: center;
+    -webkit-animation: glow 1s ease-in-out infinite alternate;
+    -moz-animation: glow 1s ease-in-out infinite alternate;
+    animation: glow 1s ease-in-out infinite alternate;
+  }
+  
+  @-webkit-keyframes glow {
+    from {
+      text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #660073, 0 0 20px #660073, 0 0 25px #660073, 0 0 30px #060073, 0 0 35px #060073;
+    }
+    
+    to {
+      text-shadow: 0 0 10px #fff, 0 0 15px #0f4da6, 0 0 20px #0f4da6, 0 0 25px #0f4da6, 0 0 30px #0f4da6, 0 0 35px #0f4da6, 0 0 40px #0f4da6;
+    }
+  }
+
+
+
+.registerbtn {
+  border-radius: 25px;
+  position:relative;
+  color: white;
+  padding: 20px 20px;
+  margin: 0.9% 0;
+  border: none;
+  cursor: pointer;
+  font-size: 150%;
+  width: 40%;
+  opacity: 0.9;
+}
+.button1{
+    background-color: green;
+    /* margin-left: 3%; */
+}
+.button2{
+	background-color: blue;
+}
+.button3{
+	background-color: red;
+}
+.button4{
+	background-color:cornflowerblue;
+}
+.button5{
+	background-color:blueviolet;
+}
+.button span {
+  cursor: pointer;
+  display: inline-block;
+  position: relative;
+  transition: 0.5s;
+}
+
+.registerbtn span:after {
+  content: '\00bb';
+  position: absolute;
+  opacity: 0;
+  top: 0;
+  right: -20px;
+  transition: 0.5s;
+}
+
+.registerbtn:hover span {
+  padding-right: 25px;
+}
+
+.registerbtn:hover span:after {
+  opacity: 1;
+  right: 0;
+}

app/static/main.js

@@ -0,0 +1,184 @@
+/* Copyright 2013 Chris Wilson
+
+   Licensed under the Apache License, Version 2.0 (the "License");
+   you may not use this file except in compliance with the License.
+   You may obtain a copy of the License at
+
+       http://www.apache.org/licenses/LICENSE-2.0
+
+   Unless required by applicable law or agreed to in writing, software
+   distributed under the License is distributed on an "AS IS" BASIS,
+   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+   See the License for the specific language governing permissions and
+   limitations under the License.
+*/
+
+window.AudioContext = window.AudioContext || window.webkitAudioContext;
+
+var audioContext = new AudioContext();
+var audioInput = null,
+    realAudioInput = null,
+    inputPoint = null,
+    audioRecorder = null;
+var rafID = null;
+var analyserContext = null;
+var canvasWidth, canvasHeight;
+var recIndex = 0;
+
+
+function gotBuffers(buffers) {
+    audioRecorder.exportMonoWAV(doneEncoding);
+}
+
+function doneEncoding(soundBlob) {
+    // fetch('/audio', {method: "POST", body: soundBlob}).then(response => $('#output').text(response.text()))
+    fetch('/audio', {method: "POST", body: soundBlob}).then(response => response.text().then(text => {
+        document.getElementById('output').innerHTML =  text;
+    }));
+    recIndex++;
+}
+
+function stopRecording() {
+    // stop recording
+    audioRecorder.stop();
+    document.getElementById('stop').disabled = true;
+    document.getElementById('start').removeAttribute('disabled');
+    audioRecorder.getBuffers(gotBuffers);
+}
+
+function startRecording() {
+
+    // start recording
+    if (!audioRecorder)
+        return;
+    document.getElementById('start').disabled = true;
+    document.getElementById('stop').removeAttribute('disabled');
+    audioRecorder.clear();
+    audioRecorder.record();
+}
+
+function convertToMono(input) {
+    var splitter = audioContext.createChannelSplitter(2);
+    var merger = audioContext.createChannelMerger(2);
+
+    input.connect(splitter);
+    splitter.connect(merger, 0, 0);
+    splitter.connect(merger, 0, 1);
+    return merger;
+}
+
+function cancelAnalyserUpdates() {
+    window.cancelAnimationFrame(rafID);
+    rafID = null;
+}
+
+function updateAnalysers(time) {
+    if (!analyserContext) {
+        var canvas = document.getElementById("analyser");
+        canvasWidth = canvas.width;
+        canvasHeight = canvas.height;
+        analyserContext = canvas.getContext('2d');
+    }
+
+    // analyzer draw code here
+    {
+        var SPACING = 3;
+        var BAR_WIDTH = 1;
+        var numBars = Math.round(canvasWidth / SPACING);
+        var freqByteData = new Uint8Array(analyserNode.frequencyBinCount);
+
+        analyserNode.getByteFrequencyData(freqByteData);
+
+        analyserContext.clearRect(0, 0, canvasWidth, canvasHeight);
+        analyserContext.fillStyle = '#F6D565';
+        analyserContext.lineCap = 'round';
+        var multiplier = analyserNode.frequencyBinCount / numBars;
+
+        // Draw rectangle for each frequency bin.
+        for (var i = 0; i < numBars; ++i) {
+            var magnitude = 0;
+            var offset = Math.floor(i * multiplier);
+            // gotta sum/average the block, or we miss narrow-bandwidth spikes
+            for (var j = 0; j < multiplier; j++)
+                magnitude += freqByteData[offset + j];
+            magnitude = magnitude / multiplier;
+            var magnitude2 = freqByteData[i * multiplier];
+            analyserContext.fillStyle = "hsl( " + Math.round((i * 360) / numBars) + ", 100%, 50%)";
+            analyserContext.fillRect(i * SPACING, canvasHeight, BAR_WIDTH, -magnitude);
+        }
+    }
+
+    rafID = window.requestAnimationFrame(updateAnalysers);
+}
+
+function toggleMono() {
+    if (audioInput != realAudioInput) {
+        audioInput.disconnect();
+        realAudioInput.disconnect();
+        audioInput = realAudioInput;
+    } else {
+        realAudioInput.disconnect();
+        audioInput = convertToMono(realAudioInput);
+    }
+
+    audioInput.connect(inputPoint);
+}
+
+function gotStream(stream) {
+    document.getElementById('start').removeAttribute('disabled');
+
+    inputPoint = audioContext.createGain();
+
+    // Create an AudioNode from the stream.
+    realAudioInput = audioContext.createMediaStreamSource(stream);
+    audioInput = realAudioInput;
+    audioInput.connect(inputPoint);
+
+//    audioInput = convertToMono( input );
+
+    analyserNode = audioContext.createAnalyser();
+    analyserNode.fftSize = 2048;
+    inputPoint.connect(analyserNode);
+
+    audioRecorder = new Recorder(inputPoint);
+
+    zeroGain = audioContext.createGain();
+    zeroGain.gain.value = 0.0;
+    inputPoint.connect(zeroGain);
+    zeroGain.connect(audioContext.destination);
+    updateAnalysers();
+}
+
+function initAudio() {
+    if (!navigator.getUserMedia)
+        navigator.getUserMedia = navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
+    if (!navigator.cancelAnimationFrame)
+        navigator.cancelAnimationFrame = navigator.webkitCancelAnimationFrame || navigator.mozCancelAnimationFrame;
+    if (!navigator.requestAnimationFrame)
+        navigator.requestAnimationFrame = navigator.webkitRequestAnimationFrame || navigator.mozRequestAnimationFrame;
+
+    navigator.getUserMedia(
+        {
+            "audio": {
+                "mandatory": {
+                    "googEchoCancellation": "false",
+                    "googAutoGainControl": "false",
+                    "googNoiseSuppression": "false",
+                    "googHighpassFilter": "false"
+                },
+                "optional": []
+            },
+        }, gotStream, function (e) {
+            alert('Error getting audio');
+            console.log(e);
+        });
+}
+
+window.addEventListener('load', initAudio);
+
+function unpause() {
+    document.getElementById('init').style.display = 'none';
+    audioContext.resume().then(() => {
+        console.log('Playback resumed successfully');
+    });
+}

app/static/recorder.js

@@ -0,0 +1,118 @@
+/*License (MIT)
+
+Copyright © 2013 Matt Diamond
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated 
+documentation files (the "Software"), to deal in the Software without restriction, including without limitation 
+the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and 
+to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of 
+the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO 
+THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF 
+CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER 
+DEALINGS IN THE SOFTWARE.
+*/
+
+(function(window){
+
+  var WORKER_PATH = '/static/recorderWorker.js';
+
+  var Recorder = function(source, cfg){
+    var config = cfg || {};
+    var bufferLen = config.bufferLen || 4096;
+    this.context = source.context;
+    if(!this.context.createScriptProcessor){
+       this.node = this.context.createJavaScriptNode(bufferLen, 2, 2);
+    } else {
+       this.node = this.context.createScriptProcessor(bufferLen, 2, 2);
+    }
+   
+    var worker = new Worker(config.workerPath || WORKER_PATH);
+    worker.postMessage({
+      command: 'init',
+      config: {
+        sampleRate: this.context.sampleRate
+      }
+    });
+    var recording = false,
+      currCallback;
+
+    this.node.onaudioprocess = function(e){
+      if (!recording) return;
+      worker.postMessage({
+        command: 'record',
+        buffer: [
+          e.inputBuffer.getChannelData(0),
+          e.inputBuffer.getChannelData(1)
+        ]
+      });
+    }
+
+    this.configure = function(cfg){
+      for (var prop in cfg){
+        if (cfg.hasOwnProperty(prop)){
+          config[prop] = cfg[prop];
+        }
+      }
+    }
+
+    this.record = function(){
+      recording = true;
+    }
+
+    this.stop = function(){
+      recording = false;
+    }
+
+    this.clear = function(){
+      worker.postMessage({ command: 'clear' });
+    }
+
+    this.getBuffers = function(cb) {
+      currCallback = cb || config.callback;
+      worker.postMessage({ command: 'getBuffers' })
+    }
+
+    this.exportWAV = function(cb, type){
+      currCallback = cb || config.callback;
+      type = type || config.type || 'audio/wav';
+      if (!currCallback) throw new Error('Callback not set');
+      worker.postMessage({
+        command: 'exportWAV',
+        type: type
+      });
+    }
+
+    this.exportMonoWAV = function(cb, type){
+      currCallback = cb || config.callback;
+      type = type || config.type || 'audio/wav';
+      if (!currCallback) throw new Error('Callback not set');
+      worker.postMessage({
+        command: 'exportMonoWAV',
+        type: type
+      });
+    }
+
+    worker.onmessage = function(e){
+      var blob = e.data;
+      currCallback(blob);
+    }
+
+    source.connect(this.node);
+    this.node.connect(this.context.destination);   // if the script node is not connected to an output the "onaudioprocess" event is not triggered in chrome.
+  };
+
+  Recorder.setupDownload = function(blob, filename){
+    var url = (window.URL || window.webkitURL).createObjectURL(blob);
+    var link = document.getElementById("save");
+    link.href = url;
+    link.download = filename || 'output.wav';
+  }
+
+  window.Recorder = Recorder;
+
+})(window);

app/static/recorderWorker.js

@@ -0,0 +1,161 @@
+/*License (MIT)
+
+Copyright © 2013 Matt Diamond
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated 
+documentation files (the "Software"), to deal in the Software without restriction, including without limitation 
+the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and 
+to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of 
+the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO 
+THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF 
+CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER 
+DEALINGS IN THE SOFTWARE.
+*/
+
+var recLength = 0,
+  recBuffersL = [],
+  recBuffersR = [],
+  sampleRate;
+
+this.onmessage = function(e){
+  switch(e.data.command){
+    case 'init':
+      init(e.data.config);
+      break;
+    case 'record':
+      record(e.data.buffer);
+      break;
+    case 'exportWAV':
+      exportWAV(e.data.type);
+      break;
+    case 'exportMonoWAV':
+      exportMonoWAV(e.data.type);
+      break;
+    case 'getBuffers':
+      getBuffers();
+      break;
+    case 'clear':
+      clear();
+      break;
+  }
+};
+
+function init(config){
+  sampleRate = config.sampleRate;
+}
+
+function record(inputBuffer){
+  recBuffersL.push(inputBuffer[0]);
+  recBuffersR.push(inputBuffer[1]);
+  recLength += inputBuffer[0].length;
+}
+
+function exportWAV(type){
+  var bufferL = mergeBuffers(recBuffersL, recLength);
+  var bufferR = mergeBuffers(recBuffersR, recLength);
+  var interleaved = interleave(bufferL, bufferR);
+  var dataview = encodeWAV(interleaved);
+  var audioBlob = new Blob([dataview], { type: type });
+
+  this.postMessage(audioBlob);
+}
+
+function exportMonoWAV(type){
+  var bufferL = mergeBuffers(recBuffersL, recLength);
+  var dataview = encodeWAV(bufferL, true);
+  var audioBlob = new Blob([dataview], { type: type });
+
+  this.postMessage(audioBlob);
+}
+
+function getBuffers() {
+  var buffers = [];
+  buffers.push( mergeBuffers(recBuffersL, recLength) );
+  buffers.push( mergeBuffers(recBuffersR, recLength) );
+  this.postMessage(buffers);
+}
+
+function clear(){
+  recLength = 0;
+  recBuffersL = [];
+  recBuffersR = [];
+}
+
+function mergeBuffers(recBuffers, recLength){
+  var result = new Float32Array(recLength);
+  var offset = 0;
+  for (var i = 0; i < recBuffers.length; i++){
+    result.set(recBuffers[i], offset);
+    offset += recBuffers[i].length;
+  }
+  return result;
+}
+
+function interleave(inputL, inputR){
+  var length = inputL.length + inputR.length;
+  var result = new Float32Array(length);
+
+  var index = 0,
+    inputIndex = 0;
+
+  while (index < length){
+    result[index++] = inputL[inputIndex];
+    result[index++] = inputR[inputIndex];
+    inputIndex++;
+  }
+  return result;
+}
+
+function floatTo16BitPCM(output, offset, input){
+  for (var i = 0; i < input.length; i++, offset+=2){
+    var s = Math.max(-1, Math.min(1, input[i]));
+    output.setInt16(offset, s < 0 ? s * 0x8000 : s * 0x7FFF, true);
+  }
+}
+
+function writeString(view, offset, string){
+  for (var i = 0; i < string.length; i++){
+    view.setUint8(offset + i, string.charCodeAt(i));
+  }
+}
+
+function encodeWAV(samples, mono){
+  var buffer = new ArrayBuffer(44 + samples.length * 2);
+  var view = new DataView(buffer);
+
+  /* RIFF identifier */
+  writeString(view, 0, 'RIFF');
+  /* file length */
+  view.setUint32(4, 32 + samples.length * 2, true);
+  /* RIFF type */
+  writeString(view, 8, 'WAVE');
+  /* format chunk identifier */
+  writeString(view, 12, 'fmt ');
+  /* format chunk length */
+  view.setUint32(16, 16, true);
+  /* sample format (raw) */
+  view.setUint16(20, 1, true);
+  /* channel count */
+  view.setUint16(22, mono?1:2, true);
+  /* sample rate */
+  view.setUint32(24, sampleRate, true);
+  /* byte rate (sample rate * block align) */
+  view.setUint32(28, sampleRate * 4, true);
+  /* block align (channel count * bytes per sample) */
+  view.setUint16(32, 4, true);
+  /* bits per sample */
+  view.setUint16(34, 16, true);
+  /* data chunk identifier */
+  writeString(view, 36, 'data');
+  /* data chunk length */
+  view.setUint32(40, samples.length * 2, true);
+
+  floatTo16BitPCM(view, 44, samples);
+
+  return view;
+}

app/templates/audio_to_text.html

@@ -0,0 +1,46 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta name="viewport" content="width=device-width, initial-scale=1">
+
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+
+<link rel="stylesheet" type="text/css" href="/static/header_file.css">
+<link rel="stylesheet" type="text/css" href="/static/footer_file.css">
+<link rel="stylesheet" type="text/css" href="/static/main.css">
+<link rel="stylesheet" type="text/css" href="/static/audio_to_text.css">
+<script src="/static/recorder.js"></script>
+<script src="/static/audiodisplay.js"></script>
+<script src="/static/main.js"></script>
+<script src="/static/recorderWorker.js"></script>
+
+</head>
+    <body style="background-color:rgb(127, 195, 255);">
+    {% include "header.html" %}
+    
+    <div id="loader">
+        <p class="glow">SPEECH to TEXT</p>
+    </div>
+
+    <div id="loader">
+        <div class="row " style="position:relative;">
+            <div class="column1">
+                <h2>Record Audio</h2>
+                    <p>
+                        <button id="start" class="btn btn-success" onclick="startRecording()" disabled>Start</button>
+                        <button id="stop" class="btn btn-danger" onclick="stopRecording()" disabled>Stop</button>
+                    </p>
+            </div>
+            <div class="column2" >
+                <h2>Audio Prediction</h2>
+                <p class="glow" id="output" style="font-size: 20px;"></p>
+                
+                
+            </div>
+        </div>
+    </div>
+    {% extends "footer.html" %}
+    {% block footer%}fixed{% endblock %}
+    </body>
+    
+</html>

app/templates/footer.html

@@ -0,0 +1,11 @@
+
+<div class="footnov" id="myFootnav" style="position: {% block footer%}{% endblock %}; bottom: 0; width: 100%;">
+    <a href="" >Follow me : </a>
+
+    <a href="https://www.facebook.com/vatsal.parasaniya" style="background: #3B5998; color: white;" class="fa fa-facebook"></a>
+    <a href="https://github.com/Vatsalparsaniya" style="background: black; color: white;" class="fa fa-github"></a>
+    <a href="https://twitter.com/VatsalParsaniya" style="background: #55ACEE; color: white;" class="fa fa-twitter"></a>
+    <a href="https://www.linkedin.com/in/vatsal-parsaniya/" style="background: #007bb5; color: white;" class="fa fa-linkedin"></a>
+  </div>
+  
+  

app/templates/header.html

@@ -0,0 +1,22 @@
+
+<div class="topnav" id="myTopnav">
+  <a href="/" class="active">Home</a>
+  <a href="/audio_to_text/">Speech to Text</a>
+  <a href="javascript:void(0);" class="icon" onclick="myFunction()">
+    <i class="fa fa-bars"></i>
+  </a>
+</div>
+
+
+
+{% with messages = get_flashed_messages(with_categories=true) %}
+{% if messages %}
+  {% for category,message in messages %}
+
+    <div class="alert">
+        <span class="closebtn" onclick="this.parentElement.style.display='none';">&times;</span> 
+        <strong>{{category}} :</strong> {{ message }}
+    </div>
+  {% endfor %}
+{% endif %}
+{% endwith %}

app/templates/index.html

@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+<link rel="stylesheet" type="text/css" href="/static/header_file.css">
+<link rel="stylesheet" type="text/css" href="/static/footer_file.css">
+<link rel="stylesheet" type="text/css" href="/static/main.css">
+<link href="https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css" rel="stylesheet">
+</head>
+    <body style="background-color:rgb(127, 195, 255);">
+    {% include "header.html" %}
+        <section class="text-gray-700 body-font">
+            
+        <div class="container mx-auto flex px-5 py-24 md:flex-row flex-col items-center">
+            <div class="lg:max-w-lg lg:w-full md:w-1/2 w-5/6" style="padding-right: 10px;">
+                <img class="object-cover object-center rounded" alt="hero" src="static/text_to_speech.png">
+                </div>
+            <div class="lg:flex-grow md:w-1/2 lg:pr-24 md:pr-16 flex flex-col md:items-start md:text-left mb-16 md:mb-0 items-center text-center">
+            <h1 class="title-font sm:text-4xl text-3xl mb-4 font-medium text-gray-900">Speech To Text Conversion</h1>
+            <p class="title-font sm:text-2xl text-1xl mb-4 font-medium text-gray-900">(Flask + Heroku + SpeechRecognition + Recorderjs)</p>
+            
+            <p class="mb-8 leading-relaxed"><b>Flask</b> is a micro web framework written in Python.</p>
+            <p class="mb-8 leading-relaxed"><b>SpeechRecognition</b> Library for performing speech recognition, with support for several engines and APIs, online and offline.</p>
+            <p class="mb-8 leading-relaxed"><b>Heroku</b> is a platform as a service (PaaS) that enables developers to build, run, and operate applications entirely in the cloud.</p>
+            <p class="mb-8 leading-relaxed"><b>Recorderjs</b> A plugin for recording/exporting the output of Web Audio API nodes </p>
+            <div class="flex justify-center">
+                <form action="/audio_to_text/"><button class="inline-flex text-white bg-indigo-500 border-0 py-2 px-6 focus:outline-none hover:bg-indigo-600 rounded text-lg">Testing Here</button></form>
+            </div>
+            </div>
+            
+        </div>
+        </section>
+
+    </body>
+    {% extends "footer.html" %}
+    {% block footer%}fixed{% endblock %}
+</html>

app/wsgi.py

@@ -0,0 +1,4 @@
+from app import app
+ 
+if __name__ == '__main__':
+   app.run()

requirements.txt

@@ -0,0 +1,7 @@
+transformers
+accelerate
+torch
+whisper
+Flask
+Flask-Cors
+faster-whisper