Rev 1372 | Go to most recent revision | Blame | Compare with Previous | Last modification | View Log | RSS feed
/*Copyright (c) 2004-2006, The Dojo FoundationAll Rights Reserved.Licensed under the Academic Free License version 2.1 or above OR themodified BSD license. For more information on Dojo licensing, see:http://dojotoolkit.org/community/licensing.shtml*/dojo.provide("dojo.widget.ProgressBar");dojo.require("dojo.widget.*");dojo.require("dojo.event");dojo.require("dojo.dom");dojo.require("dojo.html.style");dojo.require("dojo.string.*");dojo.require("dojo.lfx.*");dojo.widget.defineWidget("dojo.widget.ProgressBar", dojo.widget.HtmlWidget, {progressValue:0, maxProgressValue:100, width:300, height:30, frontPercentClass:"frontPercent", backPercentClass:"backPercent", frontBarClass:"frontBar", backBarClass:"backBar", hasText:false, isVertical:false, showOnlyIntegers:false, dataSource:"", pollInterval:3000, duration:1000, templateString:"<div dojoAttachPoint=\"containerNode\" style=\"position:relative;overflow:hidden\">\n\t<div style=\"position:absolute;display:none;width:100%;text-align:center\" dojoAttachPoint=\"backPercentLabel\" class=\"dojoBackPercentLabel\"></div>\n\t<div style=\"position:absolute;overflow:hidden;width:100%;height:100%\" dojoAttachPoint=\"internalProgress\">\n\t<div style=\"position:absolute;display:none;width:100%;text-align:center\" dojoAttachPoint=\"frontPercentLabel\" class=\"dojoFrontPercentLabel\"></div></div>\n</div>\n", templateCssString:".backBar{\n\tborder:1px solid #84a3d1;\n}\n.frontBar{\n\tbackground:url(\"images/bar.gif\") repeat bottomleft;\n\tbackground-attachment: fixed;\n}\n.h-frontBar{\n\tbackground:url(\"images/h-bar.gif\") repeat bottom left;\n\tbackground-attachment: fixed;\n}\n.simpleFrontBar{\n\tbackground: red;\n}\n.frontPercent,.backPercent{\n\tfont:bold 13px helvetica;\n}\n.backPercent{\n\tcolor:#293a4b;\n}\n.frontPercent{\n\tcolor:#fff;\n}\n", templateCssPath:dojo.uri.moduleUri("dojo.widget", "templates/ProgressBar.css"), containerNode:null, internalProgress:null, _pixelUnitRatio:0, _pixelPercentRatio:0, _unitPercentRatio:0, _unitPixelRatio:0, _floatDimension:0, _intDimension:0, _progressPercentValue:"0%", _floatMaxProgressValue:0, _dimension:"width", _pixelValue:0, _oInterval:null, _animation:null, _animationStopped:true, _progressValueBak:false, _hasTextBak:false, fillInTemplate:function (args, frag) {this.internalProgress.className = this.frontBarClass;this.containerNode.className = this.backBarClass;if (this.isVertical) {this.internalProgress.style.bottom = "0px";this.internalProgress.style.left = "0px";this._dimension = "height";} else {this.internalProgress.style.top = "0px";this.internalProgress.style.left = "0px";this._dimension = "width";}this.frontPercentLabel.className = this.frontPercentClass;this.backPercentLabel.className = this.backPercentClass;this.progressValue = "" + this.progressValue;this.domNode.style.height = this.height + "px";this.domNode.style.width = this.width + "px";this._intDimension = parseInt("0" + eval("this." + this._dimension));this._floatDimension = parseFloat("0" + eval("this." + this._dimension));this._pixelPercentRatio = this._floatDimension / 100;this.setMaxProgressValue(this.maxProgressValue, true);this.setProgressValue(dojo.string.trim(this.progressValue), true);dojo.debug("float dimension: " + this._floatDimension);dojo.debug("this._unitPixelRatio: " + this._unitPixelRatio);this.showText(this.hasText);}, showText:function (visible) {if (visible) {this.backPercentLabel.style.display = "block";this.frontPercentLabel.style.display = "block";} else {this.backPercentLabel.style.display = "none";this.frontPercentLabel.style.display = "none";}this.hasText = visible;}, postCreate:function (args, frag) {this.render();}, _backupValues:function () {this._progressValueBak = this.progressValue;this._hasTextBak = this.hasText;}, _restoreValues:function () {this.setProgressValue(this._progressValueBak);this.showText(this._hasTextBak);}, _setupAnimation:function () {var _self = this;dojo.debug("internalProgress width: " + this.internalProgress.style.width);this._animation = dojo.lfx.html.slideTo(this.internalProgress, {top:0, left:parseInt(this.width) - parseInt(this.internalProgress.style.width)}, parseInt(this.duration), null, function () {var _backAnim = dojo.lfx.html.slideTo(_self.internalProgress, {top:0, left:0}, parseInt(_self.duration));dojo.event.connect(_backAnim, "onEnd", function () {if (!_self._animationStopped) {_self._animation.play();}});if (!_self._animationStopped) {_backAnim.play();}_backAnim = null;});}, getMaxProgressValue:function () {return this.maxProgressValue;}, setMaxProgressValue:function (maxValue, noRender) {if (!this._animationStopped) {return;}this.maxProgressValue = maxValue;this._floatMaxProgressValue = parseFloat("0" + this.maxProgressValue);this._pixelUnitRatio = this._floatDimension / this.maxProgressValue;this._unitPercentRatio = this._floatMaxProgressValue / 100;this._unitPixelRatio = this._floatMaxProgressValue / this._floatDimension;this.setProgressValue(this.progressValue, true);if (!noRender) {this.render();}}, setProgressValue:function (value, noRender) {if (!this._animationStopped) {return;}this._progressPercentValue = "0%";var _value = dojo.string.trim("" + value);var _floatValue = parseFloat("0" + _value);var _intValue = parseInt("0" + _value);var _pixelValue = 0;if (dojo.string.endsWith(_value, "%", false)) {this._progressPercentValue = Math.min(_floatValue.toFixed(1), 100) + "%";_value = Math.min((_floatValue) * this._unitPercentRatio, this.maxProgressValue);_pixelValue = Math.min((_floatValue) * this._pixelPercentRatio, eval("this." + this._dimension));} else {this.progressValue = Math.min(_floatValue, this.maxProgressValue);this._progressPercentValue = Math.min((_floatValue / this._unitPercentRatio).toFixed(1), 100) + "%";_pixelValue = Math.min(_floatValue / this._unitPixelRatio, eval("this." + this._dimension));}this.progressValue = dojo.string.trim(_value);this._pixelValue = _pixelValue;if (!noRender) {this.render();}}, getProgressValue:function () {return this.progressValue;}, getProgressPercentValue:function () {return this._progressPercentValue;}, setDataSource:function (dataSource) {this.dataSource = dataSource;}, setPollInterval:function (pollInterval) {this.pollInterval = pollInterval;}, start:function () {var _showFunction = dojo.lang.hitch(this, this._showRemoteProgress);this._oInterval = setInterval(_showFunction, this.pollInterval);}, startAnimation:function () {if (this._animationStopped) {this._backupValues();this.setProgressValue("10%");this._animationStopped = false;this._setupAnimation();this.showText(false);this.internalProgress.style.height = "105%";this._animation.play();}}, stopAnimation:function () {if (this._animation) {this._animationStopped = true;this._animation.stop();this.internalProgress.style.height = "100%";this.internalProgress.style.left = "0px";this._restoreValues();this._setLabelPosition();}}, _showRemoteProgress:function () {var _self = this;if ((this.getMaxProgressValue() == this.getProgressValue()) && this._oInterval) {clearInterval(this._oInterval);this._oInterval = null;this.setProgressValue("100%");return;}var bArgs = {url:_self.dataSource, method:"POST", mimetype:"text/json", error:function (type, errorObj) {dojo.debug("[ProgressBar] showRemoteProgress error");}, load:function (type, data, evt) {_self.setProgressValue((_self._oInterval ? data["progress"] : "100%"));}};dojo.io.bind(bArgs);}, render:function () {this._setPercentLabel(dojo.string.trim(this._progressPercentValue));this._setPixelValue(this._pixelValue);this._setLabelPosition();}, _setLabelPosition:function () {var _widthFront = dojo.html.getContentBox(this.frontPercentLabel).width;var _heightFront = dojo.html.getContentBox(this.frontPercentLabel).height;var _widthBack = dojo.html.getContentBox(this.backPercentLabel).width;var _heightBack = dojo.html.getContentBox(this.backPercentLabel).height;var _leftFront = (parseInt(this.width) - _widthFront) / 2 + "px";var _bottomFront = (parseInt(this.height) - parseInt(_heightFront)) / 2 + "px";var _leftBack = (parseInt(this.width) - _widthBack) / 2 + "px";var _bottomBack = (parseInt(this.height) - parseInt(_heightBack)) / 2 + "px";this.frontPercentLabel.style.left = _leftFront;this.backPercentLabel.style.left = _leftBack;this.frontPercentLabel.style.bottom = _bottomFront;this.backPercentLabel.style.bottom = _bottomBack;}, _setPercentLabel:function (percentValue) {dojo.dom.removeChildren(this.frontPercentLabel);dojo.dom.removeChildren(this.backPercentLabel);var _percentValue = this.showOnlyIntegers == false ? percentValue : parseInt(percentValue) + "%";this.frontPercentLabel.appendChild(document.createTextNode(_percentValue));this.backPercentLabel.appendChild(document.createTextNode(_percentValue));}, _setPixelValue:function (value) {eval("this.internalProgress.style." + this._dimension + " = " + value + " + 'px'");this.onChange();}, onChange:function () {}});