QWndCtrl is a base class for all window controls such as: popup boxes, control panels, tab controls, popup menus etc. This class provides DHTML implementation of a window for wide range of modern and archaic browsers on different platforms. This list includes IE4+, all DOM1/DOM2 compatible browsers (Netscape 6.x, Netscape 7.x, Mozilla 1.0, Opera 6, Opera 7 and others). Additionally this class provides special implementation for Netscape 4.x, which is based on deprecated now <LAYER> tag.

QWndCtrl is an abstraction and has no visual representation. It extends QControl class and inherits all its methods and properties. New window class derived from QWndCtrl must call create method in the instance constructor (after this the window gets materialized in HTML).

A window is a rectangle area on the screen which content is clipped if exceeds the client area. According to DHTML principals, the height of a window is optional. If this property is missed, the window automatically selects the proper height to fit the content size.

When a window control is created, the following properties must be specified: absolute screen coordinates of the top left corner (x and y); the client area dimensions (width and optionally height); the content (content). The content property should be either a string or a function. If it's a string, it should contain HTML code that is expected to appear in the window. The functional content is used to create QLIB controls within the window or to create nested windows which are allowed.

Along with required properties, there're optional ones: initial visibility (visible); effects mask (see the Implementation section for details); opacity (opacity) and index of stacking order (zindex). By default a window appears visible right after it's created, has no effects, is a 100% opaque and its stacking order is corresponds to the creation order.

Basically the implementation of a window depends on the browser capabilities. Some old browsers do not provide all features required for extended effects. If a browser is not able to render the effect or to execute the method, this effect/method is ignored with no output to user.

setSize method has special behavior in a Netscape 4.x browser. Unlike any other browser, the content of a window doesn't get relayouted when the size changes. In fact Netscape 4.x only adjusts the clipping area. Opera 6 doesn't resize auto-height windows.

Since opacity of an element is not a part of any public standard so far, many browsers have its own syntax on this matter. A few browsers do not support semi-transparency at all. The following table gives an idea how setOpacity method is supported:

MS IE4+	Netscape 4.x	Netscape 6.x, 7.x	Mozilla 1.0	Opera 6, 7
supported	-	supported	supported	-

QWndCtrl brings up an easy way to enhance your web page with variety of transition effects. When a window is created, an optional set of effects can be provided. In addition QLIB introduces setEffects method that allows to adjust effects after the window has been created. There're two kinds of effects: static and dynamic. Effects from the both categories can be mixed together. The following table gives an idea how the effects are supported:

Effect \ Browser	MS IE4+	Netscape 4.x	Netscape 6.x, 7.x	Mozilla 1.0	Opera 6, 7
Static Effects
QWndCtrl.GRAY	Yes	No	No	No	No
QWndCtrl.XRAY	Yes	No	No	No	No
QWndCtrl.INVERT	Yes	No	No	No	No
QWndCtrl.SHADOW	Yes	No	No	No	No
Dynamic Effects
QWndCtrl.FADEIN	Yes	No	Yes	Yes	No
QWndCtrl.FADEOUT	Yes	No	Yes	Yes	No
QWndCtrl.BOXIN	Yes	No	No	No	No
QWndCtrl.BOXOUT	Yes	No	No	No	No
QWndCtrl.CIRCLEIN	Yes	No	No	No	No
QWndCtrl.CIRCLEOUT	Yes	No	No	No	No
QWndCtrl.WIPEIN	Yes	No	No	No	No
QWndCtrl.WIPEOUT	Yes	No	No	No	No
QWndCtrl.HBARNIN	Yes	No	No	No	No
QWndCtrl.HBARNOUT	Yes	No	No	No	No
QWndCtrl.VBARNIN	Yes	No	No	No	No
QWndCtrl.VBARNOUT	Yes	No	No	No	No
QWndCtrl.DISSOLVEIN	Yes	No	No	No	No
QWndCtrl.DISSOLVEOUT	Yes	No	No	No	No
QWndCtrl.HBLINDSIN	Yes	No	No	No	No
QWndCtrl.HBLINDSOUT	Yes	No	No	No	No
QWndCtrl.VBLINDSIN	Yes	No	No	No	No
QWndCtrl.VBLINDSOUT	Yes	No	No	No	No

Windowing

QWndCtrl()
Creates new prototype instance for class that you want to be derived from QWndCtrl (see JavaScript prototype property for details). Example: to derive MyControl from QWndCtrl you should assign: MyControl.prototype = new QWndCtrl();

Property	Access	Description
x	R / W	X coordinate of the window top left corner (pixels).
y	R / W	Y coordinate of the window top left corner (pixels).
width	R / W	Width in pixels of the window client area.
height	R / W	Height in pixels of the window client area (can be null for auto-size).
content	R / W	The window content (must be either a string or a function).
visible	R / W	Current visibility state.
effects	R / W	Current effects mask.
opacity	R / W	The window opacity from 0 (transparent) to 100 (opaque).
zindex	R / W	The window stacking order. Can be null for auto-stack.
Properties inherited from QControl
name	R	Name of the control. Serves as a direct reference to this object when evaluated.
id	R	Alphanumerical unique identifier of the control.
parent	R	Reference to the parent control (if any, null otherwise).
tag	R / W	Can refer any value or object, tag is always passed to all event handlers as the last parameter.
window	R / W	This property is a reference to JavaScript window object in which the control exists.
document	R / W	Refers to document object in which the corresponding HTML elements exist. Normally all elements of a DOM2 compatible browser are children of the top document object. If the control creates new document scope (i.e. printing tags like <IFRAME>, <LAYER>), it should assign this document to this property.

