Skip to content

Commit e0a33c9

Browse files
committed
corrected the code
1 parent bdac4ea commit e0a33c9

File tree

1 file changed

+19
-21
lines changed

1 file changed

+19
-21
lines changed

Source-Code/ImageFilter/script.js

+19-21
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ document.getElementById('upload-file').addEventListener('change', (e) => {
1212
const file = e.target.files[0];
1313
const reader = new FileReader();
1414

15-
reader.onload = function (event) {
15+
reader.onload = (event) => {
1616
img.src = event.target.result;
1717
};
1818

@@ -22,19 +22,17 @@ document.getElementById('upload-file').addEventListener('change', (e) => {
2222
});
2323

2424
// Helper function to clamp values
25-
function clamp(value) {
26-
return Math.min(Math.max(value, 0), 255);
27-
}
25+
const clamp = (value) => Math.min(Math.max(value, 0), 255);
2826

2927
// Draw image to canvas
30-
img.onload = function () {
28+
img.onload = () => {
3129
canvas.width = img.width;
3230
canvas.height = img.height;
3331
ctx.drawImage(img, 0, 0);
3432
};
3533

3634
// Redraw image with current adjustments
37-
function drawImage() {
35+
const drawImage = () => {
3836
ctx.drawImage(img, 0, 0);
3937
const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
4038
const { data } = imageData;
@@ -72,34 +70,34 @@ function drawImage() {
7270
data[i + 2] = clamp(data[i + 2] + amount); // Blue
7371
}
7472
ctx.putImageData(imageData, 0, 0);
75-
}
73+
};
7674

7775
// Apply brightness
78-
function applyBrightness(value) {
76+
const applyBrightness = (value) => {
7977
brightness += value;
8078
drawImage();
81-
}
79+
};
8280

8381
// Apply contrast
84-
function applyContrast(value) {
82+
const applyContrast = (value) => {
8583
contrast += value;
8684
drawImage();
87-
}
85+
};
8886

8987
// Apply saturation
90-
function applySaturation(value) {
88+
const applySaturation = (value) => {
9189
saturation += value;
9290
drawImage();
93-
}
91+
};
9492

9593
// Apply vibrance
96-
function applyVibrance(value) {
94+
const applyVibrance = (value) => {
9795
vibrance += value;
9896
drawImage();
99-
}
97+
};
10098

10199
// Apply effect
102-
function applyEffect(effect) {
100+
const applyEffect = (effect) => {
103101
drawImage();
104102
const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
105103
const { data } = imageData;
@@ -162,24 +160,24 @@ function applyEffect(effect) {
162160
}
163161

164162
ctx.putImageData(imageData, 0, 0);
165-
}
163+
};
166164

167165
// Download image
168-
function downloadImage() {
166+
const downloadImage = () => {
169167
const link = document.createElement('a');
170168
link.download = fileName;
171169
link.href = canvas.toDataURL('image/jpeg');
172170
link.click();
173-
}
171+
};
174172

175173
// Revert filters
176-
function revertFilters() {
174+
const revertFilters = () => {
177175
brightness = 0;
178176
contrast = 0;
179177
saturation = 0;
180178
vibrance = 0;
181179
drawImage();
182-
}
180+
};
183181

184182
// Event listeners for filter buttons
185183
document

0 commit comments

Comments
 (0)