From f725b162e70896e38257965424ac7f9af486b927 Mon Sep 17 00:00:00 2001 From: Jack Lukic Date: Tue, 30 Aug 2016 20:07:09 -0400 Subject: [PATCH] Add transition fallback to progress --- RELEASE-NOTES.md | 5 +++++ src/definitions/modules/progress.js | 31 ++++++++++++++++++++++++----- 2 files changed, 31 insertions(+), 5 deletions(-) diff --git a/RELEASE-NOTES.md b/RELEASE-NOTES.md index ab5f0a62a9..626ec82c93 100644 --- a/RELEASE-NOTES.md +++ b/RELEASE-NOTES.md @@ -1,5 +1,10 @@ ## RELEASE NOTES +### Version 2.2.5 + +**Enhancements* +- **Progress** - Progress now includes transitionEnd failback for progress bar animations, this will prevent labels from continuing to be updated if the `transitionEnd` css callback does not fire correctly + ### Version 2.2.4 - August 25, 2016 **Critical Bug** diff --git a/src/definitions/modules/progress.js b/src/definitions/modules/progress.js index 42b9c0e4b4..846fa4c8b6 100644 --- a/src/definitions/modules/progress.js +++ b/src/definitions/modules/progress.js @@ -153,6 +153,24 @@ $.fn.progress = function(parameters) { } }, + bind: { + transitionEnd: function(callback) { + var + transitionEnd = module.get.transitionEnd() + ; + $bar + .one(transitionEnd + eventNamespace, function(event) { + clearTimeout(module.failSafeTimer); + callback.call(this, event); + }) + ; + module.failSafeTimer = setTimeout(function() { + $bar.triggerHandler(transitionEnd); + }, settings.duration + settings.failSafeDelay); + module.verbose('Adding fail safe timer', module.timer); + } + }, + increment: function(incrementValue) { var maxValue, @@ -449,7 +467,7 @@ $.fn.progress = function(parameters) { } ; clearInterval(module.interval); - $bar.one(transitionEnd + eventNamespace, animationCallback); + module.bind.transitionEnd(animationCallback); animating = true; module.interval = setInterval(function() { var @@ -526,7 +544,7 @@ $.fn.progress = function(parameters) { if(text) { module.set.label(text); } - $bar.one(transitionEnd + eventNamespace, function() { + module.bind.transitionEnd(function() { settings.onActive.call(element, module.value, module.total); }); }, @@ -546,7 +564,7 @@ $.fn.progress = function(parameters) { text = settings.onLabelUpdate('active', text, module.value, module.total); module.set.label(text); } - $bar.one(transitionEnd + eventNamespace, function() { + module.bind.transitionEnd(function() { settings.onSuccess.call(element, module.total); }); }, @@ -562,7 +580,7 @@ $.fn.progress = function(parameters) { if(text) { module.set.label(text); } - $bar.one(transitionEnd + eventNamespace, function() { + module.bind.transitionEnd(function() { settings.onWarning.call(element, module.value, module.total); }); }, @@ -578,7 +596,7 @@ $.fn.progress = function(parameters) { if(text) { module.set.label(text); } - $bar.one(transitionEnd + eventNamespace, function() { + module.bind.transitionEnd(function() { settings.onError.call(element, module.value, module.total); }); }, @@ -856,6 +874,9 @@ $.fn.progress.settings = { total : false, value : false, + // delay in ms for fail safe animation callback + failSafeDelay : 100, + onLabelUpdate : function(state, text, value, total){ return text; },