title: How to detect if device is desktop and/or mobile, and if connection is wifi or not with AngularJS
body: <p>I have done some research on SO but the similar Q&amp;A are for detecting if it has connection or not, but not about connection type.</p>
  
  <p>The purpose of my website is that, if a user is on mobile(phone or tablet) and on wifi, play a video clip; if a user is on mobile and not on wifi, play a video clip; if a user is not on mobile, then play the video clip.</p>
  
  <p>The reason for the different behavior is to avoid possible surcharges happen to the user due to the relatively larger size of the video clip. That is not related to speed - nowadays speed difference of LTE v.s. wifi maybe only little; it is more for the concern of users getting charged for the data usage without wifi connection.</p>
  
  <p>So my question is, using AngularJS(&lt;2.0),
  1) How to detect the device is desktop or mobile
  2) How to detect the device is connected to wifi or not</p>
  
  <p>(I guess for Q1, the fallback is to use Bootstrap @media, but it isn't ideal.)</p>