<commit_before>browser-detect (ALPHA+DRAFT)
==============

__Browser-detect__  simply detects from the user-agent the sort of browser being used, checking whether if it is a mobile version of a browser and gathering other assorted device information that are useful. It then reports what it detects by populating the HTML root element with classes and also by making avaliable the same information through an object accessible through browserdetect. 

### How ###

Just add bd.min.js to your site, and it shall populate for you all the features it can detect as classes to your html element. Also you can access and check what features it detected in javascript via the bdjs object through bdjs.detect

#### What it detects ####

Operating systems:
* android
* blackberry
* ios
* linux
* mac
* windows
* windows mobile
* windows phone
* x11

through bdjs.detect.os, or through css via: .android, .blackberry, .ios, .linux, .mac, .win, .winmobile, .winphone, .x11

Browsers:
* safari, and it's mobile version
* firefox
* chrome
* internet explorer and its versions from 6 to 10
* internet explorer mobile
* opera

through bdjs.detect.browsers, or through css via: .safari, .safari-mobile, .ff, .chrome, .ie, .ie6, .ie7, .ie8, .ie9, .ie10, .ie-mobile, .opera

Browser rendering engines:
* webkit
* gecko
* presto
* trident

through bdjs.detect.bengine, or through css via: .webkit, .gecko, .trident, .presto

Device pixel density:
* ldpi (< 0.75)
* mdpi (1.0)
* hdpi (1.5)
* xhdpi (2.0), aka retina
 
through bdjs.detect.dpi, or through css via: .ldp, .mdpi, .hdpi, .xhdpi.
see [Android's guide on supporting screen sizes](http://developer.android.com/guide/practices/screens_support.html) for more info.

Device families, using some 'heuristic':
* tablet
* phone
* iphone
* ipad
* playbook
* mobile, if it being reported as a mobile device in its UA string.

through bdjs.detect.devices, or through css via: .no-mobile, .mobile, .playbook, .ipad, .iphone, .tablet, .phone.

Touch detection: through bdjs.detect.touch, or in css via .touch and .no-touch

and jQuery detection: bdjs.detect.jq, or .no-jq and .jq.



### Why ###

Given the rise of responsive, adaptive and fludic web techniques, designing for devices seem to be a faux-paus. 
But here is the thing: devices exist and they exist in 'families', and these families are different from each other in not only how we use them, but also in the ways we interact them and where use them. A laptop is clearly a sit down device, and even though you can use your phone while sitting down, you will probably also use your phone while on the bus instead of than pulling out your laptop, especially if you are standing. For us web creators, we do not really know much about the device or how it is used. This is different for the creators of these devices, they design the device in varying respects 

#### Area of concerns: the seperation of screen and device ####
It also allows for a separation of concerns in designing where you can separete concerns revolving around screen sizes into a separate area that is independent of anything device specific (as currently done through media queries), and the other area of concern being device relevant.   

#### How is it different from conditionizr?####
	
Conditionizr is great, but it does not provide a way to report if the browser detected is a mobile version, or whether it is installed on a phone, tablet, or some other device. The UA string sometimes report this, and it might be useful information.

#### How is it currently being used? ####
  
The developement of this library was spurred by a need that our practice faces in delivering solutions to our clients. We are using it basically as a means to create a gradient of experiences that isn't device specific, but rather specific to device families. The aim is in creating a commonality of experience within a specific class of devices.<commit_msg>Updated the doc to reflect the new no-state classes<commit_after>browser-detect (+DRAFT)
==============

__Browser-detect__  simply detects from the user-agent the sort of browser being used, checking whether if it is a mobile version of a browser and gathering other assorted device information that are useful. It then reports what it detects by populating the HTML root element with classes and also by making avaliable the same information through an object accessible through browserdetect. 

### How ###

Just add bd.min.js to your site, and it shall populate for you all the features it can detect as classes to your html element. Also you can access and check what features it detected in javascript via the bdjs object through bdjs.detect

#### What it detects ####

Operating systems:
* android
* blackberry
* ios
* linux
* mac
* windows
* windows mobile
* windows phone
* x11

through bdjs.detect.os, or through css via: .android, .blackberry, .ios, .linux, .mac, .win, .winmobile, .winphone, .x11

Browsers:
* safari, and it's mobile version
* firefox
* chrome
* internet explorer and its versions from 6 to 10
* internet explorer mobile
* opera

through bdjs.detect.browsers, or through css via: .safari, .safari-mobile, .ff, .chrome, .ie, .ie6, .ie7, .ie8, .ie9, .ie10, .ie-mobile, .opera

Browser rendering engines:
* webkit
* gecko
* presto
* trident

through bdjs.detect.bengine, or through css via: .webkit, .gecko, .trident, .presto

Device pixel density:
* ldpi (< 0.75)
* mdpi (1.0)
* hdpi (1.5)
* xhdpi (2.0), aka retina
 
through bdjs.detect.dpi, or through css via: .ldp, .mdpi, .hdpi, .xhdpi.
see [Android's guide on supporting screen sizes](http://developer.android.com/guide/practices/screens_support.html) for more info.

Device families, using some 'heuristic':
* tablet
* phone
* iphone
* ipad
* playbook
* mobile, if it is being reported as a mobile device in its UA string.
* desktop (really is the null-case where if none the above is reported than we default it to desktop)

through bdjs.detect.devices, or through css via: .no-mobile, .mobile, .playbook, .ipad, .iphone, .tablet, .no-tablet, .phone. .no-phone, .desktop, .no-desktop

Touch detection: through bdjs.detect.touch, or in css via .touch and .no-touch

and jQuery detection: bdjs.detect.jq, or .no-jq and .jq.



### Why ###

Given the rise of responsive, adaptive and fludic web techniques, designing for devices seem to be a faux-paus. 
But here is the thing: devices exist and they exist in 'families', and these families are different from each other in not only how we use them, but also in the ways we interact them and where use them. A laptop is clearly a sit down device, and even though you can use your phone while sitting down, you will probably also use your phone while on the bus instead of than pulling out your laptop, especially if you are standing. For us web creators, we do not really know much about the device or how it is used. This is different for the creators of these devices, they design the device in varying respects 

#### Area of concerns: the seperation of screen and device ####
It also allows for a separation of concerns in designing where you can separete concerns revolving around screen sizes into a separate area that is independent of anything device specific (as currently done through media queries), and the other area of concern being device relevant.   

#### How is it different from conditionizr?####
	
Conditionizr is great, but it does not provide a way to report if the browser detected is a mobile version, or whether it is installed on a phone, tablet, or some other device. The UA string sometimes report this, and it might be useful information.

#### How is it currently being used? ####
  
The developement of this library was spurred by a need that our practice faces in delivering solutions to our clients. We are using it basically as a means to create a gradient of experiences that isn't device specific, but rather specific to device families. The aim is in creating a commonality of experience within a specific class of devices.
{'fraction_non_alphanumeric': 0.0739027135175691, 'fraction_numerical': 0.005502063273727648, 'mean_word_length': 4.140102827763497, 'pattern_counts': {'":': 0, '<': 5, '<?xml version=': 0, '>': 3, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '34838', 'n_tokens_mistral': 2256, 'n_tokens_neox': 2161, 'n_words': 1198}