Merge pull request #40 from software-students-fall2023/ci

ci
software-students-fall2023 · Dec 4, 2023 · 225ca8e · 225ca8e
2 parents 2719c6c + 2baf3a7
commit 225ca8e
Show file tree

Hide file tree

Showing 11 changed files with 110 additions and 20 deletions.
diff --git a/.github/workflows/ci-cd.yml b/.github/workflows/ci-cd.yml
@@ -0,0 +1,66 @@
+name: CI/CD Pipeline
+
+on:
+  push:
+    branches: [ main ]
+  pull_request:
+    branches: [ main ]
+
+jobs:
+  build-and-push:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout Repo
+        uses: actions/checkout@v2
+
+      - name: Login to DockerHub
+        uses: docker/login-action@v1
+        with:
+          username: ${{ secrets.DOCKERHUB_USERNAME }}
+          password: ${{ secrets.DOCKERHUB_PASSWORD }}
+
+      - name: Build and Push Images using Docker Compose
+        env:
+          DOCKERHUB_USERNAME: ${{ secrets.DOCKERHUB_USERNAME }}
+          MONGO_DBNAME: ${{ secrets.MONGO_DBNAME }}
+          MONGO_URI: ${{ secrets.MONGO_URI }}
+          FLASK_APP: ${{ secrets.FLASK_APP }}
+          APP_SECRET_KEY: ${{ secrets.APP_SECRET_KEY }}
+          AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }}
+          AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
+          S3_BUCKET_NAME: ${{ secrets.S3_BUCKET_NAME }}
+          HOST: ${{ secrets.HOST }}
+        run: |
+          docker-compose build
+          docker-compose push
+        working-directory: ./
+
+  deploy:
+    needs: build-and-push
+    runs-on: ubuntu-latest
+    strategy:
+      fail-fast: false
+      matrix:
+        python-version: ["3.11"]
+    steps:
+      - uses: actions/checkout@v3
+
+      - name: Set up Python ${{ matrix.python-version }}
+        uses: actions/setup-python@v3
+        with:
+          python-version: ${{ matrix.python-version }}
+
+      - name: Deploy to DigitalOcean
+        uses: appleboy/ssh-action@master
+        with:
+          host: ${{ secrets.DROPLET_IP }}
+          username: ${{ secrets.DROPLET_USER }}
+          key: ${{ secrets.SSH_PRIVATE_KEY }}
+          script: |
+              cd 4-containerized-app-exercise-wacotacotruck/
+              docker container prune -f
+              docker image prune -f
+              docker volume prune -f
+              docker-compose pull
+              docker-compose down
+              docker-compose up -d
diff --git a/README.md b/README.md
@@ -1,11 +1,25 @@
 ![Workflow Status](https://github.com/software-students-fall2023/4-containerized-app-exercise-wacotacotruck/actions/workflows/lint.yml/badge.svg?branch=main&kill_cache=1)
 ![Workflow Status](https://github.com/software-students-fall2023/4-containerized-app-exercise-wacotacotruck/actions/workflows/frontend.yml/badge.svg?branch=main&kill_cache=1)
 ![Workflow Status](https://github.com/software-students-fall2023/4-containerized-app-exercise-wacotacotruck/actions/workflows/backend.yml/badge.svg?branch=main&kill_cache=1)
+![Workflow Status](https://github.com/software-students-fall2023/4-containerized-app-exercise-wacotacotruck/actions/workflows/ci-cd.yml/badge.svg?branch=main&kill_cache=1)
 
 # Sing & Sync
 
 Build a containerized app that uses machine learning. See [instructions](./instructions.md) for details.
 
+## [Live Demo](http://159.65.44.240:5001/)
+If using Google Chrome, follow these steps to address microphone access issues in the live demo:
+
+1. **Open Chrome Flags**:
+   - Type `chrome://flags/#unsafely-treat-insecure-origin-as-secure` in the address bar and press Enter.
+
+2. **Enable Insecure Origins**:
+   - Add `http://159.65.44.240:5001/` in the "Insecure origins treated as secure" section.
+   - Change dropdown to 'Enabled'.
+
+3. **Relaunch Chrome**:
+   - Click 'Relaunch' to apply changes.
+
 ## Team Members: 
 - [Aditya Pandhare](https://github.com/awesomeadi00)
 - [Anzhelika Nastashchuk](https://github.com/annsts)
@@ -27,17 +41,17 @@ Before you start the steps below, make sure you have the following downloaded on
 
 **Download AWS Command Line Interface:**
 
-1. Go to [AWS website](https://aws.amazon.com/cli/) and download AWS Command Line Interface based on your operating system.
-2. Go to terminal and type the following line: `aws configure`
-3. Follow the prompt and provide values:
-```
-AWS Access Key ID: <Value for variable AWS_ACCESS_KEY_ID in provided .env file>
-AWS Secret Access Key: <Value for variable AWS_SECRET_ACCESS_KEY in provided .env file>
-Default region name: us-east-1
-Default output format: json
-```
-
-### Running the Application Locally:
+ 1. Go to [AWS website](https://aws.amazon.com/cli/) and download AWS Command Line Interface based on your operating system.
+ 2. Go to terminal and type the following line: `aws configure`
+ 3. Follow the prompt and provide values:
+ ```
+ AWS Access Key ID: <Value for variable AWS_ACCESS_KEY_ID in provided .env file>
+ AWS Secret Access Key: <Value for variable AWS_SECRET_ACCESS_KEY in provided .env file>
+ Default region name: us-east-1
+ Default output format: json
+ ```
+
+### Running the Application:
 
 1. Clone the repository:
 ```

diff --git a/docker-compose.yml b/docker-compose.yml
@@ -4,16 +4,18 @@ services:
     build:
       context: ./web_app
       dockerfile: dockerfile.web
+    image: angstisdocker/web-app:latest
+    container_name: web-app-container
     ports:
       - "5001:5000"
   ml-client:
     build:
       context: ./machine_learning_client
       dockerfile: dockerfile.ml
+    image: angstisdocker/ml-client:latest
+    container_name: ml-client-container
     ports:
       - "5002:5002"
-    volumes:
-      - ./machine_learning_client:/machine_learning_client
   db:
     image: mongo:4.0-xenial
     ports:

diff --git a/machine_learning_client/dockerfile.ml b/machine_learning_client/dockerfile.ml
@@ -5,4 +5,5 @@ COPY requirements.txt .
 RUN pip install --no-cache-dir -r requirements.txt
 RUN pip install git+https://github.com/librosa/librosa
 COPY . .
+EXPOSE 5002
 CMD ["python", "ml.py"]
diff --git a/machine_learning_client/ml.py b/machine_learning_client/ml.py
@@ -32,6 +32,8 @@
 aws_secret_access_key = os.getenv("AWS_SECRET_ACCESS_KEY")
 s3_bucket_name = os.getenv("S3_BUCKET_NAME")
 
+host = os.getenv("HOST", "localhost")
+
 s3 = boto3.client(
     "s3",
     aws_access_key_id=aws_access_key_id,
@@ -121,7 +123,7 @@ def generate_midi_url(filtrd_comb_notes, onsets, drtns, tempo):
         filtrd_comb_notes, onsets, drtns, tempo, output_file="output.mid"
     )
     # drtns = durations; had to edit because of pylint 0_0
-    midi_url = f"http://localhost:5002/static/{midi_filename}"
+    midi_url = f"http://{host}:5002/static/{midi_filename}"
 
     return midi_url
 

diff --git a/web_app/app.py b/web_app/app.py
@@ -26,6 +26,8 @@
 aws_secret_access_key = os.getenv("AWS_SECRET_ACCESS_KEY")
 s3_bucket_name = os.getenv("S3_BUCKET_NAME")
 
+host = os.getenv("HOST", "localhost")
+
 s3 = boto3.client(
     "s3",
     aws_access_key_id=aws_access_key_id,
@@ -381,4 +383,4 @@ def logout():
 
 # Executing the Flask Application:
 if __name__ == "__main__":
-    app.run(debug=True)
+    app.run(debug=False, host="0.0.0.0", port=5001, ssl_context="adhoc")
diff --git a/web_app/dockerfile.web b/web_app/dockerfile.web
@@ -5,4 +5,5 @@ RUN pip install --no-cache-dir -r requirements.txt
 COPY . .
 ENV FLASK_APP=app.py
 ENV FLASK_RUN_HOST=0.0.0.0
+EXPOSE 5001
 CMD ["flask", "run"]
diff --git a/web_app/static/script.js b/web_app/static/script.js
@@ -2,6 +2,8 @@ let mediaRecorder;
 let audioChunks = [];
 let isRecording = false;
 
+const host = "159.65.44.240";
+
 function startRecording() {
   navigator.mediaDevices
     .getUserMedia({ audio: true })
@@ -38,7 +40,7 @@ function sendAudioToServer(audioBlob, userID) {
   formData.append("user_id", userID);
   showLoader();
 
-  fetch("http://localhost:5002/process", {
+  fetch(`http://${host}:5002/process`, {
     method: "POST",
     body: formData,
   })
@@ -172,7 +174,7 @@ function uploadMidi() {
 
   const filename = midiSrc.split("/").pop();
 
-  fetch("http://localhost:5001/upload-midi", {
+  fetch(`http://${host}:5001/upload-midi`, {
     method: "POST",
     headers: {
       "Content-Type": "application/json",

diff --git a/web_app/templates/browse.html b/web_app/templates/browse.html
@@ -47,7 +47,7 @@ <h2>Posted by: {{ post.username }}</h2>
     </div>
     </div>
     <script src="../static/script.js"></script>
-    <script src="https://cdn.jsdelivr.net/npm/[email protected]/build/index.browser.min.js"></script>
+    <script type="module" src="https://cdn.jsdelivr.net/npm/[email protected]/build/index.browser.min.js"></script>
 </body>
 </html>
 
diff --git a/web_app/templates/index.html b/web_app/templates/index.html
@@ -77,6 +77,6 @@ <h3>Instructions</h3>
             var currentUserID = "{{ user_id }}";
         </script>
         <script src="../static/script.js"></script>
-        <script src="https://cdn.jsdelivr.net/npm/[email protected]/build/index.browser.min.js"></script>
+        <script type="module" src="https://cdn.jsdelivr.net/npm/[email protected]/build/index.browser.min.js"></script>
     </body>
 </html>
diff --git a/web_app/templates/mymidi.html b/web_app/templates/mymidi.html
@@ -51,7 +51,7 @@ <h1> You have to MIDI files, get to creating!</h1>
     </div>
     </div>
     <script src="../static/script.js"></script>
-    <script src="https://cdn.jsdelivr.net/npm/[email protected]/build/index.browser.min.js"></script>
+    <script type="module" src="https://cdn.jsdelivr.net/npm/[email protected]/build/index.browser.min.js"></script>
 </body>
 </html>