Advertisement
fhumayun

Browser Detection JavaScript

May 22nd, 2011
448
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. /*
  2. Script Name: Full Featured Javascript Browser/OS detection
  3. Authors: Harald Hope, Tapio Markula, Websites: http://techpatterns.com/
  4. http://www.nic.fi/~tapio1/Teaching/index1.php3
  5. Script Source URI: http://techpatterns.com/downloads/javascript_browser_detection.php
  6. Version 4.2.4
  7. Copyright (C) 29 June 2007
  8.  
  9. This program is free software; you can redistribute it and/or modify it under
  10. the terms of the GNU General Public License as published by the Free Software
  11. Foundation; either version 3 of the License, or (at your option) any later version.
  12.  
  13. This program is distributed in the hope that it will be useful, but WITHOUT
  14. ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
  15. FOR A PARTICULAR PURPOSE. See the GNU General Public License for more details.
  16.  
  17. Get the full text of the GPL here: http://www.gnu.org/licenses/gpl.txt
  18.  
  19. Coding conventions:
  20. http://cvs.sourceforge.net/viewcvs.py/phpbb/phpBB2/docs/codingstandards.htm?rev=1.3
  21. */
  22.  
  23. /*************************************************************
  24. Full version, use it if you are pushing css to its functional limits, and/or are using
  25. specialized javascript.
  26.  
  27. Remember, always use method or object testing as your first choice, for example, if ( dom ) { statement; };
  28.  
  29. This browser detection includes all possibilities I think for most browsers.
  30. Let me know if you find an error or a failure to properly detect, or if there
  31. is a relevant browser that has special needs for detection at our tech forum:
  32. http://techpatterns.com/forums/forum-11.html
  33. The main script is separated from the initial netscape 4 detection due to certain bugs in
  34. netscape 4 when it comes to unknown things like d.getElementById. The variable declarations
  35. of course are made first to make sure that all the variables are global through the page,
  36. otherwise a javascript error will occur because you are trying to use an undeclared variable.
  37.  
  38. We test for both browser type (ie, op, or moz/netscape > 6) and version number, then place
  39. the version number into a variable which can be tested for < or > values, such as
  40. if (moz && nu> 1.1){....statement....;}
  41. This seems quite reliable, especially for Opera and Mozilla, where there is no other
  42. easy way to get the actual version number.
  43.  
  44. For more in depth discussion of css and browser issues go to:
  45. http://www.nic.fi/~tapio1/Teaching/DynamicMenusb.php#detections
  46. http://www.nic.fi/~tapio1/Teaching/FAQ.php3
  47.  
  48. ***************************************************************/
  49. //initialization, browser, os detection
  50. var d, dom, nu='', brow='', ie, ie4, ie5, ie5x, ie6, ie7;
  51. var ns4, moz, moz_rv_sub, release_date='', moz_brow, moz_brow_nu='', moz_brow_nu_sub='', rv_full='';
  52. var mac, win, old, lin, ie5mac, ie5xwin, konq, saf, op, op4, op5, op6, op7;
  53.  
  54. d=document;
  55. n=navigator;
  56. nav=n.appVersion;
  57. nan=n.appName;
  58. nua=n.userAgent;
  59. old=(nav.substring(0,1)<4);
  60. mac=(nav.indexOf('Mac')!=-1);
  61. win=( ( (nav.indexOf('Win')!=-1) || (nav.indexOf('NT')!=-1) ) && !mac)?true:false;
  62. lin=(nua.indexOf('Linux')!=-1);
  63. // begin primary dom/ns4 test
  64. // this is the most important test on the page
  65. if ( !document.layers )
  66. {
  67.     dom = ( d.getElementById ) ? d.getElementById : false;
  68. }
  69. else {
  70.     dom = false;
  71.     ns4 = true;// only netscape 4 supports document layers
  72. }
  73. // end main dom/ns4 test
  74.  
  75. op=(nua.indexOf('Opera')!=-1);
  76. saf=(nua.indexOf('Safari')!=-1);
  77. konq=(!saf && (nua.indexOf('Konqueror')!=-1) ) ? true : false;
  78. moz=( (!saf && !konq ) && ( nua.indexOf('Gecko')!=-1 ) ) ? true : false;
  79. ie=((nua.indexOf('MSIE')!=-1)&&!op);
  80. if (op)
  81. {
  82.     str_pos=nua.indexOf('Opera');
  83.     nu=nua.substr((str_pos+6),4);
  84.     brow = 'Opera';
  85. }
  86. else if (saf)
  87. {
  88.     str_pos=nua.indexOf('Safari');
  89.     nu=nua.substr((str_pos+7),5);
  90.     brow = 'Safari';
  91. }
  92. else if (konq)
  93. {
  94.     str_pos=nua.indexOf('Konqueror');
  95.     nu=nua.substr((str_pos+10),3);
  96.     brow = 'Konqueror';
  97. }
  98. // this part is complicated a bit, don't mess with it unless you understand regular expressions
  99. // note, for most comparisons that are practical, compare the 3 digit rv nubmer, that is the output
  100. // placed into 'nu'.
  101. else if (moz)
  102. {
  103.     // regular expression pattern that will be used to extract main version/rv numbers
  104.     pattern = /[(); \n]/;
  105.     // moz type array, add to this if you need to
  106.     moz_types = new Array( 'Firebird', 'Phoenix', 'Firefox', 'Iceweasel', 'Galeon', 'K-Meleon', 'Camino', 'Epiphany', 'Netscape6', 'Netscape', 'MultiZilla', 'Gecko Debian', 'rv' );
  107.     rv_pos = nua.indexOf( 'rv' );// find 'rv' position in nua string
  108.     rv_full = nua.substr( rv_pos + 3, 6 );// cut out maximum size it can be, eg: 1.8a2, 1.0.0 etc
  109.     // search for occurance of any of characters in pattern, if found get position of that character
  110.     rv_slice = ( rv_full.search( pattern ) != -1 ) ? rv_full.search( pattern ) : '';
  111.     //check to make sure there was a result, if not do  nothing
  112.     // otherwise slice out the part that you want if there is a slice position
  113.     ( rv_slice ) ? rv_full = rv_full.substr( 0, rv_slice ) : '';
  114.     // this is the working id number, 3 digits, you'd use this for
  115.     // number comparison, like if nu >= 1.3 do something
  116.     nu = rv_full.substr( 0, 3 );
  117.     for (i=0; i < moz_types.length; i++)
  118.     {
  119.         if ( nua.indexOf( moz_types[i]) !=-1 )
  120.         {
  121.             moz_brow = moz_types[i];
  122.             break;
  123.         }
  124.     }
  125.     if ( moz_brow )// if it was found in the array
  126.     {
  127.         str_pos=nua.indexOf(moz_brow);// extract string position
  128.         moz_brow_nu = nua.substr( (str_pos + moz_brow.length + 1 ) ,3);// slice out working number, 3 digit
  129.         // if you got it, use it, else use nu
  130.         moz_brow_nu = ( isNaN( moz_brow_nu ) ) ? moz_brow_nu = nu: moz_brow_nu;
  131.         moz_brow_nu_sub = nua.substr( (str_pos + moz_brow.length + 1 ), 8);
  132.         // this makes sure that it's only the id number
  133.         sub_nu_slice = ( moz_brow_nu_sub.search( pattern ) != -1 ) ? moz_brow_nu_sub.search( pattern ) : '';
  134.         //check to make sure there was a result, if not do  nothing
  135.         ( sub_nu_slice ) ? moz_brow_nu_sub = moz_brow_nu_sub.substr( 0, sub_nu_slice ) : '';
  136.     }
  137.     if ( moz_brow == 'Netscape6' )
  138.     {
  139.         moz_brow = 'Netscape';
  140.     }
  141.     else if ( moz_brow == 'rv' || moz_brow == '' )// default value if no other gecko name fit
  142.     {
  143.         moz_brow = 'Mozilla';
  144.     }
  145.     if ( !moz_brow_nu )// use rv number if nothing else is available
  146.     {
  147.         moz_brow_nu = nu;
  148.         moz_brow_nu_sub = nu;
  149.     }
  150.     if (n.productSub)
  151.     {
  152.         release_date = n.productSub;
  153.     }
  154. }
  155. else if (ie)
  156. {
  157.     str_pos=nua.indexOf('MSIE');
  158.     nu=nua.substr((str_pos+5),3);
  159.     brow = 'Microsoft Internet Explorer';
  160. }
  161. // default to navigator app name
  162. else
  163. {
  164.     brow = nan;
  165. }
  166. op5=(op&&(nu.substring(0,1)==5));
  167. op6=(op&&(nu.substring(0,1)==6));
  168. op7=(op&&(nu.substring(0,1)==7));
  169. op8=(op&&(nu.substring(0,1)==8));
  170. op9=(op&&(nu.substring(0,1)==9));
  171. ie4=(ie&&!dom);
  172. ie5=(ie&&(nu.substring(0,1)==5));
  173. ie6=(ie&&(nu.substring(0,1)==6));
  174. ie7=(ie&&(nu.substring(0,1)==7));
  175. // default to get number from navigator app version.
  176. if(!nu)
  177. {
  178.     nu = nav.substring(0,1);
  179. }
  180. /*ie5x tests only for functionavlity. dom or ie5x would be default settings.
  181. Opera will register true in this test if set to identify as IE 5*/
  182. ie5x=(d.all&&dom);
  183. ie5mac=(mac&&ie5);
  184. ie5xwin=(win&&ie5x);
  185.  
  186. /********************************************************
  187. here is a sample use of the browser detector, it would load a browser specific stylesheet
  188. for certain unsupported or improperly supported mac ie 5 css styles. The depth variable
  189. is used so that the javascript library file can be used from anywhere in the website, you simply
  190. insert the depth of the file like this,
  191. ...
  192.  <head>
  193.  <title>Browser information Page</title>
  194.  
  195.  <meta http-equiv = "Content-Type" content = "text/html; charset = iso-8859-1" />
  196.  <link rel = "stylesheet" type = "text/css" href = "css/main.css" />
  197.  <script type = "text/javascript" src = "/js/browser_detection.js"> </script>
  198.  <script type = "text/javascript>browser_css( ); </script>
  199.  </head>
  200.  
  201. in the head of the web page after the js file is loaded.
  202. Or if you are always referring your site to the root, you wouldn't need that
  203.  and could delete the depth variable and just use the absolute path to the root.
  204.  
  205. function browser_css( ) {
  206.     d = document;
  207.     if ( ie5mac ) {
  208.         d.write('<link rel = "stylesheet" type = "text\/css" href = "/css/ie5mac.css" />');
  209.     }
  210.     else if ( document.layers ){
  211.         d.write('<link rel = "stylesheet" type = "text\/css" href = "/css/ns4x.css" />');
  212.     }
  213.     else if ( ie4 ){
  214.         d.write('<link rel = "stylesheet" type = "text\/css" href = "/css/ie4.css" />');
  215.     }
  216.     else if ( moz && ( nu < 1 ) ){
  217.         d.write('<link rel = "stylesheet" type = "text\/css" href = "/css/moz_pre1-0.css" />');
  218.     }
  219.     else {
  220.         d.write('<link rel = "stylesheet" type = "text\/css" href = "/css/moz5.css" />');
  221.     }
  222. }
  223. ********************************************************/
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement