class %ZEN.Component.desktop
extends activeGroup
This is a desktop group.
A desktop is a specialized group that allows the user to drag and
position its child components within a matrix of rows and columns.
The immediate children of a desktop component MUST be dragGroups
but there are no restrictions placed on the contents of the dragGroups
themselves.
The desktop honors all the innate functionality of the dragGroup
component, including: free resize; maximize; minimize; close; and,
restore
The desktop component supports interactive layout changes via mouse
drag operations. DragGroups may be rearranged, resized or removed
at will.
The arrangement of dragGroups within the Desktop is biased in favor
of row collapse. This means that if a dragGroup is removed from a
given row, any other groups in the same row will move to the left,
collapsing the length of the row and possibly creating blank space
at the extreme right end ofthe row. This is done to bias ithe display
in favor of maximizing ther use of the visible portions of the window
and minimizing the need for horizontal scrolling.
In addition to the auto row collapse, the component supports row and
column style settings that can enforce certain geometry and alignment
constraints on the dragGroups sub-windows of the widget as a whole
The initial layout of the groups within the destkop may be hinted at
via the use of CSS top and left properties. The page designer may
suggest the initial location of the window and the desktop manager will
make every effort to abide by the suggestion within the other contraints
actively being enforced by the widget. Row and column styles, automatic
row colapse and a prohibition against overlapping dragGroups make it
impossible to guarantee that the placement suggested via CSS will be
respected to the pixel. If an exact location for the dragGroup sub-
windows is required, see the corkboard component.
The current state of the desktop's internal layout may be querried
or saved at any time. The return value of the query function may also
be used to restore the layout at a later time.
parameter DEFAULTCOLSTYLE;
Subclasses can change this to alter the default geometry and
alignment of dragGroups within rows.
parameter DEFAULTENCLOSINGCLASS = "activeGroup";
To be compatible with the static layout manager the enclosing class
has to be the generic activeGroup rather than the specific desktopGroup
The desktopGroup is the one used for tuning attributes of the absolutely
positioned elements.
parameter DEFAULTROWSTYLE = "ALIGN_ROW_TOP";
Subclasses can change this to alter the default geometry and
alignment of dragGroups within rows.
parameter INCLUDEFILES = "zenCSLM.js,zenDesktop.js";
CSV list of additional include files (either .js or .css) that
should be included when this component is used on a page.
By default, the file extension (.js or .css) is used to determine whether an
item in the list is a script include or a style include. You can override
this behavior by adding the terms "script:" or "style:" to the beginning of
the file name or names. This prefix is not used as part of the include filename.
property colStyle
as %ZEN.Datatype.string(MAXLEN=24,VALUELIST=",,FILL_COLUMN,ALIGN_COLUMN_LEFT,ALIGN_COLUMN_CENTER,ALIGN_COLUMN_RIGHT,FILL_WIDTH,ALIGN_WIDTH_LEFT,ALIGN_WIDTH_CENTER,ALIGN_WIDTH_RIGHT,FILL_UNIFORM,ALIGN_UNIFORM_LEFT,ALIGN_UNIFORM_CENTER,ALIGN_UNIFORM_RIGHT") [ InitialExpression = ..#DEFAULTCOLSTYLE ];
The desktop enforces sizing and alignment constraints on the groups
within its columns. The matrix of the desktop container is row biased
and does not, by default, recognize the existence of columns. Changing
the column style, however, will alter this behavoir such that all the
first elements of the rows will be treated as column one, all the second
elements become column two, etc. Unlike rows (which repack themselves
when are removed or added) columns are allowed to have embedded gaps
where a short row does not reach a given column. There are thirteen
possible configurations.
(null): (the default) The concept of columns is ignored, only row-based
constraints apply. The width of individual dragGroups is allowed to
vary at will
FILL_COLUMN: All dragGroups within a given column take on the width of
the widest group within the column. All subwindows become both left
and right aligned. The spacing of the columns is allowed to vary from
one column to the next
ALIGN_COLUMN_LEFT: The width of the column is dictated by the width of
the widest group within that column but the width of individual sub-
windows is allowed to vary. All dragGroups are left aligned within
their columns. The spacing of the columns is allowed to vary from
one column to the next
ALIGN_COLUMN_CENTER: The width of the column is dictated by the width
of the widest group within that column but the width of individual
subwindows is allowed to vary. All dragGroups are centered within
their columns. The spacing of the columns is allowed to vary from
one column to the next
ALIGN_COLUMN_RIGHT: The width of the column is dictated by the width of
the widest group within that column but the width of individual sub-
windows is allowed to vary. All dragGroups are right aligned within
their columns. The spacing of the columns is allowed to vary from
one column to the next
FILL_WIDTH: The total width of the longest row dictates the layout
bounds for the entire desktop container. The widths of dragGroups
within shorter rows are scaled up proportionately so as to ensure
that right edge of the the last group in each row is aligned
with that of every other row on the desktop.
ALIGN_WIDTH_LEFT: Similar to FILL_WIDTH, the subwindows within rows
are horizontally spaced based on the width of the longest row. The
widths of individual windows is not padded, creating (seemingly)
random spacing between groups within a row.
ALIGN_WIDTH_CENTER: Similar to FILL_WIDTH, the subwindows within rows
are horizontally spaced based on the width of the longest row. The
widths of individual windows is not padded, and the subwindows are
centered within the revised spacing bounds.
ALIGN_WIDTH_RIGHT: Similar to FILL_WIDTH, the subwindows within rows
are horizontally spaced based on the width of the longest row. The
widths of individual windows is not padded. The subwindows are
right aligned within the revised spacing bounds.
FILL_UNIFORM: All columns take on the width and spacing dictated by
the widest dragGroup within the desktop. All groups are given uniform
width, and are automatically left and right aligned
ALIGN_UNIFORM_LEFT: All columns take on the width and spacing dictated
by the widest dragGroup within the desktop. The widths of individual
dragGroups is allowed to vary. All groups within a column are left
aligned.
ALIGN_UNIFORM_CENTER: All columns take on the width and spacing dictated
by the widest dragGroup within the desktop. The widths of individual
dragGroups is allowed to vary. All groups within a column are centered
within the column spacing.
ALIGN_UNIFORM_RIGHT: All columns take on the width and spacing dictated
by the widest dragGroup within the desktop. The widths of individual
dragGroups is allowed to vary. All groups within a column are right
aligned.
property rowStyle
as %ZEN.Datatype.string(MAXLEN=24,VALUELIST=",FILL_ROW,ALIGN_ROW_TOP,ALIGN_ROW_CENTER,ALIGN_ROW_BOTTOM,FILL_UNIFORM,ALIGN_UNIFORM_TOP,ALIGN_UNIFORM_CENTER,ALIGN_UNIFORM_BOTTOM") [ InitialExpression = ..#DEFAULTROWSTYLE ];
The desktop enforces sizing and alignment constraints on the groups
within its rows. There are eight possible configurations.
FILL_ROW: All groups within a row have the height of the tallest
group in the row. By default the top and bottom edges of all the
sub-windows align. Height is allowed to vary from one row to the
next.
ALIGN_ROW_TOP: (the default) The top edge of all subwidows within
a row align. The height of individual subwindows within the row is
allowed to vary. The row spacing is driven by the tallest group
within the row.
ALIGN_ROW_CENTER: All subwidows are centered vertically within their
respective rows. The height of individual dragGroups is allowed to
vary. The row spacing is driven by the tallest group within the row.
ALIGN_ROW_BOTTOM: The bottom edge of all subwidows within a row align.
The height of individual subwindows within the row is allowed to vary.
The row spacing is driven by the tallest group within the row.
FILL_UNIFORM: ALL subwindows within the desktop take on the height of
the tallest dragGroup. This results in all rows being uniformly spaced
vertically and all dragGroups being both top and bottom aligned.
ALIGN_UNIFORM_TOP: All rows within the desktop take on uniform spacing
dictated by the height of the tallest group within the component.
Within each row, the top edges of individual dragGroups align. The
height of individual dragGroups is aloowed to vary.
ALIGN_UNIFORM_CENTER: All rows within the desktop take on uniform
spacing dictated by the height of the tallest group within the
component. Within each row, individual dragGroups are centered
vertically. The height of individual dragGroups is aloowed to vary.
ALIGN_UNIFORM_BOTTOM: All rows within the desktop take on uniform
spacing dictated by the height of the tallest group within the
component. Within each row, the bottom edges of individual dragGroups
align. The height of individual dragGroups is aloowed to vary.
method %DrawHTML()
Static HTML display method: draw the BODY of this component
as HTML.
Subclasses implement this in order to render the static HTML
contents of a component.
method broadcast(signal, value)
[ Language = javascript ]
Send one of several predefined signals to each of the active DragGroup windows associated
with this group. Valid signals to pass include:
"resize" - call the onresize handler (if any) for each window
"disableResize" - remove the resize pip from the lower right corners of the windows
"disableMaxToggle" - reset mouse clicks on the header to the default (drag) behavior
"enableMaxToggle" - redefine the window header to be a maximize button rather than a drag handle
"enableResize" - restore the resize pip to the lower right corners of the windows
"removeDragHeader" - completely hide the drag handle and resize the window to use the recovered space
"restoreDragHeader" - restore the drag handle and resize the window to account for the newly used space
"setHeaderStyle" - given a JSON representation of a style object in value, add the given rules to the existing style of the drag header
"setHeaderLayout" - set the headerLayout property of all children to the given value
method getState()
[ Language = javascript ]
method onRefreshContents()
[ Language = javascript ]
This client event, if present, is fired when the page is loaded.
method onloadHandler()
[ Language = javascript ]
This client event, if present, is fired when the page is loaded.
method restoreState(layout)
[ Language = javascript ]
method setColumnStyle(style)
[ Language = javascript ]
method setHorizontalGap(size)
[ Language = javascript ]
Set the horizontal spacing between rows of dragGroups within the
desktop area
method setLeftMargin(size)
[ Language = javascript ]
Set the left margin between first rows of dragGroups within the
desktop area and the left edge of the desktop itself
method setProperty(property, value, value2)
[ Language = javascript ]
Set the value of a named property.
method setRowStyle(style)
[ Language = javascript ]
method setTopMargin(size)
[ Language = javascript ]
Set the top margin between first rows of dragGroups within the
desktop area and the top of the desktop itself
method setVerticalGap(size)
[ Language = javascript ]
Set the vertical spacing between rows of dragGroups within the
desktop area