source: Dev/trunk/src/client/dijit/layout/_LayoutWidget.js @ 529

Last change on this file since 529 was 483, checked in by hendrikvanantwerpen, 11 years ago

Added Dojo 1.9.3 release.
File size: 6.7 KB
Line 
1define([
2        "dojo/_base/lang", // lang.mixin
3        "../_Widget",
4        "../_Container",
5        "../_Contained",
6        "../Viewport",
7        "dojo/_base/declare", // declare
8        "dojo/dom-class", // domClass.add domClass.remove
9        "dojo/dom-geometry", // domGeometry.marginBox
10        "dojo/dom-style" // domStyle.getComputedStyle
11], function(lang, _Widget, _Container, _Contained, Viewport,
12        declare, domClass, domGeometry, domStyle){
13
14        // module:
15        //              dijit/layout/_LayoutWidget
16
17
18        return declare("dijit.layout._LayoutWidget", [_Widget, _Container, _Contained], {
19                // summary:
20                //              Base class for a _Container widget which is responsible for laying out its children.
21                //              Widgets which mixin this code must define layout() to manage placement and sizing of the children.
22
23                // baseClass: [protected extension] String
24                //              This class name is applied to the widget's domNode
25                //              and also may be used to generate names for sub nodes,
26                //              for example dijitTabContainer-content.
27                baseClass: "dijitLayoutContainer",
28
29                // isLayoutContainer: [protected] Boolean
30                //              Indicates that this widget is going to call resize() on its
31                //              children widgets, setting their size, when they become visible.
32                isLayoutContainer: true,
33
34                buildRendering: function(){
35                        this.inherited(arguments);
36                        domClass.add(this.domNode, "dijitContainer");
37                },
38
39                startup: function(){
40                        // summary:
41                        //              Called after all the widgets have been instantiated and their
42                        //              dom nodes have been inserted somewhere under <body>.
43                        //
44                        //              Widgets should override this method to do any initialization
45                        //              dependent on other widgets existing, and then call
46                        //              this superclass method to finish things off.
47                        //
48                        //              startup() in subclasses shouldn't do anything
49                        //              size related because the size of the widget hasn't been set yet.
50
51                        if(this._started){ return; }
52
53                        // Need to call inherited first - so that child widgets get started
54                        // up correctly
55                        this.inherited(arguments);
56
57                        // If I am a not being controlled by a parent layout widget...
58                        var parent = this.getParent && this.getParent();
59                        if(!(parent && parent.isLayoutContainer)){
60                                // Do recursive sizing and layout of all my descendants
61                                // (passing in no argument to resize means that it has to glean the size itself)
62                                this.resize();
63
64                                // Since my parent isn't a layout container, and my style *may be* width=height=100%
65                                // or something similar (either set directly or via a CSS class),
66                                // monitor when viewport size changes so that I can re-layout.
67                                this.own(Viewport.on("resize", lang.hitch(this, "resize")));
68                        }
69                },
70
71                resize: function(changeSize, resultSize){
72                        // summary:
73                        //              Call this to resize a widget, or after its size has changed.
74                        // description:
75                        //              ####Change size mode:
76                        //
77                        //              When changeSize is specified, changes the marginBox of this widget
78                        //              and forces it to re-layout its contents accordingly.
79                        //              changeSize may specify height, width, or both.
80                        //
81                        //              If resultSize is specified it indicates the size the widget will
82                        //              become after changeSize has been applied.
83                        //
84                        //              ####Notification mode:
85                        //
86                        //              When changeSize is null, indicates that the caller has already changed
87                        //              the size of the widget, or perhaps it changed because the browser
88                        //              window was resized.  Tells widget to re-layout its contents accordingly.
89                        //
90                        //              If resultSize is also specified it indicates the size the widget has
91                        //              become.
92                        //
93                        //              In either mode, this method also:
94                        //
95                        //              1. Sets this._borderBox and this._contentBox to the new size of
96                        //                      the widget.  Queries the current domNode size if necessary.
97                        //              2. Calls layout() to resize contents (and maybe adjust child widgets).
98                        // changeSize: Object?
99                        //              Sets the widget to this margin-box size and position.
100                        //              May include any/all of the following properties:
101                        //      |       {w: int, h: int, l: int, t: int}
102                        // resultSize: Object?
103                        //              The margin-box size of this widget after applying changeSize (if
104                        //              changeSize is specified).  If caller knows this size and
105                        //              passes it in, we don't need to query the browser to get the size.
106                        //      |       {w: int, h: int}
107
108                        var node = this.domNode;
109
110                        // set margin box size, unless it wasn't specified, in which case use current size
111                        if(changeSize){
112                                domGeometry.setMarginBox(node, changeSize);
113                        }
114
115                        // If either height or width wasn't specified by the user, then query node for it.
116                        // But note that setting the margin box and then immediately querying dimensions may return
117                        // inaccurate results, so try not to depend on it.
118                        var mb = resultSize || {};
119                        lang.mixin(mb, changeSize || {});       // changeSize overrides resultSize
120                        if( !("h" in mb) || !("w" in mb) ){
121                                mb = lang.mixin(domGeometry.getMarginBox(node), mb);    // just use domGeometry.marginBox() to fill in missing values
122                        }
123
124                        // Compute and save the size of my border box and content box
125                        // (w/out calling domGeometry.getContentBox() since that may fail if size was recently set)
126                        var cs = domStyle.getComputedStyle(node);
127                        var me = domGeometry.getMarginExtents(node, cs);
128                        var be = domGeometry.getBorderExtents(node, cs);
129                        var bb = (this._borderBox = {
130                                w: mb.w - (me.w + be.w),
131                                h: mb.h - (me.h + be.h)
132                        });
133                        var pe = domGeometry.getPadExtents(node, cs);
134                        this._contentBox = {
135                                l: domStyle.toPixelValue(node, cs.paddingLeft),
136                                t: domStyle.toPixelValue(node, cs.paddingTop),
137                                w: bb.w - pe.w,
138                                h: bb.h - pe.h
139                        };
140
141                        // Callback for widget to adjust size of its children
142                        this.layout();
143                },
144
145                layout: function(){
146                        // summary:
147                        //              Widgets override this method to size and position their contents/children.
148                        //              When this is called this._contentBox is guaranteed to be set (see resize()).
149                        //
150                        //              This is called after startup(), and also when the widget's size has been
151                        //              changed.
152                        // tags:
153                        //              protected extension
154                },
155
156                _setupChild: function(/*dijit/_WidgetBase*/child){
157                        // summary:
158                        //              Common setup for initial children and children which are added after startup
159                        // tags:
160                        //              protected extension
161
162                        var cls = this.baseClass + "-child "
163                                + (child.baseClass ? this.baseClass + "-" + child.baseClass : "");
164                        domClass.add(child.domNode, cls);
165                },
166
167                addChild: function(/*dijit/_WidgetBase*/ child, /*Integer?*/ insertIndex){
168                        // Overrides _Container.addChild() to call _setupChild()
169                        this.inherited(arguments);
170                        if(this._started){
171                                this._setupChild(child);
172                        }
173                },
174
175                removeChild: function(/*dijit/_WidgetBase*/ child){
176                        // Overrides _Container.removeChild() to remove class added by _setupChild()
177                        var cls = this.baseClass + "-child"
178                                        + (child.baseClass ?
179                                                " " + this.baseClass + "-" + child.baseClass : "");
180                        domClass.remove(child.domNode, cls);
181
182                        this.inherited(arguments);
183                }
184        });
185});
Note: See TracBrowser for help on using the repository browser.