Stop and Reset Harvest's Tick Counter jQuery Plugin

Question

Anyone knows how to stop and reset Harvest's Tick counter jQuery plugin? I want to stop counter on specific number and reset to primary start up number.

You can checkout my code here.

HTML Markup:

<span class="tick tick-flip tick-promo">5,000</span>

jQuery Logic:

<script type="text/javascript">
$(document).ready(function () {
    startCounter();
});

function startCounter() {
    $('.tick').ticker({
        delay: 1000,
        incremental: 1,
        separators: true
    });
}

var myCounter = setInterval(function resetCounter() {
    var lsCurrentTick = $('.tick').find('.tick-new').text();

    if (lsCurrentTick > 5010) {
        $.fn.ticker.stop();
    }
}, 1000);

</script>

robbmj · Accepted Answer · 2015-03-28T18:30:10.247

1

I had to read the code to figure this out. Here is a DEMO

$(startCounter);

function startCounter() {
    var tickObj = $('.tick').ticker({
        delay: 1000,
        incremental: 1,
        separators: true
    })[0];
    setInterval(function () {
        if (tickObj.value >= 5002) {
            tickObj.stop();
            tickObj.value = 5000;
            tickObj.start();
        }
    }, 1000);
}

If you are feeling brave you can mess with Tick.prototype.tick DEMO

function startCounter() {
    var tickObj = $('.tick').ticker({
        delay: 1000,
        incremental: 1,
        separators: true
    })[0];
    tickObj.tick = (function (tick) {
        return function () {
            var ret = tick.call(tickObj);
            if (tickObj.value > 5002) {
                tickObj.stop();
                tickObj.value = 5000;
                tickObj.start();
            }
            return ret;
        };
    }(tickObj.tick));
}

edited Mar 28 '15 at 18:30

answered Mar 28 '15 at 17:21

robbmj

16,085
8
38
63

I want to insert every tick into database so, I have create javascript function "insertCounter()" and write down all logic in that function. Now I want to call this function on every tick. Can you please let me know where can I call it??? – Keval Gangani Apr 02 '15 at 15:10
1

You can call the `insertCounter()` function after the `var ret = tick.call(tickObj);` line. – robbmj Apr 02 '15 at 17:07
Hi Robb, Can I use DOT(.) as separator instead of COMMA(,)? When I tried DOT as separator, it behaves like decimal value. Do you have any suggestion to use DOT as separator? Thank you! – Keval Gangani Jun 01 '15 at 14:00

Dhiraj · Answer 2 · 2015-03-28T17:31:26.300

Have a reference to the ticker and to reset you would have to do

ticker[0].stop();
ticker[0].value = 5000;
ticker[0].start();

Full example

$(document).ready(function () {
    var ticker;
    startCounter();
});

function startCounter() {
    ticker = $('.tick').ticker({
        delay: 1000,
        incremental: 1,
        separators: true,
    });
}
var myCounter = setInterval(function resetCounter() {
    var lsCurrentTick = $('.tick').find('.tick-new').text();

    if (lsCurrentTick > 5003) {
        reset();
    }
}, 1000);
function stop(){
    ticker[0].stop();
}
function reset(){
    ticker[0].stop();
    ticker[0].value = 5000;
    ticker[0].start();
}

Here is a demo

Stop and Reset Harvest's Tick Counter jQuery Plugin

2 Answers2