scrollbar.js

javascript 很酷的类库

        this.items = [
		    this.startImg,
            this.trackImg,
            this.endImg
            ];
    }
	if (this.showCorner) this.items.add(this._cornerImg);
},


//>	@method	scrollbar.setShowCorner()	(A)
// Start showing the corner piece.
// <p>
// Marks the scrollbar for redraw.
//
//		@param	newState		(boolean)	true == show the corner piece
//<
setShowCorner : function (newState) {
	newState = newState != false;
	
	// if the newState is not the same as the old state
	if (this.showCorner != newState) {
		// set the newState
		this.showCorner = newState;
		// change the image list
		this.setItems();
		// resize the images in preparation for the redraw
		this.resizeImages();
		// mark this object as dirty to be redrawn later
		this.markForRedraw("showCorner")
	}
	return newState;
},


//>	@method	scrollbar.setScrollTarget() ([])
//          Sets or clears the scrollbar's scrollTarget. If no argument is provided, then the
//          scrollTarget will be set to the scrollbar itself.
//
//      @visibility external
//      @group  scroll
//		@param	[newTarget]		(Canvas)	target canvas to be scrolled
//<
//	Make sure we have a scrollTarget defined -- use us if nothing was ever specified.
//	Also, make sure the observation relationship between the scrollbar and the scrollTarget
//	is set up.
setScrollTarget : function (newTarget) {

	// If we have been given a newTarget, stop observing the current scrollTarget that we're
    // observing.
	if (this._selfManaged && 
		 this.scrollTarget != null && 
		 this.isObserving(this.scrollTarget, "scrollTo")) {
		//stop observing (current) this.scrollTarget
		this.ignore(this.scrollTarget, "scrollTo");
	}
		
	// If a newTarget was specified, set the scrollTarget to it.
	// If a newTarget was not specified, we'll use the current scrollTarget. If the
	// current scrollTarget isn't set, we use the scrollBar itself to avoid
	// null pointers
	if (newTarget != null) this.scrollTarget = newTarget;
	// if a target was not specified, use ourself for the target just so stuff doesn't break
	if (this.scrollTarget == null) this.scrollTarget = this;
	
	// We now are sure that we have a scrollTarget. If the scrollTarget has been changed
	// then we re-observe it. Otherwise, we're done.
	// if we've got a scrollTarget and we weren't created by adjustOverflow in the target,
	//	we should observe the _adjustOverflow method of the target to make sure the
	//	size of the thumb matches the visible portion of the target.
	if (this._selfManaged &&
		 this.scrollTarget != this &&
		 this.scrollTarget != newTarget) {
		this.observe(this.scrollTarget, "scrollTo", "observer.setThumb()");
	}

},


//>	@method	scrollbar.setHandleDisabled()	(A)
// Extend setHandleDisabled to hide the thumb and show disabled styling when disabled.
//		@group enable
//
//		@param	disabled (boolean)		true if disabling
//<
setHandleDisabled : function (disabled) {
    // clear out the auto-enabled property - if we were auto disabled, we don't want to
    // auto enable.
    
	// call the superclass method
	this.Super("setHandleDisabled",arguments);

	// hide the thumb if necessary, and set it's _showWithMaster flag to avoid it showing
    // when the scrollbar is shown, if the scrollbar is disabled.
	if (this.thumb) {
        if (disabled) this.thumb.setVisibility(isc.Canvas.HIDDEN)
        else this.thumb.setVisibility(this.visibility);
        this.thumb._showWithMaster = !disabled;
    }

	// make sure our drawn state matches the enabled state
	if (disabled == (this.state == isc.StatefulCanvas.STATE_UP)) {
		this.setState(disabled ? isc.StatefulCanvas.STATE_DISABLED: 
                                 isc.StatefulCanvas.STATE_UP );
	}
    
},


//>	@method	scrollbar.setVisibility()	(A)
// Extended to ensure thumb is placed correctly when this scrollbar is shown.
//		@group	visibility
//
//		@param	newState		(boolean)	new visible state
//<
setVisibility : function (newState,b,c,d) {
	this.invokeSuper(isc.Scrollbar, "setVisibility", newState,b,c,d);
	if (this.isVisible()) this.setThumb();
},

//>	@method	scrollbar.parentVisibilityChanged()	(A)
// Extended to ensure thumb is placed correctly when this scrollbar is shown due to a hidden
// ancestor being shown.
//		@group	visibility
//
//		@param	newState		(boolean)	new visible state
//<
parentVisibilityChanged : function (newState,b,c,d) {
    this.invokeSuper(isc.Scrollbar, "parentVisibilityChanged", newState,b,c,d);
    if (this.isVisible()) this.setThumb();
},

//>	@method	scrollbar.drawPeers()	(A)
//			custom drawPeers routine to size the thumb before it's drawn
//
//		@param	document		(document)
//
//		@return	()
//<
drawPeers : function (a,b,c,d) {
	// call the routine to resize the thumb
	this.setThumb();

	// call the superclass method to actually do the drawing
	this.invokeSuper(isc.Scrollbar, "drawPeers", a,b,c,d);
},


//>	@method	scrollbar.resizePeersBy()	(A)
// Overridden to size the thumb
//
//		@param	deltaX		(number)	change in width
//		@param	deltaY		(number)	change in height
//<
resizePeersBy : function (deltaX, deltaY) {
	this.setThumb();
},

