diff --git a/index.html b/index.html index 5fd06ab..b1bc557 100644 --- a/index.html +++ b/index.html @@ -41,6 +41,7 @@
diff --git a/skythread.js b/skythread.js index ced6999..d26fafc 100644 --- a/skythread.js +++ b/skythread.js @@ -3,6 +3,7 @@ function init() { let html = /** @type {AnyElement} */ (/** @type {unknown} */ (window.document.body.parentNode)); window.dateLocale = localStorage.getItem('locale') || undefined; + window.isIncognito = !!localStorage.getItem('incognito'); document.addEventListener('click', (e) => { $id('account_menu').style.visibility = 'hidden'; @@ -36,7 +37,7 @@ function init() { }); document.querySelector('#account').addEventListener('click', (e) => { - if (api.isLoggedIn) { + if (accountAPI.isLoggedIn) { toggleAccount(); } else { toggleLogin(); @@ -48,19 +49,36 @@ function init() { e.stopPropagation(); }); + document.querySelector('#account_menu a[data-action=incognito]').addEventListener('click', (e) => { + e.preventDefault(); + + if (isIncognito) { + localStorage.removeItem('incognito'); + } else { + localStorage.setItem('incognito', '1'); + } + + location.reload(); + }); + document.querySelector('#account_menu a[data-action=logout]').addEventListener('click', (e) => { e.preventDefault(); logOut(); }); window.appView = new BlueskyAPI('api.bsky.app', false); - window.blue = new BlueskyAPI('blue.mackuba.eu', false); - window.api = new BlueskyAPI('bsky.social', true); - - if (api.isLoggedIn) { - showLoggedInStatus(api.user.avatar); + window.blueAPI = new BlueskyAPI('blue.mackuba.eu', false); + window.accountAPI = new BlueskyAPI('bsky.social', true); + + if (accountAPI.isLoggedIn && !isIncognito) { + window.api = accountAPI; + showLoggedInStatus(true, api.user.avatar); + } else if (accountAPI.isLoggedIn && isIncognito) { + window.api = appView; + showLoggedInStatus('incognito'); + document.querySelector('#account_menu a[data-action=incognito]').innerText = '✓ Incognito mode'; } else { - window.api = window.appView; + window.api = appView; } parseQueryParams(); @@ -159,12 +177,12 @@ function toggleAccount() { menu.style.visibility = (menu.style.visibility == 'visible') ? 'hidden' : 'visible'; } -/** @param {string} [avatar] */ +/** @param {boolean | 'incognito'} loggedIn, @param {string | undefined | null} [avatar] */ -function showLoggedInStatus(avatar) { +function showLoggedInStatus(loggedIn, avatar) { let account = $id('account'); - if (avatar) { + if (loggedIn === true && avatar) { let button = account.querySelector('i'); let img = $tag('img.avatar', { src: avatar }); @@ -174,19 +192,19 @@ function showLoggedInStatus(avatar) { img.style.display = 'inline'; }); img.addEventListener('error', () => { - showLoggedInStatus(); + showLoggedInStatus(true, null); }) account.append(img); + } else if (loggedIn === false) { + $id('account').innerHTML = ``; + } else if (loggedIn === 'incognito') { + $id('account').innerHTML = ``; } else { account.innerHTML = ``; } } -function showLoggedOutStatus() { - $id('account').innerHTML = ``; -} - function submitLogin() { let handle = $id('login_handle'); let password = $id('login_password'); @@ -227,18 +245,18 @@ function loadCurrentUserAvatar() { let url = `https://cdn.bsky.app/img/avatar/plain/${api.user.did}/${data.ref.$link}@jpeg`; api.config.user.avatar = url; api.config.save(); - showLoggedInStatus(url); + showLoggedInStatus(true, url); } else { - showLoggedInStatus(); + showLoggedInStatus(true, null); } }).catch((error) => { console.log(error); - showLoggedInStatus(); + showLoggedInStatus(true, null); }); } function logOut() { - api.resetTokens(); + accountAPI.resetTokens(); location.reload(); } @@ -334,7 +352,7 @@ function loadQuotesPage(url) { if (isLoading || finished) { return; } isLoading = true; - blue.getQuotes(url, cursor).then(data => { + blueAPI.getQuotes(url, cursor).then(data => { api.loadPosts(data.posts).then(jsons => { let posts = jsons.map(j => new Post(j)); @@ -407,7 +425,7 @@ function loadThread(url, postId, nodeToUpdate) { if (!nodeToUpdate) { setPageTitle(root); - loadQuoteCount = blue.getQuoteCount(root.uri); + loadQuoteCount = blueAPI.getQuoteCount(root.uri); } if (root.parent && !nodeToUpdate) { diff --git a/style.css b/style.css index 4d0ad88..d7ecb29 100644 --- a/style.css +++ b/style.css @@ -123,15 +123,17 @@ a:visited { #account_menu ul { list-style-type: none; - margin: 10px 0px; + margin: 0px 0px 10px; padding: 6px 11px; } #account_menu li a { + display: inline-block; color: #333; font-size: 11pt; border: 1px solid #bbb; padding: 3px 5px; + margin-top: 8px; border-radius: 5px; background-color: hsla(210, 100%, 4%, 0.12); } diff --git a/types.d.ts b/types.d.ts index fbe11c8..9b42a34 100644 --- a/types.d.ts +++ b/types.d.ts @@ -1,12 +1,13 @@ interface Window { - unauthed: boolean; - root: AnyPost; dateLocale: string | undefined; + root: AnyPost; } -declare var api: BlueskyAPI; -declare var blue: BlueskyAPI; +declare var accountAPI: BlueskyAPI; +declare var blueAPI: BlueskyAPI; declare var appView: BlueskyAPI; +declare var api: BlueskyAPI; +declare var isIncognito: boolean; type SomeElement = Element | HTMLElement | AnyElement; diff --git a/utils.js b/utils.js index cc4f167..277327a 100644 --- a/utils.js +++ b/utils.js @@ -96,10 +96,5 @@ function linkToPostById(handle, postId) { let url = new URL(getLocation()); url.searchParams.set('author', handle); url.searchParams.set('post', postId); - - if (window.unauthed) { - url.searchParams.set('_u', '1'); - } - return url.toString(); }