flashii/mami
1
0
Fork 0
Code Pull requests Releases Activity

Altered the positioning for the pickers.

Browse source
This commit is contained in:
flash 2024-06-27 18:11:51 +00:00
parent b0ad0108f8
commit 74f116bfac
3 changed files with 35 additions and 21 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
src/mami.js/colpick/picker.jsx
View file

@ -79,8 +79,8 @@ const MamiColourPicker = function(options) {
if(typeof pos !== 'object')
throw 'pos must be an object';
html.style.bottom = 'y' in pos && pos.y >= 0 ? `${pos.y}px` : null;
html.style.left = 'x' in pos && pos.x >= 0 ? `${pos.x}px` : null;
for(const attr of ['top', 'left', 'right', 'bottom'])
html.style[attr] = typeof pos[attr] === 'number' ? `${pos[attr]}px` : null;
};
const tabs = new MamiTabsControl({
@ -166,20 +166,23 @@ const MamiColourPicker = function(options) {
get colour() { return colour; },
set colour(value) { setColour(value); },
setPosition: setPosition,
close: close,
close: runReject,
dialog: pos => {
html.classList.remove('hidden');
if(pos instanceof MouseEvent) {
const ev = pos;
pos = {};
const mbb = html.getBoundingClientRect();
const bbb = ev.target.getBoundingClientRect();
const pbb = html.parentNode.getBoundingClientRect();
let x = pos.clientX;
let y = pbb.height - pos.clientY;
if(x > (pbb.width - mbb.width))
x = 10;
pos.left = bbb.left;
pos.bottom = pbb.height - bbb.top;
pos = { x: x, y: y };
if(pos.left + mbb.width >= pbb.width)
pos.left = 0;
}
if(pos !== undefined)

21
src/mami.js/emotes/picker.jsx
View file

@ -100,8 +100,8 @@ const MamiEmotePicker = function(args) {
if(typeof pos !== 'object')
throw 'pos must be an object';
html.style.bottom = 'y' in pos && pos.y >= 0 ? `${pos.y}px` : null;
html.style.right = 'x' in pos && pos.x >= 0 ? `${pos.x}px` : null;
for(const attr of ['top', 'left', 'right', 'bottom'])
html.style[attr] = typeof pos[attr] === 'number' ? `${pos[attr]}px` : null;
};
return {
@ -117,15 +117,22 @@ const MamiEmotePicker = function(args) {
html.classList.remove('hidden');
if(pos instanceof MouseEvent) {
const ev = pos;
pos = {};
const mbb = html.getBoundingClientRect();
const bbb = ev.target.getBoundingClientRect();
const pbb = html.parentNode.getBoundingClientRect();
let x = pbb.width - pos.clientX;
let y = pbb.height - pos.clientY;
if(x > mbb.width)
x -= mbb.width;
pos.right = pbb.width - bbb.left;
pos.bottom = pbb.height - bbb.top;
pos = { x: x, y: y };
if(pos.right + mbb.width > pbb.width)
pos.right = 0;
else if(pos.right > mbb.width)
pos.right -= mbb.width;
else
pos.right -= bbb.width;
}
if(pos !== undefined)

10
src/mami.js/ui/markup.js
View file

@ -21,17 +21,21 @@ Umi.UI.Markup = (function() {
let picker, pickerVisible = false;
const insert = function(ev) {
if(this.dataset.umiTagName === 'color' && !pickerVisible) {
pickerVisible = true;
if(this.dataset.umiTagName === 'color') {
if(picker === undefined) {
picker = new MamiColourPicker({ presets: futami.get('colours') });
pickerTarget.appendChild(picker.element);
}
if(pickerVisible) {
picker.close();
} else {
pickerVisible = true;
picker.dialog(ev)
.then(colour => insertRaw(`[color=${MamiColour.hex(colour)}]`, '[/color]'))
.catch(() => {}) // noop so the console stops screaming
.finally(() => pickerVisible = false);
}
} else
insertRaw(
this.dataset.umiBeforeCursor,