| 1 | define([ |
|---|
| 2 | "dojo/_base/kernel", |
|---|
| 3 | "dojo/_base/config", |
|---|
| 4 | "dojo/_base/declare", |
|---|
| 5 | "dojo/_base/lang", |
|---|
| 6 | "dojo/_base/window", |
|---|
| 7 | "dojo/dom", |
|---|
| 8 | "dojo/dom-class", |
|---|
| 9 | "dijit/registry", // registry.byNode |
|---|
| 10 | "./scrollable" |
|---|
| 11 | ], function(dojo, config, declare, lang, win, dom, domClass, registry, Scrollable){ |
|---|
| 12 | // module: |
|---|
| 13 | // dojox/mobile/_ScrollableMixin |
|---|
| 14 | |
|---|
| 15 | var cls = declare("dojox.mobile._ScrollableMixin", Scrollable, { |
|---|
| 16 | // summary: |
|---|
| 17 | // Mixin for widgets to have a touch scrolling capability. |
|---|
| 18 | |
|---|
| 19 | // fixedHeader: String |
|---|
| 20 | // Id of the fixed header. |
|---|
| 21 | fixedHeader: "", |
|---|
| 22 | |
|---|
| 23 | // fixedFooter: String |
|---|
| 24 | // Id of the fixed footer. |
|---|
| 25 | fixedFooter: "", |
|---|
| 26 | |
|---|
| 27 | _fixedAppFooter: "", |
|---|
| 28 | |
|---|
| 29 | // scrollableParams: Object |
|---|
| 30 | // Parameters for dojox/mobile/scrollable.init(). |
|---|
| 31 | scrollableParams: null, |
|---|
| 32 | |
|---|
| 33 | // allowNestedScrolls: Boolean |
|---|
| 34 | // Flag to allow scrolling in nested containers, e.g. to allow ScrollableView in a SwapView. |
|---|
| 35 | allowNestedScrolls: true, |
|---|
| 36 | |
|---|
| 37 | // appBars: Boolean |
|---|
| 38 | // Enables the search for application-specific bars (header or footer). |
|---|
| 39 | appBars: true, |
|---|
| 40 | |
|---|
| 41 | constructor: function(){ |
|---|
| 42 | // summary: |
|---|
| 43 | // Creates a new instance of the class. |
|---|
| 44 | // tags: |
|---|
| 45 | // private |
|---|
| 46 | this.scrollableParams = {}; |
|---|
| 47 | }, |
|---|
| 48 | |
|---|
| 49 | destroy: function(){ |
|---|
| 50 | this.cleanup(); |
|---|
| 51 | this.inherited(arguments); |
|---|
| 52 | }, |
|---|
| 53 | |
|---|
| 54 | startup: function(){ |
|---|
| 55 | if(this._started){ return; } |
|---|
| 56 | if(this._fixedAppFooter){ |
|---|
| 57 | this._fixedAppFooter = dom.byId(this._fixedAppFooter); |
|---|
| 58 | } |
|---|
| 59 | this.findAppBars(); |
|---|
| 60 | var node, params = this.scrollableParams; |
|---|
| 61 | if(this.fixedHeader){ |
|---|
| 62 | node = dom.byId(this.fixedHeader); |
|---|
| 63 | if(node.parentNode == this.domNode){ // local footer |
|---|
| 64 | this.isLocalHeader = true; |
|---|
| 65 | } |
|---|
| 66 | params.fixedHeaderHeight = node.offsetHeight; |
|---|
| 67 | } |
|---|
| 68 | if(this.fixedFooter){ |
|---|
| 69 | node = dom.byId(this.fixedFooter); |
|---|
| 70 | if(node.parentNode == this.domNode){ // local footer |
|---|
| 71 | this.isLocalFooter = true; |
|---|
| 72 | node.style.bottom = "0px"; |
|---|
| 73 | } |
|---|
| 74 | params.fixedFooterHeight = node.offsetHeight; |
|---|
| 75 | } |
|---|
| 76 | this.scrollType = this.scrollType || config["mblScrollableScrollType"] || 0; |
|---|
| 77 | this.init(params); |
|---|
| 78 | if(this.allowNestedScrolls){ |
|---|
| 79 | for(var p = this.getParent(); p; p = p.getParent()){ |
|---|
| 80 | if(p && p.scrollableParams){ |
|---|
| 81 | this.dirLock = true; |
|---|
| 82 | p.dirLock = true; |
|---|
| 83 | break; |
|---|
| 84 | } |
|---|
| 85 | } |
|---|
| 86 | } |
|---|
| 87 | // subscribe to afterResizeAll to scroll the focused input field into view |
|---|
| 88 | // so as not to break layout on orientation changes while keyboard is shown (#14991) |
|---|
| 89 | this._resizeHandle = this.subscribe("/dojox/mobile/afterResizeAll", function(){ |
|---|
| 90 | if(this.domNode.style.display === 'none'){ return; } |
|---|
| 91 | var elem = win.doc.activeElement; |
|---|
| 92 | if(this.isFormElement(elem) && dom.isDescendant(elem, this.containerNode)){ |
|---|
| 93 | this.scrollIntoView(elem); |
|---|
| 94 | } |
|---|
| 95 | }); |
|---|
| 96 | this.inherited(arguments); |
|---|
| 97 | }, |
|---|
| 98 | |
|---|
| 99 | findAppBars: function(){ |
|---|
| 100 | // summary: |
|---|
| 101 | // Search for application-specific header or footer. |
|---|
| 102 | if(!this.appBars){ return; } |
|---|
| 103 | var i, len, c; |
|---|
| 104 | for(i = 0, len = win.body().childNodes.length; i < len; i++){ |
|---|
| 105 | c = win.body().childNodes[i]; |
|---|
| 106 | this.checkFixedBar(c, false); |
|---|
| 107 | } |
|---|
| 108 | if(this.domNode.parentNode){ |
|---|
| 109 | for(i = 0, len = this.domNode.parentNode.childNodes.length; i < len; i++){ |
|---|
| 110 | c = this.domNode.parentNode.childNodes[i]; |
|---|
| 111 | this.checkFixedBar(c, false); |
|---|
| 112 | } |
|---|
| 113 | } |
|---|
| 114 | this.fixedFooterHeight = this.fixedFooter ? this.fixedFooter.offsetHeight : 0; |
|---|
| 115 | }, |
|---|
| 116 | |
|---|
| 117 | checkFixedBar: function(/*DomNode*/node, /*Boolean*/local){ |
|---|
| 118 | // summary: |
|---|
| 119 | // Checks if the given node is a fixed bar or not. |
|---|
| 120 | if(node.nodeType === 1){ |
|---|
| 121 | var fixed = node.getAttribute("fixed") // TODO: Remove the non-HTML5-compliant attribute in 2.0 |
|---|
| 122 | || node.getAttribute("data-mobile-fixed") |
|---|
| 123 | || (registry.byNode(node) && registry.byNode(node).fixed); |
|---|
| 124 | if(fixed === "top"){ |
|---|
| 125 | domClass.add(node, "mblFixedHeaderBar"); |
|---|
| 126 | if(local){ |
|---|
| 127 | node.style.top = "0px"; |
|---|
| 128 | this.fixedHeader = node; |
|---|
| 129 | } |
|---|
| 130 | return fixed; |
|---|
| 131 | }else if(fixed === "bottom"){ |
|---|
| 132 | domClass.add(node, "mblFixedBottomBar"); |
|---|
| 133 | if(local){ |
|---|
| 134 | this.fixedFooter = node; |
|---|
| 135 | }else{ |
|---|
| 136 | this._fixedAppFooter = node; |
|---|
| 137 | } |
|---|
| 138 | return fixed; |
|---|
| 139 | } |
|---|
| 140 | } |
|---|
| 141 | return null; |
|---|
| 142 | } |
|---|
| 143 | }); |
|---|
| 144 | return cls; |
|---|
| 145 | }); |
|---|
