https://moratelindo.co.id/js/bootstrap-progressbar/bootstrap-progressbar.js

1/*!
2 * bootstrap-progressbar v0.8.2 by @minddust
3 * Copyright (c) 2012-2014 Stephan Groß
4 *
5 * http://www.minddust.com/project/bootstrap-progressbar/
6 *
7 * Licensed under the MIT license:
8 * http://www.opensource.org/licenses/MIT
9 */
10(function($) {
11
12    'use strict';
13
14    // PROGRESSBAR CLASS DEFINITION
15    // ============================
16
17    var Progressbar = function(element, options) {
18        this.$element = $(element);
19        this.options = $.extend({}, Progressbar.defaults, options);
20    };
21
22    Progressbar.defaults = {
23        transition_delay: 300,
24        refresh_speed: 50,
25        display_text: 'none',
26        use_percentage: true,
27        percent_format: function(percent) { return percent + '%'; },
28        amount_format: function(amount_part, amount_max, amount_min) { return amount_part + ' / ' + amount_max; },
29        update: $.noop,
30        done: $.noop,
31        fail: $.noop
32    };
33
34    Progressbar.prototype.transition = function() {
35        var $this = this.$element;
36        var $parent = $this.parent();
37        var $back_text = this.$back_text;
38        var $front_text = this.$front_text;
39        var options = this.options;
40        var data_transitiongoal = parseInt($this.attr('data-transitiongoal'));
41        var aria_valuemin = parseInt($this.attr('aria-valuemin')) || 0;
42        var aria_valuemax = parseInt($this.attr('aria-valuemax')) || 100;
43        var is_vertical = $parent.hasClass('vertical');
44        var update = options.update && typeof options.update === 'function' ? options.update : Progressbar.defaults.update;
45        var done = options.done && typeof options.done === 'function' ? options.done : Progressbar.defaults.done;
46        var fail = options.fail && typeof options.fail === 'function' ? options.fail : Progressbar.defaults.fail;
47
48        if (isNaN(data_transitiongoal)) {
49            fail('data-transitiongoal not set');
50            return;
51        }
52        var percentage = Math.round(100 * (data_transitiongoal - aria_valuemin) / (aria_valuemax - aria_valuemin));
53
54        if (options.display_text === 'center' && !$back_text && !$front_text) {
55            this.$back_text = $back_text = $('<span>').addClass('progressbar-back-text').prependTo($parent);
56            this.$front_text = $front_text = $('<span>').addClass('progressbar-front-text').prependTo($this);
57
58            var parent_size;
59
60            if (is_vertical) {
61                parent_size = $parent.css('height');
62                $back_text.css({height: parent_size, 'line-height': parent_size});
63                $front_text.css({height: parent_size, 'line-height': parent_size});
64
65                $(window).resize(function() {
66                    parent_size = $parent.css('height');
67                    $back_text.css({height: parent_size, 'line-height': parent_size});
68                    $front_text.css({height: parent_size, 'line-height': parent_size});
69                }); // normal resizing would brick the structure because width is in px
70            }
71            else {
72                parent_size = $parent.css('width');
73                $front_text.css({width: parent_size});
74
75                $(window).resize(function() {
76                    parent_size = $parent.css('width');
77                    $front_text.css({width: parent_size});
78                }); // normal resizing would brick the structure because width is in px
79            }
80        }
81
82        setTimeout(function() {
83            var current_percentage;
84            var current_value;
85            var this_size;
86            var parent_size;
87            var text;
88
89            if (is_vertical) {
90                $this.css('height', percentage + '%');
91            }
92            else {
93                $this.css('width', percentage + '%');
94            }
95
96            var progress = setInterval(function() {
97                if (is_vertical) {
98                    this_size = $this.height();
99                    parent_size = $parent.height();
100                }
101                else {
102                    this_size = $this.width();
103                    parent_size = $parent.width();
104                }
105
106                current_percentage = Math.round(100 * this_size / parent_size);
107                current_value = Math.round(aria_valuemin + this_size / parent_size * (aria_valuemax - aria_valuemin));
108
109                if (current_percentage >= percentage) {
110                    current_percentage = percentage;
111                    current_value = data_transitiongoal;
112                    done($this);
113                    clearInterval(progress);
114                }
115
116                if (options.display_text !== 'none') {
117                    text = options.use_percentage ? options.percent_format(current_percentage) : options.amount_format(current_value, aria_valuemax, aria_valuemin);
118
119                    if (options.display_text === 'fill') {
120                        $this.text(text);
121                    }
122                    else if (options.display_text === 'center') {
123                        $back_text.text(text);
124                        $front_text.text(text);
125                    }
126                }
127                $this.attr('aria-valuenow', current_value);
128
129                update(current_percentage, $this);
130            }, options.refresh_speed);
131        }, options.transition_delay);
132    };
133
134
135    // PROGRESSBAR PLUGIN DEFINITION
136    // =============================
137
138    var old = $.fn.progressbar;
139
140    $.fn.progressbar = function(option) {
141        return this.each(function () {
142            var $this = $(this);
143            var data = $this.data('bs.progressbar');
144            var options = typeof option === 'object' && option;
145
146            if (!data) {
147                $this.data('bs.progressbar', (data = new Progressbar(this, options)));
148            }
149            data.transition();
150        });
151    };
152
153    $.fn.progressbar.Constructor = Progressbar;
154
155
156    // PROGRESSBAR NO CONFLICT
157    // =======================
158
159    $.fn.progressbar.noConflict = function () {
160        $.fn.progressbar = old;
161        return this;
162    };
163
164})(window.jQuery);