null and exception handling

pull/2/head
Kar 2025-03-20 18:44:36 +05:30
parent cbb4a92899
commit 1ac8e4197c
1 changed files with 19 additions and 7 deletions

View File

@ -279,12 +279,18 @@ const pageImage = "https://images.unsplash.com/photo-1551731409-43eb3e517a1a?q=8
// Set up the canvas when the DOM loads // Set up the canvas when the DOM loads
document.addEventListener('DOMContentLoaded', () => { document.addEventListener('DOMContentLoaded', () => {
const canvas = document.getElementById('matrix-animation'); const canvas = document.getElementById('matrix-animation');
const ctx = canvas.getContext('2d'); if (!canvas) {
console.error('Canvas element not found');
return;
}
const ctx = (canvas as HTMLCanvasElement).getContext('2d');
// Set canvas dimensions to match the viewport // Set canvas dimensions to match the viewport
function resizeCanvas() { function resizeCanvas() {
canvas.width = window.innerWidth; if (canvas) {
canvas.height = window.innerHeight; (canvas as HTMLCanvasElement).width = window.innerWidth;
(canvas as HTMLCanvasElement).height = window.innerHeight;
}
} }
resizeCanvas(); resizeCanvas();
@ -293,10 +299,10 @@ const pageImage = "https://images.unsplash.com/photo-1551731409-43eb3e517a1a?q=8
// Characters to display // Characters to display
const chars = "SILICONPIN HOSTINNG"; const chars = "SILICONPIN HOSTINNG";
const charSize = 14; const charSize = 14;
const columns = canvas.width / charSize; const columns = (canvas as HTMLCanvasElement).width / charSize;
// Array to track the y position of each column // Array to track the y position of each column
const drops = []; const drops: number[] = [];
for (let i = 0; i < columns; i++) { for (let i = 0; i < columns; i++) {
drops[i] = Math.random() * -100; drops[i] = Math.random() * -100;
} }
@ -304,8 +310,14 @@ const pageImage = "https://images.unsplash.com/photo-1551731409-43eb3e517a1a?q=8
// Draw function // Draw function
function draw() { function draw() {
// Semi-transparent black to create trail effect // Semi-transparent black to create trail effect
if (!ctx) {
console.error('Canvas rendering context is null');
return;
}
ctx.fillStyle = "rgba(0, 0, 0, 0.05)"; ctx.fillStyle = "rgba(0, 0, 0, 0.05)";
ctx.fillRect(0, 0, canvas.width, canvas.height); if (canvas) {
ctx.fillRect(0, 0, (canvas as HTMLCanvasElement).width, (canvas as HTMLCanvasElement).height);
}
// Set text color // Set text color
ctx.fillStyle = "#6d9e37"; ctx.fillStyle = "#6d9e37";
@ -329,7 +341,7 @@ const pageImage = "https://images.unsplash.com/photo-1551731409-43eb3e517a1a?q=8
drops[i]++; drops[i]++;
// Randomly reset a column when it's past the screen // Randomly reset a column when it's past the screen
if (drops[i] * charSize > canvas.height && Math.random() > 0.975) { if (canvas && drops[i] * charSize > (canvas as HTMLCanvasElement).height && Math.random() > 0.975) {
drops[i] = 0; drops[i] = 0;
} }
} }