").addClass("progress-bar active progress-bar-striped").addClass(c.options.baseStyle).attr("role","progressbar").attr("aria-valuenow","0").attr("aria-valuemin","0").attr("aria-valuemax",c.options.timeLimit),c.span.appendTo(c.bar),c.options.showHtmlSpan||c.span.addClass("sr-only"),c.bar.appendTo(c.barContainer),c.barContainer.appendTo(c.element),c.start=new Date,c.limit=1e3*c.options.timeLimit,c.warningThreshold=1e3*c.options.warningThreshold,c.interval=b.setInterval(function(){c._run.call(c)},250),c.bar.data("progress-interval",c.interval),!0},g.prototype.destroy=function(){this.$elem.removeData()},g.prototype._run=function(){var a=this,b=new Date-a.start,c=b/a.limit*100;a.bar.attr("aria-valuenow",c),a.bar.width(c+"%");var d=c.toFixed(2);return d>=100&&(d=100),a.options.showHtmlSpan&&a.span.html(d+"%"),b>=a.warningThreshold&&a.bar.removeClass(this.options.baseStyle).removeClass(this.options.completeStyle).addClass(this.options.warningStyle),b>=a.limit&&a.complete.call(a),!0},g.prototype.removeInterval=function(){var c=this,d=a(".progress-bar",c.element);if("undefined"!=typeof d.data("progress-interval")){var e=d.data("progress-interval");b.clearInterval(e)}return d},g.prototype.complete=function(){var b=this,c=b.removeInterval.call(b),d=arguments;0!==d.length&&"object"==typeof d[0]&&(b.options=a.extend({},b.options,d[0])),c.removeClass(b.options.baseStyle).removeClass(b.options.warningStyle).addClass(b.options.completeStyle),c.width("100%"),b.options.showHtmlSpan&&a("span",c).html(b.options.successText),c.attr("aria-valuenow",100),setTimeout(function(){b.options.onFinish.call(c)},500),b.destroy.call(b)},g.prototype.error=function(){var b=this,c=b.removeInterval.call(b),d=arguments;0!==d.length&&"object"==typeof d[0]&&(b.options=a.extend({},b.options,d[0])),c.removeClass(b.options.baseStyle).addClass(b.options.warningStyle),c.width("100%"),b.options.showHtmlSpan&&a("span",c).html(b.options.errorText),c.attr("aria-valuenow",100),setTimeout(function(){b.options.onFinish.call(c)},500),b.destroy.call(b)},a.fn[e]=function(b){var c=arguments;if(b===d||"object"==typeof b)return this.each(function(){a.data(this,"plugin_"+e)||a.data(this,"plugin_"+e,new g(this,b))});if("string"==typeof b&&"_"!==b[0]&&"init"!==b){if(0===Array.prototype.slice.call(c,1).length&&-1!==a.inArray(b,a.fn[e].getters)){var f=a.data(this[0],"plugin_"+e);return f[b].apply(f,Array.prototype.slice.call(c,1))}return this.each(function(){var d=a.data(this,"plugin_"+e);d instanceof g&&"function"==typeof d[b]&&d[b].apply(d,Array.prototype.slice.call(c,1))})}},a.fn[e].getters=["complete","error"]}(jQuery,window,document,void 0);
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "jquery-progresstimer",
3 | "title": "jQuery Progress Timer",
4 | "version": "1.0.5",
5 | "author": {
6 | "name": "Thomas Norberg",
7 | "email": "tnorberg@thomasnorberg.com",
8 | "url": "http://www.thomasnorberg.com"
9 | },
10 | "repository": {
11 | "type": "git",
12 | "url": "https://github.com/tnory56/jquery-progressTimer.git"
13 | },
14 | "description": "The jquery progresstimer is a plugin that extends the ability of the bootstrap progress bar.",
15 | "homepage": "http://www.thomasnorberg.com",
16 | "devDependencies": {
17 | "bower": "^1.3.12",
18 | "grunt": "~0.4.1",
19 | "grunt-banner": "*",
20 | "grunt-bump": "0.3.1",
21 | "grunt-contrib-clean": "~0.6.0",
22 | "grunt-contrib-concat": "~0.5.0",
23 | "grunt-contrib-copy": "~0.8.0",
24 | "grunt-contrib-cssmin": "~0.12.3",
25 | "grunt-contrib-jshint": "~0.11.2",
26 | "grunt-contrib-uglify": "~0.9.1",
27 | "grunt-contrib-watch": "~0.6.1",
28 | "grunt-jsdox": "~0.1.5",
29 | "grunt-newer": "~1.1.0",
30 | "load-grunt-tasks": "~3.2.0",
31 | "time-grunt": "~1.2.1"
32 | },
33 | "dependencies": {
34 | "jquery": ">= 1.9.0",
35 | "bootstrap": ">=3.2.0"
36 | },
37 | "licenses": [
38 | {
39 | "type": "MIT",
40 | "url": "http://www.opensource.org/licenses/MIT"
41 | }
42 | ]
43 | }
44 |
--------------------------------------------------------------------------------
/src/css/jquery.progressTimer.css:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/tnory56/jquery-progressTimer/68cd91e504d43d91342bbb950fb44035b1bf07d6/src/css/jquery.progressTimer.css
--------------------------------------------------------------------------------
/src/js/jquery.progressTimer.js:
--------------------------------------------------------------------------------
1 | /*
2 |
3 |
6 | 40% Complete (success)
7 |
8 |
9 | */
10 | if (typeof jQuery === "undefined") {
11 | throw new Error("jQuery progress timer requires jQuery");
12 | }
13 | /*!
14 | * jQuery lightweight plugin boilerplate
15 | * Original author: @ajpiano
16 | * Further changes, comments: @addyosmani
17 | * Licensed under the MIT license
18 | */
19 |
20 | (function ($, window, document, undefined) {
21 | "use strict";
22 | // undefined is used here as the undefined global
23 | // variable in ECMAScript 3 and is mutable (i.e. it can
24 | // be changed by someone else). undefined isn't really
25 | // being passed in so we can ensure that its value is
26 | // truly undefined. In ES5, undefined can no longer be
27 | // modified.
28 |
29 | // window and document are passed through as local
30 | // variables rather than as globals, because this (slightly)
31 | // quickens the resolution process and can be more
32 | // efficiently minified (especially when both are
33 | // regularly referenced in your plugin).
34 |
35 | // Create the defaults once
36 | var pluginName = "progressTimer",
37 | defaults = {
38 | //total number of seconds
39 | timeLimit: 60,
40 | //seconds remaining triggering switch to warning color
41 | warningThreshold: 5,
42 | //invoked once the timer expires
43 | onFinish: function () {
44 | },
45 | //bootstrap progress bar style at the beginning of the timer
46 | baseStyle: "",
47 | //bootstrap progress bar style in the warning phase
48 | warningStyle: "progress-bar-danger",
49 | //bootstrap progress bar style at completion of timer
50 | completeStyle: "progress-bar-success",
51 | //show html on progress bar div area
52 | showHtmlSpan: true,
53 | //set the error text when error occurs
54 | errorText: "ERROR!",
55 | //set the success text when succes occurs
56 | successText: "100%"
57 | };
58 |
59 | // The actual plugin constructor
60 | var Plugin = function (element, options) {
61 | this.element = element;
62 | this.$elem = $(element);
63 | this.options = $.extend({}, defaults, options);
64 | this._defaults = defaults;
65 | this._name = pluginName;
66 | this.metadata = this.$elem.data("plugin-options");
67 | this.init();
68 | };
69 |
70 | Plugin.prototype.constructor = Plugin;
71 |
72 | Plugin.prototype.init = function () {
73 | var t = this;
74 | $(t.element).empty();
75 | t.span = $("
");
76 | t.barContainer = $("
").addClass("progress");
77 | t.bar = $("
").addClass("progress-bar active progress-bar-striped").addClass(t.options.baseStyle)
78 | .attr("role", "progressbar")
79 | .attr("aria-valuenow", "0")
80 | .attr("aria-valuemin", "0")
81 | .attr("aria-valuemax", t.options.timeLimit);
82 | t.span.appendTo(t.bar);
83 | if (!t.options.showHtmlSpan) {
84 | t.span.addClass("sr-only");
85 | }
86 | t.bar.appendTo(t.barContainer);
87 | t.barContainer.appendTo(t.element);
88 | t.start = new Date();
89 | t.limit = t.options.timeLimit * 1000;
90 | t.warningThreshold = t.options.warningThreshold * 1000;
91 | t.interval = window.setInterval(function () {
92 | t._run.call(t);
93 | }, 250);
94 | t.bar.data("progress-interval", t.interval);
95 | return true;
96 | };
97 |
98 | Plugin.prototype.destroy = function(){
99 | this.$elem.removeData();
100 | };
101 |
102 | Plugin.prototype._run = function () {
103 | var t = this;
104 | var elapsed = new Date() - t.start,
105 | width = ((elapsed / t.limit) * 100);
106 | t.bar.attr("aria-valuenow", width);
107 | t.bar.width(width + "%");
108 | var percentage = width.toFixed(2);
109 | if (percentage >= 100) {
110 | percentage = 100;
111 | }
112 | if (t.options.showHtmlSpan) {
113 | t.span.html(percentage + "%");
114 | }
115 | if (elapsed >= t.warningThreshold) {
116 | t.bar.removeClass(this.options.baseStyle)
117 | .removeClass(this.options.completeStyle)
118 | .addClass(this.options.warningStyle);
119 | }
120 | if (elapsed >= t.limit) {
121 | t.complete.call(t);
122 | }
123 | return true;
124 | };
125 |
126 | Plugin.prototype.removeInterval = function () {
127 | var t = this,
128 | bar = $(".progress-bar", t.element);
129 | if (typeof bar.data("progress-interval") !== "undefined") {
130 | var interval = bar.data("progress-interval");
131 | window.clearInterval(interval);
132 | }
133 | return bar;
134 | };
135 |
136 | Plugin.prototype.complete = function () {
137 | var t = this,
138 | bar = t.removeInterval.call(t),
139 | args = arguments;
140 | if(args.length !== 0 && typeof args[0] === "object"){
141 | t.options = $.extend({}, t.options, args[0]);
142 | }
143 | bar.removeClass(t.options.baseStyle)
144 | .removeClass(t.options.warningStyle)
145 | .addClass(t.options.completeStyle);
146 | bar.width("100%");
147 | if (t.options.showHtmlSpan) {
148 | $("span", bar).html(t.options.successText);
149 | }
150 | bar.attr("aria-valuenow", 100);
151 | setTimeout(function () {
152 | t.options.onFinish.call(bar);
153 | }, 500);
154 | t.destroy.call(t);
155 | };
156 |
157 | Plugin.prototype.error = function () {
158 | var t = this,
159 | bar = t.removeInterval.call(t),
160 | args = arguments;
161 | if(args.length !== 0 && typeof args[0] === "object"){
162 | t.options = $.extend({}, t.options, args[0]);
163 | }
164 | bar.removeClass(t.options.baseStyle)
165 | .addClass(t.options.warningStyle);
166 | bar.width("100%");
167 | if (t.options.showHtmlSpan) {
168 | $("span", bar).html(t.options.errorText);
169 | }
170 | bar.attr("aria-valuenow", 100);
171 | setTimeout(function () {
172 | t.options.onFinish.call(bar);
173 | }, 500);
174 | t.destroy.call(t);
175 | };
176 |
177 | // A really lightweight plugin wrapper around the constructor,
178 | // preventing against multiple instantiations
179 | $.fn[pluginName] = function (options) {
180 | var args = arguments;
181 | if (options === undefined || typeof options === "object") {
182 | // Creates a new plugin instance
183 | return this.each(function () {
184 | if (!$.data(this, "plugin_" + pluginName)) {
185 | $.data(this, "plugin_" + pluginName, new Plugin(this, options));
186 | }
187 | });
188 | } else if (typeof options === "string" && options[0] !== "_" && options !== "init") {
189 | // Call a public plugin method (not starting with an underscore) and different
190 | // from the "init" one
191 | if (Array.prototype.slice.call(args, 1).length === 0 && $.inArray(options, $.fn[pluginName].getters) !== -1) {
192 | // If the user does not pass any arguments and the method allows to
193 | // work as a getter then break the chainability so we can return a value
194 | // instead the element reference.
195 | var instance = $.data(this[0], "plugin_" + pluginName);
196 | return instance[options].apply(instance, Array.prototype.slice.call(args, 1));
197 | } else {
198 | // Invoke the specified method on each selected element
199 | return this.each(function() {
200 | var instance = $.data(this, "plugin_" + pluginName);
201 | if (instance instanceof Plugin && typeof instance[options] === "function") {
202 | instance[options].apply(instance, Array.prototype.slice.call(args, 1));
203 | }
204 | });
205 | }
206 | }
207 | };
208 |
209 | $.fn[pluginName].getters = ["complete", "error"];
210 |
211 | })(jQuery, window, document, undefined);
212 |
--------------------------------------------------------------------------------