AZ Window

Default settings

new AZWindow(
{
azWindowStyle: "rounded",
azWindowTitle: "",
azWindowText: "",
azWindowWidth: 300,
azWindowHeight: 150,
azWindowContentHeight: false,
azWindowPositionTop: 0,
azWindowModal: false,
azWindowTitlebar: true,
azWindowTitlebarClose: true,
azWindowAnimation: true,
azWindowNoParentScroll: false,
azWindowBackground: true,
azWindowBackgroundColor: "",
azWindowColor: "",
azWindowTitlebarBackgroundColor: "",
azWindowTitlebarColor: "",
azWindowButton: {
Button1: false,
TypeButton1: "primary",
SizeButton1: "",
RoundedButton1: false,
TextButton1: "",
Button2: false,
TypeButton2: "info",
SizeButton2: "",
RoundedButton2: false,
TextButton2: ""
}
});

Init AZWindow

There are two ways to initiate the AZWindow. The way you choose is important for further use of the function.

1. new AZWindow();
The function is initiated but you do not assign the function to a variable. This means that you can not directly interact with the function.

2. var AZWindow = new AZWindow();
The function is initiated and assigned to a variable. This means you can use the variable in relation to further interaction with the function.

Whatever approach you choose, you can use the following three features (Events):

azWindowBeforeOpen
azWindowAfterOpen
azWindowAfterClose

Other examples:

Window Title
Window Resize

azWindowStyle Type: String Default: "rounded" Values:"rounded" or "flat"

azWindowTitle Type: String Default: "" Values: Text

azWindowText Type: String Default: "" Values: Text or HTML

azWindowWidth Type: Integer Default: 300 Unit: px
AZ Window width will be adjusted to fit the screen size of the device if azWindowWidth is set larger than the screen width.

azWindowHeight Type: Integer Default: 150 Unit: px
AZ Window height will be adjusted to fit the screen size of the device if azWindowHeight is set larger than the screen height.

azWindowContentHeight Type: Boolean Default: false Values: true or false
By changing the value to true, AZWindow will automatically adjust the height of the window to the content.

azWindowPositionTop Type: Integer Default: 0 Unit: px

azWindowModal Type: Boolean Default: false Values: true or false
By changing the value to true, AZWindow will not automatically close when the user clicks on the outside of AZWindow.

azWindowTitlebar Type: Boolean Default: true Values: true or false
By changing the values to false, you have the option to hide the entire title bar.

azWindowTitlebarClose Type: Boolean Default: true Values: true or false
By changing the values to false, you have the option to hide the close button (X) in the right part of the title bar.

azWindowAnimation Type: Boolean Default: true Values: true or false

azWindowNoParentScroll Type: Boolean Default: false Values: true or false
By changing the values to true, the scroll bar for the main page will be removed and AZWindow will retain its position when scrolling.

azWindowBackground Type: Boolean Default: true Values: true or false

azWindowBackgroundColor Type: Color Hex Default: ""
See also CSS #az-window

azWindowColor Type: Color Hex Default: ""
See also CSS #az-window

azWindowTitlebarBackgroundColor Type: Color Hex Default: ""
See also CSS #az-window > .az-window-titlebar

azWindowTitlebarColor Type: Color Hex Default: ""
See also CSS #az-window > .az-window-titlebar

azWindowButton Type: object
Button1: true or false TypeButton1: "default" or "primary" or "success" or "info" or "warning" or "danger" or "link" SizeButton1: "" or "xs" or "sm" or "md" RoundedButton1: true or false TextButton1: Text
Button2: true or false TypeButton2: "default" or "primary" or "success" or "info" or "warning" or "danger" or "link" SizeButton2: "" or "xs" or "sm" or "md" RoundedButton2: true or false TextButton2: Text

functionlib/azWindowBeforeOpen Type: Function

$.subscribeonce("functionlib/azWindowBeforeOpen", function (e, data)
{
data.azWindowId
});

This function is triggered before AZWindow is fully initiated.

functionlib/azWindowAfterOpen Type: Function

$.subscribeonce("functionlib/azWindowAfterOpen", function (e, data)
{
data.$Window - i.fn.init[]
data.$Titlebar - i.fn.init[]
data.$Dialog - i.fn.init[]
data.$Article - i.fn.init[]
data.azWindowId
data.azWindowClose - ƒ ()
data.azChangeWindowTitlebar - ƒ (n)
data.azWindowResize - ƒ (n)
});

This function is triggered after AZWindow is fully initiated.

functionlib/azWindowAfterClose Type: Function

$.subscribeonce("functionlib/azWindowAfterClose", function (e, data)
{
data.azWindowId
});

This function is triggered after AZWindow is closed.

AZ Window - Title

Default settings

new AZWindow(
{
azWindowTitle: "",
azWindowTitlebarBackgroundColor: "",
azWindowTitlebarColor: "",
azWindowAlertTimeout: 3000
});

azWindowTitle Type: String Default: "" Values: Text

azWindowTitlebarBackgroundColor Type: Color Hex Default: ""
See also CSS .az-window-titlebar

azWindowTitlebarColor Type: Color Hex Default: ""
See also CSS .az-window-titlebar

azWindowAlertTimeout Type: Integer Default: 3000 Unit: milliseconds

var ChangeWindowTitlebarOptions =
{
azWindowTitle: "",
azWindowTitlebarBackgroundColor: "",
azWindowTitlebarColor: "",
azWindowAlertTimeout: 3000
};

1. new AZWindow();
$.subscribeonce("functionlib/azWindowAfterOpen", function (e, data)
{
data.azChangeWindowTitlebar(ChangeWindowTitlebarOptions);
});

2. var AZWindow = new AZWindow();
AZWindow.azChangeWindowTitlebar(ChangeWindowTitlebarOptions);

AZ Window - Resize

Default settings

new AZWindow(
{
azWindowWidth: 300,
azWindowHeight: 150
};

azWindowWidth Type: Integer Default: 300 Unit: px

azWindowHeight Type: Integer Default: 150 Unit: px

var WindowResizeOptions =
{
azWindowWidth: 600,
azWindowHeight: 600
};

1. new AZWindow();
$.subscribeonce("functionlib/azWindowAfterOpen", function (e, data)
{
data.azWindowResize(WindowResizeOptions);
});

2. var AZWindow = new AZWindow();
AZWindow.azWindowResize(WindowResizeOptions);

AZ Window CSS

AZ Window has some CSS that you can find here: window.css