f.weber/homebrewery
0
0
Fork 0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2025-12-31 10:52:42 +00:00
Code Wiki Activity

Reduce overlapping observer handlers

Browse Source 
Combine handlePageVisibilityChange and handleCenterPageChange to reduce some of the infrastructure burden for handling centerPage.
This commit is contained in:
Trevor Buckner
2024-12-23 18:35:36 -05:00
parent c8efca3120
commit 2b7a1e1cb2
1 changed files with 12 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
client/homebrew/brewRenderer/brewRenderer.jsx
View File

@@ -47,9 +47,9 @@ const BrewPage = (props)=>{
(entries)=>{ (entries)=>{
entries.forEach((entry)=>{ entries.forEach((entry)=>{
if(entry.isIntersecting) if(entry.isIntersecting)
props.onVisibilityChange(props.index + 1, true); // add page to array of visible pages. props.onVisibilityChange(props.index + 1, true, false); // add page to array of visible pages.
else else
props.onVisibilityChange(props.index + 1, false); props.onVisibilityChange(props.index + 1, false, false);
}); });
}, },
{ threshold: .3, rootMargin: '0px 0px 0px 0px' } // detect when >30% of page is within bounds. { threshold: .3, rootMargin: '0px 0px 0px 0px' } // detect when >30% of page is within bounds.
@@ -60,7 +60,7 @@ const BrewPage = (props)=>{
(entries)=>{ (entries)=>{
entries.forEach((entry)=>{ entries.forEach((entry)=>{
if(entry.isIntersecting) if(entry.isIntersecting)
props.onCenterPageChange(props.index + 1); // Set this page as the center page props.onVisibilityChange(props.index + 1, true, true); // Set this page as the center page
}); });
}, },
{ threshold: 0, rootMargin: '-50% 0px -50% 0px' } // Detect when the page is at the center { threshold: 0, rootMargin: '-50% 0px -50% 0px' } // Detect when the page is at the center
@@ -124,26 +124,21 @@ const BrewRenderer = (props)=>{
rawPages = props.text.split(/^\\page$/gm); rawPages = props.text.split(/^\\page$/gm);
} }
const handlePageVisibilityChange = (pageNum, isVisible)=>{ const handlePageVisibilityChange = (pageNum, isVisible, isCenter)=>{
setState((prevState)=>{ setState((prevState)=>{
const updatedVisiblePages = new Set(prevState.visiblePages); const updatedVisiblePages = new Set(prevState.visiblePages);
isVisible ? updatedVisiblePages.add(pageNum) : updatedVisiblePages.delete(pageNum); if(!isCenter)
isVisible ? updatedVisiblePages.add(pageNum) : updatedVisiblePages.delete(pageNum);
return { return {
...prevState, ...prevState,
visiblePages : [...updatedVisiblePages].sort((a, b)=>a - b) visiblePages : [...updatedVisiblePages].sort((a, b)=>a - b),
centerPage : isCenter ? pageNum : prevState.centerPage
}; };
}); });
};
const handleCenterPageChange = (pageNum)=>{ if(isCenter)
setState((prevState)=>({ props.onPageChange(pageNum);
//if(prevState.visiblePages.length == 0)
...prevState,
centerPage : pageNum,
}));
props.onPageChange(pageNum);
}; };
const isInView = (index)=>{ const isInView = (index)=>{
@@ -181,12 +176,12 @@ const BrewRenderer = (props)=>{
if(props.renderer == 'legacy') { if(props.renderer == 'legacy') {
const html = MarkdownLegacy.render(pageText); const html = MarkdownLegacy.render(pageText);
return <BrewPage className='page phb' index={index} key={index} contents={html} style={styles} onVisibilityChange={handlePageVisibilityChange} onCenterPageChange={handleCenterPageChange} />; return <BrewPage className='page phb' index={index} key={index} contents={html} style={styles} onVisibilityChange={handlePageVisibilityChange} />;
} else { } else {
pageText += `\n\n&nbsp;\n\\column\n&nbsp;`; //Artificial column break at page end to emulate column-fill:auto (until `wide` is used, when column-fill:balance will reappear) pageText += `\n\n&nbsp;\n\\column\n&nbsp;`; //Artificial column break at page end to emulate column-fill:auto (until `wide` is used, when column-fill:balance will reappear)
const html = Markdown.render(pageText, index); const html = Markdown.render(pageText, index);
return <BrewPage className='page' index={index} key={index} contents={html} style={styles} onVisibilityChange={handlePageVisibilityChange} onCenterPageChange={handleCenterPageChange} />; return <BrewPage className='page' index={index} key={index} contents={html} style={styles} onVisibilityChange={handlePageVisibilityChange} />;
} }
}; };