Browse Source

Add player page

master
NGnius 4 years ago
parent
commit
2dbdfe6161
4 changed files with 170 additions and 4 deletions
  1. +11
    -4
      site/board/board.js
  2. +40
    -0
      site/board/player.html
  3. +79
    -0
      site/board/player.js
  4. +40
    -0
      site/static/style.css

+ 11
- 4
site/board/board.js View File

@@ -1,9 +1,11 @@
let load_url = "https://exmods.org/load?board=test1&count=10&start=0";
let load_url = "https://exmods.org/load?board=main-test&count=10&start=0";
let test_url = "http://localhost:1337/load?board=main-test&count=15&start=0";
//load_url = test_url // testing only

function build_board() {
let leaderboard = document.getElementById("leaderboard")
let leaderboard_container = document.getElementById("leaderboard-container")
let tmpEntry = {ID: -42, Rank:"?", PlayerURL: "#", PlayerName: "Loading...", Score:">9000"}
let tmpEntry = {ID: -42, Rank:"?", PlayerURL: "", PlayerName: "Loading...", Score:">9000"}
let errEntry = build_entry(tmpEntry)
leaderboard.appendChild(errEntry)
setTimeout(() => {document.getElementById("nameAnchor-42").innerText = "Something went wrong :(";}, 5000) // 5s
@@ -38,14 +40,19 @@ function build_entry(entry) {
rankEntry.innerText = entry.Rank
rankEntry.classList.add("board-rank")
newEntry.appendChild(rankEntry)
// name
// name and url
let nameElem = document.createElement("span")
nameElem.setAttribute("id", "name"+entry.ID)
nameElem.classList.add("board-name")
let nameAElem = document.createElement("a")
nameAElem.setAttribute("id", "nameAnchor"+entry.ID)
nameAElem.classList.add("board-name-a")
nameAElem.href = entry.PlayerURL
let splitUrl = entry.PlayerURL.split("?")
if (load_url === test_url) {
nameAElem.href = "../board"+splitUrl[0]+".html?"+splitUrl.slice(1).join("?")
} else {
nameAElem.href = "/board"+splitUrl[0]+".html?"+splitUrl.slice(1).join("?")
}
nameAElem.innerText = entry.PlayerName
nameElem.appendChild(nameAElem)
newEntry.appendChild(nameElem)


+ 40
- 0
site/board/player.html View File

@@ -0,0 +1,40 @@
<!DOCTYPE html>

<html lang="en">
<head>
<meta name="theme-color" content="#20c420" />
<meta name="author" content="Exmods community" />
<meta name="keywords" content="exmods,gamecraft,modding,mod" />
<meta name="og:type" content="website" />
<meta name="og:title" content="Exmods" />
<meta name="og:description" content="Gamecraft modding website" />
<meta name="description" content="Gamecraft modding website" />
<meta name="og:image" content="../static/favicon.png" />
<meta name="og:url" content="https://www.exmods.org" />
<meta charset="UTF-8" />
<link rel="icon" href="../static/favicon.png" type="image/x-icon"/>
<link rel="shortcut icon" href="../static/favicon.png" type="image/x-icon"/>
<link rel="stylesheet" href="../static/style.css" type="text/css" />
<title>Exmods</title>
<script src="player.js"></script>
</head>
<body onload="build_player()">
<h1>Player</h1>
<div id="player-container" class="player-container">
<div id="player" class="player">
<span class="player-avatar" id="player-avatar"><img src="../static/favicon.png" /><!-- TODO --></span>
<span class="player-name" id="player-name"><a href="#" id="player-link"></a></span>
</div>
</div>
<h2>Recent activity</h2>
<div id="leaderboard-container" class="board-container">
<div id="leaderboard" class="board">
<div id="entry0" class="board-entry">
<span id="rank0" class="board-rank board-header">Rank</span>
<span id="name0" class="board-name board-header">Board</span>
<span id="score0" class="board-score board-header">Score</span>
</div>
</div>
</div>
</body>
</html>

+ 79
- 0
site/board/player.js View File

@@ -0,0 +1,79 @@
let load_url = "https://exmods.org/player"
let test_url = "http://localhost:1337/player"
//load_url = test_url // testing only

function build_player() {
// build
let player = document.getElementById("player-name")
let player_link = document.getElementById("player-link")
let leaderboard = document.getElementById("leaderboard")
let leaderboard_container = document.getElementById("leaderboard-container")
let tmpEntry = {ID: -42, Rank:"?", BoardURL: "", BoardName:"Loading...", PlayerURL: "", PlayerName: "Loading...", Score:">9000"}
let errEntry = build_entry(tmpEntry)
leaderboard.appendChild(errEntry)
let gen_url = load_url+"?"+window.location.href.split("?").slice(1).join("?")+"&entries=10"
setTimeout(() => {document.getElementById("nameAnchor-42").innerText = "Something went wrong :(";}, 5000) // 5s
fetch(gen_url).then(
(response) => {
if (!response.ok || (response.status) != 200) {
document.getElementById("nameAnchor-42").innerText = "Something went wrong :("
return
}
errEntry.style.display = "none"
response.json().then(
(result) => {
if (result.Items.length!=1) {
document.getElementById("nameAnchor-42").innerText = "Something went wrong :("
return
}
errEntry.style.display = "none"
leaderboard.removeChild(errEntry)
// build player
player_link.innerText = result.Items[0].Name
player_link.href = ""// TODO use result.Items[0].Url
// build leaderboard
for (entry of result.Items[0].Entries) {
let newEntry = build_entry(entry)
// end
leaderboard.appendChild(newEntry)
}
}
)
}
)
}

function build_entry(entry) {
let newEntry = document.createElement("div")
newEntry.setAttribute("id", "entry"+entry.ID)
newEntry.classList.add("board-entry")
// rank
let rankEntry = document.createElement("span")
rankEntry.setAttribute("id", "rank"+entry.ID)
rankEntry.innerText = entry.Rank
rankEntry.classList.add("board-rank")
newEntry.appendChild(rankEntry)
// name and url
let nameElem = document.createElement("span")
nameElem.setAttribute("id", "name"+entry.ID)
nameElem.classList.add("board-name")
let nameAElem = document.createElement("a")
nameAElem.setAttribute("id", "nameAnchor"+entry.ID)
nameAElem.classList.add("board-name-a")
let splitUrl = entry.BoardURL.split("?")
if (load_url === test_url) {
nameAElem.href = "../board/"+splitUrl[0]+".html?"+splitUrl.slice(1).join("?")
} else {
nameAElem.href = "/board/"+splitUrl[0]+".html?"+splitUrl.slice(1).join("?")
}
nameAElem.innerText = entry.BoardName
nameElem.appendChild(nameAElem)
newEntry.appendChild(nameElem)
// score
let scoreElem = document.createElement("span")
scoreElem.setAttribute("id", "score"+entry.ID)
scoreElem.classList.add("board-score")
scoreElem.innerText = entry.Score
newEntry.appendChild(scoreElem)
return newEntry
}

+ 40
- 0
site/static/style.css View File

@@ -112,3 +112,43 @@ span {
font-size: 150%;
color: #112211;
}

/* player style */
.player {
font-size: 200%;
background-color: #e0e0e0;
color: #111111;
width: 100%;
}

.player-container {
width: 99%;
text-align: left;
border: 5px;
border-style: solid;
border-color: #505050;
}

.player-name {
width: 75%;
font-size: 300%;
padding-left: 1%;
padding-right: 1%;
overflow: hidden;
vertical-align: middle;
}

.player-link {
width: 100%;
}

.player-avatar {
width: 20%;
text-align: center;
margin: 0.5%;
border-style: solid;
border-color: #505050;
border: 5px;
border-right: 5px;
vertical-align: middle;
}

Loading…
Cancel
Save