Path: csiph.com!news.mixmin.net!weretis.net!feeder1.news.weretis.net!news.solani.org!.POSTED!not-for-mail
From: Thomas 'PointedEars' Lahn <PointedEars@web.de>
Newsgroups: comp.lang.javascript
Subject: Re: Animated vector field...
Date: Mon, 06 Jun 2016 21:55:36 +0200
Organization: PointedEars Software (PES)
Lines: 94
Message-ID: <2375647.gXbDYIEuU1@PointedEars.de>
References: <nitnvj$mko$1@gioia.aioe.org> <nito4t$mo7$1@gioia.aioe.org> <1650761.fOrR8oP7AL@PointedEars.de> <nj24lg$13n0$1@gioia.aioe.org>
Reply-To: Thomas 'PointedEars' Lahn <cljs@PointedEars.de>
Mime-Version: 1.0
Content-Type: text/plain; charset="UTF-8"
Content-Transfer-Encoding: 8Bit
X-Trace: solani.org 1465242940 9246 eJwNxcEBwCAIA8CVEEgK46DI/iPY+xyMi+dzgo7BWPbf0mj46NlkW2mIYUNcp69HauXtKBmcBxJwEQc= (6 Jun 2016 19:55:40 GMT)
X-Complaints-To: abuse@news.solani.org
NNTP-Posting-Date: Mon, 6 Jun 2016 19:55:40 +0000 (UTC)
User-Agent: KNode/4.14.2
X-User-ID: eJwFwYkBwCAIA8CV0CQ846DF/UfoneDLb9Dl1NNr2cnpMQRQo62i3dzYSPLyK08cBvUxlivSn9LUx5tT+AEkjRP4
Cancel-Lock: sha1:taMWf36zxpzUzD8qwILxjRHjmfs=
X-NNTP-Posting-Host: eJwNy8kRADEIA7CWuOzE7cAs/Zew0V9IOucUwcJiW5xhetxvXIow7Yxahgy15YVOd73DUtkPDmUQJg==
Xref: csiph.com comp.lang.javascript:30638

Chris M. Thomasson wrote:

> I am thinking of using:
> ___________________________________________________
> // Request animation workaround
> var g_request_animation_frame = window.requestAnimationFrame;
> 
> function prv_request_animation_frame(cb) {
>     if (!g_request_animation_frame) {
>         g_request_animation_frame =
>             window.webkitRequestAnimationFrame ||
>             window.mozRequestAnimationFrame ||
>             window.oRequestAnimationFrame ||
>             window.msRequestAnimationFrame;

If you call g_request_animation_frame(), you will call one of these methods 
as functions.  In strict mode, “this” will be undefined.  In non-strict 
mode, “this” will refer to the global object; that might work because of 
internal wrappers.  But you should always call object’s methods as such, 
i.e. in this case you should call them as methods of the object referred to 
by “window” explicitly.  The least you should do is to call them using 
Function.prototype.call/.apply(), but with host objects, all bets are off.

I recommend that you define at least

        g_request_animation_frame = window.webkitRequestAnimationFrame
          ? function (callback) {
              window.webkitRequestAnimationFrame(callback);
            }
          : window.mozRequestAnimationFrame
              ? function (callback) {
                  window.mozRequestAnimationFrame(callback);
                }
              : window.oRequestAnimationFrame
                  ? function (callback) {
                      window.oRequestAnimationFrame(callback);
                    }
                  : window.msRequestAnimationFrame
                      ? function (callback) {
                          window.msRequestAnimationFrame(callback);
                        }
                      : null;

instead.  An alternative that needs to be thoroughly tested:

       g_request_animation_frame =
         window.requestAnimationFrame
         || window.webkitRequestAnimationFrame
         || window.mozRequestAnimationFrame
         || window.oRequestAnimationFrame
         || window.msRequestAnimationFrame;

       var fpCall = Function.prototype.call;

       var native_request_animation_frame = function (callback) {
         fpCall.call(g_request_animation_frame, window, callback);
       };

It is not a good idea to access host object’s methods in a type-converting 
test; see implementations of isHostMethod() for an alternative.

However, you should check if attempting to call prefixed methods makes 
sense.  For example, Opera has switched to Blink; if they do not have 
window.oRequestAnimationFrame() now, they are not going to have it later, 
but, at most, window.webkitRequestAnimationFrame().

>             g_request_animation_frame = function (callback) {
>                 var cur_time = new Date().getTime();
>                 var time_addend = Math.max(0, 16 - (cur_time -
>                 last_time));

It is a good idea to consider that more time may have elapsed, but what are 
you getting at with the Math.max(…)?
 
>                 var id = window.setTimeout(function () {
>                     callback(cur_time + time_addend);
>                 }, time_addend);
> 
>                 last_time = cur_time + time_addend;
> 
>                 return id;
>             };
>         }
>     }
> 
>     g_request_animation_frame(cb);
> }
> […]

-- 
PointedEars
FAQ: <http://PointedEars.de/faq> | SVN: <http://PointedEars.de/wsvn/>
Twitter: @PointedEars2 | ES Matrix: <http://PointedEars.de/es-matrix>
Please do not cc me. / Bitte keine Kopien per E-Mail.