spacebar/SplatNet
spacebar/SplatNet
Watch
13
1
Fork
You've already forked SplatNet
 1
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: implement logging in & out of twitter using header

Browse source
This commit is contained in:
kittentm 2026-03-22 23:35:09 +01:00
commit ca0cc9db44
No known key found for this signature in database
GPG key ID: AC43DFDBC1F44A91
5 changed files with 209 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

50
equipment/equipment.js
View file

@ -9,6 +9,55 @@ window.loadHeader(async function(headerContainer) {
}); });
} }
const twitterBtn = document.getElementById('twitter-link-btn');
const twitterLabel = document.getElementById('twitter-label-img');
const handleTwitterAction = () => {
const isLinked = twitterBtn.dataset.linked === "true";
if (isLinked) {
if (!confirm("Unlink Twitter account?")) return;
fetch("/api/v1/me/twitter/unlink", { method: "POST", credentials: 'include' })
.then(() => window.location.reload());
} else {
twitterBtn.style.opacity = "0.5";
twitterBtn.style.pointerEvents = "none";
fetch("/api/v1/me/twitter/link", { credentials: 'include' })
.then(res => res.status === 401 ? (window.location.href = "/sign_in/") : res.json())
.then(data => data?.url ? (window.location.href = data.url) : window.location.reload())
.catch(() => window.location.reload());
}
};
if (twitterBtn) {
twitterBtn.addEventListener('click', handleTwitterAction);
}
const updateTwitterUI = () => {
if (!twitterBtn || !twitterLabel) return;
fetch("/api/v1/me/twitter/status", { credentials: 'include' })
.then(res => res.ok ? res.json() : null)
.then(data => {
if (data && data.is_linked) {
twitterBtn.dataset.linked = "true";
twitterLabel.src = "/assets/en/svg/text/menu/tx_twitter_Cancel-34186e4e830964405f2528210d7278206d255bf40b69559babc36a7a041e0394.svg";
twitterLabel.alt = "Unlink Twitter";
twitterLabel.style.scale = "1.6";
twitterLabel.style.marginLeft = "30px";
twitterLabel.style.translate = "-10px -2px";
} else {
twitterBtn.dataset.linked = "false";
twitterLabel.src = "/assets/en/svg/text/menu/tx_twitter-47ce083cc4514ab6aeb75b7dd9f71ce89ddc54a18d930d90cf4df62047413831.svg";
twitterLabel.alt = "Link Twitter";
twitterLabel.style.scale = "";
twitterLabel.style.marginLeft = "";
twitterLabel.style.translate = "";
}
})
.catch(() => {
twitterBtn.dataset.linked = "false";
});
};
const extractMiiName = (miiDataB64) => { const extractMiiName = (miiDataB64) => {
try { try {
const binaryString = atob(miiDataB64.replace(/-/g, '+').replace(/_/g, '/')); const binaryString = atob(miiDataB64.replace(/-/g, '+').replace(/_/g, '/'));
@ -222,6 +271,7 @@ window.loadHeader(async function(headerContainer) {
</div> </div>
`; `;
} }
updateTwitterUI();
}; };
const init = async () => { const init = async () => {

62
friend_list/friendlist.js
View file

@ -5,7 +5,6 @@ window.loadHeader(function(headerContainer) {
} }
const logoutForm = document.getElementById("logout-form"); const logoutForm = document.getElementById("logout-form");
if (logoutForm) { if (logoutForm) {
logoutForm.action = "/api/v1/spfn/logout"; logoutForm.action = "/api/v1/spfn/logout";
const originInput = document.getElementById("logout_frontend_origin"); const originInput = document.getElementById("logout_frontend_origin");
@ -16,6 +15,30 @@ window.loadHeader(function(headerContainer) {
}); });
} }
const twitterBtn = document.getElementById('twitter-link-btn');
const twitterLabel = document.getElementById('twitter-label-img');
const handleTwitterAction = () => {
const isLinked = twitterBtn.dataset.linked === "true";
if (isLinked) {
if (!confirm("Unlink Twitter account?")) return;
fetch("/api/v1/me/twitter/unlink", { method: "POST", credentials: 'include' })
.then(() => window.location.reload());
} else {
twitterBtn.style.opacity = "0.5";
twitterBtn.style.pointerEvents = "none";
fetch("/api/v1/me/twitter/link", { credentials: 'include' })
.then(res => res.status === 401 ? (window.location.href = "/sign_in/") : res.json())
.then(data => data?.url ? (window.location.href = data.url) : window.location.reload())
.catch(() => window.location.reload());
}
};
if (twitterBtn) {
twitterBtn.addEventListener('click', handleTwitterAction);
}
const extractMiiName = (miiDataB64) => { const extractMiiName = (miiDataB64) => {
try { try {
const binaryString = atob(miiDataB64.replace(/-/g, '+').replace(/_/g, '/')); const binaryString = atob(miiDataB64.replace(/-/g, '+').replace(/_/g, '/'));
@ -42,6 +65,33 @@ window.loadHeader(function(headerContainer) {
} }
}; };
const updateTwitterUI = () => {
if (!twitterBtn || !twitterLabel) return;
//this is so shitty but it works so i dont care
fetch("/api/v1/me/twitter/status", { credentials: 'include' })
.then(res => res.ok ? res.json() : null)
.then(data => {
if (data && data.is_linked) {
twitterBtn.dataset.linked = "true";
twitterLabel.src = "/assets/en/svg/text/menu/tx_twitter_Cancel-34186e4e830964405f2528210d7278206d255bf40b69559babc36a7a041e0394.svg";
twitterLabel.alt = "Unlink Twitter";
twitterLabel.style.scale = "1.6";
twitterLabel.style.marginLeft = "30px";
twitterLabel.style.translate = "-10px -2px";
} else {
twitterBtn.dataset.linked = "false";
twitterLabel.src = "/assets/en/svg/text/menu/tx_twitter-47ce083cc4514ab6aeb75b7dd9f71ce89ddc54a18d930d90cf4df62047413831.svg";
twitterLabel.alt = "Link Twitter";
twitterLabel.style.height = "";
twitterLabel.style.transform = "";
}
})
.catch(() => {
twitterBtn.dataset.linked = "false";
});
};
const renderData = (data) => { const renderData = (data) => {
if (typeof data === 'string') { if (typeof data === 'string') {
try { data = JSON.parse(data); } catch (e) {} try { data = JSON.parse(data); } catch (e) {}
@ -59,19 +109,15 @@ window.loadHeader(function(headerContainer) {
imgEl.src = `https://mii-unsecure.ariankordi.net/miis/image.png?data=${encodeURIComponent(miiBlob)}&type=face&width=270`; imgEl.src = `https://mii-unsecure.ariankordi.net/miis/image.png?data=${encodeURIComponent(miiBlob)}&type=face&width=270`;
imgEl.style.display = 'block'; imgEl.style.display = 'block';
} }
updateTwitterUI();
}; };
const cached = sessionStorage.getItem('user_cache'); const cached = sessionStorage.getItem('user_cache');
if (cached) renderData(JSON.parse(cached)); if (cached) renderData(JSON.parse(cached));
fetch("/api/v1/me", { credentials: 'include' }) fetch("/api/v1/me", { credentials: 'include' })
.then(res => { .then(res => res.redirected ? (window.location.href = res.url) : (res.ok ? res.json() : Promise.reject(res)))
if (res.redirected) {
window.location.href = res.url;
return;
}
return res.ok ? res.json() : Promise.reject(res);
})
.then(data => { .then(data => {
if (!data) return; if (!data) return;
sessionStorage.setItem('user_cache', JSON.stringify(data)); sessionStorage.setItem('user_cache', JSON.stringify(data));

4
header.html
View file

@ -61,9 +61,9 @@
<span id="mii-name" class="profile-name-label">Loading...</span> <span id="mii-name" class="profile-name-label">Loading...</span>
<div class="button-container"> <div class="button-container">
<button class="box-btn twitter-btn"> <button id="twitter-link-btn" class="box-btn twitter-btn">
<img src="../assets/en/svg/ui/ico_twitter-e7c60d7a77d2adc6a5ca9338e1c74d4a2378804fc979929a4fc9cad1127945f0.svg" alt="" class="btn-icon"> <img src="../assets/en/svg/ui/ico_twitter-e7c60d7a77d2adc6a5ca9338e1c74d4a2378804fc979929a4fc9cad1127945f0.svg" alt="" class="btn-icon">
<img src="../assets/en/svg/text/menu/tx_twitter-47ce083cc4514ab6aeb75b7dd9f71ce89ddc54a18d930d90cf4df62047413831.svg" class="btn-label-img" alt="Unlink Twitter"> <img id="twitter-label-img" src="../assets/en/svg/text/menu/tx_twitter-47ce083cc4514ab6aeb75b7dd9f71ce89ddc54a18d930d90cf4df62047413831.svg" class="btn-label-img" alt="Twitter">
</button> </button>
<form id="logout-form" method="POST" style="display: contents;" accept-charset="UTF-8"> <form id="logout-form" method="POST" style="display: contents;" accept-charset="UTF-8">

53
ranking/rank.js
View file

@ -15,6 +15,57 @@ window.loadHeader(async function(headerContainer) {
}); });
} }
const twitterBtn = document.getElementById('twitter-link-btn');
const twitterLabel = document.getElementById('twitter-label-img');
const handleTwitterAction = () => {
const isLinked = twitterBtn.dataset.linked === "true";
if (isLinked) {
if (!confirm("Unlink Twitter account?")) return;
fetch("/api/v1/me/twitter/unlink", { method: "POST", credentials: 'include' })
.then(() => window.location.reload());
} else {
twitterBtn.style.opacity = "0.5";
twitterBtn.style.pointerEvents = "none";
fetch("/api/v1/me/twitter/link", { credentials: 'include' })
.then(res => res.status === 401 ? (window.location.href = "/sign_in/") : res.json())
.then(data => data?.url ? (window.location.href = data.url) : window.location.reload())
.catch(() => window.location.reload());
}
};
if (twitterBtn) {
twitterBtn.addEventListener('click', handleTwitterAction);
}
const updateTwitterUI = () => {
if (!twitterBtn || !twitterLabel) return;
fetch("/api/v1/me/twitter/status", { credentials: 'include' })
.then(res => res.ok ? res.json() : null)
.then(data => {
if (data && data.is_linked) {
twitterBtn.dataset.linked = "true";
twitterLabel.src = "/assets/en/svg/text/menu/tx_twitter_Cancel-34186e4e830964405f2528210d7278206d255bf40b69559babc36a7a041e0394.svg";
twitterLabel.alt = "Unlink Twitter";
twitterLabel.style.scale = "1.6";
twitterLabel.style.marginLeft = "30px";
twitterLabel.style.translate = "-10px -2px";
} else {
twitterBtn.dataset.linked = "false";
twitterLabel.src = "/assets/en/svg/text/menu/tx_twitter-47ce083cc4514ab6aeb75b7dd9f71ce89ddc54a18d930d90cf4df62047413831.svg";
twitterLabel.alt = "Link Twitter";
twitterLabel.style.scale = "";
twitterLabel.style.marginLeft = "";
twitterLabel.style.translate = "";
}
})
.catch(() => {
twitterBtn.dataset.linked = "false";
});
};
const extractMiiName = (miiDataB64) => { const extractMiiName = (miiDataB64) => {
try { try {
const data = Uint8Array.from(atob(miiDataB64.replace(/-/g, '+').replace(/_/g, '/')), c => c.charCodeAt(0)); const data = Uint8Array.from(atob(miiDataB64.replace(/-/g, '+').replace(/_/g, '/')), c => c.charCodeAt(0));
@ -60,6 +111,8 @@ window.loadHeader(async function(headerContainer) {
imgEl.src = getMiiRenderUrl(miiBlob); imgEl.src = getMiiRenderUrl(miiBlob);
imgEl.style.display = 'block'; imgEl.style.display = 'block';
} }
updateTwitterUI();
}; };
const getRankIcon = (rank, mode) => { const getRankIcon = (rank, mode) => {

50
stages/stages.js
View file

@ -19,6 +19,55 @@ window.loadHeader(async function(headerContainer) {
}); });
} }
const twitterBtn = document.getElementById('twitter-link-btn');
const twitterLabel = document.getElementById('twitter-label-img');
const handleTwitterAction = () => {
const isLinked = twitterBtn.dataset.linked === "true";
if (isLinked) {
if (!confirm("Unlink Twitter account?")) return;
fetch("/api/v1/me/twitter/unlink", { method: "POST", credentials: 'include' })
.then(() => window.location.reload());
} else {
twitterBtn.style.opacity = "0.5";
twitterBtn.style.pointerEvents = "none";
fetch("/api/v1/me/twitter/link", { credentials: 'include' })
.then(res => res.status === 401 ? (window.location.href = "/sign_in/") : res.json())
.then(data => data?.url ? (window.location.href = data.url) : window.location.reload())
.catch(() => window.location.reload());
}
};
if (twitterBtn) {
twitterBtn.addEventListener('click', handleTwitterAction);
}
const updateTwitterUI = () => {
if (!twitterBtn || !twitterLabel) return;
fetch("/api/v1/me/twitter/status", { credentials: 'include' })
.then(res => res.ok ? res.json() : null)
.then(data => {
if (data && data.is_linked) {
twitterBtn.dataset.linked = "true";
twitterLabel.src = "/assets/en/svg/text/menu/tx_twitter_Cancel-34186e4e830964405f2528210d7278206d255bf40b69559babc36a7a041e0394.svg";
twitterLabel.alt = "Unlink Twitter";
twitterLabel.style.scale = "1.6";
twitterLabel.style.marginLeft = "30px";
twitterLabel.style.translate = "-10px -2px";
} else {
twitterBtn.dataset.linked = "false";
twitterLabel.src = "/assets/en/svg/text/menu/tx_twitter-47ce083cc4514ab6aeb75b7dd9f71ce89ddc54a18d930d90cf4df62047413831.svg";
twitterLabel.alt = "Link Twitter";
twitterLabel.style.scale = "";
twitterLabel.style.marginLeft = "";
twitterLabel.style.translate = "";
}
})
.catch(() => {
twitterBtn.dataset.linked = "false";
});
};
const extractMiiName = (miiDataB64) => { const extractMiiName = (miiDataB64) => {
try { try {
const binaryString = atob(miiDataB64.replace(/-/g, '+').replace(/_/g, '/')); const binaryString = atob(miiDataB64.replace(/-/g, '+').replace(/_/g, '/'));
@ -63,6 +112,7 @@ window.loadHeader(async function(headerContainer) {
imgEl.src = `https://mii-unsecure.ariankordi.net/miis/image.png?data=${encodeURIComponent(miiBlob)}&type=face&width=270`; imgEl.src = `https://mii-unsecure.ariankordi.net/miis/image.png?data=${encodeURIComponent(miiBlob)}&type=face&width=270`;
imgEl.style.display = 'block'; imgEl.style.display = 'block';
} }
updateTwitterUI();
}; };
const init = async () => { const init = async () => {