Friday, May 11, 2012

Forcing browser compatibility in IE

I happened to stumble upon this concept long back and due to some reason which I don't remember, I lost interest in it. After a long time when I checked my archives, I came across this concept again and thought its time I put it to good use. I as most developers do, believe, IE is the browser that is a gift for the developers. Its so buggy that you can forget why your wife threw a stick at you the same morning :).

And to add to the recipe we have different versions of IE which again are different from each other in behavior. Or at least that what I believe as far as I have worked with it. Stories apart, I will come to the point,

I just found some one talking about how to force IE8 to work like IE7 when working with XPages.That article was exhaustive, and I have lost track of it. But I do have parts of it documented there and there for my understanding.

All you got to do is put the following code in beforeRenderResponse event: 
// first option uses compatibility mode, second option too but stronger
// X-UA-Compatible: IE=7
// X-UA-Compatible: IE=EmulateIE7
if (context.getUserAgent().isIE(8, 8)) {
  var exCon = facesContext.getExternalContext();
  var response = exCon.getResponse();
  response.setHeader("X-UA-Compatible", "IE=EmulateIE7");
}

Understanding Compatibility View

Before displaying a standards-mode Web page, Internet Explorer 8 checks to see if the domain name of the Web site appears in the Compatibility View List. If so, the site is displayed using Compatibility View. If not, and the page contains no other direction, Internet Explorer 8 displays the page in Internet Explorer 8 Standards mode.
When a standards-based Web page is displayed in Compatibility View, the following changes occur.
Pages are displayed in IE7 mode rather than IE8 mode.
In the user-agent string, the browser identifies itself as MSIE 7.0 instead of MSIE 8.0.
Conditional comments and version vectors recognize the browser as Internet Explorer 7, rather than Internet Explorer 8.
These changes help ensure that users can still use Web sites that do not fully support the features of Internet Explorer 8.
Please note that the X-UA-COMPATIBLE header has greater precedence than Compatibility View. If a Web site is on the Compatibility View List and a page on that site includes an X-UA-COMPATIBLE header telling Internet Explorer 8 to display a page in IE8 mode, the page is displayed in Internet Explorer 8 Standards mode. This allows Web developers to support Internet Explorer 8 Standards mode on an incremental basis

Javascript to identify the compatibility mode


engine = null;
if (window.navigator.appName == "Microsoft Internet Explorer")
{
   // This is an IE browser. What mode is the engine in?
   if (document.documentMode) // IE8
      engine = document.documentMode;
   else // IE 5-7
   {
      engine = 5; // Assume quirks mode unless proven otherwise.
      if (document.compatMode)
      {
         if (document.compatMode == "CSS1Compat")
            engine = 7; // standards mode
      }
   }
   // The engine variable now contains the document compatibility mode.
}


To specify a document mode for your Web pages, use the META element to include an X-UA-Compatible http-eqiv
header in your Web page. The following example specifies EmulateIE7 mode compatibility.
    
   
      My Web Page</< span>title></div><div>      <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /></div><div>   </< span>head></div><div>   <body></div><div>      <p>Content goes here.</< span>p></div><div>   </< span>body></div><div></< span>html></div><div><br></div><div>    </div><div><br></div><div>The content attribute specifies the mode for the page; for example, to mimic Internet Explorer 7 beha vior, specify IE=EmulateIE7.</div><div>Likewise, specify IE=5, IE=7, or IE=8 to select one of those compatibility modes. You can also specify IE=edge to tell Internet Explorer 8 to use the</div><div>highest mode available. </div><div><br></div></div>

Saturday, May 5, 2012

Google Search - Context Menu Addin For Internet Explorer



Create a html filed named say “GoogleSearch.htm” in a location say “D:\Lotus Notes\tools\MyIEPlugins”
Now code the html file with the following code and save it
<script language="JavaScript">
  var parentwin = external.menuArguments;
  var doc = parentwin.document;
  var sel = doc.selection;
  var rng = sel.createRange();
  var str = new String(rng.text);

  if(0 < str.length)
  {
    window.open("https://www.google.co.in/#hl=en&q="
      + str, "_blank");
  }
</script>
Now open your registry editor and traverse to the following key “HKCU\software\microsoft\Internet Explorer\MenuExt”
Now create a key named “&Google Search”
  
Now on the right side change the (Default) attribute’s value to the location of your html file that we created in the beginning
Now create a new DWord named “Contexts” and specify its value as 0x10.
Now start or restart your internet explorer.
Open a web page or your choice. Select some text and right click on it. Voila you will find some thing like the following

This will bring up a new window with the google search for the selected text as illustrated by the following screen shot


Likewise you can do it for Live Search as well. All you got to do is tweak your url a bit
"http://search.live.com/results.aspx?q="      + str
Hope this helps J