xssbook/public/js/profile.js
2023-01-29 00:35:06 -05:00

126 lines
No EOL
3.8 KiB
JavaScript

function swap(value) {
let postsb = document.getElementById("profilepostbutton");
let aboutb = document.getElementById("profileaboutbutton");
let posts = document.getElementById("posts");
let about = document.getElementById("about");
if (value) {
postsb.classList.add("selected")
aboutb.classList.remove("selected")
about.classList.add("hidden")
posts.classList.remove("hidden")
} else {
postsb.classList.remove("selected")
aboutb.classList.add("selected")
about.classList.remove("hidden")
posts.classList.add("hidden")
}
}
function render() {
const html = `
<div id="top">
<div id="banner">
<div>
</div>
</div>
<div id="info">
<div class="face">
</div>
<div class="infodata">
<span class="bold ltext">${data.user.firstname + ' ' + data.user.lastname}</span>
<span class="gtext">Joined ${parseDate(new Date(data.user.date))}</span>
</div>
</div>
<div class="fullline" style="width: 80em; margin-bottom: 0;"></div>
<div class="profilebuttons">
<button id="profilepostbutton" class="${posts ? 'selected' : ''}" onclick="swap(true)">
Posts
</button>
<button id="profileaboutbutton" class="${posts ? '' : 'selected'}" onclick="swap(false)">
About
</button>
<div style="flex: 20"></div>
${ isself ? `<button class="logout" onclick="logout_button()">Logout</button>` : ''}
</div>
</div>
`
append(html)
const postsh = `
<div id="posts" class="${posts ? '' : 'hidden'}">
${data.posts.map(p => parsePost(p)).join('')}
</div>
`
append(postsh)
const about = `
<div id="about" class="post ${posts ? 'hidden' : ''}">
<span class="bold ltext">About</span>
<div class="data">
<span class="gtext bold">Name: ${data.user.firstname + ' ' + data.user.lastname}</span>
<span class="gtext bold">Email: ${data.user.email}</span>
<span class="gtext bold">Gender: ${data.user.gender}</span>
<span class="gtext bold">Birthday: ${parseMonth(data.user.month) + ' ' + data.user.day + ', ' + data.user.year}</span>
<span class="gtext bold">User ID: ${data.user.user_id}</span>
</div>
</div>
`
append(about)
}
async function logout_button() {
const response = await logout()
if (response.status != 200) return;
location.href = '/login'
}
var posts = true
var isself = false
async function load() {
header(false, false)
var params = {};
for (const [key, value] of new URLSearchParams(location.search)) {
params[key] = value
}
data.user = (await loadself()).json;
data.users[data.user.user_id] = data.user
let id;
if (params.id !== undefined && !isNaN(params.id)) {
id = parseInt(params.id);
} else {
id = data.user.user_id
}
isself = id === data.user.user_id
const posts = (await loadusersposts(id)).json
data.posts.push(... posts)
const batch = []
for (const post of posts) {
for(const comment of post.comments) {
if (data.users[comment[0]] !== undefined) continue
if (batch.includes(comment[0])) continue
batch.push(comment[0])
}
if (data.users[post.user_id] !== undefined) continue
if (batch.includes(post.user_id)) continue
batch.push(post.user_id)
}
const users = batch.length == 0 ? [] : (await loadusers(batch)).json
for (const user of users) {
data.users[user.user_id] = user
}
render()
}
load()