website/index.js at main · astroid-app/website · GitHub

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
97
98
99
100
101
102
103
104
105
window.onresize = function() {
    if (window.innerWidth <= 550) {
        document.querySelector(".logo img").src = "../assets/Astroid Logo no bg.png";
    } else {
        document.querySelector(".logo img").src = "../assets/Astroid-banner.png";
    }
}


async function getStats() {
    const res = await fetch("https://api.astroid.cc/statistics");
    const data = await res.json();

    // animation from https://jshakespeare.com/simple-count-up-number-animation-javascript-react/
    const animationDuration = 1000;
    const frameDuration = 1000 / 60;
    const totalFrames = Math.round( animationDuration / frameDuration );
    const easeOutQuad = t => t * ( 2 - t );

    const animateCountUp = el => {
        let frame = 0;
        const countTo = parseInt( el.innerHTML, 10 );
        const counter = setInterval( () => {
            frame++;
            const progress = easeOutQuad( frame / totalFrames );
            const currentCount = Math.round( countTo * progress );
            if ( parseInt( el.innerHTML, 10 ) !== currentCount ) {
                el.innerHTML = currentCount;
            }
            if ( frame === totalFrames ) {
                clearInterval( counter );
                if (el.id == "total-messages-num") {
                    el.innerText = data.messages.total_rounded + "+";
                }

            }
        }, frameDuration );
    };
    document.querySelector("#total-servers-num").innerText = data.endpoints;
    document.querySelector("#total-messages-num").innerText = data.messages.total_rounded;
    document.querySelector("#messages-month-num").innerText = data.messages.month;

    animateCountUp(document.querySelector('#total-servers-num'));
    animateCountUp(document.querySelector('#total-messages-num'));
    animateCountUp(document.querySelector('#messages-month-num'));

    document.querySelector("#total-servers-num").innerText = document.querySelector("#total-messages-num").innerText + "+";


}

window.onload = async function() {
    if (window.innerWidth <= 550) {
        document.querySelector(".logo img").src = "../assets/Astroid Logo no bg.png";
    } else {
        document.querySelector(".logo img").src = "../assets/Astroid-banner.png";
    }

    document.querySelector(".logo img").onclick = function() {
        window.location.href = "/";
    }

    await getStats();

document.querySelectorAll("#can-resize").forEach(img => {
    img.onclick = function() {
        const div = document.querySelector(".full_img_div");
        var div_img = document.createElement("img");
        div_img.src = img.src;
        div_img.id = "full_img";
        div.appendChild(div_img);
        div.style.display = "flex";
        document.querySelector(".norm").style.filter = "blur(5px) brightness(0.3)";
        document.querySelector("body").id = "no-scroll";
    }
});

    document.querySelector(".close").onclick = function() {
        document.querySelector(".full_img_div").style.display = "none";
        document.querySelector(".full_img_div #full_img").remove();
        document.querySelector(".norm").style.filter = "none";
        document.querySelector("body").id = null;
    }
    document.querySelector("body").onclick = function(e) {
        if (e.target.className == "full_img_div") {
            document.querySelector(".full_img_div").style.display = "none";
            document.querySelector(".full_img_div #full_img").remove();
            document.querySelector(".norm").style.filter = "none";
            document.querySelector("body").id = null;
        }
    }
    document.querySelector("#github").onclick = function() {
        window.open("https://github.com/astroid-app");
    }
    document.querySelector("#get-astroid").onclick = function() {
        window.open("./invite");
    }
    document.querySelector("#discord").onclick = function() {
        window.open("https://api.astroid.cc/discord");
    }
    document.querySelector("#supportus").onclick = function() {
        window.open("https://ko-fi.com/astroidapp");
    }
}