X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/0494b8d9b9bb03ab6c22b34dae81261e3cd7e3e6..7a654f8d43fdb43d78b63d90528bed6e86b608cc:/docs/source/ScrollerOverflow.html diff --git a/docs/source/ScrollerOverflow.html b/docs/source/ScrollerOverflow.html deleted file mode 100644 index a19c7bd3..00000000 --- a/docs/source/ScrollerOverflow.html +++ /dev/null @@ -1,517 +0,0 @@ - - - - The source code - - - - -
/*!
- * Ext JS Library 3.3.1
- * Copyright(c) 2006-2010 Sencha Inc.
- * licensing@sencha.com
- * http://www.sencha.com/license
- */
-
/** - * @class Ext.layout.boxOverflow.Scroller - * @extends Ext.layout.boxOverflow.None - * Description - */ -Ext.layout.boxOverflow.Scroller = Ext.extend(Ext.layout.boxOverflow.None, { -
/** - * @cfg animateScroll - * @type Boolean - * True to animate the scrolling of items within the layout (defaults to true, ignored if enableScroll is false) - */ - animateScroll: true, - -
/** - * @cfg scrollIncrement - * @type Number - * The number of pixels to scroll by on scroller click (defaults to 100) - */ - scrollIncrement: 100, - -
/** - * @cfg wheelIncrement - * @type Number - * The number of pixels to increment on mouse wheel scrolling (defaults to 3). - */ - wheelIncrement: 3, - -
/** - * @cfg scrollRepeatInterval - * @type Number - * Number of milliseconds between each scroll while a scroller button is held down (defaults to 400) - */ - scrollRepeatInterval: 400, - -
/** - * @cfg scrollDuration - * @type Number - * Number of seconds that each scroll animation lasts (defaults to 0.4) - */ - scrollDuration: 0.4, - -
/** - * @cfg beforeCls - * @type String - * CSS class added to the beforeCt element. This is the element that holds any special items such as scrollers, - * which must always be present at the leftmost edge of the Container - */ - beforeCls: 'x-strip-left', - -
/** - * @cfg afterCls - * @type String - * CSS class added to the afterCt element. This is the element that holds any special items such as scrollers, - * which must always be present at the rightmost edge of the Container - */ - afterCls: 'x-strip-right', - -
/** - * @cfg scrollerCls - * @type String - * CSS class added to both scroller elements if enableScroll is used - */ - scrollerCls: 'x-strip-scroller', - -
/** - * @cfg beforeScrollerCls - * @type String - * CSS class added to the left scroller element if enableScroll is used - */ - beforeScrollerCls: 'x-strip-scroller-left', - -
/** - * @cfg afterScrollerCls - * @type String - * CSS class added to the right scroller element if enableScroll is used - */ - afterScrollerCls: 'x-strip-scroller-right', - - /** - * @private - * Sets up an listener to scroll on the layout's innerCt mousewheel event - */ - createWheelListener: function() { - this.layout.innerCt.on({ - scope : this, - mousewheel: function(e) { - e.stopEvent(); - - this.scrollBy(e.getWheelDelta() * this.wheelIncrement * -1, false); - } - }); - }, - - /** - * @private - * Most of the heavy lifting is done in the subclasses - */ - handleOverflow: function(calculations, targetSize) { - this.createInnerElements(); - this.showScrollers(); - }, - - /** - * @private - */ - clearOverflow: function() { - this.hideScrollers(); - }, - - /** - * @private - * Shows the scroller elements in the beforeCt and afterCt. Creates the scrollers first if they are not already - * present. - */ - showScrollers: function() { - this.createScrollers(); - - this.beforeScroller.show(); - this.afterScroller.show(); - - this.updateScrollButtons(); - }, - - /** - * @private - * Hides the scroller elements in the beforeCt and afterCt - */ - hideScrollers: function() { - if (this.beforeScroller != undefined) { - this.beforeScroller.hide(); - this.afterScroller.hide(); - } - }, - - /** - * @private - * Creates the clickable scroller elements and places them into the beforeCt and afterCt - */ - createScrollers: function() { - if (!this.beforeScroller && !this.afterScroller) { - var before = this.beforeCt.createChild({ - cls: String.format("{0} {1} ", this.scrollerCls, this.beforeScrollerCls) - }); - - var after = this.afterCt.createChild({ - cls: String.format("{0} {1}", this.scrollerCls, this.afterScrollerCls) - }); - - before.addClassOnOver(this.beforeScrollerCls + '-hover'); - after.addClassOnOver(this.afterScrollerCls + '-hover'); - - before.setVisibilityMode(Ext.Element.DISPLAY); - after.setVisibilityMode(Ext.Element.DISPLAY); - - this.beforeRepeater = new Ext.util.ClickRepeater(before, { - interval: this.scrollRepeatInterval, - handler : this.scrollLeft, - scope : this - }); - - this.afterRepeater = new Ext.util.ClickRepeater(after, { - interval: this.scrollRepeatInterval, - handler : this.scrollRight, - scope : this - }); - -
/** - * @property beforeScroller - * @type Ext.Element - * The left scroller element. Only created when needed. - */ - this.beforeScroller = before; - -
/** - * @property afterScroller - * @type Ext.Element - * The left scroller element. Only created when needed. - */ - this.afterScroller = after; - } - }, - - /** - * @private - */ - destroy: function() { - Ext.destroy(this.beforeScroller, this.afterScroller, this.beforeRepeater, this.afterRepeater, this.beforeCt, this.afterCt); - }, - - /** - * @private - * Scrolls left or right by the number of pixels specified - * @param {Number} delta Number of pixels to scroll to the right by. Use a negative number to scroll left - */ - scrollBy: function(delta, animate) { - this.scrollTo(this.getScrollPosition() + delta, animate); - }, - - /** - * @private - * Normalizes an item reference, string id or numerical index into a reference to the item - * @param {Ext.Component|String|Number} item The item reference, id or index - * @return {Ext.Component} The item - */ - getItem: function(item) { - if (Ext.isString(item)) { - item = Ext.getCmp(item); - } else if (Ext.isNumber(item)) { - item = this.items[item]; - } - - return item; - }, - - /** - * @private - * @return {Object} Object passed to scrollTo when scrolling - */ - getScrollAnim: function() { - return { - duration: this.scrollDuration, - callback: this.updateScrollButtons, - scope : this - }; - }, - - /** - * @private - * Enables or disables each scroller button based on the current scroll position - */ - updateScrollButtons: function() { - if (this.beforeScroller == undefined || this.afterScroller == undefined) { - return; - } - - var beforeMeth = this.atExtremeBefore() ? 'addClass' : 'removeClass', - afterMeth = this.atExtremeAfter() ? 'addClass' : 'removeClass', - beforeCls = this.beforeScrollerCls + '-disabled', - afterCls = this.afterScrollerCls + '-disabled'; - - this.beforeScroller[beforeMeth](beforeCls); - this.afterScroller[afterMeth](afterCls); - this.scrolling = false; - }, - - /** - * @private - * Returns true if the innerCt scroll is already at its left-most point - * @return {Boolean} True if already at furthest left point - */ - atExtremeBefore: function() { - return this.getScrollPosition() === 0; - }, - - /** - * @private - * Scrolls to the left by the configured amount - */ - scrollLeft: function(animate) { - this.scrollBy(-this.scrollIncrement, animate); - }, - - /** - * @private - * Scrolls to the right by the configured amount - */ - scrollRight: function(animate) { - this.scrollBy(this.scrollIncrement, animate); - }, - -
/** - * Scrolls to the given component. - * @param {String|Number|Ext.Component} item The item to scroll to. Can be a numerical index, component id - * or a reference to the component itself. - * @param {Boolean} animate True to animate the scrolling - */ - scrollToItem: function(item, animate) { - item = this.getItem(item); - - if (item != undefined) { - var visibility = this.getItemVisibility(item); - - if (!visibility.fullyVisible) { - var box = item.getBox(true, true), - newX = box.x; - - if (visibility.hiddenRight) { - newX -= (this.layout.innerCt.getWidth() - box.width); - } - - this.scrollTo(newX, animate); - } - } - }, - - /** - * @private - * For a given item in the container, return an object with information on whether the item is visible - * with the current innerCt scroll value. - * @param {Ext.Component} item The item - * @return {Object} Values for fullyVisible, hiddenLeft and hiddenRight - */ - getItemVisibility: function(item) { - var box = this.getItem(item).getBox(true, true), - itemLeft = box.x, - itemRight = box.x + box.width, - scrollLeft = this.getScrollPosition(), - scrollRight = this.layout.innerCt.getWidth() + scrollLeft; - - return { - hiddenLeft : itemLeft < scrollLeft, - hiddenRight : itemRight > scrollRight, - fullyVisible: itemLeft > scrollLeft && itemRight < scrollRight - }; - } -}); - -Ext.layout.boxOverflow.scroller = Ext.layout.boxOverflow.Scroller; - - -
/** - * @class Ext.layout.boxOverflow.VerticalScroller - * @extends Ext.layout.boxOverflow.Scroller - * Description - */ -Ext.layout.boxOverflow.VerticalScroller = Ext.extend(Ext.layout.boxOverflow.Scroller, { - scrollIncrement: 75, - wheelIncrement : 2, - - handleOverflow: function(calculations, targetSize) { - Ext.layout.boxOverflow.VerticalScroller.superclass.handleOverflow.apply(this, arguments); - - return { - targetSize: { - height: targetSize.height - (this.beforeCt.getHeight() + this.afterCt.getHeight()), - width : targetSize.width - } - }; - }, - - /** - * @private - * Creates the beforeCt and afterCt elements if they have not already been created - */ - createInnerElements: function() { - var target = this.layout.innerCt; - - //normal items will be rendered to the innerCt. beforeCt and afterCt allow for fixed positioning of - //special items such as scrollers or dropdown menu triggers - if (!this.beforeCt) { - this.beforeCt = target.insertSibling({cls: this.beforeCls}, 'before'); - this.afterCt = target.insertSibling({cls: this.afterCls}, 'after'); - - this.createWheelListener(); - } - }, - - /** - * @private - * Scrolls to the given position. Performs bounds checking. - * @param {Number} position The position to scroll to. This is constrained. - * @param {Boolean} animate True to animate. If undefined, falls back to value of this.animateScroll - */ - scrollTo: function(position, animate) { - var oldPosition = this.getScrollPosition(), - newPosition = position.constrain(0, this.getMaxScrollBottom()); - - if (newPosition != oldPosition && !this.scrolling) { - if (animate == undefined) { - animate = this.animateScroll; - } - - this.layout.innerCt.scrollTo('top', newPosition, animate ? this.getScrollAnim() : false); - - if (animate) { - this.scrolling = true; - } else { - this.scrolling = false; - this.updateScrollButtons(); - } - } - }, - -
/** - * Returns the current scroll position of the innerCt element - * @return {Number} The current scroll position - */ - getScrollPosition: function(){ - return parseInt(this.layout.innerCt.dom.scrollTop, 10) || 0; - }, - - /** - * @private - * Returns the maximum value we can scrollTo - * @return {Number} The max scroll value - */ - getMaxScrollBottom: function() { - return this.layout.innerCt.dom.scrollHeight - this.layout.innerCt.getHeight(); - }, - - /** - * @private - * Returns true if the innerCt scroll is already at its right-most point - * @return {Boolean} True if already at furthest right point - */ - atExtremeAfter: function() { - return this.getScrollPosition() >= this.getMaxScrollBottom(); - } -}); - -Ext.layout.boxOverflow.scroller.vbox = Ext.layout.boxOverflow.VerticalScroller; - - -
/** - * @class Ext.layout.boxOverflow.HorizontalScroller - * @extends Ext.layout.boxOverflow.Scroller - * Description - */ -Ext.layout.boxOverflow.HorizontalScroller = Ext.extend(Ext.layout.boxOverflow.Scroller, { - handleOverflow: function(calculations, targetSize) { - Ext.layout.boxOverflow.HorizontalScroller.superclass.handleOverflow.apply(this, arguments); - - return { - targetSize: { - height: targetSize.height, - width : targetSize.width - (this.beforeCt.getWidth() + this.afterCt.getWidth()) - } - }; - }, - - /** - * @private - * Creates the beforeCt and afterCt elements if they have not already been created - */ - createInnerElements: function() { - var target = this.layout.innerCt; - - //normal items will be rendered to the innerCt. beforeCt and afterCt allow for fixed positioning of - //special items such as scrollers or dropdown menu triggers - if (!this.beforeCt) { - this.afterCt = target.insertSibling({cls: this.afterCls}, 'before'); - this.beforeCt = target.insertSibling({cls: this.beforeCls}, 'before'); - - this.createWheelListener(); - } - }, - - /** - * @private - * Scrolls to the given position. Performs bounds checking. - * @param {Number} position The position to scroll to. This is constrained. - * @param {Boolean} animate True to animate. If undefined, falls back to value of this.animateScroll - */ - scrollTo: function(position, animate) { - var oldPosition = this.getScrollPosition(), - newPosition = position.constrain(0, this.getMaxScrollRight()); - - if (newPosition != oldPosition && !this.scrolling) { - if (animate == undefined) { - animate = this.animateScroll; - } - - this.layout.innerCt.scrollTo('left', newPosition, animate ? this.getScrollAnim() : false); - - if (animate) { - this.scrolling = true; - } else { - this.scrolling = false; - this.updateScrollButtons(); - } - } - }, - -
/** - * Returns the current scroll position of the innerCt element - * @return {Number} The current scroll position - */ - getScrollPosition: function(){ - return parseInt(this.layout.innerCt.dom.scrollLeft, 10) || 0; - }, - - /** - * @private - * Returns the maximum value we can scrollTo - * @return {Number} The max scroll value - */ - getMaxScrollRight: function() { - return this.layout.innerCt.dom.scrollWidth - this.layout.innerCt.getWidth(); - }, - - /** - * @private - * Returns true if the innerCt scroll is already at its right-most point - * @return {Boolean} True if already at furthest right point - */ - atExtremeAfter: function() { - return this.getScrollPosition() >= this.getMaxScrollRight(); - } -}); - -Ext.layout.boxOverflow.scroller.hbox = Ext.layout.boxOverflow.HorizontalScroller;
- - \ No newline at end of file