[SOLVED] Why does the code inside this else run twice?

help
1

Template.procesorFilterConfigurator.events({

'change .procesorFilter':function(event){
    
    if ( $('select.procesorFilter').val() === '' ){
        $('.procesor-fan').velocity("transition.shrinkOut",{duration:400});    
    }else{
        $('.procesor-fan').velocity("transition.shrinkIn",{duration:500});    
    }
}

});

[SOLVED] : I had two elements with the same class ,because of the CSS framework , and the values of two element was changing THANKS TO ALL FOR YOUR HELP

Why does the ‘transition.shrinkIn’ animation run twice ?
I change the select value and I see the animation twice.
But the code inside the ‘if’ just run once.

1 Like
2

What do you get if you add console.log("Animation run") inside the if?

3

I get two ‘Animation run’. So that animation also run twice.
Then , why I dont see the animation twice in this case ?

4

you started with seeing animation 2x, now after adding console log you dont see it 2x?
somehow you are saing every time something else…

5

I see the console log message twice in the ‘if’ and the ‘else’.
But I only see the animation twice in the ‘else’.

6

It makes sense that you’d only see the shrinkOut once because the element’s opacity is already at 0% (hidden) the second time the code is run.
Do you have multiple instances of the template rendered?

You can check with

Template.procesorFilterConfigurator.onRendered(function () {
  console.log(this.view.renderCount);
}
7

But it would be the same with the shrinkIn.
I select a processor , then I select other processor but I see the shrinkIn effect again.
I havent multiple instance of the template rendered.

8

just run console.log(“true is running”) or “false is running” depending on branch

check behaviour and than debug animation itself how it is defined.
but console logging 1st.