fixed emojiboard opening
This commit is contained in:
parent
e971069595
commit
50d3631bc4
3 changed files with 8 additions and 13 deletions
|
@ -176,9 +176,10 @@ function toggleEmoji(roomId, eventId, emojiKey, roomTimeline) {
|
||||||
}
|
}
|
||||||
|
|
||||||
function pickEmoji(e, roomId, eventId, roomTimeline) {
|
function pickEmoji(e, roomId, eventId, roomTimeline) {
|
||||||
|
const boxInfo = e.target.getBoundingClientRect();
|
||||||
openEmojiBoard({
|
openEmojiBoard({
|
||||||
x: e.detail ? e.clientX : '50%',
|
x: boxInfo.x,
|
||||||
y: e.detail ? e.clientY : '50%',
|
y: boxInfo.y,
|
||||||
detail: e.detail,
|
detail: e.detail,
|
||||||
}, (emoji) => {
|
}, (emoji) => {
|
||||||
toggleEmoji(roomId, eventId, emoji.unicode, roomTimeline);
|
toggleEmoji(roomId, eventId, emoji.unicode, roomTimeline);
|
||||||
|
@ -439,7 +440,7 @@ function ChannelViewContent({
|
||||||
iconSrc={EmojiAddIC}
|
iconSrc={EmojiAddIC}
|
||||||
onClick={(e) => pickEmoji(e, roomId, mEvent.getId(), roomTimeline)}
|
onClick={(e) => pickEmoji(e, roomId, mEvent.getId(), roomTimeline)}
|
||||||
>
|
>
|
||||||
Add reaciton
|
Add reaction
|
||||||
</MenuItem>
|
</MenuItem>
|
||||||
<MenuItem
|
<MenuItem
|
||||||
iconSrc={ReplyArrowIC}
|
iconSrc={ReplyArrowIC}
|
||||||
|
|
|
@ -300,10 +300,10 @@ function ChannelViewInput({
|
||||||
<div ref={rightOptionsRef} className="channel-input__option-container">
|
<div ref={rightOptionsRef} className="channel-input__option-container">
|
||||||
<IconButton
|
<IconButton
|
||||||
onClick={(e) => {
|
onClick={(e) => {
|
||||||
|
const boxInfo = e.target.getBoundingClientRect();
|
||||||
openEmojiBoard({
|
openEmojiBoard({
|
||||||
x: '10%',
|
x: boxInfo.x + (document.dir === 'rtl' ? -80 : 80),
|
||||||
y: 300,
|
y: boxInfo.y - 250,
|
||||||
isReverse: true,
|
|
||||||
detail: e.detail,
|
detail: e.detail,
|
||||||
}, addEmoji);
|
}, addEmoji);
|
||||||
}}
|
}}
|
||||||
|
|
|
@ -18,13 +18,7 @@ function EmojiBoardOpener() {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
const x = typeof cords.x === 'string' ? cords.x : `${cords.x}px`;
|
openerRef.current.style.transform = `translate(${cords.x}px, ${cords.y}px)`;
|
||||||
const y = typeof cords.y === 'string' ? cords.y : `${cords.y}px`;
|
|
||||||
|
|
||||||
openerRef.current.style.left = cords.isReverse ? 'unset' : x;
|
|
||||||
openerRef.current.style.top = cords.isReverse ? 'unset' : y;
|
|
||||||
openerRef.current.style.right = cords.isReverse ? x : 'unset';
|
|
||||||
openerRef.current.style.bottom = cords.isReverse ? y : 'unset';
|
|
||||||
requestCallback = requestEmojiCallback;
|
requestCallback = requestEmojiCallback;
|
||||||
openerRef.current.click();
|
openerRef.current.click();
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue