depd-v2 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/calculator/index.html +270 -0
- package/chat/index.html +31 -0
- package/chat/server.js +24 -0
- package/chat-react/.oxlintrc.json +8 -0
- package/chat-react/README.md +16 -0
- package/chat-react/index.html +13 -0
- package/chat-react/package-lock.json +1386 -0
- package/chat-react/package.json +23 -0
- package/chat-react/public/favicon.svg +1 -0
- package/chat-react/public/icons.svg +24 -0
- package/chat-react/src/App.css +184 -0
- package/chat-react/src/App.jsx +59 -0
- package/chat-react/src/assets/hero.png +0 -0
- package/chat-react/src/assets/react.svg +1 -0
- package/chat-react/src/assets/vite.svg +1 -0
- package/chat-react/src/index.css +111 -0
- package/chat-react/src/main.jsx +10 -0
- package/chat-react/src/server.js +23 -0
- package/chat-react/vite.config.js +7 -0
- package/food-delivery/.oxlintrc.json +8 -0
- package/food-delivery/README.md +16 -0
- package/food-delivery/index.html +13 -0
- package/food-delivery/package-lock.json +2233 -0
- package/food-delivery/package.json +24 -0
- package/food-delivery/public/favicon.svg +1 -0
- package/food-delivery/public/icons.svg +24 -0
- package/food-delivery/src/App.css +184 -0
- package/food-delivery/src/App.jsx +157 -0
- package/food-delivery/src/assets/hero.png +0 -0
- package/food-delivery/src/assets/react.svg +1 -0
- package/food-delivery/src/assets/vite.svg +1 -0
- package/food-delivery/src/index.css +111 -0
- package/food-delivery/src/main.jsx +10 -0
- package/food-delivery/src/server.js +74 -0
- package/food-delivery/vite.config.js +7 -0
- package/health-tracker/.oxlintrc.json +8 -0
- package/health-tracker/README.md +16 -0
- package/health-tracker/index.html +13 -0
- package/health-tracker/package-lock.json +1386 -0
- package/health-tracker/package.json +23 -0
- package/health-tracker/public/favicon.svg +1 -0
- package/health-tracker/public/icons.svg +24 -0
- package/health-tracker/src/App.css +184 -0
- package/health-tracker/src/App.jsx +117 -0
- package/health-tracker/src/assets/hero.png +0 -0
- package/health-tracker/src/assets/react.svg +1 -0
- package/health-tracker/src/assets/vite.svg +1 -0
- package/health-tracker/src/index.css +111 -0
- package/health-tracker/src/main.jsx +10 -0
- package/health-tracker/vite.config.js +7 -0
- package/lab1/index.html +237 -0
- package/lab1b/index.html +52 -0
- package/lab1b/style.css +72 -0
- package/lab2/index.html +46 -0
- package/package.json +16 -0
|
@@ -0,0 +1,270 @@
|
|
|
1
|
+
<!doctype html>
|
|
2
|
+
<html>
|
|
3
|
+
<head>
|
|
4
|
+
<title>Pro Smart Calculator</title>
|
|
5
|
+
<style>
|
|
6
|
+
body {
|
|
7
|
+
font-family: Arial;
|
|
8
|
+
display: flex;
|
|
9
|
+
justify-content: center;
|
|
10
|
+
align-items: center;
|
|
11
|
+
height: 100vh;
|
|
12
|
+
background: #f2f2f2;
|
|
13
|
+
margin: 0;
|
|
14
|
+
transition: 0.3s;
|
|
15
|
+
}
|
|
16
|
+
body.dark {
|
|
17
|
+
background: #1e1e1e;
|
|
18
|
+
color: white;
|
|
19
|
+
}
|
|
20
|
+
.calculator {
|
|
21
|
+
width: 320px;
|
|
22
|
+
background: white;
|
|
23
|
+
border-radius: 15px;
|
|
24
|
+
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
|
|
25
|
+
padding: 20px;
|
|
26
|
+
transition: 0.3s;
|
|
27
|
+
}
|
|
28
|
+
body.dark .calculator {
|
|
29
|
+
background: #2c2c2c;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
.header {
|
|
33
|
+
text-align: center;
|
|
34
|
+
padding: 10px;
|
|
35
|
+
margin-bottom: 10px;
|
|
36
|
+
border-radius: 10px;
|
|
37
|
+
background: linear-gradient(135deg, #03a9f4, #0288d1);
|
|
38
|
+
color: white;
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
#clock {
|
|
42
|
+
font-size: 14px;
|
|
43
|
+
margin-top: 5px;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
.toggle {
|
|
47
|
+
margin-top: 5px;
|
|
48
|
+
cursor: pointer;
|
|
49
|
+
font-size: 13px;
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
.display {
|
|
53
|
+
width: 100%;
|
|
54
|
+
height: 50px;
|
|
55
|
+
font-size: 1.5rem;
|
|
56
|
+
text-align: right;
|
|
57
|
+
padding: 10px;
|
|
58
|
+
margin-bottom: 10px;
|
|
59
|
+
border: none;
|
|
60
|
+
background: #ffeb3b;
|
|
61
|
+
border-radius: 8px;
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
.buttons {
|
|
65
|
+
display: grid;
|
|
66
|
+
grid-template-columns: repeat(4, 1fr);
|
|
67
|
+
gap: 10px;
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
.button {
|
|
71
|
+
padding: 18px;
|
|
72
|
+
font-size: 1.3rem;
|
|
73
|
+
border: none;
|
|
74
|
+
border-radius: 10px;
|
|
75
|
+
background: #03a9f4;
|
|
76
|
+
color: white;
|
|
77
|
+
cursor: pointer;
|
|
78
|
+
transition: 0.2s;
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
.button:hover {
|
|
82
|
+
transform: scale(1.05);
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
.operator {
|
|
86
|
+
background: #ff9800;
|
|
87
|
+
}
|
|
88
|
+
.equal {
|
|
89
|
+
background: #4caf50;
|
|
90
|
+
}
|
|
91
|
+
.clear {
|
|
92
|
+
background: #ff5722;
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
.history {
|
|
96
|
+
margin-top: 15px;
|
|
97
|
+
max-height: 120px;
|
|
98
|
+
overflow: auto;
|
|
99
|
+
font-size: 14px;
|
|
100
|
+
border-top: 1px solid #ddd;
|
|
101
|
+
padding-top: 10px;
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
body.dark .history {
|
|
105
|
+
border-color: #555;
|
|
106
|
+
}
|
|
107
|
+
</style>
|
|
108
|
+
</head>
|
|
109
|
+
<body>
|
|
110
|
+
<div class="calculator">
|
|
111
|
+
<div class="header">
|
|
112
|
+
<b>Pro Calculator</b>
|
|
113
|
+
<div id="clock"></div>
|
|
114
|
+
<div class="toggle" onclick="toggleDarkMode()">
|
|
115
|
+
🌙 Toggle Dark Mode
|
|
116
|
+
</div>
|
|
117
|
+
</div>
|
|
118
|
+
|
|
119
|
+
<input id="display" class="display" disabled />
|
|
120
|
+
|
|
121
|
+
<div class="buttons">
|
|
122
|
+
<button class="button clear" onclick="clearDisplay()">C</button>
|
|
123
|
+
<button class="button operator" onclick="appendOperation('/')">
|
|
124
|
+
/
|
|
125
|
+
</button>
|
|
126
|
+
<button class="button operator" onclick="appendOperation('*')">
|
|
127
|
+
*
|
|
128
|
+
</button>
|
|
129
|
+
<button class="button operator" onclick="appendOperation('-')">
|
|
130
|
+
-
|
|
131
|
+
</button>
|
|
132
|
+
|
|
133
|
+
<button class="button" onclick="appendNumber('7')">7</button>
|
|
134
|
+
<button class="button" onclick="appendNumber('8')">8</button>
|
|
135
|
+
<button class="button" onclick="appendNumber('9')">9</button>
|
|
136
|
+
<button class="button operator" onclick="appendOperation('+')">
|
|
137
|
+
+
|
|
138
|
+
</button>
|
|
139
|
+
|
|
140
|
+
<button class="button" onclick="appendNumber('4')">4</button>
|
|
141
|
+
<button class="button" onclick="appendNumber('5')">5</button>
|
|
142
|
+
<button class="button" onclick="appendNumber('6')">6</button>
|
|
143
|
+
<button class="button equal" onclick="calculate()">=</button>
|
|
144
|
+
|
|
145
|
+
<button class="button" onclick="appendNumber('1')">1</button>
|
|
146
|
+
<button class="button" onclick="appendNumber('2')">2</button>
|
|
147
|
+
<button class="button" onclick="appendNumber('3')">3</button>
|
|
148
|
+
<button class="button" onclick="appendNumber('0')">0</button>
|
|
149
|
+
</div>
|
|
150
|
+
|
|
151
|
+
<div class="history" id="history"><b>History</b><br /></div>
|
|
152
|
+
</div>
|
|
153
|
+
|
|
154
|
+
<script>
|
|
155
|
+
let currentInput = ''
|
|
156
|
+
let previousInput = ''
|
|
157
|
+
let currentOperation = ''
|
|
158
|
+
|
|
159
|
+
function updateDisplay() {
|
|
160
|
+
document.getElementById('display').value =
|
|
161
|
+
previousInput + ' ' + currentOperation + ' ' + currentInput
|
|
162
|
+
}
|
|
163
|
+
|
|
164
|
+
function appendNumber(num) {
|
|
165
|
+
currentInput += num
|
|
166
|
+
updateDisplay()
|
|
167
|
+
}
|
|
168
|
+
|
|
169
|
+
function appendOperation(op) {
|
|
170
|
+
if (currentInput === '') return
|
|
171
|
+
|
|
172
|
+
if (previousInput !== '') {
|
|
173
|
+
calculate()
|
|
174
|
+
}
|
|
175
|
+
|
|
176
|
+
currentOperation = op
|
|
177
|
+
previousInput = currentInput
|
|
178
|
+
currentInput = ''
|
|
179
|
+
updateDisplay()
|
|
180
|
+
}
|
|
181
|
+
|
|
182
|
+
function calculate() {
|
|
183
|
+
if (previousInput === '' || currentInput === '') return
|
|
184
|
+
|
|
185
|
+
let result
|
|
186
|
+
let prev = parseFloat(previousInput)
|
|
187
|
+
let curr = parseFloat(currentInput)
|
|
188
|
+
|
|
189
|
+
switch (currentOperation) {
|
|
190
|
+
case '+':
|
|
191
|
+
result = prev + curr
|
|
192
|
+
break
|
|
193
|
+
case '-':
|
|
194
|
+
result = prev - curr
|
|
195
|
+
break
|
|
196
|
+
case '*':
|
|
197
|
+
result = prev * curr
|
|
198
|
+
break
|
|
199
|
+
case '/':
|
|
200
|
+
if (curr === 0) {
|
|
201
|
+
alert('Cannot divide by zero')
|
|
202
|
+
return
|
|
203
|
+
}
|
|
204
|
+
result = prev / curr
|
|
205
|
+
break
|
|
206
|
+
}
|
|
207
|
+
|
|
208
|
+
let historyText =
|
|
209
|
+
previousInput +
|
|
210
|
+
' ' +
|
|
211
|
+
currentOperation +
|
|
212
|
+
' ' +
|
|
213
|
+
currentInput +
|
|
214
|
+
' = ' +
|
|
215
|
+
result
|
|
216
|
+
|
|
217
|
+
document.getElementById('history').innerHTML +=
|
|
218
|
+
historyText + '<br>'
|
|
219
|
+
|
|
220
|
+
currentInput = result.toString()
|
|
221
|
+
previousInput = ''
|
|
222
|
+
currentOperation = ''
|
|
223
|
+
updateDisplay()
|
|
224
|
+
}
|
|
225
|
+
|
|
226
|
+
function clearDisplay() {
|
|
227
|
+
currentInput = ''
|
|
228
|
+
previousInput = ''
|
|
229
|
+
currentOperation = ''
|
|
230
|
+
updateDisplay()
|
|
231
|
+
}
|
|
232
|
+
|
|
233
|
+
function toggleDarkMode() {
|
|
234
|
+
document.body.classList.toggle('dark')
|
|
235
|
+
}
|
|
236
|
+
|
|
237
|
+
/* CLOCK */
|
|
238
|
+
|
|
239
|
+
function updateClock() {
|
|
240
|
+
let now = new Date()
|
|
241
|
+
document.getElementById('clock').innerText =
|
|
242
|
+
now.toLocaleTimeString()
|
|
243
|
+
}
|
|
244
|
+
|
|
245
|
+
setInterval(updateClock, 1000)
|
|
246
|
+
updateClock()
|
|
247
|
+
|
|
248
|
+
/* KEYBOARD SUPPORT */
|
|
249
|
+
|
|
250
|
+
document.addEventListener('keydown', function (e) {
|
|
251
|
+
if (!isNaN(e.key)) {
|
|
252
|
+
appendNumber(e.key)
|
|
253
|
+
}
|
|
254
|
+
|
|
255
|
+
if (['+', '-', '*', '/'].includes(e.key)) {
|
|
256
|
+
appendOperation(e.key)
|
|
257
|
+
}
|
|
258
|
+
|
|
259
|
+
if (e.key === 'Enter') {
|
|
260
|
+
calculate()
|
|
261
|
+
}
|
|
262
|
+
|
|
263
|
+
if (e.key === 'Backspace') {
|
|
264
|
+
currentInput = currentInput.slice(0, -1)
|
|
265
|
+
updateDisplay()
|
|
266
|
+
}
|
|
267
|
+
})
|
|
268
|
+
</script>
|
|
269
|
+
</body>
|
|
270
|
+
</html>
|
package/chat/index.html
ADDED
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html>
|
|
3
|
+
|
|
4
|
+
<head>
|
|
5
|
+
<title>WebSocket Chat</title>
|
|
6
|
+
</head>
|
|
7
|
+
|
|
8
|
+
<body>
|
|
9
|
+
<h2>WebSocket Chat Application</h2>
|
|
10
|
+
<input type="text" id="messageInput" placeholder="Enter message">
|
|
11
|
+
<button onclick="sendMessage()">Send</button>
|
|
12
|
+
<ul id="messages"></ul>
|
|
13
|
+
<script>
|
|
14
|
+
const socket = new WebSocket("ws://localhost:3000");
|
|
15
|
+
socket.onopen = () => {
|
|
16
|
+
console.log("Connected to server");
|
|
17
|
+
};
|
|
18
|
+
socket.onmessage = (event) => {
|
|
19
|
+
const li = document.createElement("li");
|
|
20
|
+
li.textContent = event.data;
|
|
21
|
+
document.getElementById("messages").appendChild(li);
|
|
22
|
+
};
|
|
23
|
+
function sendMessage() {
|
|
24
|
+
const input = document.getElementById("messageInput");
|
|
25
|
+
socket.send(input.value);
|
|
26
|
+
input.value = "";
|
|
27
|
+
}
|
|
28
|
+
</script>
|
|
29
|
+
</body>
|
|
30
|
+
|
|
31
|
+
</html>
|
package/chat/server.js
ADDED
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
const WebSocket = require('ws');
|
|
2
|
+
|
|
3
|
+
const wss = new WebSocket.Server({ port: 3000 });
|
|
4
|
+
|
|
5
|
+
console.log("WebSocket server running on ws://localhost:3000");
|
|
6
|
+
|
|
7
|
+
let clients = [];
|
|
8
|
+
|
|
9
|
+
wss.on('connection', (ws) => {
|
|
10
|
+
console.log("New client connected");
|
|
11
|
+
clients.push(ws);
|
|
12
|
+
ws.on('message', (message) => {
|
|
13
|
+
console.log("Received:", message.toString());
|
|
14
|
+
clients.forEach(client => {
|
|
15
|
+
if (client !== ws && client.readyState === WebSocket.OPEN) {
|
|
16
|
+
client.send(message.toString());
|
|
17
|
+
}
|
|
18
|
+
});
|
|
19
|
+
});
|
|
20
|
+
ws.on('close', () => {
|
|
21
|
+
console.log("Client disconnected");
|
|
22
|
+
clients = clients.filter(client => client !== ws);
|
|
23
|
+
});
|
|
24
|
+
});
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
# React + Vite
|
|
2
|
+
|
|
3
|
+
This template provides a minimal setup to get React working in Vite with HMR and some Oxlint rules.
|
|
4
|
+
|
|
5
|
+
Currently, two official plugins are available:
|
|
6
|
+
|
|
7
|
+
- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Oxc](https://oxc.rs)
|
|
8
|
+
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/)
|
|
9
|
+
|
|
10
|
+
## React Compiler
|
|
11
|
+
|
|
12
|
+
The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see [this documentation](https://react.dev/learn/react-compiler/installation).
|
|
13
|
+
|
|
14
|
+
## Expanding the Oxlint configuration
|
|
15
|
+
|
|
16
|
+
If you are developing a production application, we recommend using TypeScript with type-aware lint rules enabled. Check out the [TS template](https://github.com/vitejs/vite/tree/main/packages/create-vite/template-react-ts) for information on how to integrate TypeScript and Oxlint's TypeScript related rules in your project.
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
<!doctype html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8" />
|
|
5
|
+
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
|
6
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
7
|
+
<title>chat-react</title>
|
|
8
|
+
</head>
|
|
9
|
+
<body>
|
|
10
|
+
<div id="root"></div>
|
|
11
|
+
<script type="module" src="/src/main.jsx"></script>
|
|
12
|
+
</body>
|
|
13
|
+
</html>
|