Gontattoo Yeah
Gontattoo Yeah

Reputation: 1

How to detect tablet device in AngluarJS with deviceDetector module?

The problem is with a Samsung Tablet. I want to show some stuff if device is a cellphone, but not in a tablet.

Device detector show:
- isMobile(): true
- isTablet(): false

This is the complete data from module:

{"raw":{"userAgent":"Mozilla/5.0 (Linux; Android 4.4.2; es-us; SAMSUNG SM-T230NU Build/KOT49H) AppleWebKit/537.36 (KHTML, like Gecko) Version/1.5 Chrome/28.0.1500.94 Safari/537.36","os":{"windows":false,"mac":false,"ios":false,"android":true,"linux":true,"unix":false,"firefox-os":false,"chrome-os":false,"windows-phone":false,"ps4":false,"vita":false,"unknown":false},"browser":{"chrome":true,"firefox":false,"safari":true,"opera":false,"ie":false,"ms-edge":false,"ps4":false,"vita":false,"unknown":false},"device":{"android":true,"ipad":false,"iphone":false,"ipod":false,"blackberry":false,"firefox-os":false,"chrome-book":false,"windows-phone":false,"ps4":false,"vita":false,"unknown":false},"os_version":{"windows-3-11":false,"windows-95":false,"windows-me":false,"windows-98":false,"windows-ce":false,"windows-2000":false,"windows-xp":false,"windows-server-2003":false,"windows-vista":false,"windows-7":false,"windows-8-1":false,"windows-8":false,"windows-10":false,"windows-phone-7-5":false,"windows-phone-8-1":false,"windows-phone-10":false,"windows-nt-4-0":false,"unknown":false}},"os":"android","browser":"chrome","device":"android","os_version":"unknown","browser_version":"28.0.1500.94"}

Thanks in advance.

Upvotes: 0

Views: 1043

Answers (2)

Gontattoo Yeah
Gontattoo Yeah

Reputation: 1

The problem was on Tablets with Android OS, ng-device-detector show same info for Android Tablet and Android Phone. Looking for a solution, I find that ALL Smartphones has the string "Mobile" in userAgent, but tablets doesn't.

Here's a list of all smartphones userAgents.

Simply, I use this function to replace ng-device-detector "isMobile" function:

deviceDetector.isMobile = function(){
    var ua = deviceDetector.raw.userAgent;
    return ua.match(/Mobile/i);
}

Thanks you all. Sorry for my english, I talk spanish.

Upvotes: 0

Jamona
Jamona

Reputation: 97

If it's just about showing stuff, try to do it the bootstrap way and use their css-classes: enter image description here

Depending on your needs this could be a very simple and straight-forward solution.

Picture source: http://getbootstrap.com/2.3.2/

Upvotes: 0

Related Questions