setTimeout not working in NodeJS

Question

I have this slideUp function that calls the animate function. The objective is to make a div appear to slide up on the screen by recalling the animate function every 20ms, and rerendering the div in the browser after adjusting the css for the div position. I'm using Node js, and due to the asynchronous behaviour, I believe that the timeout only gets involked once, and that the program continues running while it waits on the timeout to complete. When i print the value of 'bottom' to the console, it has looped through 20 times as expected. Only the final view gets rendered thou. Can anyone offer any way to get around this problem so that it rerenders each of the 20 times?

slideUp: function () {
            var bottom=0;
            this.animate(bottom);
        },

 animate: function(bottom){   
                bottom++;
                if (bottom<20){
                    this.view.getClientNotificationElement().setAttribute("style","margin-bottom:"+bottom+"px");
                    this.clientNotification.attachTo(this.view.getClientNotificationElement());
                    setTimeout(this.animate(bottom), 20);
                    console.log(bottom);
                }
            }

This something to be of concern for browser. Node.js runs on server side. — AdityaParab, Jul 15 '14 at 09:10
You're both wrong. You can easily run node.js in a browser environment if you use [node-webkit](https://github.com/rogerwang/node-webkit) or similar frameworks. — MMM, Jul 15 '14 at 09:11
@MMM you must be joking -- `node-webkit` is for creating standalone applications. — artur grzesiak, Jul 15 '14 at 09:13
@MMM I was merely asking a question. And I doubt OP uses node-webkit, as he didn't specified that and as it's still difficult to see where Node js is relevant to the question. — Denys Séguret, Jul 15 '14 at 09:13
@arturgrzesiak Yes Artur, and it runs on top of Chromium, which is a browser-like environment. — MMM, Jul 15 '14 at 09:13
Looks like webkit runs on top of it rather than the other way around. — Quentin, Jul 15 '14 at 09:14
@dystroy: Why are you doubting that, what else is he using then? You can easily run node.js client side, so I'm just correcting you. — MMM, Jul 15 '14 at 09:16
@MMM OP says: 'rerendering the div in the browser' and the question is not tagged with `node-webkit`... — artur grzesiak, Jul 15 '14 at 09:18
@arturgrzesiak: Well that's an oversight on his part, but why should we assume he is silly and trying to use node.js in an actual browser? Isn't it more probable that by browser he means a browser-like rendering engine used for an app (which I would probably also refer to as a browser when trying to explain something)? — MMM, Jul 15 '14 at 09:21

score 1 · Answer 1 · answered Jul 15 '14 at 09:13

You are passing the return value of this.animate(bottom) to setTimeout.

The animate function doesn't have a return statement, so it returns undefined.

The effects of the function happen immediately (because you are calling it) and then setTimeout does nothing.

Pass a function to setTimeout instead.

var self = this;
var callback = function () {
    self.animate(bottom);
};
setTimeout(callback, 20);

setTimeout not working in NodeJS

1 Answers1