OpenCloud
/
element-web
mirror of https://github.com/vector-im/element-web
1
0
Fork 0
Code Issues Releases Wiki Activity

Merge pull request #770 from matrix-org/luke/fix-read-receipt-offset 

Read Receipt offset
pull/21833/head
Luke Barnard 2017-03-27 15:51:57 +02:00 committed by GitHub
parent a8d85ca2ad a4b4c3feb8
commit 55351927d7
1 changed files with 11 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/components/views/rooms/EventTile.js
View File

@ -283,9 +283,10 @@ module.exports = WithMatrixClient(React.createClass({
},
getReadAvatars: function() {
var ReadReceiptMarker = sdk.getComponent('rooms.ReadReceiptMarker');
var avatars = [];
var left = 0;
const ReadReceiptMarker = sdk.getComponent('rooms.ReadReceiptMarker');
const avatars = [];
const receiptOffset = 15;
let left = 0;
// It's possible that the receipt was sent several days AFTER the event.
// If it is, we want to display the complete date along with the HH:MM:SS,
@ -305,6 +306,12 @@ module.exports = WithMatrixClient(React.createClass({
if ((i < MAX_READ_AVATARS) || this.state.allReadAvatars) {
hidden = false;
}
// TODO: we keep the extra read avatars in the dom to make animation simpler
// we could optimise this to reduce the dom size.
// If hidden, set offset equal to the offset of the final visible avatar or
// else set it proportional to index
left = (hidden ? MAX_READ_AVATARS - 1 : i) * -receiptOffset;
var userId = receipt.roomMember.userId;
var readReceiptInfo;
@ -316,11 +323,6 @@ module.exports = WithMatrixClient(React.createClass({
this.props.readReceiptMap[userId] = readReceiptInfo;
}
}
// TODO: we keep the extra read avatars in the dom to make animation simpler
// we could optimise this to reduce the dom size.
if (!hidden) {
left -= 15;
}
// add to the start so the most recent is on the end (ie. ends up rightmost)
avatars.unshift(
@ -341,7 +343,7 @@ module.exports = WithMatrixClient(React.createClass({
if (remainder > 0) {
remText = <span className="mx_EventTile_readAvatarRemainder"
onClick={this.toggleAllReadAvatars}
style={{ right: -(left - 15) }}>{ remainder }+
style={{ right: -(left - receiptOffset) }}>{ remainder }+
</span>;
}
}