mirror of
https://github.com/ION606/bluesky-client.git
synced 2026-05-14 21:26:54 +00:00
added additional tags to user profile
This commit is contained in:
@@ -1,42 +0,0 @@
|
||||
async function renderLikes(data, ipcRenderer) {
|
||||
let container;
|
||||
/** @type {Map<String, Element>} */
|
||||
let a;
|
||||
if (document.querySelector('#likescontainer')) {
|
||||
container = document.querySelector('#likescontainer');
|
||||
a = new Map(Array.from(container.querySelectorAll('.post-card')).map(o => ([o.dataset.bskyid, o])));
|
||||
}
|
||||
else {
|
||||
container = document.createElement('div');
|
||||
container.classList.add('cards-container');
|
||||
container.id = 'likescontainer';
|
||||
a = new Map();
|
||||
}
|
||||
|
||||
// setupWorker();
|
||||
// renderLikesFeed(posts.map(p => (p?.reply?.root?.uri || p.post.uri)?.trim()), likes, ipcRenderer);
|
||||
|
||||
for (const post of data) renderPostSingle(post, a, likes.map(o => ({ posturi: o.post.uri, likeuri: o.post.viewer?.like })), ipcRenderer, container);
|
||||
|
||||
const postids = Array.from(document.querySelectorAll('[data-like-bskyid]')).map(o => o.dataset.bskyid);
|
||||
console.log(postids);
|
||||
|
||||
// "force" garbage collection
|
||||
// delete a;
|
||||
a.clear();
|
||||
a = null;
|
||||
|
||||
// append container to the document body or a specific section
|
||||
const postdiv = document.querySelector('#posts');
|
||||
postdiv.querySelector('.placeholder')?.remove();
|
||||
if (!document.querySelector('#likescontainer')) {
|
||||
postdiv.appendChild(container);
|
||||
document.addEventListener('click', (e) => {
|
||||
if (e.target.tagName === "VIDEO") zoomvid(e);
|
||||
else if (e.target.tagName === "IMG" || e.target.classList.contains('overlay')) zoomimg(e);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
module.exports = renderLikes;
|
||||
+60
-6
@@ -559,6 +559,47 @@ function renderPostSingle(post, a, likes, ipcRenderer, container, idkey = 'bskyi
|
||||
}
|
||||
}
|
||||
|
||||
if (post.post.embed && post.post.embed.$type === 'app.bsky.embed.external#view') {
|
||||
const embedContainer = document.createElement('div'),
|
||||
embed = post.post.embed.external;
|
||||
|
||||
embedContainer.classList.add('external-embed-container');
|
||||
|
||||
// thumbnail (if exists)
|
||||
if (embed.thumb) {
|
||||
const thumbnail = document.createElement('img');
|
||||
thumbnail.classList.add('external-embed-thumb');
|
||||
thumbnail.src = embed.thumb;
|
||||
thumbnail.alt = `${embed.title} thumbnail`;
|
||||
embedContainer.appendChild(thumbnail);
|
||||
}
|
||||
|
||||
// title
|
||||
const titleElement = document.createElement('h3');
|
||||
titleElement.classList.add('external-embed-title');
|
||||
titleElement.textContent = embed.title;
|
||||
|
||||
// description
|
||||
const descriptionElement = document.createElement('p');
|
||||
descriptionElement.classList.add('external-embed-description');
|
||||
descriptionElement.textContent = embed.description;
|
||||
|
||||
// link
|
||||
const linkElement = document.createElement('a');
|
||||
linkElement.classList.add('external-embed-link');
|
||||
linkElement.href = embed.uri;
|
||||
linkElement.target = '_blank'; // opens in a new tab
|
||||
linkElement.rel = 'noopener noreferrer'; // improves security
|
||||
linkElement.textContent = 'Visit';
|
||||
|
||||
// append elements to the container
|
||||
embedContainer.appendChild(titleElement);
|
||||
embedContainer.appendChild(descriptionElement);
|
||||
embedContainer.appendChild(linkElement);
|
||||
|
||||
card.appendChild(embedContainer);
|
||||
}
|
||||
|
||||
// interaction counts
|
||||
if (!card.querySelector('.interaction-counts')) {
|
||||
const counts = document.createElement('div');
|
||||
@@ -585,7 +626,6 @@ function renderPostSingle(post, a, likes, ipcRenderer, container, idkey = 'bskyi
|
||||
* @param {*} ipcRenderer
|
||||
*/
|
||||
module.exports = function renderPosts(posts, likes, pinnedPost, ipcRenderer, idkey = 'bskyid', containerid = 'posts') {
|
||||
console.log(`${idkey}, ${containerid}container, ${posts.length}`);
|
||||
let container;
|
||||
/** @type {Map<String, Element>} */
|
||||
let a;
|
||||
@@ -596,14 +636,26 @@ module.exports = function renderPosts(posts, likes, pinnedPost, ipcRenderer, idk
|
||||
else {
|
||||
container = document.createElement('div');
|
||||
container.classList.add('cards-container');
|
||||
container.id = containerid;
|
||||
container.id = `${containerid}container`;
|
||||
a = new Map();
|
||||
}
|
||||
|
||||
// setupWorker();
|
||||
// renderLikesFeed(posts.map(p => (p?.reply?.root?.uri || p.post.uri)?.trim()), likes, ipcRenderer);
|
||||
|
||||
for (const post of posts) renderPostSingle(post, a, likes.map(o => ({ posturi: o.post.uri, likeuri: o.post.viewer?.like })), ipcRenderer, container, idkey, containerid);
|
||||
for (const post of posts) {
|
||||
try {
|
||||
renderPostSingle(
|
||||
post,
|
||||
a,
|
||||
likes.map(o => ({ posturi: o.post.uri, likeuri: o.post.viewer?.like })),
|
||||
ipcRenderer,
|
||||
container,
|
||||
idkey,
|
||||
containerid
|
||||
);
|
||||
}
|
||||
catch (err) {
|
||||
console.error(err);
|
||||
}
|
||||
}
|
||||
|
||||
const postids = Array.from(document.querySelectorAll(`[data-${idkey}]`)).map(o => o.dataset[`${idkey} `]);
|
||||
console.log(postids);
|
||||
@@ -614,6 +666,8 @@ module.exports = function renderPosts(posts, likes, pinnedPost, ipcRenderer, idk
|
||||
a = null;
|
||||
|
||||
if (pinnedPost) {
|
||||
console.log("PINNED", posts.find(p => p.post.uri === pinnedPost.uri));
|
||||
|
||||
const pinnedcard = container.querySelector(`[data-${idkey}="${pinnedPost.uri}"]`);
|
||||
if (pinnedcard) {
|
||||
const pinnedLabel = document.createElement('div');
|
||||
|
||||
+1
-3
@@ -86,12 +86,10 @@ function createPostPreview(post, isParent = false) {
|
||||
}
|
||||
|
||||
|
||||
module.exports = function renderReplies(replyObj) {
|
||||
module.exports = function renderReplies({ cursor, replies }) {
|
||||
const repliesContainer = document.querySelector('#replies');
|
||||
repliesContainer.querySelector('.placeholder')?.remove();
|
||||
|
||||
const { cursor, replies } = replyObj;
|
||||
|
||||
if (cursor) sessionStorage.setItem('repliescursor', cursor);
|
||||
else sessionStorage.removeItem('repliescursor');
|
||||
|
||||
|
||||
+62
-13
@@ -1,12 +1,27 @@
|
||||
document.addEventListener('scroll', () => bottomscrolled(document.querySelector('#posts')));
|
||||
async function bottomscrolled(targetDiv) {
|
||||
document.addEventListener('scroll', bottomscrolled);
|
||||
async function bottomscrolled(e) {
|
||||
const scrollPosition = window.scrollY + window.innerHeight,
|
||||
pageHeight = document.documentElement.scrollHeight,
|
||||
atbottom = (scrollPosition >= pageHeight);
|
||||
|
||||
if (!atbottom) return;
|
||||
|
||||
window.electronAPI.getnewposts();
|
||||
// get the current div
|
||||
const targetDiv = document.querySelector('.content.active')
|
||||
|
||||
switch (targetDiv.id) {
|
||||
case 'posts': window.electronAPI.getnewposts();
|
||||
break;
|
||||
case 'replies': window.electronAPI.getReplies()
|
||||
break;
|
||||
case 'likes': window.electronAPI.getnewlikes();
|
||||
break;
|
||||
case 'media':
|
||||
window.electronAPI.getnewmedia();
|
||||
break;
|
||||
|
||||
default: console.log(`unknown scroll div ID ${targetDiv.id}`);
|
||||
}
|
||||
}
|
||||
|
||||
// function to toggle the active section
|
||||
@@ -24,16 +39,55 @@ function showSection(sectionId) {
|
||||
// show the selected section and activate the button
|
||||
document.getElementById(sectionId).classList.add('active');
|
||||
document.getElementById(sectionId + 'Btn').classList.add('active');
|
||||
|
||||
createDropdown();
|
||||
}
|
||||
|
||||
|
||||
function createDropdown() {
|
||||
document.querySelector('.dropdown')?.remove();
|
||||
|
||||
const activeDiv = document.querySelector('.content.active');
|
||||
if (activeDiv.id === 'replies') return;
|
||||
|
||||
const dropdown = document.createElement('div');
|
||||
dropdown.classList.add('dropdown');
|
||||
|
||||
const button = document.createElement('button');
|
||||
button.classList.add('dropdown-button');
|
||||
button.textContent = 'Layout: Compact';
|
||||
|
||||
const content = document.createElement('div');
|
||||
content.classList.add('dropdown-content');
|
||||
content.id = 'layoutDropdown';
|
||||
|
||||
const options = [
|
||||
{ text: 'Large', value: 'large' },
|
||||
{ text: 'Relaxed', value: 'relaxed' },
|
||||
{ text: 'Compact', value: 'compact', selected: true }
|
||||
];
|
||||
|
||||
options.forEach(({ text, value, selected }) => {
|
||||
const link = document.createElement('a');
|
||||
link.href = '#';
|
||||
link.dataset.value = value;
|
||||
link.textContent = text;
|
||||
if (selected) link.classList.add('selected');
|
||||
link.addEventListener('click', togglerelaxed);
|
||||
content.appendChild(link);
|
||||
})
|
||||
|
||||
dropdown.append(button, content);
|
||||
activeDiv.prepend(dropdown);
|
||||
}
|
||||
|
||||
|
||||
// function to handle layout selection
|
||||
function togglerelaxed(e) {
|
||||
e.preventDefault(); // prevent the default anchor behavior
|
||||
|
||||
const value = e.target.getAttribute('data-value');
|
||||
const container = document.querySelector(`#${sessionStorage.getItem('currenttab') || 'cardscontainer'}`);
|
||||
|
||||
console.log(value)
|
||||
const container = document.querySelector('.content.active [class*="cards-container"]'),
|
||||
value = e.target.getAttribute('data-value');
|
||||
|
||||
if (!container) return console.warn('container not found!');
|
||||
|
||||
@@ -50,9 +104,4 @@ function togglerelaxed(e) {
|
||||
document.querySelector('.dropdown-button').textContent = `Layout: ${value.charAt(0).toUpperCase() + value.slice(1)}`;
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
// event listener for dropdown items
|
||||
document.querySelectorAll('#layoutDropdown a').forEach(item => {
|
||||
item.addEventListener('click', togglerelaxed);
|
||||
});
|
||||
});
|
||||
document.addEventListener('DOMContentLoaded', createDropdown);
|
||||
Reference in New Issue
Block a user