forked from cybrespace/mastodon
		
	Postpone scroll-to-detailed status after react components are loaded (#9773)
This commit is contained in:
		
							parent
							
								
									5104b61b6b
								
							
						
					
					
						commit
						70801b850c
					
				
					 1 changed files with 18 additions and 10 deletions
				
			
		| 
						 | 
				
			
			@ -33,6 +33,17 @@ function main() {
 | 
			
		|||
  const Rellax = require('rellax');
 | 
			
		||||
  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(() => {
 | 
			
		||||
    const locale = document.documentElement.lang;
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			@ -76,8 +87,14 @@ function main() {
 | 
			
		|||
 | 
			
		||||
          ReactDOM.render(<MediaContainer locale={locale} components={reactComponents} />, content);
 | 
			
		||||
          document.body.appendChild(content);
 | 
			
		||||
          scrollToDetailedStatus();
 | 
			
		||||
        })
 | 
			
		||||
        .catch(error => console.error(error));
 | 
			
		||||
        .catch(error => {
 | 
			
		||||
          console.error(error);
 | 
			
		||||
          scrollToDetailedStatus();
 | 
			
		||||
        });
 | 
			
		||||
    } else {
 | 
			
		||||
      scrollToDetailedStatus();
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    const parallaxComponents = document.querySelectorAll('.parallax');
 | 
			
		||||
| 
						 | 
				
			
			@ -85,15 +102,6 @@ function main() {
 | 
			
		|||
    if (parallaxComponents.length > 0 ) {
 | 
			
		||||
      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 });
 | 
			
		||||
    }
 | 
			
		||||
  });
 | 
			
		||||
 | 
			
		||||
  delegate(document, '.webapp-btn', 'click', ({ target, button }) => {
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		
		Reference in a new issue