title: cordova/phonegap screen notch detection (for all phones, not only iPhone X)
body: <p>I would like to integrate screen notch support for my cordova application.
  However a couple months ago the iPhone X is was the only smartphone with a screen notch so the detection and solution for it was pretty easy:</p>
  
  <pre><code>(function(){
  
    // Really basic check for the ios platform
    // https://stackoverflow.com/questions/9038625/detect-if-device-is-ios
    var iOS = /iPad|iPhone|iPod/.test(navigator.userAgent) &amp;&amp; !window.MSStream;
  
    // Get the device pixel ratio
    var ratio = window.devicePixelRatio || 1;
  
    // Define the users device screen dimensions
    var screen = {
      width : window.screen.width * ratio,
      height : window.screen.height * ratio
    };
  
    // iPhone X Detection
    if (iOS &amp;&amp; screen.width == 1125 &amp;&amp; screen.height === 2436) {
      alert('iPhoneX Detected!');
    }
  })();
  </code></pre>
  
  <p>I could then, with javascript, apply a top-offset of 20px so the screen notch support is complete.</p>
  
  <p><strong>However</strong> as more and more phones start using this screen notch the detection gets a lot more complicated and I don't know where to start. Does anyone have a good idea on how one would settle this problem?</p>
  
  <p>As you can see below a lot of smartphone companies are starting to use the screen notch and a good app should support all devices right?</p>
  
  <p>Phones with screen notch:</p>
  
  <ul>
  <li>Huawei P20 series</li>
  <li>Asus ZenFone 5 and 5Z</li>
  <li>Huawei Honor 10</li>
  <li>Oppo R15 and R15 Pro</li>
  <li>Oppo F7</li>
  <li>Vivo V9</li>
  <li>Vivo X21 and X21 UD</li>
  <li>OnePlus 6</li>
  <li>LG G7 ThinQ</li>
  <li>Leagoo S9</li>
  <li>Oukitel U18</li>
  <li>Sharp Aquos S3</li>
  <li>...</li>
  </ul>