-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- PP:
- Ranked Score:
- Total Score:
- Play Count:
- Total Hit:
- Hit Accuracy:
-
-
-
-
-
-
Level
-
-
Total play time:
+
+
+
caodoc
+
caodoc's exozyme page
+
+
Visitor Count:
diff --git a/osu.html b/osu.html
new file mode 100644
index 0000000..1a78275
--- /dev/null
+++ b/osu.html
@@ -0,0 +1,110 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
caodoc's osu! profile
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ PP:
+ Ranked Score:
+ Total Score:
+ Play Count:
+ Total Hit:
+ Hit Accuracy:
+
+
+
+
+
+
Level
+
+
Total play time:
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/static/avatar.png b/static/avatar.png
new file mode 100644
index 0000000..1f2c1c0
Binary files /dev/null and b/static/avatar.png differ
diff --git a/static/contact/discord.png b/static/contact/discord.png
new file mode 100644
index 0000000..75c59c7
Binary files /dev/null and b/static/contact/discord.png differ
diff --git a/static/contact/forgejo.png b/static/contact/forgejo.png
new file mode 100644
index 0000000..34e41e4
Binary files /dev/null and b/static/contact/forgejo.png differ
diff --git a/static/contact/github.png b/static/contact/github.png
new file mode 100644
index 0000000..6ced044
Binary files /dev/null and b/static/contact/github.png differ
diff --git a/static/contact/osu.png b/static/contact/osu.png
new file mode 100644
index 0000000..83c43a5
Binary files /dev/null and b/static/contact/osu.png differ
diff --git a/static/css/osu.css b/static/css/osu.css
new file mode 100644
index 0000000..5a2e152
--- /dev/null
+++ b/static/css/osu.css
@@ -0,0 +1,249 @@
+@import "mocha.css";
+
+:root
+{
+ --bg: var(--base00);
+ --container: var(--base02);
+ --text: var(--base07);
+ --link: var(--base0D);
+}
+
+*
+{
+ box-sizing: border-box;
+}
+
+*::-webkit-scrollbar
+{
+ background-color: transparent;
+ width: 1rem;
+}
+
+*::-webkit-scrollbar-track
+{
+ background-color: transparent;
+}
+
+*::-webkit-scrollbar-thumb
+{
+ border-radius: 20px;
+ border: 4px solid transparent;
+ background-color: var(--base04);
+ background-clip: content-box;
+}
+
+@font-face
+{
+ font-family: Aller;
+ src: url("../font/Aller.ttf");
+}
+
+a
+{
+ color: var(--link);
+ text-decoration: underline;
+ text-decoration-color: var(--link);
+}
+
+a:visited
+{
+ color: var(--link);
+}
+
+body
+{
+ max-width: 50rem;
+ margin: 2rem auto;
+ background-color: var(--bg);
+ color: var(--text);
+ font-size: 16px;
+ font-family: Aller;
+}
+
+#container
+{
+ padding: 20px;
+ display: flex;
+ flex-direction: row;
+ gap: 50px;
+ border-radius: 15px;
+ background-color: var(--container);
+}
+
+#avatar
+{
+ width: 100%;
+ border-radius: 50px;
+}
+
+.textBold
+{
+ font-weight: bold;
+}
+
+.image-rank
+{
+ width: 30px;
+ height: 100%;
+}
+
+.image-point
+{
+ width: 40px;
+ height: 100%;
+}
+
+.count-text
+{
+ position: relative;
+ top: -7.5px;
+}
+
+#box-0
+{
+ width: 400px;
+ display: flex;
+ flex-direction: column;
+ gap: 20px;
+}
+
+#box-0-1
+{
+ display: flex;
+ flex-direction: row;
+ justify-content: space-evenly;
+}
+
+#box-1
+{
+ width: 100%;
+ padding: 10px 10px 10px 0px;
+ display: flex;
+ flex-direction: column;
+ gap: 20px;
+}
+
+.line
+{
+ width: 100%;
+ height: 2px;
+ border-radius: 5px;
+ background-color: var(--base04);
+}
+
+#username
+{
+ font-weight: bold;
+ font-size: 32px;
+}
+
+#rank
+{
+ display: flex;
+ flex-direction: row;
+ justify-content: space-between;
+ font-size: 20px;
+}
+
+.box-2
+{
+ width: 200px;
+ display: flex;
+ flex-direction: column;
+ gap: 7.5px;
+}
+
+#box-3
+{
+ display: flex;
+ flex-direction: column;
+ gap: 10px;
+}
+
+#box-4
+{
+ display: flex;
+ flex-direction: row;
+ justify-content: space-between;
+}
+
+#other
+{
+ width: 100%;
+ display: flex;
+ flex-direction: row;
+ justify-content: space-between;
+}
+
+#boxProgress
+{
+ width: 100%;
+ height: 15px;
+ border-radius: 10px;
+ background-color: var(--bg);
+}
+
+#progress
+{
+ width: 50%;
+ height: 100%;
+ border-radius: 10px;
+ background-color: var(--base0C);
+}
+
+#levelProgress
+{
+ width: 100%;
+ padding-right: 10px;
+ display: flex;
+ justify-content: flex-end;
+ font-size: 14px;
+ color: var(--base00);
+}
+
+@media screen and (max-width: 500px)
+{
+ body
+ {
+ margin: 0 0;
+ padding: 10px;
+ max-width: 100%;
+ }
+
+ #container
+ {
+ width: 100%;
+ padding: 10px;
+ border-radius: 25px;
+ background-color: var(--container);
+ flex-direction: column;
+ }
+
+ #box-0-1
+ {
+ display: none;
+ }
+
+ #box-0
+ {
+ width: 100%;
+ }
+
+ #box-1
+ {
+ padding: 0px 0px 0px 0px;
+ }
+
+ #avatar
+ {
+ position: relative;
+ top: 20px;
+ width: 100%;
+ border-radius: 50%;
+ }
+
+ .boxSmall
+ {
+ display: none;
+ }
+}
\ No newline at end of file
diff --git a/static/css/style.css b/static/css/style.css
index 5a2e152..1de9fc3 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -6,6 +6,7 @@
--container: var(--base02);
--text: var(--base07);
--link: var(--base0D);
+ --linkHover: var(--base09);
}
*
@@ -38,212 +39,99 @@
src: url("../font/Aller.ttf");
}
-a
-{
- color: var(--link);
- text-decoration: underline;
- text-decoration-color: var(--link);
-}
-
-a:visited
-{
- color: var(--link);
-}
-
body
{
- max-width: 50rem;
- margin: 2rem auto;
+ margin: 2rem 2rem;
background-color: var(--bg);
color: var(--text);
font-size: 16px;
font-family: Aller;
}
+a
+{
+ color: var(--text);
+ text-decoration: none;
+}
+
+a:visited
+{
+ color: var(--text);
+}
+
+a:hover
+{
+ color: var(--linkHover);
+}
+
#container
{
- padding: 20px;
+ width: 100%;
+ display: flex;
+ flex-direction: column;
+ gap: 50px;
+ font-size: 24px;
+}
+
+#containerTop
+{
display: flex;
flex-direction: row;
- gap: 50px;
- border-radius: 15px;
- background-color: var(--container);
+ gap: 15px;
+}
+
+#icon
+{
+ width: 50px;
+ border-radius: 50%;
+}
+
+#containerTopText
+{
+ line-height: 50px;
+ text-align: center;
+ font-size: 32px;
+ font-weight: 750;
+}
+
+#containerBody
+{
+ display: flex;
+ flex-direction: column;
+ gap: 25px;
+ align-items: center;
}
#avatar
{
- width: 100%;
- border-radius: 50px;
+ width: 250px;
+ border-radius: 50%;
}
-.textBold
+#name
{
- font-weight: bold;
-}
-
-.image-rank
-{
- width: 30px;
- height: 100%;
-}
-
-.image-point
-{
- width: 40px;
- height: 100%;
-}
-
-.count-text
-{
- position: relative;
- top: -7.5px;
-}
-
-#box-0
-{
- width: 400px;
- display: flex;
- flex-direction: column;
- gap: 20px;
-}
-
-#box-0-1
-{
- display: flex;
- flex-direction: row;
- justify-content: space-evenly;
-}
-
-#box-1
-{
- width: 100%;
- padding: 10px 10px 10px 0px;
- display: flex;
- flex-direction: column;
- gap: 20px;
-}
-
-.line
-{
- width: 100%;
- height: 2px;
- border-radius: 5px;
- background-color: var(--base04);
-}
-
-#username
-{
- font-weight: bold;
+ font-weight: 750;
font-size: 32px;
}
-#rank
+#containerBot
{
+ position: relative;
+ left: 5px;
display: flex;
flex-direction: row;
- justify-content: space-between;
- font-size: 20px;
+ gap: 25px;
}
-.box-2
+.contact
{
- width: 200px;
- display: flex;
- flex-direction: column;
- gap: 7.5px;
+ width: 35px;
+ border-radius: 50%;
+ filter: contrast(125%);
+ transition: transform 0.2s;
}
-#box-3
+.contact:hover
{
- display: flex;
- flex-direction: column;
- gap: 10px;
-}
-
-#box-4
-{
- display: flex;
- flex-direction: row;
- justify-content: space-between;
-}
-
-#other
-{
- width: 100%;
- display: flex;
- flex-direction: row;
- justify-content: space-between;
-}
-
-#boxProgress
-{
- width: 100%;
- height: 15px;
- border-radius: 10px;
- background-color: var(--bg);
-}
-
-#progress
-{
- width: 50%;
- height: 100%;
- border-radius: 10px;
- background-color: var(--base0C);
-}
-
-#levelProgress
-{
- width: 100%;
- padding-right: 10px;
- display: flex;
- justify-content: flex-end;
- font-size: 14px;
- color: var(--base00);
-}
-
-@media screen and (max-width: 500px)
-{
- body
- {
- margin: 0 0;
- padding: 10px;
- max-width: 100%;
- }
-
- #container
- {
- width: 100%;
- padding: 10px;
- border-radius: 25px;
- background-color: var(--container);
- flex-direction: column;
- }
-
- #box-0-1
- {
- display: none;
- }
-
- #box-0
- {
- width: 100%;
- }
-
- #box-1
- {
- padding: 0px 0px 0px 0px;
- }
-
- #avatar
- {
- position: relative;
- top: 20px;
- width: 100%;
- border-radius: 50%;
- }
-
- .boxSmall
- {
- display: none;
- }
+ transform: scale(1.5);
}
\ No newline at end of file
diff --git a/static/js/osu.js b/static/js/osu.js
new file mode 100644
index 0000000..f3a3f36
--- /dev/null
+++ b/static/js/osu.js
@@ -0,0 +1,53 @@
+function numberSeparator(x)
+{
+ return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+}
+
+function getInformation()
+{
+ fetch("https://caodoc-api.exozy.me/osu")
+ .then(reponse => reponse.json())
+ .then(data => {
+
+ //console.log(data);
+
+ document.getElementById("username").textContent = data.username;
+ document.getElementById("avatar").src = data.avatarURL;
+ document.getElementById("countryCode").textContent = data.userCountry;
+ document.getElementById("globalRank").textContent = numberSeparator(data.globalRank);
+ document.getElementById("countryRank").textContent = numberSeparator(data.countryRank);
+ document.getElementById("userLevel").textContent = numberSeparator(data.userLevel);
+ document.getElementById("pp").textContent = Math.round(data.pp);
+ document.getElementById("rankedScore").textContent = numberSeparator(data.rankedScore);
+ document.getElementById("totalScore").textContent = numberSeparator(data.totalScore);
+
+ let playTime = data.playTime;
+ let secondADay = 86400;
+ let secondAHour = 3600;
+ let day = Math.floor(playTime / secondADay);
+ playTime = playTime - secondADay * day;
+ let hour = Math.floor(playTime / secondAHour);
+ playTime = playTime - secondAHour * hour;
+ //console.log(day);
+ //console.log(hour);
+ //console.log(playTime);
+ document.getElementById("playTime").textContent = `${day}d ${hour}hrs`;
+
+ document.getElementById("playCount").textContent = numberSeparator(data.playCount);
+ document.getElementById("totalHits").textContent = numberSeparator(data.totalHits);
+ document.getElementById("hitAccuracy").textContent = `${data.hitAccuracy.toFixed(2)}%`;
+ document.getElementById("maximumCombo").textContent = numberSeparator(data.maximumCombo);
+ document.getElementById("count_300").textContent = numberSeparator(data.count_300);
+ document.getElementById("count_100").textContent = numberSeparator(data.count_100);
+ document.getElementById("count_50").textContent = numberSeparator(data.count_50);
+ document.getElementById("progress").style.width = `${data.levelProgress}%`;
+ document.getElementById("levelProgress").textContent = `${data.levelProgress}%`;
+ document.getElementById("ssh").textContent = numberSeparator(data.SSH);
+ document.getElementById("ss").textContent = numberSeparator(data.SS);
+ document.getElementById("sh").textContent = numberSeparator(data.SH);
+ document.getElementById("s").textContent = numberSeparator(data.S);
+ document.getElementById("a").textContent = numberSeparator(data.A);
+ });
+}
+
+getInformation();
\ No newline at end of file
diff --git a/static/js/script.js b/static/js/script.js
index f3a3f36..0ed966d 100644
--- a/static/js/script.js
+++ b/static/js/script.js
@@ -1,53 +1,34 @@
-function numberSeparator(x)
+const visitorCount = document.getElementById("visitor-count");
+
+if (!localStorage.getItem("lastVisited"))
{
- return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+ const date = new Date();
+ console.log(date);
+ localStorage.setItem("lastVisited", date.getDate());
}
-function getInformation()
+if (!localStorage.getItem("count"))
{
- fetch("https://caodoc-api.exozy.me/osu")
+ fetch("https://caodoc-api.exozy.me/new_visitor/exozyme")
.then(reponse => reponse.json())
.then(data => {
-
- //console.log(data);
-
- document.getElementById("username").textContent = data.username;
- document.getElementById("avatar").src = data.avatarURL;
- document.getElementById("countryCode").textContent = data.userCountry;
- document.getElementById("globalRank").textContent = numberSeparator(data.globalRank);
- document.getElementById("countryRank").textContent = numberSeparator(data.countryRank);
- document.getElementById("userLevel").textContent = numberSeparator(data.userLevel);
- document.getElementById("pp").textContent = Math.round(data.pp);
- document.getElementById("rankedScore").textContent = numberSeparator(data.rankedScore);
- document.getElementById("totalScore").textContent = numberSeparator(data.totalScore);
-
- let playTime = data.playTime;
- let secondADay = 86400;
- let secondAHour = 3600;
- let day = Math.floor(playTime / secondADay);
- playTime = playTime - secondADay * day;
- let hour = Math.floor(playTime / secondAHour);
- playTime = playTime - secondAHour * hour;
- //console.log(day);
- //console.log(hour);
- //console.log(playTime);
- document.getElementById("playTime").textContent = `${day}d ${hour}hrs`;
-
- document.getElementById("playCount").textContent = numberSeparator(data.playCount);
- document.getElementById("totalHits").textContent = numberSeparator(data.totalHits);
- document.getElementById("hitAccuracy").textContent = `${data.hitAccuracy.toFixed(2)}%`;
- document.getElementById("maximumCombo").textContent = numberSeparator(data.maximumCombo);
- document.getElementById("count_300").textContent = numberSeparator(data.count_300);
- document.getElementById("count_100").textContent = numberSeparator(data.count_100);
- document.getElementById("count_50").textContent = numberSeparator(data.count_50);
- document.getElementById("progress").style.width = `${data.levelProgress}%`;
- document.getElementById("levelProgress").textContent = `${data.levelProgress}%`;
- document.getElementById("ssh").textContent = numberSeparator(data.SSH);
- document.getElementById("ss").textContent = numberSeparator(data.SS);
- document.getElementById("sh").textContent = numberSeparator(data.SH);
- document.getElementById("s").textContent = numberSeparator(data.S);
- document.getElementById("a").textContent = numberSeparator(data.A);
+ localStorage.setItem("count", data.count);
+ visitorCount.textContent = data.count;
});
}
-getInformation();
\ No newline at end of file
+visitorCount.textContent = localStorage.getItem("count");
+
+const date = new Date();
+if (date.getDate() != localStorage.getItem("lastVisited"))
+{
+ fetch("https://caodoc-api.exozy.me/new_visitor/exozyme")
+ .then(reponse => reponse.json())
+ .then(data => {
+ visitorCount.textContent = data.count;
+ });
+
+ const date = new Date();
+ console.log(date);
+ localStorage.setItem("lastVisited", date.getDate());
+}
\ No newline at end of file
diff --git a/static/preview/preview.png b/static/preview/osu.png
similarity index 100%
rename from static/preview/preview.png
rename to static/preview/osu.png