diff --git a/README.md b/README.md index 64779b9..74594cf 100644 --- a/README.md +++ b/README.md @@ -11,6 +11,9 @@ Cross device utility for browser ## Changelog +### 1.0.29 +- Added the parent class iphone-x for models iPhone 12, 12 Pro, 12 Pro Max + ### 1.0.28 - Standalone detect improved diff --git a/bower.json b/bower.json index cfdb8a6..c7a77e6 100644 --- a/bower.json +++ b/bower.json @@ -1,6 +1,6 @@ { "name": "device-utils", - "version": "1.0.28", + "version": "1.0.29", "homepage": "https://github.com/SonoIo/device", "authors": [ "Matteo Baggio", diff --git a/lib/device.js b/lib/device.js index 0207c93..3917729 100644 --- a/lib/device.js +++ b/lib/device.js @@ -427,11 +427,53 @@ Device.isIphoneXSMax = function isIphoneXSMax(force){ return deviceCache.isIphoneXSMax; } +Device.isIphone12 = function isIphone12(force){ + if ( !force && _.isBoolean(deviceCache.isIphone12) ) + return deviceCache.isIphone12; + + var iOs = Device.isIos(force); + if (!iOs){ + deviceCache.isIphone12 = false; + return false; + } + + var dpr = _.isNumber(devicePixelRatio) && !_.isNaN(devicePixelRatio) ? devicePixelRatio : 1; + deviceCache.isIphone12 = screen.height * dpr == 2532; // @ref: https://developer.apple.com/ios/human-interface-guidelines/visual-design/adaptivity-and-layout/ + + return deviceCache.isIphone12; +} + +Device.isIphone12Pro = function isIphone12Pro(force){ + if ( !force && _.isBoolean(deviceCache.isIphone12Pro) ) + return deviceCache.isIphone12Pro; + deviceCache.isIphone12Pro = Device.isIphone12(force); + return deviceCache.isIphone12Pro; +} + +Device.isIphone12ProMax = function isIphone12ProMax(force){ + if ( !force && _.isBoolean(deviceCache.isIphone12ProMax) ) + return deviceCache.isIphone12ProMax; + + var iOs = Device.isIos(force); + if (!iOs){ + deviceCache.isIphone12ProMax = false; + return false; + } + + var dpr = _.isNumber(devicePixelRatio) && !_.isNaN(devicePixelRatio) ? devicePixelRatio : 1; + deviceCache.isIphone12ProMax = screen.height * dpr == 2778; // @ref: https://developer.apple.com/ios/human-interface-guidelines/visual-design/adaptivity-and-layout/ + + return deviceCache.isIphone12ProMax; +} + + Device.isIphoneWithNotch = function isIphoneWithNotch(force) { return Device.isIphoneX(force) || Device.isIphoneXR(force) || Device.isIphoneXS(force) - || Device.isIphoneXSMax(force); + || Device.isIphoneXSMax(force) + || Device.isIphone12Pro(force) + || Device.isIphone12ProMax(force); } Device.isAndroid = function isAndroid(force){ @@ -679,6 +721,27 @@ Device.bind = function bind() { }); } + if ( Device.isIphone12() ){ + window.requestAnimationFrame(function(){ + document.documentElement.classList.add('iphone-x'); + document.documentElement.classList.add('iphone-12'); + }); + } + + if ( Device.isIphone12Pro() ){ + window.requestAnimationFrame(function(){ + document.documentElement.classList.add('iphone-x'); + document.documentElement.classList.add('iphone-12-pro'); + }); + } + + if ( Device.isIphone12ProMax() ){ + window.requestAnimationFrame(function(){ + document.documentElement.classList.add('iphone-x'); + document.documentElement.classList.add('iphone-12-pro-max'); + }); + } + if ( Device.isAndroid() ){ window.requestAnimationFrame(function(){ document.documentElement.classList.add('android'); diff --git a/package.json b/package.json index 3098e5a..d583dd3 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "device-utils", - "version": "1.0.28", + "version": "1.0.29", "description": "Cross device utils for browser", "main": "lib/device.js", "scripts": {