makeThumb : function () {
	// figure out derived attributes
    var classObject = this.vertical ? this.vThumbClass : this.hThumbClass;
	this.thumb = classObject.create({
		ID:this.getID()+"_thumb",
        scrollbar:this,
		state:this.state,
		visibility:this.visibility,

		width : this.vertical ? this.getWidth() : 1,
		height : !this.vertical ? this.getHeight() : 1,
        
        dragScrollDirection : this.vertical ? isc.Canvas.VERTICAL : isc.Canvas.HORIZONTAL
	});
},


//>	@method	scrollbar.setThumb()	(A)
// Resize the thumb so that the thumb's size relative to the track reflects the viewport size
// relative to the overall scrollable area.
//		@param	forceResize		(boolean)	if true, resize regardless of whether it is necessary
//<
setThumb : function () {
    // Bail if the thumb hasn't been created yet. This happens on setWidth() / setHeight()
    // during initWidget()
    if (this.thumb == null || this._suppressSetThumb) return;

    

    var thumb = this.thumb,
        trackSize = this.trackSize();

    // make sure the thumb is above us (we avoid automatically redrawing the thumb, so it can
    // end up underneath the zIndex of the latest draw of the track/buttons)
    if (this.isDrawn() && thumb.isDrawn()) thumb.moveAbove(this);

    // calculate size for thumb
    var size = Math.round(this.scrollTarget.getViewportRatio(this.vertical) * trackSize);

    // don't go below a minimum thumb size (too hard to grab)
    if (!isc.isA.Number(size) || size < this.thumbMinSize) size = this.thumbMinSize;

    // don't let it exceed trackSize
    if (size > trackSize) size = trackSize;

    // always ensure the thumb's thickness matches the available space for it
    var thickness = this.vertical ? this.getWidth() : this.getHeight();
	// resize the thumb
    this.vertical ? thumb.resizeTo(thickness, size) : thumb.resizeTo(size, thickness);
	
	// now move the thumb according to the scroll
	this.moveThumb();
},

// Override 'setZIndex' to ensure the thumb stays above us when our z-index changes.
setZIndex : function (newIndex) {
    this.Super("setZIndex", arguments);
    if (this.thumb) this.thumb.moveAbove(this);
},

//>	@method	scrollbar.moveThumbTo()	(A)
//			move the thumb to a particular coordinate
//
//		@param	coord		(number)	new x or y coordinate to move to
//<
moveThumbTo : function (coord) {
	if (this.vertical)
		return this.thumb.moveTo(this.getLeft(), coord);
	else
		return this.thumb.moveTo(coord, this.getTop());
},


//>	@method	scrollbar.thumbSize()	(A)
//		@group	sizing
//			return the size of the thumb in the direction of the scroll
//		@return	(number)	the size of the thumb in the direction of the scroll
//<
thumbSize : function () {
	return (this.vertical ? this.thumb.getHeight() : this.thumb.getWidth());
},


//>	@method	scrollbar.moveThumb()	(A)
// Move the thumb to the right place for the scroll of the target
// <P>
// May enable/disable the scrollbar if scrolling is no longer necessary because everything is
// visible.
//		@group	sizing
//<
moveThumb : function () {

    var scrollingOn = (this._selfManaged || this.scrollTarget.canScroll(this.vertical));
    
    if (!scrollingOn) {
        if (this.autoEnable) this.disable();
        this.moveThumbTo(this.trackStart());
        return;
    }

    if (this.autoEnable && !this.scrollTarget.isDisabled()) this.enable();
    var scrollRatio = this.scrollTarget.getScrollRatio(this.vertical),
        maxThumbPosition = this.trackSize() - this.thumbSize(),
        thumbCoord = Math.round(scrollRatio * maxThumbPosition);
    
    this.moveThumbTo(thumbCoord + this.trackStart());
    
    // If the thumb moved due to the user holding the mouse down over our track, this kills
    // repeatTrackScrolling 
    var EH = isc.EH;
    if (EH.mouseIsDown() && (EH.mouseDownTarget() == this) && this.thumb.containsEvent())
        this.doneTrackScrolling();
},


_$track:"track",
_$track_start:"track_start",
_$track_end:"track_end",
_$thumb:"thumb",
_$corner:"corner",
//>	@method	scrollbar.trackSize()	(A)
//		@group	sizing
//			return the size of the scroll track
//		@return	(number)	size of the scroll track
//<
trackSize : function () {
	// that's the size of the 'track' object + 2, 
	//	since the thumb overlaps the top and bottom buttons by 1 pixel
    if (this.showTrackEnds == true) 
        return  this.getSize(this.getPartNum(this._$track)) +
                this.getSize(this.getPartNum(this._$track_start)) +
                this.getSize(this.getPartNum(this._$track_end)) + 
                this.startThumbOverlap + this.endThumbOverlap;
    else return this.getSize(this.getPartNum(this._$track)) +
                this.startThumbOverlap + this.endThumbOverlap;
},


//>	@method	scrollbar.trackStart()	(A)
// Return where the scroll track starts
//		@group	sizing
//
//		@return	(number)	relative pixel where the scroll track starts