From 49c3df2328077162db4bca078073b056435d04e4 Mon Sep 17 00:00:00 2001 From: Nariman Jelveh Date: Sun, 14 Apr 2024 20:04:27 -0700 Subject: [PATCH] allow child windows to center relative to parent window --- src/UI/Settings/UIWindowSettings.js | 13 ++++++++++++- src/UI/UIWindow.js | 19 +++++++++++++++++++ src/UI/UIWindowThemeDialog.js | 6 ++++-- 3 files changed, 35 insertions(+), 3 deletions(-) diff --git a/src/UI/Settings/UIWindowSettings.js b/src/UI/Settings/UIWindowSettings.js index 5d245285..0a0e47bf 100644 --- a/src/UI/Settings/UIWindowSettings.js +++ b/src/UI/Settings/UIWindowSettings.js @@ -336,6 +336,7 @@ async function UIWindowSettings(options){ window_options:{ parent_uuid: $(el_window).attr('data-element_uuid'), disable_parent_window: true, + parent_center: true, } }); }) @@ -346,6 +347,7 @@ async function UIWindowSettings(options){ window_options:{ parent_uuid: $(el_window).attr('data-element_uuid'), disable_parent_window: true, + parent_center: true, } }); }) @@ -355,6 +357,7 @@ async function UIWindowSettings(options){ window_options:{ parent_uuid: $(el_window).attr('data-element_uuid'), disable_parent_window: true, + parent_center: true, } }); }) @@ -364,12 +367,19 @@ async function UIWindowSettings(options){ window_options:{ parent_uuid: $(el_window).attr('data-element_uuid'), disable_parent_window: true, + parent_center: true, } }); }) $(el_window).find('.change-ui-colors').on('click', function (e) { - UIWindowThemeDialog(); + UIWindowThemeDialog({ + window_options:{ + parent_uuid: $(el_window).attr('data-element_uuid'), + disable_parent_window: true, + parent_center: true, + } + }); }) $(el_window).find('.manage-sessions').on('click', function (e) { @@ -377,6 +387,7 @@ async function UIWindowSettings(options){ window_options:{ parent_uuid: $(el_window).attr('data-element_uuid'), disable_parent_window: true, + parent_center: true, } }); }) diff --git a/src/UI/UIWindow.js b/src/UI/UIWindow.js index 0fc8a887..7274e243 100644 --- a/src/UI/UIWindow.js +++ b/src/UI/UIWindow.js @@ -520,6 +520,25 @@ async function UIWindow(options) { }); } + // ===================================== + // Center relative to parent window + // ===================================== + if(options.parent_center && options.parent_uuid){ + const $parent_window = $(`.window[data-element_uuid="${options.parent_uuid}"]`); + const parent_window_width = $parent_window.width(); + const parent_window_height = $parent_window.height(); + const parent_window_left = $parent_window.offset().left; + const parent_window_top = $parent_window.offset().top; + const window_height = $(el_window).height(); + const window_width = $(el_window).width(); + options.left = parent_window_left + parent_window_width/2 - window_width/2; + options.top = parent_window_top + parent_window_height/2 - window_height/2; + $(el_window).css({ + 'left': options.left + 'px', + 'top': options.top + 'px', + }); + } + // onAppend() - using show() is a hack to make sure window is visible AND onAppend is called when // window is actually appended and usable. // NOTE: there is another is_visible condition below diff --git a/src/UI/UIWindowThemeDialog.js b/src/UI/UIWindowThemeDialog.js index 5f507daa..3932d183 100644 --- a/src/UI/UIWindowThemeDialog.js +++ b/src/UI/UIWindowThemeDialog.js @@ -1,6 +1,7 @@ import UIWindow from "./UIWindow.js"; -const UIWindowThemeDialog = async function UIWindowThemeDialog () { +const UIWindowThemeDialog = async function UIWindowThemeDialog (options) { + options = options ?? {}; const services = globalThis.services; const svc_theme = services.get('theme'); @@ -43,7 +44,8 @@ const UIWindowThemeDialog = async function UIWindowThemeDialog () { var(--primary-alpha))`, 'backdrop-filter': 'blur(3px)', - } + }, + ...options.window_options, }); const w_body = w.querySelector('.window-body');