chat: overscan and block level images

This commit is contained in:
Liam Fitzgerald 2020-12-10 15:51:36 +10:00
parent c3e4a1632f
commit aaddd080b5
No known key found for this signature in database
GPG Key ID: D390E12C61D1CFFB
2 changed files with 11 additions and 8 deletions

View File

@ -192,7 +192,7 @@ export class MessageWithSigil extends PureComponent<MessageProps> {
fontSize
} = this.props;
const datestamp = moment.unix(msg['time-sent']).format(DATESTAMP_FORMAT);
const datestamp = moment.unix(msg['time-sent'] / 1000).format(DATESTAMP_FORMAT);
const contact = msg.author in contacts ? contacts[msg.author] : false;
const showNickname = !hideNicknames && contact && contact.nickname;
const name = showNickname ? contact!.nickname : cite(msg.author);
@ -289,16 +289,18 @@ export const MessageContent = ({ content, contacts, remoteContentPolicy, measure
return <CodeContent content={content} />;
} else if ('url' in content) {
return (
<Text mx="2px" flexShrink={0} fontSize={fontSize ? fontSize : '14px'} lineHeight="tall" color='black'>
<Box mx="2px" flexShrink={0} fontSize={fontSize ? fontSize : '14px'} lineHeight="tall" color='black'>
<RemoteContent
url={content.url}
remoteContentPolicy={remoteContentPolicy}
onLoad={measure}
imageProps={{style: {
maxWidth: '18rem'
maxWidth: '18rem',
display: 'block'
}}}
videoProps={{style: {
maxWidth: '18rem'
maxWidth: '18rem',
display: 'block'
}
}}
textProps={{style: {
@ -306,7 +308,7 @@ export const MessageContent = ({ content, contacts, remoteContentPolicy, measure
textDecoration: 'underline'
}}}
/>
</Text>
</Box>
);
} else if ('text' in content) {
return <TextContent fontSize={fontSize} content={content} />;

View File

@ -141,18 +141,19 @@ export default class VirtualScroller extends Component<VirtualScrollerProps, Vir
const { scrollTop, offsetHeight: windowHeight } = this.window;
const { averageHeight } = this.state;
const { data, size: totalSize, onCalculateVisibleItems } = this.props;
console.log(windowHeight);
[...data].forEach(([index, datum]) => {
const height = this.heightOf(index);
if (startgap < scrollTop && !startGapFilled) {
if (startgap < (scrollTop - height) && !startGapFilled) {
startBuffer.set(index, datum);
startgap += height;
} else if (heightShown < windowHeight) {
} else if (heightShown < (windowHeight + height)) {
startGapFilled = true;
visibleItems.set(index, datum);
heightShown += height;
} else if (endBuffer.size < (visibleItems.size - visibleItems.size % 5)) {
} else if (endBuffer.size < visibleItems.size) {
endBuffer.set(index, data.get(index));
} else {
endgap += height;