diff --git a/src/routes/_actions/accounts.js b/src/routes/_actions/accounts.js index f9c50402..ff84bcd2 100644 --- a/src/routes/_actions/accounts.js +++ b/src/routes/_actions/accounts.js @@ -7,6 +7,9 @@ async function _updateAccount (accountId, instanceName, accessToken) { const localPromise = database.getAccount(instanceName, accountId) const remotePromise = getAccount(instanceName, accessToken, accountId).then(account => { /* no await */ database.setAccount(instanceName, account) + if (process.browser) { + window.fediloveData.currentAccount = account; + } return account }) diff --git a/src/routes/_api/timelines.js b/src/routes/_api/timelines.js index 77bc7214..f1580cce 100644 --- a/src/routes/_api/timelines.js +++ b/src/routes/_api/timelines.js @@ -98,6 +98,10 @@ export async function getTimeline (instanceName, accessToken, timeline, maxId, s if (timeline === 'federated') { items = window.fediloveFunctions.filterItemsForFedilove(items); + } else if (timeline.startsWith('account/') && params.tagged === 'fediloveimg') { + if (items.length === 0) { + window.fediloveData.currentAccountIsEmpty = true; + } } return { items, headers } diff --git a/src/scss/themes/ozark.scss b/src/scss/themes/ozark.scss index 7ba6bc90..d73ae1bc 100644 --- a/src/scss/themes/ozark.scss +++ b/src/scss/themes/ozark.scss @@ -346,6 +346,22 @@ div.main-content.account { max-width: 100em; margin: auto; + div.no-images-account { + height: 100vh; + display: flex; + + img.fixed-size-img { + max-width: 100vw; + max-height: 100vh; + object-fit: contain !important; + margin: auto; + } + } + + div.virtual-list-item { + opacity: 1 !important; + } + article.status-article { cursor: initial !important; background: none !important; @@ -398,6 +414,7 @@ div.main-content.meet { div.virtual-list-item { max-width: 100em; margin: auto; + opacity: 1 !important; article.status-article { background-repeat: no-repeat !important; @@ -432,6 +449,8 @@ div.main-content.meet { div.status-content { position: absolute; + max-height: 30%; + overflow: auto; padding: 2em; bottom: 8%; color: #fff; diff --git a/static/fedilove-no-react.js b/static/fedilove-no-react.js index 5d61f958..de276be7 100644 --- a/static/fedilove-no-react.js +++ b/static/fedilove-no-react.js @@ -81,7 +81,8 @@ var fediloveUI = { }, false); }, meetAccountImageDirection: function(direction) { - if (fediloveUI.meetAccountImageLocked) return; + if (!window.location.pathname.startsWith('/accounts') || + fediloveUI.meetAccountImageLocked) return; fediloveUI.meetAccountImageLocked = true; var dontMove = false; @@ -229,6 +230,8 @@ var fediloveData = { chatAvatarCache: undefined, meetAccountCurrentImg: 0, meetAccountImageLocked: false, + currentAccount: null, + currentAccountIsEmpty: false, gotEmojifyTextFunction: false, composeTxtKeypressEvent: false }; @@ -298,7 +301,6 @@ var fediloveEvents = { // this is our URL-based customizations made by JavaScript -var intervalChatCssChange = null; function fedilove_customization() { if (document.querySelector('#main-nav > div#dummy-nav') != null) { document.querySelector('#main-nav > div#dummy-nav').remove(); @@ -312,6 +314,7 @@ function fedilove_customization() { document.querySelector('#chat-compose-global').style = 'visibility: collapse'; document.querySelector('#chat-party-hide').style = 'display: none !important'; document.querySelector('nav#main-nav > ul.main-nav-ul').style = ''; + fediloveData.currentAccountIsEmpty = false; $('nav#main-nav li.main-nav-li svg').each(function() { $(this).removeClass('active'); @@ -380,11 +383,13 @@ function fedilove_customization() { // this function changes the css class on articles (messages) // that match the given account_id var makeMessageUIModifications = function(account_id) { - if (intervalChatCssChange !== null) return; var theint = 150; - setInterval(function() + const _this = setInterval(function() { - intervalChatCssChange = this; + if (!window.location.pathname.startsWith('/statuses/')) { + clearInterval(_this); + return; + } // paint MY messages as mine $('div.main-content.chat article.status-article').each(function(i) { @@ -448,8 +453,6 @@ function fedilove_customization() { document.querySelector('#meet-navigation > #profile-nav').style = ''; $('#meet-navigation > #anim-swipe').html(''); - // TO-DO: disable click events on every article - // prev and next navigation const cloneBackSvg = function(selector) { $(selector).html(''); @@ -464,6 +467,40 @@ function fedilove_customization() { fediloveUI.meetAccountImageDirection('prev'); else fediloveUI.meetAccountImageDirection('next'); }); + + // clone the first element and include the account header image + var countmax = 0; + const _applyImageTo = function(selector) { + setTimeout(function() + { // set image of first item to the account header (100ms after cloning the object) + if (window.fediloveData.currentAccount != null) { + if ($(selector)[0] !== undefined) + $(selector)[0].src = window.fediloveData.currentAccount.header; + } + }, 300); + }; + const _this = setInterval(function() { + // max interval time: 10 seconds + if (countmax > 50 || $('div.virtual-list > div.virtual-list-item').length > 0) { + if ($('div.virtual-list > div.virtual-list-item').length > 0) { + // clone the first element, insert it at the next position + const _e = $('div.virtual-list > div.virtual-list-item:last').clone(); + $(_e).insertAfter('div.virtual-list > div.virtual-list-item:last'); + _applyImageTo('div.virtual-list > div.virtual-list-item:last div.status-media img'); + } + + clearInterval(_this); + } else if (fediloveData.currentAccountIsEmpty && window.fediloveData.currentAccount != null) { + $('div.virtual-list').html('
'); + _applyImageTo('div.virtual-list > div.no-images-account > img.fixed-size-img'); + $('#meet-navigation > #profile-nav > #next')[0].style = 'display: none !important'; + + clearInterval(_this); + } else if (!window.location.pathname.startsWith('/accounts')) { + clearInterval(_this); + } + countmax++; + }, 200); } else if (window.location.pathname == '/federated') {