+++ /dev/null
-/*!
- * 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 <tt>3</tt>).
- */
- 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;
-
-
-/**\r
- * @class Ext.layout.boxOverflow.VerticalScroller\r
- * @extends Ext.layout.boxOverflow.Scroller\r
- * Description\r
- */\r
-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
git.ithinksw.org / extjs.git / blobdiff