Skip to content

Instantly share code, notes, and snippets.

@gaspardzul
Created December 10, 2016 05:42
Show Gist options
  • Save gaspardzul/0b6081faea7fe7bbd61c0a7700094b2a to your computer and use it in GitHub Desktop.
Save gaspardzul/0b6081faea7fe7bbd61c0a7700094b2a to your computer and use it in GitHub Desktop.
clock tracking es un plugin que te permite hacer un tracking visual a partir de atributos horas, minutos y segundos.
/**
* Created by gaspardzul on 28/11/16.
* Permite llevar un tracking visual de tu tiempo
* Ejemplo de uso
* <span id="timer" data-hr="4" data-min="10" data-sec="4"></span>
* JS: $('#timer').tracking();
* Pasamos como parametros la hora , minuto y segundo a tra ves delos atributos data del elemento
*/
(function($){
$.fn.extend({
tracking:function () {
this.each(function () {
var $this = $(this);
var hr = $this.data("hr");
var min = $this.data("min");
var sec = $this.data("sec");
var h_ini = 0;
var m_ini = 0;
var s_ini = 0;
function carsTimer(inicial, ph, pm, ps) {
if (inicial) {
h_ini = ph;
m_ini = pm;
s_ini = ps;
} else {
s_ini++;
if (s_ini == 60) {
s_ini = 0;
m_ini++;
}
if (m_ini == 60) {
m_ini = 0;
h_ini++;
}
}
var h = 0, m = 0, s = 0;
h = h_ini;
m = m_ini;
s = s_ini;
if (s < 10) {
s = "0" + s;
}
if (m < 10) {
m = "0" + m;
}
if (h < 10) {
h = "0" + h;
}
$this.text(h + " : " + m + " : " + s).css('margin-left','5px').css('margin-right','5px');
setTimeout(function () {
carsTimer(false);
}, 1000);
}
carsTimer(true,hr,min,sec);
});
}
});
/* código */
})(jQuery);
@gaspardzul
Copy link
Author

Sirve para hacer un tracking visual del tiempo a partir de una hora, minuto y segundo dado.
Ejemplo
https://plnkr.co/edit/o5ENrBhq0ivKoBV9YZDv?p=preview

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment