JavaScript rain canvas animation

rain.js

const MAX_PARTICLES = 500;
const PARTICLE_COLOR = "rgba(174, 194, 224, 0.5)";
const PARTICLE_SPEED = 10;

const TEXT_COLOR = "rgba(255, 255, 255, .2)";
const TEXT_FONT = "bold 36px Arial";

const body = document.body;

function randomInt(min, max) {
    return Math.floor(Math.random() * (max - min + 1) + min);
}

function drawText(text, canvas) {
    const ctx = canvas.getContext("2d");
    
    ctx.fillStyle = TEXT_COLOR;
    ctx.font = TEXT_FONT;
    
    const size = ctx.measureText(text);
    const width = size.width;
    const height = size.actualBoundingBoxAscent + size.actualBoundingBoxDescent;
    
    ctx.fillText(text, (canvas.width - width) / 2, (canvas.height - height) / 2);
}

function createParticles(ctx, width, height) {
    ctx.strokeStyle = PARTICLE_COLOR;
    ctx.lineWidth = 1;
    ctx.lineCap = "round";
    
    var particles = [];
    for(var a = 0; a < MAX_PARTICLES; a++) {
        particles.push({
            x: Math.random() * width,
            y: Math.random() * height,
            length: Math.random() * 1,
            offset_x: -4 + Math.random() * 4 + 2,
            offset_y: Math.random() * PARTICLE_SPEED + 10
        })
    }
    return particles;
}

function moveParticles(particles, width, height) {
    for(var b = 0; b < particles.length; b++) {
        var p = particles[b];
        p.x += p.offset_x;
        p.y += p.offset_y;
        if(p.x > width || p.y > height) {
            p.x = Math.random() * width;
            p.y = -20;
        }
    }
}

function drawParticles(particles, ctx) {
    for(var c = 0; c < particles.length; c++) {
        var p = particles[c];
        ctx.beginPath();
        ctx.moveTo(p.x, p.y);
        ctx.lineTo(p.x + p.length * p.offset_x, p.y + p.length * p.offset_y);
        ctx.stroke();
    }
}

document.addEventListener("DOMContentLoaded", () => {
    let text_counter = 0;

    const canvas = document.getElementById("canvas");
    
    const width = canvas.width = window.innerWidth;
    const height = canvas.height = window.innerHeight;
    
    if(!canvas.getContext) {
        return;
    }
    const ctx = canvas.getContext("2d");
    
    const particles = createParticles(ctx, width, height);
    
    setInterval(() => {
        text_counter += 30;
        ctx.clearRect(0, 0, width, height);
        
        if(text_counter < 1000) {
            drawText("This rain's kinda heavy", canvas);
        } else if(text_counter < 2000) {
            drawText("This rain's kinda heavy.", canvas);
        } else if(text_counter < 3000) {
            drawText("This rain's kinda heavy..", canvas);
        } else if(text_counter < 4000) {
            drawText("This rain's kinda heavy...", canvas);
        } else if(text_counter < 5000) {
            drawText("This rain's kinda heavy", canvas);
            text_counter = 0;
        }

        drawParticles(particles, ctx);
        moveParticles(particles, width, height);
    }, 30);
});