forked from spacebar/SplatNet
Add log out support
This commit is contained in:
parent
82794e6f22
commit
ba0814eecd
9 changed files with 132 additions and 56 deletions
|
|
@ -4,6 +4,17 @@ fetch("../header.html")
|
|||
const headerContainer = document.getElementById("header-container");
|
||||
headerContainer.innerHTML = html;
|
||||
|
||||
const logoutForm = document.getElementById("logout-form");
|
||||
if (logoutForm && typeof CONFIG !== 'undefined') {
|
||||
const apiBase = CONFIG.API_BASE_URL.replace(/\/$/, "");
|
||||
logoutForm.action = apiBase + "/api/v1/spfn/logout";
|
||||
|
||||
const originInput = document.getElementById("logout_frontend_origin");
|
||||
if (originInput) {
|
||||
originInput.value = window.location.origin;
|
||||
}
|
||||
}
|
||||
|
||||
const friendButton = headerContainer.querySelector('.menu-item.equipment');
|
||||
if (friendButton) {
|
||||
friendButton.classList.add('active');
|
||||
|
|
|
|||
|
|
@ -6,6 +6,7 @@
|
|||
<link rel="icon" href="../favicon.ico" type="image/x-icon" />
|
||||
<link rel="stylesheet" href="styles.css" />\
|
||||
<script src="/assets/general.js"></script>
|
||||
<script src="/config.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="header-container"></div>
|
||||
|
|
|
|||
|
|
@ -4,6 +4,17 @@ fetch("../header.html")
|
|||
const headerContainer = document.getElementById("header-container");
|
||||
headerContainer.innerHTML = html;
|
||||
|
||||
const logoutForm = document.getElementById("logout-form");
|
||||
if (logoutForm && typeof CONFIG !== 'undefined') {
|
||||
const apiBase = CONFIG.API_BASE_URL.replace(/\/$/, "");
|
||||
logoutForm.action = apiBase + "/api/v1/spfn/logout";
|
||||
|
||||
const originInput = document.getElementById("logout_frontend_origin");
|
||||
if (originInput) {
|
||||
originInput.value = window.location.origin;
|
||||
}
|
||||
}
|
||||
|
||||
const friendButton = headerContainer.querySelector('.menu-item.friend');
|
||||
if (friendButton) {
|
||||
friendButton.classList.add('active');
|
||||
|
|
|
|||
|
|
@ -6,6 +6,7 @@
|
|||
<link rel="icon" href="../favicon.ico" type="image/x-icon" />
|
||||
<link rel="stylesheet" href="styles.css" />
|
||||
<script src="/assets/general.js"></script>
|
||||
<script src="/config.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="header-container"></div>
|
||||
|
|
|
|||
124
header.html
124
header.html
|
|
@ -1,73 +1,79 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="stylesheet" href="../style.css" />
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="stylesheet" href="../style.css" />
|
||||
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<aside class="splatnet-sidebar">
|
||||
<div class="splatnet-logo">
|
||||
<img src="../assets/en/ui/SplatNetLogo.png" alt="SplatNet">
|
||||
</div>
|
||||
|
||||
<a href="/friend_list/" class="menu-link">
|
||||
<div class="menu-item friend">
|
||||
<img class="bg default" src="../assets/en/ui/default.png">
|
||||
<img class="bg hover-state" src="../assets/en/ui/friendlist-selected.png">
|
||||
<img class="icon default" src="../assets/en/svg/ui/ico_friendlist-320cb666486606280b494d4d4427451b2de2c9ad01f3332c286433c6f536db0a.svg">
|
||||
<img class="icon hover-state" src="../assets/en/svg/ui/ico_friendlist_wht-032a1f27d7f1529f75f86f8976877a12ce0ec18496e84fcb249a510129aa337c.svg">
|
||||
<img class="label default" src="../assets/en/svg/text/menu/tx_friendlist-c96280213f50b1bc3c6380aa2bf191f6aaf4fd2da44a111bcbb1495444f23868.svg">
|
||||
<img class="label hover-state" src="../assets/en/svg/text/menu/tx_friendlist_wht-b805b3146503cef16e75964333f58c2934bc3b6b6e1cd6e21172c85706a4deda.svg">
|
||||
<div class="splatnet-logo">
|
||||
<img src="../assets/en/ui/SplatNetLogo.png" alt="SplatNet">
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<a href="/ranking/" class="menu-link">
|
||||
<div class="menu-item rank">
|
||||
<img class="bg default" src="../assets/en/ui/default.png">
|
||||
<img class="bg hover-state" src="../assets/en/ui/rank-selected.png">
|
||||
<img class="icon default" src="../assets/en/svg/ui/ico_ranking-c89e570ab4d08a764d285e453423188b1976895b3feacf031e3f231b1506b441.svg">
|
||||
<img class="icon hover-state" src="../assets/en/svg/ui/ico_ranking_wht-526d8e4da303f0c9e77ee41ea8422d265f41280e2ffc6ffa763b35d96f8e51f1.svg">
|
||||
<img class="label default" src="../assets/en/svg/text/menu/tx_ranking-8d97ac01b5b5c5b9244c8a4960bce79d33349175d141b06da0d835c71c8298e2.svg">
|
||||
<img class="label hover-state" src="../assets/en/svg/text/menu/tx_ranking_wht-6b4dcbc2bb6f0d50c8e6180ec1da935b54c3b0cc761dd7700b26c7bd1b5ac9d4.svg">
|
||||
<a href="/friend_list/" class="menu-link">
|
||||
<div class="menu-item friend">
|
||||
<img class="bg default" src="../assets/en/ui/default.png">
|
||||
<img class="bg hover-state" src="../assets/en/ui/friendlist-selected.png">
|
||||
<img class="icon default" src="../assets/en/svg/ui/ico_friendlist-320cb666486606280b494d4d4427451b2de2c9ad01f3332c286433c6f536db0a.svg">
|
||||
<img class="icon hover-state" src="../assets/en/svg/ui/ico_friendlist_wht-032a1f27d7f1529f75f86f8976877a12ce0ec18496e84fcb249a510129aa337c.svg">
|
||||
<img class="label default" src="../assets/en/svg/text/menu/tx_friendlist-c96280213f50b1bc3c6380aa2bf191f6aaf4fd2da44a111bcbb1495444f23868.svg">
|
||||
<img class="label hover-state" src="../assets/en/svg/text/menu/tx_friendlist_wht-b805b3146503cef16e75964333f58c2934bc3b6b6e1cd6e21172c85706a4deda.svg">
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<a href="/ranking/" class="menu-link">
|
||||
<div class="menu-item rank">
|
||||
<img class="bg default" src="../assets/en/ui/default.png">
|
||||
<img class="bg hover-state" src="../assets/en/ui/rank-selected.png">
|
||||
<img class="icon default" src="../assets/en/svg/ui/ico_ranking-c89e570ab4d08a764d285e453423188b1976895b3feacf031e3f231b1506b441.svg">
|
||||
<img class="icon hover-state" src="../assets/en/svg/ui/ico_ranking_wht-526d8e4da303f0c9e77ee41ea8422d265f41280e2ffc6ffa763b35d96f8e51f1.svg">
|
||||
<img class="label default" src="../assets/en/svg/text/menu/tx_ranking-8d97ac01b5b5c5b9244c8a4960bce79d33349175d141b06da0d835c71c8298e2.svg">
|
||||
<img class="label hover-state" src="../assets/en/svg/text/menu/tx_ranking_wht-6b4dcbc2bb6f0d50c8e6180ec1da935b54c3b0cc761dd7700b26c7bd1b5ac9d4.svg">
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<a href="/equipment/" class="menu-link">
|
||||
<div class="menu-item equipment">
|
||||
<img class="bg default" src="../assets/en/ui/default.png">
|
||||
<img class="bg hover-state" src="../assets/en/ui/equipment-selected.png">
|
||||
<img class="icon default" src="../assets/en/svg/ui/ico_equipment-40943361040a3d62c745a21d1a1fa95794c851f378e11334f2dc6c1cc81b4984.svg">
|
||||
<img class="icon hover-state" src="../assets/en/svg/ui/ico_equipment_wht-a9d551da5fa6a6792cb2bf8aca2938a107a983a13aef9f4fd020493e6412435e.svg">
|
||||
<img class="label default" src="../assets/en/svg/text/menu/tx_equipment-8d59c4296bdafb1746824229dc9300ef6b140d4bda0bb0284a662903f20afe45.svg">
|
||||
<img class="label hover-state" src="../assets/en/svg/text/menu/tx_equipment_wht-940f9bdfe17d321ac6bc737021f1b837ccace05cf0a14e24315e2a39d3d52a3e.svg">
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<a href="/stages/" class="menu-link">
|
||||
<div class="menu-item stage">
|
||||
<img class="bg default" src="../assets/en/ui/default.png">
|
||||
<img class="bg hover-state" src="../assets/en/ui/stage-selected.png">
|
||||
<img class="icon default" src="../assets/en/svg/ui/ico_stage-8dbc9e30d2dd9f99f4d1678fe53c4aaada7f7ff43929880a0c9f4e49f148f540.svg">
|
||||
<img class="icon hover-state" src="../assets/en/svg/ui/ico_stage_wht-0093ccdcb4a0985c929e77571e4baf690f39def2f97b84a4cb4109e4a4ae10b4.svg">
|
||||
<img class="label default" src="../assets/en/svg/text/menu/tx_stageinfo-5e7f00d4a18387e2ee3065e97a475e23002554c3facc1dc6816cdb157c5985c4.svg">
|
||||
<img class="label hover-state" src="../assets/en/svg/text/menu/tx_stageinfo_wht-5fa41cd0a2c7e72f93cb7ec6821d01af7f5d05e91b9dc16b002197e69fdf9440.svg">
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<div class="twitterbgbox">
|
||||
<div class="button-container">
|
||||
<button class="box-btn twitter-btn">
|
||||
<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">
|
||||
</button>
|
||||
|
||||
<form id="logout-form" method="POST" style="display: contents;" accept-charset="UTF-8">
|
||||
<input type="hidden" name="frontend_origin" id="logout_frontend_origin">
|
||||
<button type="submit" class="box-btn">
|
||||
<img src="../assets/en/svg/text/menu/tx_logout-a35c74ff79b585667ae273fd9477f07a9d07c7fce8f5ef24f8f8f43988b5afcb.svg" class="btn-label-img" alt="Log Out">
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<a href="/equipment/" class="menu-link">
|
||||
<div class="menu-item equipment">
|
||||
<img class="bg default" src="../assets/en/ui/default.png">
|
||||
<img class="bg hover-state" src="../assets/en/ui/equipment-selected.png">
|
||||
<img class="icon default" src="../assets/en/svg/ui/ico_equipment-40943361040a3d62c745a21d1a1fa95794c851f378e11334f2dc6c1cc81b4984.svg">
|
||||
<img class="icon hover-state" src="../assets/en/svg/ui/ico_equipment_wht-a9d551da5fa6a6792cb2bf8aca2938a107a983a13aef9f4fd020493e6412435e.svg">
|
||||
<img class="label default" src="../assets/en/svg/text/menu/tx_equipment-8d59c4296bdafb1746824229dc9300ef6b140d4bda0bb0284a662903f20afe45.svg">
|
||||
<img class="label hover-state" src="../assets/en/svg/text/menu/tx_equipment_wht-940f9bdfe17d321ac6bc737021f1b837ccace05cf0a14e24315e2a39d3d52a3e.svg">
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<a href="/stages/" class="menu-link">
|
||||
<div class="menu-item stage">
|
||||
<img class="bg default" src="../assets/en/ui/default.png">
|
||||
<img class="bg hover-state" src="../assets/en/ui/stage-selected.png">
|
||||
<img class="icon default" src="../assets/en/svg/ui/ico_stage-8dbc9e30d2dd9f99f4d1678fe53c4aaada7f7ff43929880a0c9f4e49f148f540.svg">
|
||||
<img class="icon hover-state" src="../assets/en/svg/ui/ico_stage_wht-0093ccdcb4a0985c929e77571e4baf690f39def2f97b84a4cb4109e4a4ae10b4.svg">
|
||||
<img class="label default" src="../assets/en/svg/text/menu/tx_stageinfo-5e7f00d4a18387e2ee3065e97a475e23002554c3facc1dc6816cdb157c5985c4.svg">
|
||||
<img class="label hover-state" src="../assets/en/svg/text/menu/tx_stageinfo_wht-5fa41cd0a2c7e72f93cb7ec6821d01af7f5d05e91b9dc16b002197e69fdf9440.svg">
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<div class="twitterbgbox">
|
||||
<div class="button-container">
|
||||
<button class="box-btn twitter-btn">
|
||||
<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">
|
||||
</button>
|
||||
|
||||
<button class="box-btn">
|
||||
<img src="../assets/en/svg/text/menu/tx_logout-a35c74ff79b585667ae273fd9477f07a9d07c7fce8f5ef24f8f8f43988b5afcb.svg" class="btn-label-img" alt="Log Out">
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<script src="config.js"></script>
|
||||
<script src="logout.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
21
logout.js
Normal file
21
logout.js
Normal file
|
|
@ -0,0 +1,21 @@
|
|||
$(document).ready(function () {
|
||||
const form = $("#logout-form");
|
||||
if (typeof CONFIG === 'undefined') {
|
||||
alert("CRITICAL ERROR: config.js not loaded before logout.js");
|
||||
return;
|
||||
}
|
||||
|
||||
const apiBase = CONFIG.API_BASE_URL;
|
||||
const targetAction = apiBase.replace(/\/$/, "") + "/spfn/logout";
|
||||
$("#logout_frontend_origin").val(window.location.origin);
|
||||
form.attr("action", targetAction);
|
||||
|
||||
console.log("Form action set to: " + targetAction);
|
||||
|
||||
form.submit(function(e) {
|
||||
alert("Submitting to: " + $(this).attr("action"));
|
||||
|
||||
const submitBtn = $(":submit", this);
|
||||
submitBtn.prop("disabled", true).css("opacity", "0.5");
|
||||
});
|
||||
});
|
||||
|
|
@ -6,6 +6,7 @@
|
|||
<link rel="icon" href="../favicon.ico" type="image/x-icon" />
|
||||
<link rel="stylesheet" href="styles.css" />
|
||||
<script src="/assets/general.js"></script>
|
||||
<script src="/config.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="header-container"></div>
|
||||
|
|
|
|||
|
|
@ -4,6 +4,17 @@ fetch("../header.html")
|
|||
const headerContainer = document.getElementById("header-container");
|
||||
headerContainer.innerHTML = html;
|
||||
|
||||
const logoutForm = document.getElementById("logout-form");
|
||||
if (logoutForm && typeof CONFIG !== 'undefined') {
|
||||
const apiBase = CONFIG.API_BASE_URL.replace(/\/$/, "");
|
||||
logoutForm.action = apiBase + "/api/v1/spfn/logout";
|
||||
|
||||
const originInput = document.getElementById("logout_frontend_origin");
|
||||
if (originInput) {
|
||||
originInput.value = window.location.origin;
|
||||
}
|
||||
}
|
||||
|
||||
const friendButton = headerContainer.querySelector('.menu-item.rank');
|
||||
if (friendButton) {
|
||||
friendButton.classList.add('active');
|
||||
|
|
|
|||
|
|
@ -6,6 +6,7 @@
|
|||
<link rel="icon" href="../favicon.ico" type="image/x-icon" />
|
||||
<link rel="stylesheet" href="styles.css" />
|
||||
<script src="/assets/general.js"></script>
|
||||
<script src="/config.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
|
@ -40,12 +41,24 @@
|
|||
</div>
|
||||
|
||||
</div>
|
||||
<script>
|
||||
<script>
|
||||
const headerBox = document.getElementById("header-container");
|
||||
fetch("../header.html")
|
||||
.then(res => res.text())
|
||||
.then(html => {
|
||||
headerBox.innerHTML = html;
|
||||
|
||||
const logoutForm = document.getElementById("logout-form");
|
||||
if (logoutForm && typeof CONFIG !== 'undefined') {
|
||||
const apiBase = CONFIG.API_BASE_URL.replace(/\/$/, "");
|
||||
logoutForm.action = apiBase + "/api/v1/spfn/logout";
|
||||
|
||||
const originInput = document.getElementById("logout_frontend_origin");
|
||||
if (originInput) {
|
||||
originInput.value = window.location.origin;
|
||||
}
|
||||
}
|
||||
|
||||
const friendButton = headerBox.querySelector('.menu-item.stage');
|
||||
if (friendButton) {
|
||||
friendButton.classList.add('active');
|
||||
|
|
|
|||
Loading…
Reference in a new issue