Jashu/Multi-Model-Sentiment-analysis-using-BERTModel

1<!DOCTYPE html>
2<html lang="en">
3<head>
4    <meta charset="UTF-8">
5    <meta name="viewport" content="width=device-width, initial-scale=1.0">
6    <title>Sentiment Analysis</title>
7    <style>
8        body {
9            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
10            background-color: #f4f4f4;
11            color: #333;
12            text-align: center;
13            margin: 50px;
14        }
15
16        h1 {
17            color: #008080;
18            margin-bottom: 20px;
19        }
20
21        h2 {
22            color: #008080;
23            margin-bottom: 10px;
24        }
25
26        .input-container {
27            background-color: #fff;
28            padding: 20px;
29            border-radius: 10px;
30            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
31            display: inline-block;
32            max-width: 400px;
33            margin: 0 auto;
34            margin-bottom: 20px;
35        }
36
37        label {
38            font-weight: bold;
39            margin-top: 10px;
40            display: block;
41            color: #333;
42        }
43
44        input, select, button {
45            width: 100%;
46            padding: 10px;
47            margin-top: 5px;
48            margin-bottom: 10px;
49            box-sizing: border-box;
50            border: 1px solid #ccc;
51            border-radius: 5px;
52        }
53
54        button {
55            background-color: #008080;
56            color: #fff;
57            cursor: pointer;
58        }
59
60        button:disabled {
61            opacity: 0.5;
62            cursor: not-allowed;
63        }
64
65        #downloadLink {
66            display: block;
67            margin-top: 10px;
68            color: #008080;
69            text-decoration: none;
70        }
71
72        #downloadLink:hover {
73            text-decoration: underline;
74        }
75
76        #result {
77            font-weight: bold;
78            margin-top: 20px;
79            padding: 15px;
80            border-radius: 10px;
81            background-color: #008080;
82            color: #fff;
83        }
84    </style>
85</head>
86<body>
87    <h1>Sentiment Analysis</h1>
88
89    <!-- Text Input Container -->
90    <div class="input-container" id="text_input_container">
91        <h2>Text Input</h2>
92        <form action="/analyze_input1" method="post">
93            <label for="input_text">Enter text:</label>
94            <input type="text" name="input_text" id="input_text" placeholder="Enter text" required>
95            <button type="submit">Analyze Text</button>
96        </form>
97    </div>
98
99    <!-- Audio Input Container -->
100    <div class="input-container" id="audio_input_container">
101        <h2>Audio Input</h2>
102        <form action="/analyze_input2" method="post" enctype="multipart/form-data">
103            <label for="audio_file">Upload audio file:</label>
104            <input type="file" name="audio_file" accept="audio/*" id="audio_file">
105            <button type="submit">Analyze Audio</button>
106        </form>
107    </div>
108
109   <!-- Recording Controls Container -->
110<div class="input-container" id="recording_controls_container">
111    <h2>Live Audio Recording</h2>
112    <form id="startForm" action="/start" onsubmit="startRecording()">
113        <button type="submit" id="startRecord">Start Recording</button>
114    </form>
115    <form id="stopForm" action="/stop" onsubmit="stopRecording()">
116        <button type="submit" id="stopRecord">Stop Recording</button>
117    </form>
118    <form action="/analyse_live">
119        <button type="submit">Analyse</button>
120    </form>
121</div>
122
123    <div id="result"></div>
124
125
126    <script>
127    function startRecording() {
128        alert("Please Start Talking. Our System is Recording.");
129    }
130
131    function stopRecording() {
132        alert("We have Stopped and saved your recording in the 'uploads' folder.");
133    }
134</script>
135
136</body>
137</html>
138