[RECOVERY] Pixel Ratio (DPI) detection

[Chris]

Hey guys,

I posted a answer to the DPI thread and accidentially posted it twice. When I tried to delete my double-post on the mobile view of this board, I accidentiall nuked the whole thread >_<

New lesson learned: Never try to administer something from the mobile board theme... *sigh*

 

Anyways - since it seems like the original thread is forever gone in the nirvana of sql datasets, I'll try and re-create the topic from what I remember and code I found.

 

 

Here is a nice function to detect if a device has a HD (aka retina) display:

 

/** * Use this function to test if the current device is a HD device (retina display), or not. * @source The retina.js library (https://github.com/imulus/retinajs) * @returns {Boolean} */function isHDDevice(){    var mediaQuery = '(-webkit-min-device-pixel-ratio: 1.5),' +                     '(min--moz-device-pixel-ratio: 1.5),' +                     '(-o-min-device-pixel-ratio: 3/2),' +                     '(min-resolution: 1.5dppx)';    if(root.devicePixelRatio > 1){        return true;    }    return (root.matchMedia && root.matchMedia(mediaQuery).matches);}

 

I have taken it from the retinajs library and modified it a little bit.

[Ezelia]

and here is a code I posted to help detect slow rendering

 

 

CanvasRenderer.prototype.drawAll = function () {    var _time = Date.now();    var _ms = _time - this.lastRun;    this.lastRun = _time;    this._frames++;    if(_time > this._timeLastSecond + 1000) {        this.FPS = round((this._frames * 1000) / (_time - this._timeLastSecond));        this._timeLastSecond = _time;        this._frames = 0;    }    this.avgFPS = round((this.avgFPS + this.FPS) / 2);    var _this = this;            /* rendering code goes here */            requestAnimFrame(function () {        _this.drawAll();    });} 

 

 

low avgFPS value mean slow rendering. I use that to disable intensive CPU operation (particle effects for example) when avgFPS is lower than 30.