Creepso/Wplace-BlueMarble
1
0
Fork 0
mirror of https://github.com/SwingTheVine/Wplace-BlueMarble.git synced 2026-05-09 22:50:57 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fix Color Filter minimization

Browse source
This commit is contained in:
Alexey 2026-04-21 10:08:05 +05:00
parent 190ea815de
commit aadc17cb9f
6 changed files with 139 additions and 39 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

83
dist/BlueMarble-For-GreasyFork.user.js vendored
View file

@ -1323,20 +1323,61 @@
button.style.textDecoration = "none";
const window2 = button.closest(".bm-window");
const dragbar = button.closest(".bm-dragbar");
const header = window2.querySelector("h1");
const windowContent = window2.querySelector(".bm-window-content");
window2.parentElement.append(window2);
if (button.dataset["buttonStatus"] == "expanded") {
windowContent.style.height = windowContent.scrollHeight + "px";
window2.style.width = window2.scrollWidth + "px";
windowContent.style.height = "0";
windowContent.addEventListener("transitionend", function handler() {
windowContent.style.display = "none";
const header = window2?.querySelector("h1");
const windowContent = window2?.querySelector(".bm-window-content");
if (!window2 || !dragbar || !windowContent) {
button.disabled = false;
button.style.textDecoration = "";
return;
}
const finishMinimizeTransition = (callback) => {
let isFinished = false;
let fallbackTimer;
const finish = () => {
if (isFinished) {
return;
}
isFinished = true;
clearTimeout(fallbackTimer);
windowContent.removeEventListener("transitionend", handler);
callback();
button.disabled = false;
button.style.textDecoration = "";
windowContent.removeEventListener("transitionend", handler);
};
const handler = (event) => {
if (event.target != windowContent || event.propertyName != "height") {
return;
}
finish();
};
windowContent.addEventListener("transitionend", handler);
fallbackTimer = setTimeout(finish, 360);
};
const getCollapsedHeight = () => {
const windowStyle = getComputedStyle(window2);
const toPixels = (value) => parseFloat(value) || 0;
const extraHeight = windowStyle.boxSizing == "border-box" ? toPixels(windowStyle.paddingTop) + toPixels(windowStyle.paddingBottom) + toPixels(windowStyle.borderTopWidth) + toPixels(windowStyle.borderBottomWidth) : 0;
return Math.ceil(dragbar.getBoundingClientRect().height + extraHeight + 2);
};
window2.parentElement.append(window2);
if (button.dataset["buttonStatus"] == "expanded") {
window2.dataset["widthBeforeMinimize"] = window2.style.width;
window2.dataset["heightBeforeMinimize"] = window2.style.height;
window2.dataset["minHeightBeforeMinimize"] = window2.style.minHeight;
windowContent.style.height = windowContent.scrollHeight + "px";
void windowContent.offsetHeight;
if (!window2.style.width) {
window2.style.width = window2.scrollWidth + "px";
}
finishMinimizeTransition(() => {
windowContent.style.display = "none";
});
const dragbarHeader1 = header.cloneNode(true);
windowContent.style.height = "0";
if (window2.style.height || window2.classList.contains("bm-windowed")) {
window2.style.minHeight = "0px";
window2.style.height = getCollapsedHeight() + "px";
}
const dragbarHeader1 = header?.cloneNode(true) ?? document.createElement("h1");
const dragbarHeader1Text = dragbarHeader1.textContent;
button.nextElementSibling.appendChild(dragbarHeader1);
button.innerHTML = minimizeIconCollapsed;
@ -1348,14 +1389,17 @@
dragbarHeader1.remove();
windowContent.style.display = "";
windowContent.style.height = "0";
window2.style.width = "";
windowContent.style.height = windowContent.scrollHeight + "px";
windowContent.addEventListener("transitionend", function handler() {
window2.style.width = window2.dataset["widthBeforeMinimize"] ?? "";
window2.style.minHeight = window2.dataset["minHeightBeforeMinimize"] ?? "";
window2.style.height = window2.dataset["heightBeforeMinimize"] ?? "";
void windowContent.offsetHeight;
finishMinimizeTransition(() => {
windowContent.style.height = "";
button.disabled = false;
button.style.textDecoration = "";
windowContent.removeEventListener("transitionend", handler);
delete window2.dataset["widthBeforeMinimize"];
delete window2.dataset["heightBeforeMinimize"];
delete window2.dataset["minHeightBeforeMinimize"];
});
windowContent.style.height = windowContent.scrollHeight + "px";
button.innerHTML = minimizeIconExpanded;
button.dataset["buttonStatus"] = "expanded";
button.ariaLabel = `Minimize window "${dragbarHeader1Text}"`;
@ -2750,6 +2794,9 @@ Getting Y ${pixelY}-${pixelY + drawSizeY}`);
if (!windowState || !windowElement?.isConnected || !windowElement.classList.contains("bm-windowed")) {
return;
}
if (windowElement.querySelector('.bm-dragbar button[data-button-status="collapsed"]')) {
return;
}
const rect = windowElement.getBoundingClientRect();
const width = __privateMethod(this, _WindowFilter_instances, clampWindowDimension_fn).call(this, rect.width, this.windowMinWidth, Math.min(this.windowMaxWidth, window.innerWidth - 16));
const height = __privateMethod(this, _WindowFilter_instances, clampWindowDimension_fn).call(this, rect.height, this.windowMinHeight, Math.min(this.windowMaxHeight, window.innerHeight - 16));
@ -4469,4 +4516,4 @@ Time Since Blink: ${String(Math.floor(elapsed / 6e4)).padStart(2, "0")}:${String
}
})();
// Build Hash: 6b3fa566393f
// Build Hash: 90abdec99d7b

4
dist/BlueMarble-Standalone.user.js vendored
View file

File diff suppressed because one or more lines are too long

4
dist/BlueMarble.user.css vendored
View file

File diff suppressed because one or more lines are too long

4
dist/BlueMarble.user.js vendored
View file

File diff suppressed because one or more lines are too long

82
src/Overlay.js
View file

@ -1220,8 +1220,50 @@ export default class Overlay {
const window = button.closest('.bm-window'); // Get the window
const dragbar = button.closest('.bm-dragbar'); // Get the dragbar
const header = window.querySelector('h1'); // Get the header
const windowContent = window.querySelector('.bm-window-content'); // Get the window content container
const header = window?.querySelector('h1'); // Get the header
const windowContent = window?.querySelector('.bm-window-content'); // Get the window content container
if (!window || !dragbar || !windowContent) {
button.disabled = false;
button.style.textDecoration = '';
return;
}
const finishMinimizeTransition = (callback) => {
let isFinished = false;
let fallbackTimer;
const finish = () => {
if (isFinished) {return;}
isFinished = true;
clearTimeout(fallbackTimer);
windowContent.removeEventListener('transitionend', handler);
callback();
button.disabled = false;
button.style.textDecoration = '';
};
const handler = event => {
if (event.target != windowContent || event.propertyName != 'height') {return;}
finish();
};
windowContent.addEventListener('transitionend', handler);
fallbackTimer = setTimeout(finish, 360);
};
const getCollapsedHeight = () => {
const windowStyle = getComputedStyle(window);
const toPixels = value => parseFloat(value) || 0;
const extraHeight = windowStyle.boxSizing == 'border-box'
? toPixels(windowStyle.paddingTop) +
toPixels(windowStyle.paddingBottom) +
toPixels(windowStyle.borderTopWidth) +
toPixels(windowStyle.borderBottomWidth)
: 0;
return Math.ceil(dragbar.getBoundingClientRect().height + extraHeight + 2);
};
window.parentElement.append(window); // Moves the window to the top
@ -1230,18 +1272,25 @@ export default class Overlay {
// ...we want to close it
// Logic for the transition animation to collapse the window
window.dataset['widthBeforeMinimize'] = window.style.width;
window.dataset['heightBeforeMinimize'] = window.style.height;
window.dataset['minHeightBeforeMinimize'] = window.style.minHeight;
windowContent.style.height = windowContent.scrollHeight + 'px';
window.style.width = window.scrollWidth + 'px'; // So the width of the window does not change due to the lack of content
windowContent.style.height = '0'; // Set the height to 0px
windowContent.addEventListener('transitionend', function handler() { // Add an event listener to cleanup once the minimize transition is complete
void windowContent.offsetHeight; // Force layout so the height transition always has a real start value
if (!window.style.width) {
window.style.width = window.scrollWidth + 'px'; // So the width of the window does not change due to the lack of content
}
finishMinimizeTransition(() => {
windowContent.style.display = 'none'; // Changes "display" to "none" for screen readers
button.disabled = false; // Enables the button
button.style.textDecoration = ''; // Resets the text decoration to default
windowContent.removeEventListener('transitionend', handler); // Removes the event listener
});
windowContent.style.height = '0'; // Set the height to 0px
if (window.style.height || window.classList.contains('bm-windowed')) {
window.style.minHeight = '0px';
window.style.height = getCollapsedHeight() + 'px';
}
// Makes a clone of the h1 element inside the window, and adds it to the dragbar
const dragbarHeader1 = header.cloneNode(true);
const dragbarHeader1 = header?.cloneNode(true) ?? document.createElement('h1');
const dragbarHeader1Text = dragbarHeader1.textContent;
button.nextElementSibling.appendChild(dragbarHeader1);
@ -1259,14 +1308,17 @@ export default class Overlay {
// Logic for the transition animation to expand the window
windowContent.style.display = ''; // Resets display to default
windowContent.style.height = '0'; // Sets the height to 0
window.style.width = ''; // Resets the window width to default
windowContent.style.height = windowContent.scrollHeight + 'px'; // Change the height back to normal
windowContent.addEventListener('transitionend', function handler() { // Add an event listener to cleanup once the minimize transition is complete
window.style.width = window.dataset['widthBeforeMinimize'] ?? ''; // Restores width to the pre-minimized value
window.style.minHeight = window.dataset['minHeightBeforeMinimize'] ?? ''; // Restores resizable windows
window.style.height = window.dataset['heightBeforeMinimize'] ?? ''; // Restores height to the pre-minimized value
void windowContent.offsetHeight; // Force layout before expanding from 0px
finishMinimizeTransition(() => {
windowContent.style.height = ''; // Changes the height back to default
button.disabled = false; // Enables the button
button.style.textDecoration = ''; // Resets the text decoration to default
windowContent.removeEventListener('transitionend', handler); // Removes the event listener
delete window.dataset['widthBeforeMinimize'];
delete window.dataset['heightBeforeMinimize'];
delete window.dataset['minHeightBeforeMinimize'];
});
windowContent.style.height = windowContent.scrollHeight + 'px'; // Change the height back to normal
button.innerHTML = minimizeIconExpanded; // Swap button icon
button.dataset['buttonStatus'] = 'expanded'; // Swap button status tracker

1
src/WindowFilter.js
View file

@ -494,6 +494,7 @@ export default class WindowFilter extends Overlay {
#saveWindowState(windowElement) {
const windowState = this.#getWindowState();
if (!windowState || !windowElement?.isConnected || !windowElement.classList.contains('bm-windowed')) {return;}
if (windowElement.querySelector('.bm-dragbar button[data-button-status="collapsed"]')) {return;}
const rect = windowElement.getBoundingClientRect();
const width = this.#clampWindowDimension(rect.width, this.windowMinWidth, Math.min(this.windowMaxWidth, window.innerWidth - 16));