diff --git a/src/scripts/OSFramework/OSUI/Helper/Device.ts b/src/scripts/OSFramework/OSUI/Helper/Device.ts index 43ee4d28fe..56180ed998 100644 --- a/src/scripts/OSFramework/OSUI/Helper/Device.ts +++ b/src/scripts/OSFramework/OSUI/Helper/Device.ts @@ -142,7 +142,7 @@ namespace OSFramework.OSUI.Helper { private static _getUserAgent(userAgent = ''): string { let localUserAgent = userAgent; - if (userAgent.replace(' ', '') === '') { + if (userAgent.replace(/ /g, '') === '') { if (sessionStorage.previewDevicesUserAgent) { localUserAgent = sessionStorage.previewDevicesUserAgent; } else { diff --git a/src/scripts/OutSystems/OSUI/Utils/Menu.ts b/src/scripts/OutSystems/OSUI/Utils/Menu.ts index a13ce1386e..da841dd3cb 100644 --- a/src/scripts/OutSystems/OSUI/Utils/Menu.ts +++ b/src/scripts/OutSystems/OSUI/Utils/Menu.ts @@ -29,10 +29,10 @@ namespace OutSystems.OSUI.Utils.Menu { 'a[href]:not([disabled]), [tabindex], button:not([disabled]), textarea:not([disabled]), input:not([disabled]), select:not([disabled])'; // Add Menu Event Listeners - const _addMenuEeventListeners = (hasTriggeredByAPI = false): void => { + const _addMenuEventListeners = (hasTriggeredByAPI = false): void => { // Ensure events will be removed when SetMenuListeners "API" has been triggered and before readding them again if (hasTriggeredByAPI) { - _removeMenuEeventListeners(); + _removeMenuEventListeners(); } // Check if the keydown event should be added const shouldKeyDownBeAdded = @@ -54,6 +54,17 @@ namespace OutSystems.OSUI.Utils.Menu { ); }; + // Method that add the OrientationChange handler, used only for TabletApps (Template_TabletApp > Menu) + const _addMenuOnOrientationChange = (callback: OSFramework.OSUI.GlobalCallbacks.Generic): void => { + if (callback && OSFramework.OSUI.Helper.DeviceInfo.IsTablet) { + _onOrientationChangeCallback = callback; + OSFramework.OSUI.Event.DOMEvents.Listeners.GlobalListenerManager.Instance.addHandler( + OSFramework.OSUI.Event.DOMEvents.Listeners.Type.OrientationChange, + _onOrientationChangeCallbackHandler + ); + } + }; + const _hideMenu = (): void => { // Update app properties if (_appProp.menu.element === undefined || _appProp.layout.element === undefined) { @@ -103,8 +114,8 @@ namespace OutSystems.OSUI.Utils.Menu { // OrientationChange handler const _onOrientationChangeCallbackHandler = (callback: OSFramework.OSUI.GlobalCallbacks.Generic): void => { - if (callback !== undefined) { - setTimeout(function () { + if (typeof callback === 'function') { + OSFramework.OSUI.Helper.ApplySetTimeOut(() => { _onOrientationChangeCallback(); }, 300); } @@ -133,20 +144,31 @@ namespace OutSystems.OSUI.Utils.Menu { } // Remove the menu event listeners since device type changed - _removeMenuEeventListeners(); + _removeMenuEventListeners(); // ReAdd the menu event listeners - _addMenuEeventListeners(); + _addMenuEventListeners(); }; // Remove Menu Event Listeners - const _removeMenuEeventListeners = (): void => { + const _removeMenuEventListeners = (): void => { if (_appProp.menu.hasEventListeners) { _appProp.menu.hasEventListeners = false; _appProp.menu.element.removeEventListener('keydown', _menuOnKeypress); } }; + // Method that removes the OrientationChange handler, used only for TabletApps (Template_TabletApp > Menu) + const _removeMenuOnOrientationChange = (): void => { + if (_onOrientationChangeCallback && OSFramework.OSUI.Helper.DeviceInfo.IsTablet) { + OSFramework.OSUI.Event.DOMEvents.Listeners.GlobalListenerManager.Instance.removeHandler( + OSFramework.OSUI.Event.DOMEvents.Listeners.Type.OrientationChange, + _onOrientationChangeCallbackHandler + ); + _onOrientationChangeCallback = undefined; + } + }; + // Method that removes the OnResize handler const _removeMenuOnResize = (): void => { OSFramework.OSUI.Event.DOMEvents.Listeners.GlobalListenerManager.Instance.removeHandler( @@ -295,21 +317,11 @@ namespace OutSystems.OSUI.Utils.Menu { _setA11YAttributes(); }; - /** - * Method that add the OrientationChange handler, used only for TabletApps (Template_TabletApp > Menu) - * - * @export - * @param {OSFramework.OSUI.GlobalCallbacks.Generic} callback - */ - export function AddMenuOnOrientationChange(callback: OSFramework.OSUI.GlobalCallbacks.Generic): void { - if (callback !== undefined) { - _onOrientationChangeCallback = callback; - OSFramework.OSUI.Event.DOMEvents.Listeners.GlobalListenerManager.Instance.addHandler( - OSFramework.OSUI.Event.DOMEvents.Listeners.Type.OrientationChange, - _onOrientationChangeCallbackHandler - ); - } - } + // Expose the_addMenuOnOrientationChange method, used only for TabletApps (Template_TabletApp > Menu) + export const addMenuOnOrientationChange = _addMenuOnOrientationChange; + + // Expose the _removeMenuOnOrientationChange method, used only for TabletApps (Template_TabletApp > Menu) + export const removeMenuOnOrientationChange = _removeMenuOnOrientationChange; /** * Checks if the menu can be draggable @@ -439,6 +451,8 @@ namespace OutSystems.OSUI.Utils.Menu { errorCode: ErrorCodes.Utilities.FailSetMenuOnDestroy, callback: () => { _removeMenuOnResize(); + // Remove the OrientationChange handler only for TabletApps + _removeMenuOnOrientationChange(); }, }); @@ -451,33 +465,20 @@ namespace OutSystems.OSUI.Utils.Menu { * @export * @return {*} {string} */ - export function OnReady(): string { + export function OnReady(callback: OSFramework.OSUI.GlobalCallbacks.Generic): string { const result = OutSystems.OSUI.Utils.CreateApiResponse({ errorCode: ErrorCodes.Utilities.FailSetMenuOnReady, callback: () => { _updatePropsAndAttrs(); _addMenuOnResize(); + // Add the OrientationChange handler only for TabletApps + _addMenuOnOrientationChange(callback); }, }); return result; } - /** - * Method that removes the OrientationChange handler - * - * @export - */ - export function RemoveMenuOnOrientationChange(): void { - if (_onOrientationChangeCallback !== undefined) { - OSFramework.OSUI.Event.DOMEvents.Listeners.GlobalListenerManager.Instance.removeHandler( - OSFramework.OSUI.Event.DOMEvents.Listeners.Type.OrientationChange, - _onOrientationChangeCallbackHandler - ); - _onOrientationChangeCallback = undefined; - } - } - /** * Adds the selected states to menu items * @@ -687,9 +688,9 @@ namespace OutSystems.OSUI.Utils.Menu { if (_appProp.layout.element && menu) { // Invoking setTimeout to schedule the callback to be run asynchronously - setTimeout(function () { - _addMenuEeventListeners(true); - }, 0); + OSFramework.OSUI.Helper.AsyncInvocation(() => { + _addMenuEventListeners(true); + }); } }, }); diff --git a/src/scripts/osui.ts b/src/scripts/osui.ts index 36e1220807..fb98df2def 100644 --- a/src/scripts/osui.ts +++ b/src/scripts/osui.ts @@ -1,10 +1,16 @@ // eslint-disable-next-line @typescript-eslint/no-unused-vars namespace osui { + /** + * @deprecated use 'OutSystems.OSUI.GetVersion()' instead. + */ export function GetVersion(): string { console.warn('osui.GetVersion(), is deprecated. Please use the API `OutSystems.OSUI.GetVersion()`.'); return OutSystems.OSUI.GetVersion(); } + /** + * @deprecated use 'OutSystems.OSUI.Utils.ToggleClass(...)' instead. + */ export function ToggleClass(el: HTMLElement, state: unknown, className: string): void { console.warn( 'osui.ToggleClass(...), is deprecated. Please use the API `OutSystems.OSUI.Utils.ToggleClass(...)`.' @@ -12,6 +18,9 @@ namespace osui { OutSystems.OSUI.Utils.ToggleClass(el, state, className); } + /** + * @deprecated use 'OutSystems.OSUI.GetVersion()' instead. + */ export function GetClosest(elem: HTMLElement, selector: string): unknown { console.warn( 'osui.GetClosest(...), is deprecated. Please use the API `OutSystems.OSUI.Utils.GetClosest(...)`.' @@ -19,11 +28,17 @@ namespace osui { return OutSystems.OSUI.Utils.GetClosest(elem, selector); } + /** + * @deprecated use 'OutSystems.OSUI.Utils.FixInputs(...)' instead. + */ export function FixInputs(): void { console.warn('osui.FixInputs(...), is deprecated. Please use the API `OutSystems.OSUI.Utils.FixInputs(...)`.'); OutSystems.OSUI.Utils.LayoutPrivate.FixInputs(); } + /** + * @deprecated use 'OutSystems.OSUI.Utils.HasMasterDetail()' instead. + */ export function HasMasterDetail(): boolean { console.warn( 'osui.HasMasterDetail(), is deprecated. Please use the API `OutSystems.OSUI.Utils.HasMasterDetail()`.' @@ -31,6 +46,9 @@ namespace osui { return OutSystems.OSUI.Utils.HasMasterDetail(); } + /** + * @deprecated use 'OutSystems.OSUI.Utils.HideOnScroll.Init()' instead. + */ export function HideOnScroll(): unknown { console.warn( 'osui.HideOnScroll(), is deprecated. Please use the API `OutSystems.OSUI.Utils.HideOnScroll.Init()`.' @@ -42,3 +60,25 @@ namespace osui { }; } } + +namespace OutSystems.OSUI.Utils.Menu { + /** + * @deprecated use 'OutSystems.OSUI.Utils.Menu.OnReady(...)' instead. + */ + export function AddMenuOnOrientationChange(callback: OSFramework.OSUI.GlobalCallbacks.Generic): void { + console.warn( + 'OutSystems.OSUI.Utils.Menu.AddMenuOnOrientationChange(...), is deprecated. Please use the API `OutSystems.OSUI.Utils.Menu.OnReady(...)`.' + ); + return OutSystems.OSUI.Utils.Menu.addMenuOnOrientationChange(callback); + } + + /** + * @deprecated use 'OutSystems.OSUI.Utils.Menu.OnDestroy()' instead. + */ + export function RemoveMenuOnOrientationChange(): void { + console.warn( + 'OutSystems.OSUI.Utils.Menu.RemoveMenuOnOrientationChange(), is deprecated. Please use the API `OutSystems.OSUI.Utils.Menu.OnDestroy()`.' + ); + return OutSystems.OSUI.Utils.Menu.removeMenuOnOrientationChange(); + } +}