jquery-psiscore.js
by Eric Miller
CSS
@import 'common.css';
/* tablets and desktop */
@media only screen and (min-width: 768px) {
@import()
}
/* phones */
@media only screen and (max-width: 767px) {
}
/* portrait phones */
@media only screen and (max-width: 767px) and (orientation: portrait) {
}
JavaScript
function getOrientation() {
var mql = window.matchMedia("(orientation: portrait)");
return (mql.matches) ? 'portrait' : 'landscape';
}
function getHeight() {
return $(window).height();
}
function getWidth() {
return $(window).width();
}
function getScreenHeight() {
return screen.height;
}
function getScreenWidth() {
return screen.width;
}
function getPixelRatio() {
return window.devicePixelRatio;
}
function sqr(x) {
return x * x;
}
function getDiag(h, w) {
var sqrH = sqr(h),
sqrW = sqr(w),
x = Math.sqrt(sqr(h) + sqr(w));
console.log(sqrH, sqrW, x);
return x;
}
function getScreenDiag() {
var h = getScreenHeight(),
w = getScreenWidth();
return getDiag(h, w);
}
// PPI = sqrt( pixel width^2 + pixel height^2) divided by physical diagonal size
function getPPI() {
var ph = getHeight(),
pw = getWidth(),
sd = getScreenDiag();
return getDiag(ph, pw) / sd;
}
// PSINET SCORE = ratio of the smaller width or height of the resolution and the PPI
function getPSINETScore() {
var ph = getHeight(),
pw = getWidth(),
ppi = getPPI(),
p = (ph > pw) ? pw : ph;
return p / ppi;
}
function init() {
$('body').append($('<p />').text('Screen: ' + getScreenWidth() + 'x' + getScreenHeight() + '(diag: ' + getScreenDiag() + ')'));
$('body').append($('<p />').text('PPI: ' + getPPI()));
$('body').append($('<p />').text('PSINET Score: ' + getPSINETScore()));
console.log('Pixel ratio: ', getPixelRatio());
}
$(document).ready(init);