From c8b56bb2f019084cf09c5991fe17418c1e6a406e Mon Sep 17 00:00:00 2001 From: Akhilesh Thite Date: Thu, 19 Sep 2024 19:14:35 -0700 Subject: [PATCH 01/15] feat: apply defaults globally across all pages, including followed accounts and profile --- config/defaults.json | 12 ++++++++++ defaults.js | 55 ++++++++++++++++++++++++++++++++++++++++++++ followed-accounts.js | 5 +++- index.html | 2 +- outbox.js | 5 +++- post.js | 5 +++- sidebar.html | 2 +- timeline.js | 19 ++++----------- 8 files changed, 85 insertions(+), 20 deletions(-) create mode 100644 config/defaults.json create mode 100644 defaults.js diff --git a/config/defaults.json b/config/defaults.json new file mode 100644 index 0000000..aadef33 --- /dev/null +++ b/config/defaults.json @@ -0,0 +1,12 @@ +{ + "communityName": "Akhi's Art", + "theme": { + "bgColor": "#ecfeff", + "postBgColor": "#cffafe", + "postDetailsColor": "#06b6d4", + "postLinkColor": "#0ea5e9" + }, + "defaultFollowedActors": [ + "https://mastodon.social/@akhileshthite" + ] +} \ No newline at end of file diff --git a/defaults.js b/defaults.js new file mode 100644 index 0000000..ee88ed3 --- /dev/null +++ b/defaults.js @@ -0,0 +1,55 @@ +import { db } from './dbInstance.js' + +export async function fetchDefaults () { + const response = await fetch('./config/defaults.json') + if (!response.ok) { + throw new Error('Failed to load defaults.') + } + return await response.json() +} + +export async function applyDefaults () { + try { + const defaults = await fetchDefaults() + + // Apply community name if available + if (defaults.communityName) { + document.title = defaults.communityName // Update the main title + const brandingElement = document.getElementById('header-branding') // Update sidebar branding + if (brandingElement) { + brandingElement.textContent = defaults.communityName + } + } + + // Apply theme if available + if (defaults.theme) { + applyTheme(defaults.theme) + } + } catch (error) { + console.error('Error loading defaults: ', error) + } +} + +function applyTheme (theme) { + const root = document.documentElement + if (theme.bgColor) root.style.setProperty('--bg-color', theme.bgColor) + if (theme.postBgColor) root.style.setProperty('--rdp-bg-color', theme.postBgColor) + if (theme.postDetailsColor) root.style.setProperty('--rdp-details-color', theme.postDetailsColor) + if (theme.postLinkColor) root.style.setProperty('--rdp-link-color', theme.postLinkColor) +} + +export async function initializeDefaultFollowedActors () { + const hasFollowedActors = await db.hasFollowedActors() + + if (!hasFollowedActors) { + try { + const defaults = await fetchDefaults() + const defaultActors = defaults.defaultFollowedActors || [] + + // Follow default actors from the loaded configuration + await Promise.all(defaultActors.map((actorUrl) => db.followActor(actorUrl))) + } catch (error) { + console.error('Error loading default followed actors: ', error) + } + } +} diff --git a/followed-accounts.js b/followed-accounts.js index 1b5de4c..040f724 100644 --- a/followed-accounts.js +++ b/followed-accounts.js @@ -1,4 +1,5 @@ import { db } from './dbInstance.js' +import { applyDefaults } from './defaults.js' export class FollowedActorsList extends HTMLElement { constructor () { @@ -6,7 +7,9 @@ export class FollowedActorsList extends HTMLElement { this.updateFollowedActors = this.updateFollowedActors.bind(this) } - connectedCallback () { + async connectedCallback () { + await applyDefaults() + this.renderFollowedActors() db.addEventListener('actorFollowed', this.updateFollowedActors) diff --git a/index.html b/index.html index d9371f8..cf21234 100644 --- a/index.html +++ b/index.html @@ -1,7 +1,7 @@ -Social Reader +Social Reader