treehouse
/
mastodon
21
8
Fork 5
Code Issues 32 Pull Requests Projects 1 Releases Wiki Activity

[Glitch] Postpone scroll-to-detailed status after react components are loaded 

Port f6a5894af6 to glitch-soc
lolsob-rspec
Thibaut Girka 2019-01-10 20:28:24 +01:00
parent d9abcb4b4b
commit c0c04cd2d4
1 changed files with 18 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
app/javascript/flavours/glitch/packs/public.js
View File

@ -12,6 +12,17 @@ function main() {
const Rellax = require('rellax'); const Rellax = require('rellax');
const createHistory = require('history').createBrowserHistory; const createHistory = require('history').createBrowserHistory;
const scrollToDetailedStatus = () => {
const history = createHistory();
const detailedStatuses = document.querySelectorAll('.public-layout .detailed-status');
const location = history.location;
if (detailedStatuses.length === 1 && (!location.state || !location.state.scrolledToDetailedStatus)) {
detailedStatuses[0].scrollIntoView();
history.replace(location.pathname, { ...location.state, scrolledToDetailedStatus: true });
}
};
ready(() => { ready(() => {
const locale = document.documentElement.lang; const locale = document.documentElement.lang;
@ -54,8 +65,14 @@ function main() {
ReactDOM.render(<MediaContainer locale={locale} components={reactComponents} />, content); ReactDOM.render(<MediaContainer locale={locale} components={reactComponents} />, content);
document.body.appendChild(content); document.body.appendChild(content);
scrollToDetailedStatus();
}) })
.catch(error => console.error(error)); .catch(error => {
console.error(error);
scrollToDetailedStatus();
});
} else {
scrollToDetailedStatus();
} }
const parallaxComponents = document.querySelectorAll('.parallax'); const parallaxComponents = document.querySelectorAll('.parallax');
@ -63,15 +80,6 @@ function main() {
if (parallaxComponents.length > 0 ) { if (parallaxComponents.length > 0 ) {
new Rellax('.parallax', { speed: -1 }); new Rellax('.parallax', { speed: -1 });
} }
const history = createHistory();
const detailedStatuses = document.querySelectorAll('.public-layout .detailed-status');
const location = history.location;
if (detailedStatuses.length === 1 && (!location.state || !location.state.scrolledToDetailedStatus)) {
detailedStatuses[0].scrollIntoView();
history.replace(location.pathname, { ...location.state, scrolledToDetailedStatus: true });
}
}); });
} }