File size: 2,615 Bytes
065c470
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
document.addEventListener('DOMContentLoaded', async function() {
    await tsParticles.load("tsparticles", {
        fullScreen: {
            enable: false
        },
        background: {
            color: {
                value: "transparent"
            }
        },
        fpsLimit: 60,
        interactivity: {
            events: {
                onClick: {
                    enable: true,
                    mode: "push"
                },
                onHover: {
                    enable: true,
                    mode: "grab"
                },
                resize: true
            },
            modes: {
                push: {
                    quantity: 4
                },
                grab: {
                    distance: 140,
                    links: {
                        opacity: 1
                    }
                }
            }
        },
        particles: {
            color: {
                value: "#ffffff"
            },
            links: {
                color: "#ffffff",
                distance: 150,
                enable: true,
                opacity: 0.5,
                width: 1
            },
            collisions: {
                enable: true
            },
            move: {
                direction: "none",
                enable: true,
                outModes: {
                    default: "bounce"
                },
                random: false,
                speed: 2,
                straight: false
            },
            number: {
                density: {
                    enable: true,
                    area: 800
                },
                value: 80
            },
            opacity: {
                value: 0.5
            },
            shape: {
                type: "circle"
            },
            size: {
                value: { min: 1, max: 5 }
            }
        },
        detectRetina: true
    });

    function toggleDarkMode() {
        document.body.classList.toggle('dark-mode');
        updateParticleColors();
    }

    function updateParticleColors() {
        const isDarkMode = document.body.classList.contains('dark-mode');
        const color = isDarkMode ? "#4299e1" : "#ffffff";
        tsParticles.domItem(0).options.particles.color.value = color;
        tsParticles.domItem(0).options.particles.links.color = color;
        tsParticles.domItem(0).refresh();
    }

    // Expose toggleDarkMode to global scope
    window.toggleDarkMode = toggleDarkMode;
});