懒羊羊
2023-11-14 8286c62256f23bc2367a6729c0f46f84215e380b
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
/*
 * @ Dmitry Farafonov
 */
 
(function($){
$.ProgressBar = function(options) {
    this.element = $(options.boundingBox);
    if (options.on && options.on.complete){
        this.onComplete = options.on.complete;
    }
    if (options.on && options.on.valueChange){
        this.onValueChange = options.on.valueChange;
    }
    
    this._create();
    
    if (options.label)
        this.set("label", options.label);
    if (options.value)
        this.value(options.value);
    if (options.max)
        this.set("max", options.max);
};
$.ProgressBar.prototype = {
    options: {
        value: 0,
        max: 100
    },
 
    min: 0,
 
    _create: function() {
        this.element
            .addClass( "ui-progressbar ui-widget ui-widget-content ui-corner-all" )
            .attr({
                role: "progressbar",
                "aria-valuemin": this.min,
                "aria-valuemax": this.options.max,
                "aria-valuenow": this._value()
            });
 
        this.valueDiv = $( "<div class='ui-progressbar-label'></div>" )
            .appendTo( this.element );
            
        this.valueDiv = $( "<div class='ui-progressbar-value ui-widget-header ui-corner-left'></div>" )
            .appendTo( this.element );
 
        this.oldValue = this._value();
        this._refreshValue();
    },
 
    _destroy: function() {
        this.element
            .removeClass( "ui-progressbar ui-widget ui-widget-content ui-corner-all" )
            .removeAttr( "role" )
            .removeAttr( "aria-valuemin" )
            .removeAttr( "aria-valuemax" )
            .removeAttr( "aria-valuenow" );
 
        this.valueDiv.remove();
    },
 
    value: function( newValue ) {
        if ( newValue === undefined ) {
            return this._value();
        }
 
        this._setOption( "value", newValue );
        return this;
    },
 
    _setOption: function( key, value ) {
        if ( key === "value" ) {
            //var oldVal = this.options.value;
            this.options.value = value;
            this._refreshValue();
            
            if (this.onValueChange)
                this.onValueChange.apply(this, [{oldVal: this.oldValue, newVal: value}]);
            
            if ( this._value() === this.options.max ) {
                //this._trigger( "complete" );
                if (this.onComplete)
                    this.onComplete.apply(this);
            }
        } else if (key === "label") {
            $(this.element).find(".ui-progressbar-label").html(value);
        } else if (key === "max") {
            this.options.max = value;
        }
 
        //this._super( key, value );
    },
 
    _value: function() {
        var val = this.options.value;
        // normalize invalid value
        if ( typeof val !== "number" ) {
            val = 0;
        }
        return Math.min( this.options.max, Math.max( this.min, val ) );
    },
 
    _percentage: function() {
        return 100 * this._value() / this.options.max;
    },
 
    _refreshValue: function() {
        var value = this.value(),
            percentage = this._percentage();
 
        if ( this.oldValue !== value ) {
            this.oldValue = value;
            //this._trigger( "change" );
        }
 
        this.valueDiv
            .toggle( value > this.min )
            .toggleClass( "ui-corner-right", value === this.options.max )
            .width( percentage.toFixed(0) + "%" );
        this.element.attr( "aria-valuenow", value );
        
        //$(this.element).find(".ui-progressbar-label").html(value + "%");
    },
    
    set: function(key, value){
        this._setOption(key, value);
    }
};
 
})( jQuery );