/*
Created By: Chris Campbell
Website: http://particletree.com
Date: 2/1/2006

Inspired by the lightbox implementation found at http://www.huddletogether.com/projects/lightbox/

Updated to suit the use in ibm.com/developworks:
Updated by:
Tom Coppedge (tcoppedg@us.ibm.com) Date: 3/22/2007 (increased size of lightbox to 750W X 480H)
Peter Yim (pcyim@us.ibm.com)  Date: 2/1/2007
*/
var detect=navigator.userAgent.toLowerCase();var OS,browser,version,total,thestring;function getBrowserInfo(){if(checkIt("konqueror")){browser="Konqueror";OS="Linux"}else{if(checkIt("safari")){browser="Safari"}else{if(checkIt("omniweb")){browser="OmniWeb"}else{if(checkIt("opera")){browser="Opera"}else{if(checkIt("webtv")){browser="WebTV"}else{if(checkIt("icab")){browser="iCab"}else{if(checkIt("msie")){browser="Internet Explorer"}else{if(!checkIt("compatible")){browser="Netscape Navigator";version=detect.charAt(8)
}else{browser="An unknown browser"}}}}}}}}if(!version){version=detect.charAt(place+thestring.length)}if(!OS){if(checkIt("linux")){OS="Linux"}else{if(checkIt("x11")){OS="Unix"}else{if(checkIt("mac")){OS="Mac"}else{if(checkIt("win")){OS="Windows"}else{OS="an unknown operating system"}}}}}}function checkIt(A){place=detect.indexOf(A)+1;thestring=A;return place}Event.observe(window,"load",initialize,false);Event.observe(window,"load",getBrowserInfo,false);Event.observe(window,"unload",Event.unloadCache,false);
var lightbox=Class.create();lightbox.prototype={yPos:0,xPos:0,initialize:function(A){this.content=A.href;Event.observe(A,"click",this.activate.bindAsEventListener(this),false);A.onclick=function(){return false}},activate:function(){if(browser=="Internet Explorer"){this.getScroll();this.prepareIE("100%","hidden");this.setScroll(0,0);this.hideSelects("hidden")}this.displayLightbox("block")},prepareIE:function(A,B){bod=document.getElementsByTagName("body")[0];bod.style.height=A;bod.style.overflow=B;
htm=document.getElementsByTagName("html")[0];htm.style.height=A;htm.style.overflow=B},hideSelects:function(A){selects=document.getElementsByTagName("select");for(i=0;i<selects.length;i++){selects[i].style.visibility=A}},getScroll:function(){if(self.pageYOffset){this.yPos=self.pageYOffset}else{if(document.documentElement&&document.documentElement.scrollTop){this.yPos=document.documentElement.scrollTop}else{if(document.body){this.yPos=document.body.scrollTop}}}},setScroll:function(A,B){window.scrollTo(A,B)
},displayLightbox:function(A){$("overlay").style.display=A;$("lightbox").style.display=A;if(A!="none"){this.loadInfo()}},loadInfo:function(){info="<div id='lbContent'></div>";new Insertion.Before($("lbLoadMessage"),info);var A=new Ajax.Updater("lbContent",this.content,{method:"get",parameters:"rand="+(new Date()).getTime()+Math.random(),onComplete:this.processInfo.bindAsEventListener(this),evalScripts:true,asynchronous:true})},processInfo:function(A){$("lightbox").className="done";var B=$$("#lbContent #receiveFocus input");
if(B!=null&&B.length>0){B[0].focus()}updateBuffer();this.actions()},actions:function(){lbActions=document.getElementsByClassName("lbAction");for(i=0;i<lbActions.length;i++){if(lbActions[i].nodeName=="IMG"||lbActions[i].nodeName=="INPUT"){if(lbActions[i].alt=="Submit"){this.submitFunc=lbActions[i].onclick;Event.observe(lbActions[i],"click",this[lbActions[i].alt].bindAsEventListener(this),false)}if(lbActions[i].alt=="Approve"){this.approveFunc=lbActions[i].onclick;Event.observe(lbActions[i],"click",this[lbActions[i].alt].bindAsEventListener(this),false)
}if(lbActions[i].alt=="Reject"){this.rejectFunc=lbActions[i].onclick;Event.observe(lbActions[i],"click",this[lbActions[i].alt].bindAsEventListener(this),false)}}else{Event.observe(lbActions[i],"click",this[lbActions[i].rel].bindAsEventListener(this),false)}lbActions[i].onclick=function(){return false}}},insert:function(B){link=Event.element(B).parentNode;Element.remove($("lbContent"));var A=new Ajax.Request(link.href,{method:"get",parameters:"rand="+(new Date()).getTime()+Math.random(),onComplete:this.processInfo.bindAsEventListener(this)})
},deactivate:function(){Element.remove($("lbContent"));if(browser=="Internet Explorer"){this.setScroll(0,this.yPos);this.prepareIE("auto","auto");this.hideSelects("visible")}$("lightbox").className="loading";this.displayLightbox("none")},Submit:function(){this.submitFunc();if($("ret_status").innerHTML=="true"){this.deactivate()}},Approve:function(){this.approveFunc();if($("ret_status").innerHTML=="true"){this.deactivate()}},Reject:function(){this.rejectFunc();if($("ret_status").innerHTML=="true"){this.deactivate()
}}};function initialize(){addLightboxMarkup();lbox=document.getElementsByClassName("lbOn");for(i=0;i<lbox.length;i++){valid=new lightbox(lbox[i])}}function addLightboxMarkup(){bod=document.getElementsByTagName("body")[0];overlay=document.createElement("div");overlay.id="overlay";lb=document.createElement("div");lb.id="lightbox";lb.className="loading";lb.innerHTML='<div id="lbLoadMessage"><table cellspacing="0" cellpadding="0" width="750">   <tr>     <td height="450" width="750">       <!-- The div create a drop shadow effect around the table -->       <div class="blur">         <div class="shadow">           <div class="content">             <!-- START OF MAIN TABLE -->             <table cellspacing="0" cellpadding="0" width="750" border="0">               <tr>               <td height="450" width="1"><img src="//www.ibm.com/c.gif" width="1" height="450" alt="" /></td>               <td>                 <table>                   <!-- MASTHEAD --> 	              <tr> 	                <td class="bbg" height="30"> 	                  <table> 	                    <tr> 	                      <td>                                  <img src="//www.ibm.com/developerworks/i/dw_header.gif" width="125" height="30" alt="developerWorks" /> 	                      </td> 	                      <td bgcolor="black"> 	                        <img src="//www.ibm.com/c.gif" width="512" height="30" alt="" /> 	                      </td> 	                      <td> 	                        <img src="//www.ibm.com/developerworks/i/ibm_header.gif" width="113" height="30" alt="Provided by IBM" /> 	                      </td> 	                    </tr> 	                  </table> 	                </td>                  </tr>               	 <!-- BODY -->               	 <tr> 	                <td width="750" height="400" valign="top"> 	                  <table border="0" cellpadding="0" cellspacing="0" width="750"> 	                    <tr> 	                      <td> 	                        <img src="//www.ibm.com/c.gif" width="3" alt="" /> 	                      </td> 	                      <td width="744"> 	                        <h1>Loading...</h1> 	                        <table width="744" cellpadding="0" cellspacing="0" border="0"> 	                          <tr valign="top" align="left"> 	                            <td width="10"> 	                              <img src="//www.ibm.com/i/c.gif" width="10" height="1" alt="" /> 	                            </td> 	                            <td width="734"> 	                              <table border="0" cellspacing="0" cellpadding="0"> 	                                <tr> 	                                  <td> 	                                    <img src="//www.ibm.com/i/c.gif" width="1" height="5" alt="" /> 						                         </td> 					                         </tr> 					                         <tr>                                        <td class="small" valign="top" align="left">                                               <div id="editArea">                                                 <br />                                               </div>                                         </td>                                       </tr>                                       <tr>                                           <td>                                               <img src="//www.ibm.com/c.gif" width="1" height="5" alt="" />                                             </td>                                           </tr>                                     </table> 					                     </td> 					                   </tr> 				                   </table> 				                 </td> 				                 <td> 			                     <img src="//www.ibm.com/c.gif" width="3" alt="" /> 			                   </td> 			                </tr> 	                  </table> 	                </td>                  </tr>                  <!-- FOOTER -->                  <tr> 	                <td class="bbg" height="20" width="750"> 	                  <table cellpadding="0" cellspacing="0" border="0" width="750"> 	                    <tr> 	                      <td height="19" class="bbg"> 	                        <table cellspacing="0" cellpadding="0" border="0"> 	                          <tr> 	                             <td> 	                                  <span class="spacer">&nbsp;&nbsp;&nbsp;&nbsp;</span> 	                                  <a class="mainlink" href="http://www.ibm.com/privacy/us/">Privacy</a> 	                             </td> 	                             <td width="27" class="footer-divider">&nbsp;&nbsp;&nbsp;&nbsp;</td> 	                             <td> 	                                  <a class="mainlink" href="http://www.ibm.com/contact/us/">Contact</a> 	                             </td> 	                             <!-- Spacer --> 	                             <td width="550"> 	                               <img src="//www.ibm.com/c.gif" width="550" height="20" alt="" /> 	                             </td> 				     <td> 	                             </td> 	                          </tr> 	                        </table> 	                      </td> 	                    </tr> 	                  </table> 	                </td>                  </tr>                 </table>                 </td>  <!-- end of second cell in the main row -->               </tr>    <!--  end of the main row  -->                     </table>           </div>         </div>       </div>     </td>   </tr> </table> </div>';
bod.appendChild(overlay);bod.appendChild(lb)};
