refac: chat controls panel resize logic

This commit is contained in:
Timothy Jaeryang Baek 2025-09-08 20:54:18 +04:00
parent 41f9a8caff
commit fcebc82ec2

View file

@ -39,7 +39,11 @@
export const openPane = () => { export const openPane = () => {
if (parseInt(localStorage?.chatControlsSize)) { if (parseInt(localStorage?.chatControlsSize)) {
pane.resize(parseInt(localStorage?.chatControlsSize)); const container = document.getElementById('chat-container');
let size = Math.floor(
(parseInt(localStorage?.chatControlsSize) / container.clientWidth) * 100
);
pane.resize(size);
} else { } else {
pane.resize(minSize); pane.resize(minSize);
} }
@ -91,7 +95,7 @@
const resizeObserver = new ResizeObserver((entries) => { const resizeObserver = new ResizeObserver((entries) => {
for (let entry of entries) { for (let entry of entries) {
const width = entry.contentRect.width; const width = entry.contentRect.width;
// calculate the percentage of 200px // calculate the percentage of 350px
const percentage = (350 / width) * 100; const percentage = (350 / width) * 100;
// set the minSize to the percentage, must be an integer // set the minSize to the percentage, must be an integer
minSize = Math.floor(percentage); minSize = Math.floor(percentage);
@ -99,6 +103,13 @@
if ($showControls) { if ($showControls) {
if (pane && pane.isExpanded() && pane.getSize() < minSize) { if (pane && pane.isExpanded() && pane.getSize() < minSize) {
pane.resize(minSize); pane.resize(minSize);
} else {
let size = Math.floor(
(parseInt(localStorage?.chatControlsSize) / container.clientWidth) * 100
);
if (size < minSize) {
pane.resize(minSize);
}
} }
} }
} }
@ -217,7 +228,11 @@
if (size < minSize) { if (size < minSize) {
localStorage.chatControlsSize = 0; localStorage.chatControlsSize = 0;
} else { } else {
localStorage.chatControlsSize = size; // save the size in pixels to localStorage
const container = document.getElementById('chat-container');
localStorage.chatControlsSize = Math.floor((size / 100) * container.clientWidth);
console.log('saved size', localStorage.chatControlsSize);
} }
} }
}} }}