Skip to content

Commit 3064324

Browse files
22MH1A42G122MH1A42G1
authored
Add files via upload
1 parent 1d9150d commit 3064324

4 files changed

Lines changed: 162 additions & 34 deletions

File tree

‎index.html‎

Lines changed: 38 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -2,36 +2,50 @@
22
<html>
33
<head>
44
<title>Sentiment Analysis</title>
5+
<link rel="stylesheet" href="style.css">
56
</head>
67
<body>
7-
<h1>Sentiment Analysis</h1>
8-
<textarea id="inputText"></textarea><br><br>
9-
<button onclick="analyzeSentiment()">Analyze Sentiment</button>
8+
<h1 class="fade-in">Sentiment Analysis</h1>
9+
<textarea id="inputText" class="slide-in"></textarea><br><br>
10+
<button onclick="analyzeSentiment()" class="pulse-button">Analyze Sentiment</button>
1011

11-
<h3>Sentiment: <span id="sentiment"></span></h3>
12-
<h3>Scores: <span id="scores"></span></h3>
12+
<h3 class="fade-in">Sentiment: <span id="sentiment"></span></h3>
13+
<h3 class="fade-in">Scores: <span id="scores"></span></h3>
1314

1415
<script>
1516
async function analyzeSentiment() {
16-
const text = document.getElementById('inputText').value;
17-
try {
18-
const response = await fetch('https://pnj6w5sail.execute-api.us-east-1.amazonaws.com/prod/analyze', {
19-
method: 'POST',
20-
headers: { 'Content-Type': 'application/json' },
21-
body: JSON.stringify({ text: text })
22-
});
23-
24-
const data = await response.json();
25-
console.log('Lambda response:', data); // confirm structure here
26-
27-
// No JSON.parse needed - data is already an object
28-
document.getElementById('sentiment').innerText = data.sentiment;
29-
document.getElementById('scores').innerText = JSON.stringify(data.score);
30-
31-
} catch (error) {
32-
console.error('Error:', error);
33-
}
34-
}
17+
const text = document.getElementById('inputText').value;
18+
try {
19+
const response = await fetch('https://ucm1z2y012.execute-api.us-east-1.amazonaws.com/test/analyze', {
20+
method: 'POST',
21+
headers: { 'Content-Type': 'application/json' },
22+
body: JSON.stringify({ text: text })
23+
});
24+
25+
const data = await response.json();
26+
console.log('Lambda response:', data);
27+
28+
const sentimentEl = document.getElementById('sentiment');
29+
const scoresEl = document.getElementById('scores');
30+
31+
sentimentEl.innerText = data.sentiment || 'N/A';
32+
scoresEl.innerText = JSON.stringify(data.score || {});
33+
34+
// Add animation class to highlight update
35+
sentimentEl.classList.remove('highlight');
36+
scoresEl.classList.remove('highlight');
37+
38+
void sentimentEl.offsetWidth; // trigger reflow
39+
void scoresEl.offsetWidth;
40+
41+
sentimentEl.classList.add('highlight');
42+
scoresEl.classList.add('highlight');
43+
} catch (error) {
44+
console.error('Error:', error);
45+
document.getElementById('sentiment').innerText = 'Error';
46+
document.getElementById('scores').innerText = '';
47+
}
48+
}
3549
</script>
3650
</body>
3751
</html>

‎latest_result.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
{"input": "I Love AWS tools", "sentiment": "POSITIVE", "score": {"Positive": 0.997831404209137, "Negative": 0.00016904459334909916, "Neutral": 0.0015955643029883504, "Mixed": 0.00040401858859695494}}

‎sentiment-analysis-results-policy.json‎

Lines changed: 0 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +0,0 @@
1-
{
2-
"Version": "2012-10-17",
3-
"Statement": [
4-
{
5-
"Effect": "Allow",
6-
"Action": "comprehend:DetectSentiment",
7-
"Resource": "*"
8-
}
9-
]
10-
}

‎style.css‎

Lines changed: 123 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,123 @@
1+
/* Basic reset */
2+
* {
3+
margin: 0;
4+
padding: 0;
5+
box-sizing: border-box;
6+
}
7+
8+
/* Body styling */
9+
body {
10+
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
11+
background: linear-gradient(135deg, #f7f9fc, #e3f2fd);
12+
color: #333;
13+
padding: 40px;
14+
line-height: 1.6;
15+
animation: fadeInBody 1.5s ease forwards;
16+
}
17+
18+
/* Title */
19+
h1 {
20+
font-size: 2.5em;
21+
margin-bottom: 20px;
22+
color: #2c3e50;
23+
text-align: center;
24+
}
25+
26+
/* Textarea */
27+
textarea {
28+
width: 100%;
29+
height: 120px;
30+
padding: 12px;
31+
font-size: 16px;
32+
border: 1px solid #ccc;
33+
border-radius: 6px;
34+
resize: vertical;
35+
box-shadow: 0 4px 10px rgba(0,0,0,0.1);
36+
transition: box-shadow 0.3s;
37+
}
38+
39+
textarea:focus {
40+
box-shadow: 0 6px 15px rgba(0,0,0,0.2);
41+
outline: none;
42+
}
43+
44+
/* Button */
45+
button {
46+
margin-top: 15px;
47+
padding: 12px 24px;
48+
font-size: 16px;
49+
background: linear-gradient(135deg, #2c89e8, #1a73e8);
50+
color: #fff;
51+
border: none;
52+
border-radius: 30px;
53+
cursor: pointer;
54+
transition: transform 0.3s, box-shadow 0.3s;
55+
}
56+
57+
button:hover {
58+
transform: scale(1.05);
59+
box-shadow: 0 8px 20px rgba(44, 137, 232, 0.4);
60+
}
61+
62+
button:active {
63+
transform: scale(0.98);
64+
}
65+
66+
/* Output styling */
67+
h3 {
68+
margin-top: 25px;
69+
font-size: 18px;
70+
color: #2d3436;
71+
}
72+
73+
#sentiment,
74+
#scores {
75+
font-weight: bold;
76+
color: #0984e3;
77+
display: inline-block;
78+
transition: all 0.4s ease;
79+
}
80+
81+
#sentiment.highlight,
82+
#scores.highlight {
83+
animation: highlightAnim 0.8s ease;
84+
}
85+
86+
/* Animations */
87+
@keyframes fadeInBody {
88+
from { opacity: 0; }
89+
to { opacity: 1; }
90+
}
91+
92+
.fade-in {
93+
animation: fadeIn 1s ease forwards;
94+
}
95+
96+
@keyframes fadeIn {
97+
from { opacity: 0; transform: translateY(-20px); }
98+
to { opacity: 1; transform: translateY(0); }
99+
}
100+
101+
.slide-in {
102+
animation: slideIn 1.2s ease forwards;
103+
}
104+
105+
@keyframes slideIn {
106+
from { opacity: 0; transform: translateX(-50px); }
107+
to { opacity: 1; transform: translateX(0); }
108+
}
109+
110+
.pulse-button {
111+
animation: pulse 2s infinite;
112+
}
113+
114+
@keyframes pulse {
115+
0% { box-shadow: 0 0 0 0 rgba(44, 137, 232, 0.5); }
116+
70% { box-shadow: 0 0 0 10px rgba(44, 137, 232, 0); }
117+
100% { box-shadow: 0 0 0 0 rgba(44, 137, 232, 0); }
118+
}
119+
120+
@keyframes highlightAnim {
121+
0% { background-color: #dff9fb; }
122+
100% { background-color: transparent; }
123+
}

0 commit comments

Comments
 (0)