From 480905de234b5646d543405d3a467b08fc006e57 Mon Sep 17 00:00:00 2001 From: abdennour Date: Tue, 17 Nov 2015 09:13:56 +0300 Subject: [PATCH] progress function : awesome feature + rectify animatation functions # progress function : - Calling with : - One Argument --> "percentOrCurrent" is the percent of progress - Two Argument ---> "percentOrCurrent" is the current amount, "total" is the total amount . ____________ # animate : - you can pass "timer" && "timeout" as global settings , the "animate" function will reuse them if you don't specify argument 2 AND/OR argument 3 - you can call ```animate ``` function without argument , then, the animated message will be the message set on calling on ```show``` function . ___ # stopAnimate : - Calling it without arguments -> means -> stop the last running job . --- build/bootstrap-waitingfor.js | 112 ++++++++++++++++++++++++++++++---- 1 file changed, 99 insertions(+), 13 deletions(-) diff --git a/build/bootstrap-waitingfor.js b/build/bootstrap-waitingfor.js index ef222cc..1760236 100644 --- a/build/bootstrap-waitingfor.js +++ b/build/bootstrap-waitingfor.js @@ -2,6 +2,7 @@ * Module for displaying "Waiting for..." dialog using Bootstrap * * @author Eugene Maslovich + * */ (function (root, factory) { @@ -44,8 +45,8 @@ } // Dialog object - var $dialog; - + var $dialog,config,cache={}; + return { /** * Opens our dialog @@ -79,11 +80,12 @@ progressType: '', contentElement: 'p', contentClass: 'content', - onHide: null, // This callback runs after the dialog was hidden - onShow: null // This callback runs after the dialog was shown + timer:500, //useful for animate function + timeout:0,//useful for animate function + onHide: null // This callback runs after the dialog was hidden }, options), $headerTag, $contentTag; - + config= settings; $dialog = constructDialog($dialog); // Configuring dialog @@ -128,11 +130,6 @@ settings.onHide.call($dialog); }); } - if (typeof settings.onShow === 'function') { - $dialog.off('shown.bs.modal').on('shown.bs.modal', function () { - settings.onShow.call($dialog); - }); - } // Opening dialog $dialog.modal(); }, @@ -146,17 +143,106 @@ }, /** * Changes or displays current dialog message + * @author Abdennour TOUMI */ message: function (newMessage) { if (typeof $dialog !== 'undefined') { if (typeof newMessage !== 'undefined') { - return $dialog.find('.modal-header>h3').html(newMessage); + return $dialog.find('.modal-header>h'+config.headerSize).html(newMessage); } else { - return $dialog.find('.modal-header>h3').html(); + return $dialog.find('.modal-header>h'+config.headerSize).html(); } } - } + } + /** + * animate the message every period equals to 'timer', + * and starts this animation after a delay equals to 'timeout' + * + * + * @param messages can be : + * - string : it will be an array , i.e: messages="waitings"--> messages=["waiting..","waiting....",""waiting"......"] + * - array + * - function + * @param timer period + * @param timeout if it is 0 -> starts immediatly + * + * @return id of periodic job + * @author Abdennour TOUMI + * */ + ,animate:function(messages,timer,timeout){ + timer=timer ||config.timer; + timeout=timeout||config.timeout; + + messages=messages||$dialog.find('.modal-header>h'+config.headerSize).html(); + cache.animate=cache.animate || []; + if(typeof messages ==='string'){ + + + messages=['..','....','......'].map(function(e){ + return messages+e; + }) ; + } + + if(typeof messages ==='object' && messages instanceof Array){ + var old=messages; + messages=function(container){ + var current=old.indexOf(container.html()); + if(current<0){ + container.html(old[0]); + }else{ + var indx=(current+1>=old.length)?0:current+1 + container.html(old[indx]); + + } + } + + } + + if(typeof messages ==="function"){ + if(timeouth'+config.headerSize)) + },timeout) + } + var job= setInterval(function(){ + messages.call($dialog,$dialog.find('.modal-header>h'+config.headerSize)) + },timer); + cache.animate.push(job); + return job; + } + + + + }, + /* + * stop job with specified id . + if no id specified , stopAnimate will stop the last running job . + *@param id + * @author Abdennour TOUMI + */ + + stopAnimate:function(id){ + id=id || cache.animate[cache.animate.length-1]; + clearInterval(id); + delete cache.animate[cache.animate.indexOf(id)]; + return $dialog; + }, + /* + * @param percentOrCurrent + * @param total + * Calling with : + * - One Argument --> "percentOrCurrent" is the percent of progress + * - Two Argument ---> "percentOrCurrent" is the current amount, "total" is the total amount . + *@author Abdennour TOUMI + */ + progress:function(percentOrCurrent,total){ + if(total){ + percentOrCurrent=parseInt(percentOrCurrent/total*100); + } + $dialog.find('.progress-bar').css('width',percentOrCurrent+'%'); + return $dialog; + } }; }));