source: Dev/branches/rest-dojo-ui/client/dojox/mobile/ScrollableView.js @ 256

define([
        "dojo/_base/array",
        "dojo/_base/declare",
        "dojo/dom-class",
        "dojo/dom-construct",
        "dijit/registry",       // registry.byNode
        "./View",
        "./_ScrollableMixin"
], function(array, declare, domClass, domConstruct, registry, View, ScrollableMixin){

        /*=====
                var View = dojox.mobile.View;
                var ScrollableMixin = dojox.mobile._ScrollableMixin;
        =====*/

        // module:
        //              dojox/mobile/ScrollableView
        // summary:
        //              A container that has a touch scrolling capability.

        return declare("dojox.mobile.ScrollableView", [View, ScrollableMixin], {
                // summary:
                //              A container that has a touch scrolling capability.
                // description:
                //              ScrollableView is a subclass of View (=dojox.mobile.View).
                //              Unlike the base View class, ScrollableView's domNode always stays
                //              at the top of the screen and its height is "100%" of the screen.
                //              In this fixed domNode, containerNode scrolls. Browser's default
                //              scrolling behavior is disabled, and the scrolling machinery is
                //              re-implemented with JavaScript. Thus the user does not need to use the
                //              two-finger operation to scroll an inner DIV (containerNode).
                //              The main purpose of this widget is to realize fixed-positioned header
                //              and/or footer bars.

                // scrollableParams: Object
                //              Parameters for dojox.mobile.scrollable.init().
                scrollableParams: null,

                // keepScrollPos: Boolean
                //              Overrides dojox.mobile.View.keepScrollPos.
                keepScrollPos: false,

                constructor: function(){
                        this.scrollableParams = {noResize: true};
                },

                buildRendering: function(){
                        this.inherited(arguments);
                        domClass.add(this.domNode, "mblScrollableView");
                        this.domNode.style.overflow = "hidden";
                        this.domNode.style.top = "0px";
                        this.containerNode = domConstruct.create("DIV",
                                {className:"mblScrollableViewContainer"}, this.domNode);
                        this.containerNode.style.position = "absolute";
                        this.containerNode.style.top = "0px"; // view bar is relative
                        if(this.scrollDir === "v"){
                                this.containerNode.style.width = "100%";
                        }
                        this.reparent();
                        this.findAppBars();
                },

                resize: function(){
                        // summary:
                        //              Calls resize() of each child widget.
                        this.inherited(arguments); // scrollable#resize() will be called
                        array.forEach(this.getChildren(), function(child){
                                if(child.resize){ child.resize(); }
                        });
                },

                isTopLevel: function(e){
                        // summary:
                        //              Returns true if this is a top-level widget.
                        //              Overrides dojox.mobile.scrollable.
                        var parent = this.getParent && this.getParent();
                        return (!parent || !parent.resize); // top level widget
                },

                addChild: function(widget, /*Number?*/insertIndex){
                        var c = widget.domNode;
                        var fixed = this.checkFixedBar(c, true);
                        if(fixed){
                                // Addition of a fixed bar is an exceptional case.
                                // It has to be added to domNode, not containerNode.
                                // In this case, insertIndex is ignored.
                                this.domNode.appendChild(c);
                                if(fixed === "top"){
                                        this.fixedHeaderHeight = c.offsetHeight;
                                        this.isLocalHeader = true;
                                }else if(fixed === "bottom"){
                                        this.fixedFooterHeight = c.offsetHeight;
                                        this.isLocalFooter = true;
                                        c.style.bottom = "0px";
                                }
                                this.resize();
                                if(this._started && !widget._started){
                                        widget.startup();
                                }
                        }else{
                                this.inherited(arguments);
                        }
                },

                reparent: function(){
                        // summary:
                        //              Moves all the children, except header and footer, to
                        //              containerNode.
                        var i, idx, len, c;
                        for(i = 0, idx = 0, len = this.domNode.childNodes.length; i < len; i++){
                                c = this.domNode.childNodes[idx];
                                // search for view-specific header or footer
                                if(c === this.containerNode || this.checkFixedBar(c, true)){
                                        idx++;
                                        continue;
                                }
                                this.containerNode.appendChild(this.domNode.removeChild(c));
                        }
                },

                onAfterTransitionIn: function(moveTo, dir, transition, context, method){
                        this.flashScrollBar();
                },
        
                getChildren: function(){
                        // summary:
                        //              Overrides _WidgetBase#getChildren to add local fixed bars,
                        //              which are not under containerNode, to the children array.
                        var children = this.inherited(arguments);
                        if(this.fixedHeader && this.fixedHeader.parentNode === this.domNode){
                                children.push(registry.byNode(this.fixedHeader));
                        }
                        if(this.fixedFooter && this.fixedFooter.parentNode === this.domNode){
                                children.push(registry.byNode(this.fixedFooter));
                        }
                        return children;
                }
        });
});