123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228 |
- if (!dojo._hasResource["dijit.layout._LayoutWidget"]) { // _hasResource checks
- // added by build. Do
- // not use _hasResource
- // directly in your
- // code.
- dojo._hasResource["dijit.layout._LayoutWidget"] = true;
- dojo.provide("dijit.layout._LayoutWidget");
- dojo.require("dijit._Widget");
- dojo.require("dijit._Container");
- dojo.declare("dijit.layout._LayoutWidget", [dijit._Widget,
- dijit._Container, dijit._Contained], {
- // summary
- // Mixin for widgets that contain a list of children like
- // SplitContainer.
- // Widgets which mixin this code must define layout() to lay out
- // the children
- isLayoutContainer : true,
- postCreate : function() {
- dojo.addClass(this.domNode, "dijitContainer");
- },
- startup : function() {
- // summary:
- // Called after all the widgets have been instantiated and
- // their
- // dom nodes have been inserted somewhere under
- // document.body.
- //
- // Widgets should override this method to do any
- // initialization
- // dependent on other widgets existing, and then call
- // this superclass method to finish things off.
- //
- // startup() in subclasses shouldn't do anything
- // size related because the size of the widget hasn't been
- // set yet.
- if (this._started) {
- return;
- }
- this._started = true;
- if (this.getChildren) {
- dojo.forEach(this.getChildren(), function(child) {
- child.startup();
- });
- }
- // If I am a top level widget
- if (!this.getParent || !this.getParent()) {
- // Do recursive sizing and layout of all my descendants
- // (passing in no argument to resize means that it has
- // to glean the size itself)
- this.resize();
- // since my parent isn't a layout container, and my
- // style is width=height=100% (or something similar),
- // then I need to watch when the window resizes, and
- // size myself accordingly
- // (passing in no argument to resize means that it has
- // to glean the size itself)
- this.connect(window, 'onresize', function() {
- this.resize();
- });
- }
- },
- resize : function(args) {
- // summary:
- // Explicitly set this widget's size (in pixels),
- // and then call layout() to resize contents (and maybe
- // adjust child widgets)
- //
- // args: Object?
- // {w: int, h: int, l: int, t: int}
- var node = this.domNode;
- // set margin box size, unless it wasn't specified, in which
- // case use current size
- if (args) {
- dojo.marginBox(node, args);
- // set offset of the node
- if (args.t) {
- node.style.top = args.t + "px";
- }
- if (args.l) {
- node.style.left = args.l + "px";
- }
- }
- // If either height or width wasn't specified by the user,
- // then query node for it.
- // But note that setting the margin box and then immediately
- // querying dimensions may return
- // inaccurate results, so try not to depend on it.
- var mb = dojo.mixin(dojo.marginBox(node), args || {});
- // Save the size of my content box.
- this._contentBox = dijit.layout.marginBox2contentBox(node,
- mb);
- // Callback for widget to adjust size of it's children
- this.layout();
- },
- layout : function() {
- // summary
- // Widgets override this method to size & position their
- // contents/children.
- // When this is called this._contentBox is guaranteed to be
- // set (see resize()).
- //
- // This is called after startup(), and also when the
- // widget's size has been
- // changed.
- }
- });
- dijit.layout.marginBox2contentBox = function(/* DomNode */node, /* Object */
- mb) {
- // summary:
- // Given the margin-box size of a node, return it's content box size.
- // Functions like dojo.contentBox() but is more reliable since it
- // doesn't have
- // to wait for the browser to compute sizes.
- var cs = dojo.getComputedStyle(node);
- var me = dojo._getMarginExtents(node, cs);
- var pb = dojo._getPadBorderExtents(node, cs);
- return {
- l : dojo._toPixelValue(node, cs.paddingLeft),
- t : dojo._toPixelValue(node, cs.paddingTop),
- w : mb.w - (me.w + pb.w),
- h : mb.h - (me.h + pb.h)
- };
- };
- (function() {
- var capitalize = function(word) {
- return word.substring(0, 1).toUpperCase() + word.substring(1);
- };
- var size = function(widget, dim) {
- // size the child
- widget.resize ? widget.resize(dim) : dojo.marginBox(widget.domNode,
- dim);
- // record child's size, but favor our own numbers when we have them.
- // the browser lies sometimes
- dojo.mixin(widget, dojo.marginBox(widget.domNode));
- dojo.mixin(widget, dim);
- };
- dijit.layout.layoutChildren = function(/* DomNode */container, /* Object */
- dim, /* Object[] */children) {
- /**
- * summary Layout a bunch of child dom nodes within a parent dom
- * node container: parent node dim: {l, t, w, h} object specifying
- * dimensions of container into which to place children children: an
- * array like [ {domNode: foo, layoutAlign: "bottom" }, {domNode:
- * bar, layoutAlign: "client"} ]
- */
- // copy dim because we are going to modify it
- dim = dojo.mixin({}, dim);
- dojo.addClass(container, "dijitLayoutContainer");
- // Move "client" elements to the end of the array for layout. a11y
- // dictates that the author
- // needs to be able to put them in the document in tab-order, but
- // this algorithm requires that
- // client be last.
- children = dojo.filter(children, function(item) {
- return item.layoutAlign != "client";
- }).concat(dojo.filter(children, function(item) {
- return item.layoutAlign == "client";
- }));
- // set positions/sizes
- dojo.forEach(children, function(child) {
- var elm = child.domNode, pos = child.layoutAlign;
- // set elem to upper left corner of unused space; may
- // move it later
- var elmStyle = elm.style;
- elmStyle.left = dim.l + "px";
- elmStyle.top = dim.t + "px";
- elmStyle.bottom = elmStyle.right = "auto";
- dojo.addClass(elm, "dijitAlign" + capitalize(pos));
- // set size && adjust record of remaining space.
- // note that setting the width of a <div> may affect
- // it's height.
- if (pos == "top" || pos == "bottom") {
- size(child, {
- w : dim.w
- });
- dim.h -= child.h;
- if (pos == "top") {
- dim.t += child.h;
- } else {
- elmStyle.top = dim.t + dim.h + "px";
- }
- } else if (pos == "left" || pos == "right") {
- size(child, {
- h : dim.h
- });
- dim.w -= child.w;
- if (pos == "left") {
- dim.l += child.w;
- } else {
- elmStyle.left = dim.l + dim.w + "px";
- }
- } else if (pos == "client") {
- size(child, dim);
- }
- });
- };
- })();
- }
|