diff options
Diffstat (limited to 'public/js')
| -rw-r--r-- | public/js/api.js | 12 | ||||
| -rw-r--r-- | public/js/people.js | 15 | ||||
| -rw-r--r-- | public/js/profile.js | 139 |
3 files changed, 127 insertions, 39 deletions
diff --git a/public/js/api.js b/public/js/api.js index 176ae59..5a55460 100644 --- a/public/js/api.js +++ b/public/js/api.js @@ -79,6 +79,18 @@ export const loadself = async () => { return await request("/users/self", {}) } +export const follow = async (state, user_id) => { + return await request('/users/follow', {state, user_id}, 'PUT') +} + +export const follow_status = async (user_id) => { + return await request('/users/follow', {user_id}) +} + +export const friends = async (user_id) => { + return await request('/users/friends', {user_id}) +} + export const postcomment = async (post_id, content) => { return await request('/posts/comment', {post_id, content}, 'PATCH') } diff --git a/public/js/people.js b/public/js/people.js index 0a97e93..99890d9 100644 --- a/public/js/people.js +++ b/public/js/people.js @@ -34,22 +34,7 @@ const data = { } async function load() { - let request = await loadself() - if (request.status === 429) { - let new_body = - body({}, - ...header(false, true) - ) - - document.body.replaceWith(new_body) - throw new Error("Rate limited"); - } - - - const self = request.json - - header(false, true, self.user_id) const users = (await loaduserspage(page)).json if (users.length === 0) { diff --git a/public/js/profile.js b/public/js/profile.js index dd5216d..4e4f44f 100644 --- a/public/js/profile.js +++ b/public/js/profile.js @@ -1,31 +1,55 @@ import { div, pfp, banner, parse, button, body, a, span, crawl, parseDate, parseMonth } from './main.js' -import { loadself, loadusers, loadusersposts, updateavatar, updatebanner, logout } from './api.js' -import { parsePost, header } from './components.js' +import { loadself, loadusers, loadusersposts, updateavatar, updatebanner, logout, follow, follow_status, friends } from './api.js' +import { parsePost, parseUser, header } from './components.js' -function swap(value) { - let postsb = document.getElementById("profilepostbutton"); - let aboutb = document.getElementById("profileaboutbutton"); - let posts = document.getElementById("posts"); - let about = document.getElementById("about"); - let load = document.getElementsByClassName("loadp")[0]; +function swap(tab) { + let post_button = document.querySelector("#profilepostbutton"); + let about_button = document.querySelector("#profileaboutbutton"); + let friends_button = document.querySelector("#profilefriendsbutton"); - if (value) { + let posts_section = document.querySelector("#posts"); + let about_section = document.querySelector("#about"); + let friends_section = document.querySelector("#friends"); + + let load = document.querySelector(".loadp"); + + if (tab === 0) { - postsb.classList.add("selected") - aboutb.classList.remove("selected") - about.classList.add("hidden") - posts.classList.remove("hidden") + post_button.classList.add("selected") + about_button.classList.remove("selected") + friends_button.classList.remove("selected") + + posts_section.classList.remove("hidden") + about_section.classList.add("hidden") + friends_section.classList.add("hidden") if (load) { load.classList.remove("hidden") } - } else { + } else if (tab === 1) { - postsb.classList.remove("selected") - aboutb.classList.add("selected") - about.classList.remove("hidden") - posts.classList.add("hidden") + post_button.classList.remove("selected") + about_button.classList.add("selected") + friends_button.classList.remove("selected") + + posts_section.classList.add("hidden") + about_section.classList.remove("hidden") + friends_section.classList.add("hidden") + + if (load) { + load.classList.add("hidden") + } + + } else if (tab === 2) { + + post_button.classList.remove("selected") + about_button.classList.remove("selected") + friends_button.classList.add("selected") + + posts_section.classList.add("hidden") + about_section.classList.add("hidden") + friends_section.classList.remove("hidden") if (load) { load.classList.add("hidden") @@ -67,9 +91,37 @@ function changeimage(fn) { input.click(); } -function render() { +function status_text(status) { + switch (status) { + case 1: + return 'Following ✓' + case 2: + return 'Follow Back' + case 3: + return 'Friends ✓' + default: + return 'Follow' + } +} + +async function render() { - let new_body = + let status; + if (!isself) { + let response = await follow_status(data.user.user_id) + if (response.status == 200) { + status = parseInt(response.msg) + } else { + status = 0; + } + } + + let friends_arr = (await friends(data.user.user_id)).json + if (friends_arr == undefined) { + friends_arr = [] + } + + let new_body = body({}, ...header(false, false, data.self.user_id), div({id: 'top'}, @@ -91,16 +143,53 @@ function render() { span({class: 'gtext'}, parse('Joined ' + parseDate(new Date(data.user.date))) ) + ), + !isself ? + div({class: 'right'}, + div({class: `follow ${status == 3 ? 'friend' : ''}`, onclick: async (event) => { + let button = event.target + if (button.tagName == 'SPAN') { + button = button.parentElement + } + + let response + if (status % 2 == 0) { + response = await follow(true, data.user.user_id); + } else { + response = await follow(false, data.user.user_id); + } + + if (response.status == 200) { + status = parseInt(response.msg) + } else { + return + } + + button.firstChild.innerHTML = status_text(status) + if (status == 3) { + button.classList.add('friend') + } else { + button.classList.remove('friend') + } + }}, + span({class: 'gtext'}, + parse(status_text(status)) + ) + ) ) + : parse('') ), div({class: 'fullline', style: 'width: 80em; margin-bottom: 0; z-index: 0;'}), div({class: 'profilebuttons'}, - button({id: 'profilepostbutton', class: 'selected', onclick: () => swap(true)}, + button({id: 'profilepostbutton', class: 'selected', onclick: () => swap(0)}, parse('Posts') ), - button({id: 'profileaboutbutton', onclick: () => swap(false)}, + button({id: 'profileaboutbutton', onclick: () => swap(1)}, parse('About') ), + button({id: 'profilefriendsbutton', onclick: () => swap(2)}, + parse('Friends') + ), div({style: 'flex: 20'}), isself ? button({class: 'logout', onclick: async () => { const response = await logout() @@ -154,6 +243,9 @@ function render() { ) ) ), + div({id: 'friends', class: 'hidden'}, + ...friends_arr.map(u => parseUser(u)) + ), div({id: 'popup', class: 'hidden'}, div({class: 'createpost'}, div({class: 'close', onclick: () => document.getElementById('popup').classList.add('hidden')}), @@ -207,7 +299,6 @@ async function load(id) { if (el) { el.remove() } - return [] } else { page++ } @@ -269,7 +360,7 @@ async function init() { const posts = await load(id) data.posts.push(... posts) - + data.user = data.users[id] render() |