slider.js

初学者

		this._clipRight = x + this._clipXdelta;
	}
	this.progressBackgroundNode.style.clip = "rect(" + this._clipTop + "px," + this._clipRight + "px," + this._clipBottom + "px," + this._clipLeft + "px)";
}, _calc_valueSizeX:function () {
	var constrainingCtrBox = dojo.html.getContentBox(this.constrainingContainerNode);
	var sliderHandleBox = dojo.html.getContentBox(this.sliderHandleNode);
	if (isNaN(constrainingCtrBox.width) || isNaN(sliderHandleBox.width) || constrainingCtrBox.width <= 0 || sliderHandleBox.width <= 0) {
		return false;
	}
	this._constraintWidth = constrainingCtrBox.width + dojo.html.getPadding(this.constrainingContainerNode).width - sliderHandleBox.width;
	if (this.flipX) {
		this._clipLeft = this._clipRight = constrainingCtrBox.width;
	} else {
		this._clipLeft = this._clipRight = 0;
	}
	this._clipXdelta = sliderHandleBox.width >> 1;
	if (!this.isEnableY) {
		this._clipTop = 0;
		this._clipBottom = constrainingCtrBox.height;
	}
	if (this._constraintWidth <= 0) {
		return false;
	}
	if (this.snapValuesX == 0) {
		this.snapValuesX = this._constraintWidth + 1;
	}
	this._valueSizeX = this._constraintWidth / (this.snapValuesX - 1);
	return true;
}, setValueX:function (value) {
	if (0 == this._valueSizeX) {
		if (this._calc_valueSizeX() == false) {
			dojo.lang.setTimeout(this, "setValueX", 100, value);
			return;
		}
	}
	if (isNaN(value)) {
		value = 0;
	}
	if (value > this.maximumX) {
		value = this.maximumX;
	} else {
		if (value < this.minimumX) {
			value = this.minimumX;
		}
	}
	var pixelPercent = (value - this.minimumX) / (this.maximumX - this.minimumX);
	if (this.flipX) {
		pixelPercent = 1 - pixelPercent;
	}
	this._snapX(pixelPercent * this._constraintWidth);
	this.notifyListeners();
}, getValueX:function () {
	var pixelPercent = dojo.html.getPixelValue(this.sliderHandleNode, "left") / this._constraintWidth;
	if (this.flipX) {
		pixelPercent = 1 - pixelPercent;
	}
	return Math.round(pixelPercent * (this.snapValuesX - 1)) * ((this.maximumX - this.minimumX) / (this.snapValuesX - 1)) + this.minimumX;
}, _snapY:function (y) {
	if (y < 0) {
		y = 0;
	} else {
		if (y > this._constraintHeight) {
			y = this._constraintHeight;
		} else {
			var selectedValue = Math.round(y / this._valueSizeY);
			y = Math.round(selectedValue * this._valueSizeY);
		}
	}
	this.sliderHandleNode.style.top = y + "px";
	if (this.flipY) {
		this._clipTop = y + this._clipYdelta;
	} else {
		this._clipBottom = y + this._clipYdelta;
	}
	this.progressBackgroundNode.style.clip = "rect(" + this._clipTop + "px," + this._clipRight + "px," + this._clipBottom + "px," + this._clipLeft + "px)";
}, _calc_valueSizeY:function () {
	var constrainingCtrBox = dojo.html.getContentBox(this.constrainingContainerNode);
	var sliderHandleBox = dojo.html.getContentBox(this.sliderHandleNode);
	if (isNaN(constrainingCtrBox.height) || isNaN(sliderHandleBox.height) || constrainingCtrBox.height <= 0 || sliderHandleBox.height <= 0) {
		return false;
	}
	this._constraintHeight = constrainingCtrBox.height + dojo.html.getPadding(this.constrainingContainerNode).height - sliderHandleBox.height;
	if (this.flipY) {
		this._clipTop = this._clipBottom = constrainingCtrBox.height;
	} else {
		this._clipTop = this._clipBottom = 0;
	}
	this._clipYdelta = sliderHandleBox.height >> 1;
	if (!this.isEnableX) {
		this._clipLeft = 0;
		this._clipRight = constrainingCtrBox.width;
	}
	if (this._constraintHeight <= 0) {
		return false;
	}
	if (this.snapValuesY == 0) {
		this.snapValuesY = this._constraintHeight + 1;
	}
	this._valueSizeY = this._constraintHeight / (this.snapValuesY - 1);
	return true;
}, setValueY:function (value) {
	if (0 == this._valueSizeY) {
		if (this._calc_valueSizeY() == false) {
			dojo.lang.setTimeout(this, "setValueY", 100, value);
			return;
		}
	}
	if (isNaN(value)) {
		value = 0;
	}
	if (value > this.maximumY) {
		value = this.maximumY;
	} else {
		if (value < this.minimumY) {
			value = this.minimumY;
		}
	}
	var pixelPercent = (value - this.minimumY) / (this.maximumY - this.minimumY);
	if (this.flipY) {
		pixelPercent = 1 - pixelPercent;
	}
	this._snapY(pixelPercent * this._constraintHeight);
	this.notifyListeners();
}, getValueY:function () {
	var pixelPercent = dojo.html.getPixelValue(this.sliderHandleNode, "top") / this._constraintHeight;
	if (this.flipY) {
		pixelPercent = 1 - pixelPercent;
	}
	return Math.round(pixelPercent * (this.snapValuesY - 1)) * ((this.maximumY - this.minimumY) / (this.snapValuesY - 1)) + this.minimumY;
}, _onClick:function (evt) {
	if (this._isDragInProgress) {
		return;
	}
	var parent = dojo.html.getAbsolutePosition(this.constrainingContainerNode, true, dojo.html.boxSizing.MARGIN_BOX);
	var content = dojo.html.getContentBox(this._handleMove.domNode);
	if (this.isEnableX) {
		var x = evt.pageX - parent.x - (content.width >> 1);
		this._snapX(x);
	}
	if (this.isEnableY) {
		var y = evt.pageY - parent.y - (content.height >> 1);
		this._snapY(y);
	}
	this.notifyListeners();
}, notifyListeners:function () {
	this.onValueChanged(this.getValueX(), this.getValueY());
}, onValueChanged:function (x, y) {
}});
dojo.widget.defineWidget("dojo.widget.SliderHorizontal", dojo.widget.Slider, {isEnableX:true, isEnableY:false, initialValue:"", snapValues:"", minimum:"", maximum:"", buttonStyle:"", backgroundSize:"height:10px;width:200px;", backgroundSrc:dojo.uri.moduleUri("dojo.widget", "templates/images/slider-bg.gif"), flip:false, postMixInProperties:function () {
	dojo.widget.SliderHorizontal.superclass.postMixInProperties.apply(this, arguments);
	if (!isNaN(parseFloat(this.initialValue))) {
		this.initialValueX = parseFloat(this.initialValue);
	}
	if (!isNaN(parseFloat(this.minimum))) {
		this.minimumX = parseFloat(this.minimum);
	}
	if (!isNaN(parseFloat(this.maximum))) {
		this.maximumX = parseFloat(this.maximum);
	}
	if (!isNaN(parseInt(this.snapValues))) {
		this.snapValuesX = parseInt(this.snapValues);
	}
	if (dojo.lang.isString(this.buttonStyle) && this.buttonStyle != "") {
		this.buttonStyleX = this.buttonStyle;
	}
	if (dojo.lang.isBoolean(this.flip)) {
		this.flipX = this.flip;
	}
}, notifyListeners:function () {
	this.onValueChanged(this.getValueX());
}, getValue:function () {
	return this.getValueX();
}, setValue:function (value) {
	this.setValueX(value);
}, onValueChanged:function (value) {
}});
dojo.widget.defineWidget("dojo.widget.SliderVertical", dojo.widget.Slider, {isEnableX:false, isEnableY:true, initialValue:"", snapValues:"", minimum:"", maximum:"", buttonStyle:"", backgroundSize:"width:10px;height:200px;", backgroundSrc:dojo.uri.moduleUri("dojo.widget", "templates/images/slider-bg-vert.gif"), flip:false, postMixInProperties:function () {
	dojo.widget.SliderVertical.superclass.postMixInProperties.apply(this, arguments);
	if (!isNaN(parseFloat(this.initialValue))) {
		this.initialValueY = parseFloat(this.initialValue);
	}
	if (!isNaN(parseFloat(this.minimum))) {
		this.minimumY = parseFloat(this.minimum);
	}
	if (!isNaN(parseFloat(this.maximum))) {
		this.maximumY = parseFloat(this.maximum);
	}
	if (!isNaN(parseInt(this.snapValues))) {
		this.snapValuesY = parseInt(this.snapValues);
	}
	if (dojo.lang.isString(this.buttonStyle) && this.buttonStyle != "") {
		this.buttonStyleY = this.buttonStyle;
	}
	if (dojo.lang.isBoolean(this.flip)) {
		this.flipY = this.flip;
	}
}, notifyListeners:function () {
	this.onValueChanged(this.getValueY());
}, getValue:function () {
	return this.getValueY();
}, setValue:function (value) {
	this.setValueY(value);
}, onValueChanged:function (value) {
}});
dojo.declare("dojo.widget._SliderDragMoveSource", dojo.dnd.HtmlDragMoveSource, {slider:null, onDragStart:function (evt) {
	this.slider._isDragInProgress = true;
	var dragObj = this.createDragMoveObject();
	this.slider.notifyListeners();
	return dragObj;
}, onDragEnd:function (evt) {
	this.slider._isDragInProgress = false;
	this.slider.notifyListeners();
}, createDragMoveObject:function () {
	var dragObj = new dojo.widget._SliderDragMoveObject(this.dragObject, this.type);
	dragObj.slider = this.slider;
	if (this.dragClass) {
		dragObj.dragClass = this.dragClass;
	}
	return dragObj;
}, setParent:function (slider) {
	this.slider = slider;
}});
dojo.declare("dojo.widget._SliderDragMoveObject", dojo.dnd.HtmlDragMoveObject, {slider:null, onDragMove:function (evt) {
	this.updateDragOffset();
	if (this.slider.isEnableX) {
		var x = this.dragOffset.x + evt.pageX;
		this.slider._snapX(x);
	}
	if (this.slider.isEnableY) {
		var y = this.dragOffset.y + evt.pageY;
		this.slider._snapY(y);
	}
	if (this.slider.activeDrag) {
		this.slider.notifyListeners();
	}
}});