14

I am used to using Atlas. Recently i have started transitioning to jQuery and sometimes prototype. The project that i'm currently working on is using prototype.

In Prototype, is there an easy way to get the browser name and version? I've looked over the API documentation and can't seem to find it.

Rob W
  • 341,306
  • 83
  • 791
  • 678
EvilSyn
  • 2,412
  • 7
  • 24
  • 22
  • 1
    And as an aside, I understand the pitfalls of coding towards a specific browser and its version, as opposed to coding towards available 'features'. – EvilSyn Oct 16 '08 at 15:34
  • More scouring, and I see Prototype.Browser which will give me boolean on IE or Gecko, etc. So that helps.. Would be nice if it had the version in there as well but I guess I can write plain old JS for that. – EvilSyn Oct 16 '08 at 15:37

6 Answers6

18

As a completion to nertzy's answer you can add the ability for detecting IE versions using this:

Prototype.Browser.IE6 = Prototype.Browser.IE && parseInt(navigator.userAgent.substring(navigator.userAgent.indexOf("MSIE")+5)) == 6;
Prototype.Browser.IE7 = Prototype.Browser.IE && parseInt(navigator.userAgent.substring(navigator.userAgent.indexOf("MSIE")+5)) == 7;
Prototype.Browser.IE8 = Prototype.Browser.IE && !Prototype.Browser.IE6 && !Prototype.Browser.IE7;

On the other hand you have to detect user agent details on the server side, too. Anyways browser detection is a seriously flawed strategy for writing cross-browser scripts, that's just to be used when browser feature detection fails. It's pretty easy for a user to alter his/her user agent details.

sepehr
  • 17,110
  • 7
  • 81
  • 119
  • Please not that this answer doesn't take care of IE9 (as it probably didn't exist yet when it was posted). – Stephan Muller Jul 14 '11 at 09:42
  • My guess is less than 10% of users don't know how to change their user agent, so I guess it's not a bad strategy – Rigel Glen Sep 11 '11 at 05:43
  • The last line needs to be updated for IE9! Prototype.Browser.IE8 returns true when using the latest version of the awesome browser. – jmlnik Nov 08 '12 at 04:41
7

Prototype offers some flags you can check to get an idea as to which browser is running. Keep in mind that it's much better practice to check for the functionality you wish to use rather than check for a particular browser.

Here is the browser- and feature-detection portion of prototype.js currently in the source tree:

var Prototype = {
  Browser: {
    IE:     !!(window.attachEvent &&
      navigator.userAgent.indexOf('Opera') === -1),
    Opera:  navigator.userAgent.indexOf('Opera') > -1,
    WebKit: navigator.userAgent.indexOf('AppleWebKit/') > -1,
    Gecko:  navigator.userAgent.indexOf('Gecko') > -1 && 
      navigator.userAgent.indexOf('KHTML') === -1,
    MobileSafari: !!navigator.userAgent.match(/Apple.*Mobile.*Safari/)
  },

  BrowserFeatures: {
    XPath: !!document.evaluate,
    SelectorsAPI: !!document.querySelector,
    ElementExtensions: !!window.HTMLElement,
    SpecificElementExtensions: 
      document.createElement('div')['__proto__'] &&
      document.createElement('div')['__proto__'] !== 
        document.createElement('form')['__proto__']
  },
}

So you could check if the current browser is IE by investigating the value of Prototype.Browser.IE, or alternatively, be more future-compatible and check for a particular feature like XPath with Prototype.BrowserFeatures.XPath.

Grant Hutchins
  • 4,275
  • 1
  • 27
  • 32
3

You're right - prototype doesn't provide a utility for ascertaining the browser name or version.

If you specifically need to get the browser info as a plugin, I would suggest adding the following (taken from directly jQuery):

var Browser = Class.create({
  initialize: function() {
    var userAgent = navigator.userAgent.toLowerCase();
    this.version = (userAgent.match( /.+(?:rv|it|ra|ie)[\/: ]([\d.]+)/ ) || [])[1];
    this.webkit = /webkit/.test( userAgent );
    this.opera = /opera/.test( userAgent );
    this.msie = /msie/.test( userAgent ) && !/opera/.test( userAgent );
    this.mozilla = /mozilla/.test( userAgent ) && !/(compatible|webkit)/.test( userAgent );
  }
});
Remy Sharp
  • 4,520
  • 3
  • 23
  • 40
  • 2
    You're somewhat incorrect, Prototype does provide a utility for guessing the browser name as I show below. And guessing is really the best you can do, since any browser can lie about its User Agent string. – Grant Hutchins Oct 26 '08 at 23:41
  • This is a great solution, thanks. (It works better than Prototype's, which only distinguishes between IE, Opera, WebKit, MobileSafari and Gecko -- and with no version numbers without coding it yourself.) – Chuck Le Butt Jun 08 '10 at 14:12
  • Adding the line: this.chrome = /chrome/.test( userAgent ); adds recognition for... you guessed it. (Note: You also need to add: "&& !/chrome/.test( userAgent );" to the Safari line.) – Chuck Le Butt Jun 08 '10 at 15:36
3

I use this over and above Prototype's browser definitions.

Object.extend(Prototype.Browser, {
    ie6: (/MSIE (\d+\.\d+);/.test(navigator.userAgent)) ? (Number(RegExp.$1) == 6 ? true : false) : false,
    ie7: (/MSIE (\d+\.\d+);/.test(navigator.userAgent)) ? (Number(RegExp.$1) == 7 ? true : false) : false,
    ie8: (/MSIE (\d+\.\d+);/.test(navigator.userAgent)) ? (Number(RegExp.$1) == 8 ? true : false) : false,
    ie9: (/MSIE (\d+\.\d+);/.test(navigator.userAgent)) ? (Number(RegExp.$1) == 9 ? true : false) : false
});

Hope it helps!

Mandeep
  • 181
  • 4
  • 12
2

I have prototype.js extended after:

var Prototype = { ... };

with this:

// extension
if (Prototype.Browser.IE) {
    if (/MSIE (\d+\.\d+);/.test(navigator.userAgent)) {
        Prototype.BrowserFeatures['Version'] = new Number(RegExp.$1);
    }
}

Works fine for me, calling is like:

if (Prototype.Browser.IE && Prototype.BrowserFeatures['Version'] == 8) { ... }
toutatis
  • 21
  • 1
0
            <script type="text/JavaScript">

                function getBrowserVersion()
                {
                    var msg = "Not Recognised Browser";

                    if (/Firefox[\/\s](\d+\.\d+)/.test(navigator.userAgent))
                    {
                        var ffversion = new Number(RegExp.$1)

                        for (var i = 1; i < 20; i++)
                        {
                            if (ffversion == i)
                            {
                                msg = "FF" + i + "x";
                                break;
                            }
                        }
                    }
                    else if (/MSIE (\d+\.\d+);/.test(navigator.userAgent))
                    {
                        var ieversion = new Number(RegExp.$1)

                        for (var i = 1; i < 20; i++)
                        {
                            if (ieversion == i)
                            {
                                msg = "IE" + i + "x";
                                break;
                            }
                        }
                    }

                    alert(msg); // return msg; 
                }

           </script>
Developer_From_India
  • 1