create()
Creates DHTML code for the window. This method is claimed to be protected. That means that only subclasses of QWndCtrl may call it. This method requires the following properties to be initialized before the call: window position (x, y); dimensions (width, height); content (content); initial visibility (visible); effects mask (effects); opacity (opacity) and stacking order (zindex).

show(show)
Shows or hides the window. "IN" and "OUT" transitions can be assigned to show and hide actions respectively (see setEffects method). In this case the window does not show/hide promptly, instead the window smoothly changes its visibility through animation. Parameters show - Desirable state as follows: true - make it visible, false - hide the window.

focus()
Gives the focus to the window. This brings it to the top of the stacking order.

center()
Centers the window on page.

moveTo(x, y)
Moves the window to specified position. If the window has been created in document context, it gets positioned in absolute page coordinates. If the window is nested in another one, it's positioned in relative coordinates of the parent window (see CSS positon property for more details). Parameters x - X coordinate in pixels. y - Y coordinate in pixels.

setSize(w, hopt)
Resizes the window. The content gets relayouted to fill the area changed. See Implementation Notes for details of cross-browser support. Parameters w - The window width in pixels. h - Optional. The window height in pixels. The window automatically selects the proper height is this parameter is skipped or null

setZIndex(z)
Changes the stacking order of the window. Window with higher index appear on the screen first obscuring underlying windows with lower indices. Parameters z - Desirable stacking index (starting from 1).

setOpacity(op)
Changes the window opacity. See Implementation Notes for details and how this method is supported. Parameters op - Desirable opacity as follows: 0 - transparent, 100 - opaque.

setEffects(fx)

Sets effects mask. There're two kinds of effects: static and dynamic. Static effects change the default appearance of the window (for example, a window casts shadow when it's set by QWndCtrl.SHADOW). On the other hand, dynamic effects are transitions that get activated when window changes its visibility state. A dynamic effect can be either "IN" or "OUT". The first type is played when a window appears. The second one is activated on the hiding. Effects of all types can be mixed together to bring up a composite effect (example: "QWndCtrl.SHADOW + QWndCtrl.BOXIN + QWndCtrl.FADEOUT" - makes a window to cast shadow, it appears with "box" effect, hides itself fading out from view). Parameters fx - Mix of effects to apply.

onShow(visible, tag)
This handler is fired when the window becomes visible or vanishes. When transitions are enabled, the handler is fired after the animation completes. Parameters visible - Visibility state of the window. tag - Tag is commonly used to parameterize the event handler. Each control can be optionally assigned by a tag. Returns The return value is ignored.

Variable	Description
QWndCtrl.TOPZINDEX	Stacking order of the topmost window.

Constant	Description
QWndCtrl.GRAY	Static effect that displays the window in black-and-white mode.
QWndCtrl.XRAY	This gives an effect of xray shot.
QWndCtrl.INVERT	This static effect inverses the colors.
QWndCtrl.SHADOW	Makes the window to cast shadow.
QWndCtrl.FADEIN	This is a fade transition that gets activated when the window becomes visible.
QWndCtrl.FADEOUT	This is a fade transition that gets activated when the window hides.
QWndCtrl.BOXIN	The window appears as an opening box.
QWndCtrl.BOXOUT	The window hides when the box gets collapsed.
QWndCtrl.CIRCLEIN	The window appears as a growing circle.
QWndCtrl.CIRCLEOUT	The window hides when the circle gets collapsed.
QWndCtrl.WIPEIN	The window wipes down when appears.
QWndCtrl.WIPEOUT	The window wipes up when hides.
QWndCtrl.HBARNIN	Creates an effect of opening doors when the window appears.
QWndCtrl.HBARNOUT	Creates an effect of closing doors when the window hides.
QWndCtrl.VBARNIN	Creates an effect of vertically opening shutter when the window appears.
QWndCtrl.VBARNOUT	Creates an effect of vertically closing shutter when the window hides.
QWndCtrl.DISSOLVEIN	Random dissolve on appear.
QWndCtrl.DISSOLVEOUT	Random dissolve on hide.
QWndCtrl.HBLINDSIN	Horizontal blinds when the window appears.
QWndCtrl.HBLINDSOUT	Horizontal blinds when the window hides.
QWndCtrl.VBLINDSIN	Vertical blinds when the window appears.
QWndCtrl.VBLINDSOUT	Vertical blinds when the window hides.

CSS Class	Description	Example (defined in a CSS file)
DIV.qwindow	Defines style properties of the window DIV element.	DIV.qwindow { background-color: red } /* sets the window background to red. */