﻿// JScript File
//
//===================================================================

//============================ Open Div Using AJAX =============//
        //=============== NEW START ========//

        var xmlHttp = null;
        var divLeftPosition = 0;
        var divTopPosition = 0;
        
        function ShowMoreInfo(obj, div_Id)
        {
            
            try
            {
                divLoading(obj, div_Id);
                try
                {
                      xmlHttp=new XMLHttpRequest();   // This is for Firefox, Opera 8.0+, Safari, IE7.
                }
                catch(e)
                {
                      // This is for Old lower version of IE7...
                      try
                      {
                        xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
                      }
                      catch(err)
                      {
                        alert ("This Browser is not 'XMLHTTP' Compatible!");
                        return;  
                      }
                }
                var screenHeight = getDocumentSize('height');
                var screenWidth = getDocumentSize('width');
                try
                {
	                if (window.event)   //========= This is for IE =========//
                    {
                        //######## For WIDTH of IE ########
                        if((event.clientX + 255) > screenWidth)
                        {
                            //divLeftPosition = screenWidth - 250;
                            divLeftPosition = event.clientX - 220;
                        }
                        else
                        {
                            divLeftPosition = event.clientX + 10;
                        }
                        //######## For HEIGHT of IE ########
                        if((screenHeight - event.clientY) < 92)
                        {
                            divTopPosition = (screenHeight + Get_Scroller_Value('Top') - 120);
                        }
                        else
                        {
                            divTopPosition = (event.clientY + Get_Scroller_Value('Top') + 10);
                        }
                    }
                    else if(obj)    //========= This is for Mozilla & other's =========//
                    {
                        //######## For WIDTH of Mozilla & other's ########
                        if((obj.clientX + 255) > screenWidth)
                        {
                            //divLeftPosition = (screenWidth - 250) + "px";
                            divLeftPosition = (obj.clientX - 220) + "px";
                        }
                        else
                        {
                            divLeftPosition = (obj.clientX + 10) + "px";
                        }
                        //######## For HEIGHT of Mozilla & other's ########
                        if((screenHeight - obj.clientY) < 92)
                        {
                            divTopPosition = (screenHeight + Get_Scroller_Value('Top') - 120) + "px";
                        }
                        else
                        {
                            divTopPosition = (obj.clientY + Get_Scroller_Value('Top') + 10) + "px";
                        }
                    }
                 }
                 catch(Error)
                 {
                    alert("Error in Loading : "+Error);
                 }
                  //===============================================//
                 //============== This is for 'POST' =============//
                //===============================================//
                
                var url = "GetAjaxValue.aspx";
                var data = "squareId=" + div_Id;
                xmlHttp.open("POST", url, true);
                xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
                xmlHttp.send(data);
                
                xmlHttp.onreadystatechange = function(){ OnCompleted(div_Id); };
            }
            catch(error)
            {
                alert("Error :: " + error);
            }
        }
        
        function OnCompleted(divId) 
        {
            try
            {
                if (xmlHttp.readyState == 4)
                {
                    var xmlDoc = null;
                    //alert(xmlHttp.responseText);
                    if(xmlHttp.responseXML != null)
                    {
                        xmlDoc = xmlHttp.responseXML.documentElement;
                        var Name = xmlDoc.getElementsByTagName("Name")[0].childNodes[0].nodeValue;
                        var Age = xmlDoc.getElementsByTagName("Age")[0].childNodes[0].nodeValue;
                        var Gender = xmlDoc.getElementsByTagName("Gender")[0].childNodes[0].nodeValue;
                        var Country = xmlDoc.getElementsByTagName("Country")[0].childNodes[0].nodeValue;
                        var Points = xmlDoc.getElementsByTagName("Points")[0].childNodes[0].nodeValue;
                        var UserImg = xmlDoc.getElementsByTagName("UserImg")[0].childNodes[0].nodeValue;
                        var GameName = xmlDoc.getElementsByTagName("GameName")[0].childNodes[0].nodeValue;
                        var Score = xmlDoc.getElementsByTagName("Score")[0].childNodes[0].nodeValue;
                        var PlayDate = xmlDoc.getElementsByTagName("PlayDate")[0].childNodes[0].nodeValue;
                        
                        var other_Info = "<b> "+ Age + "/" + Gender + "/" + Country + ",<br/>" + Points + " RS Points, <br/> Game Played : " + GameName + ",<br/>Score : " + Score + ",<br/> Play Date : "+ PlayDate +"</b> <br/>";
                        getInfo(Name,UserImg,other_Info);
                    }
                    else
                    {
                       blankInfo1(divId);
                    }
                }
            }
            catch(err)
            {
                blankInfo1(divId);
            }
        }
        function getInfo(userName, imgSrc, otherInfo)
        {
            var  x = document.getElementById("divParent");
            var  y = document.getElementById("divLoading");
            if(x!=null)
            {
                document.getElementById("divGrid").removeChild(x);
            }
            else if(y != null)
            {
                try
                {
                    var containerDiv = document.getElementById("divGrid");
                    
                    //==== This is Parent Div =====//
                    var divParent = document.createElement('DIV');
			        divParent.setAttribute('id','divParent');
			        divParent.style.position = "absolute";
			        divParent.style.width = "200px";
			        divParent.style.height = "auto";
			        divParent.style.border = "solid 1px Black";
			        divParent.style.backgroundColor = "Silver";
			        
			        //===== This is for Show Div along with Mouse Move ======//
			        divParent.style.left = divLeftPosition;
                    divParent.style.top = divTopPosition;
			        
			        containerDiv.appendChild(divParent);
        						
			        //===== This is Title Area =====//
			        var divTitleArea=document.createElement('DIV');
			        divTitleArea.setAttribute('id','divTitleArea');
			        divTitleArea.style.width = "195px";
			        divTitleArea.style.height = "20px";
			        divTitleArea.style.textAlign = "left";
			        divTitleArea.style.paddingLeft = "5px";
			        divTitleArea.style.color = "White";
			        divTitleArea.style.fontSize = "12px";
			        divTitleArea.style.fontWeight = "bold";
			        divTitleArea.style.fontFamily = "Arial";
			        divTitleArea.style.verticalAlign = "middle";
			        divTitleArea.style.backgroundColor = "Maroon";
			        divTitleArea.style.borderBottom = "solid 1px Maroon";
			        divTitleArea.appendChild(document.createTextNode(userName));
			        divParent.appendChild(divTitleArea);
        			
			        //===== To Add a Info contain Div =======//
			        var divInfo = document.createElement('DIV');
			        divInfo.setAttribute('id','divInfo');
			        divInfo.style.width = "200px";
			        divInfo.style.height = "auto";
			        divInfo.style.backgroundColor = "Transparent";
			        divParent.appendChild(divInfo);
        			
    			    //===== To Add Image Holder Div =======//
    			    var divImg = document.createElement('DIV');
			        divImg.setAttribute('id','divImg');
			        divImg.style.width = "60px";
			        divImg.style.height = "55px";
			        divImg.style.textAlign = "center";
			        divImg.style.padding = "3px 2px 2px 0px";
			        divImg.style.cssFloat = "left";   //=== This is for Mozilla =====//
			        divImg.style.styleFloat = "left"; //=== This is for IE =====//
			        divInfo.appendChild(divImg);
        			
			        //===== This is for UserImage ======//
			        var imgUser = document.createElement('IMG');
			        imgUser.setAttribute('id','imgUser');
			        imgUser.setAttribute('src',imgSrc);
			        imgUser.style.border = "solid 1px Black";
			        imgUser.style.width="50px";
			        imgUser.style.height="50px";
			        divImg.appendChild(imgUser);
    			    
			        //===== To Add Text Holder Div =======//
    			    var divText = document.createElement('DIV');
			        divText.setAttribute('id','divText');
			        divText.style.width = "130px";
			        divText.style.textAlign = "left";
			        divText.style.padding = "3px 2px 3px 3px";
			        divText.style.cssFloat = "right";   //=== This is for Mozilla =====//
			        divText.style.styleFloat = "right"; //=== This is for IE =====//
			        divText.style.fontSize = "10px";
			        divText.style.color = "White";
			        divText.style.fontWeight = "bold";
			        divText.style.fontFamily = "Arial";
			        divText.innerHTML = otherInfo;
			        divInfo.appendChild(divText);
			        
			        //========= Loading Div Close =========//
			        divClose("divLoading");
			    }
			    catch(err)
			    {
			        alert("Error :: " + err);
			    }
			}
        }
        
        function divLoading(objMove, divId)
        {
            divClose("divParent");
            var containerDiv = document.getElementById("divGrid");
            try
            {
                    //==== This is Parent Div =====//
                    var divLoading = document.createElement('DIV');
			        divLoading.setAttribute('id','divLoading');
			        divLoading.style.position = "absolute";
			        divLoading.style.width = "200px";
			        divLoading.style.height = "80px";
			        divLoading.style.border = "solid 1px Black";
			        divLoading.style.zIndex = "3";
			        divLoading.style.backgroundColor = "Silver";
			        
			        //===== This is for Show Div along with Mouse Move ======//
			        var screenHeight = getDocumentSize('height');
                    var screenWidth = getDocumentSize('width');
			        if (window.event)   ///========= This is for IE ========//
		            {
                        //######## For WIDTH of IE ########
                        if((event.clientX + 255) > screenWidth)
                        {
                            //divLoading.style.left = screenWidth - 250;
                            divLoading.style.left = event.clientX - 220;
                        }
                        else
                        {
                            divLoading.style.left = event.clientX + 10;
                        }
                        //######## For HEIGHT of IE ########
                        if((screenHeight - event.clientY) < 92)
                        {
                            divLoading.style.top = (screenHeight + Get_Scroller_Value('Top') - 120);
                        }
                        else
                        {
                            divLoading.style.top = (event.clientY + Get_Scroller_Value('Top') + 10);
                        }
                    }
                    else if(objMove)    ///========= This is for Mozilla & other's ========//
                    {
                        //######## For WIDTH of Mozilla & other's ########
                        if((objMove.clientX + 255) > screenWidth)
                        {
                            //divLoading.style.left = (screenWidth - 250) + "px";
                            divLoading.style.left = (objMove.clientX - 220) + "px";
                        }
                        else
                        {
                            divLoading.style.left = (objMove.clientX + 10) + "px";
                        }
                        //######## For HEIGHT of Mozilla & other's ########
                        if((screenHeight - objMove.clientY) < 92)
                        {
                            divLoading.style.top = (screenHeight + Get_Scroller_Value('Top') - 120) + "px";
                        }
                        else
                        {
                            divLoading.style.top = (objMove.clientY + Get_Scroller_Value('Top') + 10) + "px";
                        }
                    }
			        containerDiv.appendChild(divLoading);
        						
			        //===== This is Title Area =====//
			        var divTitleArea=document.createElement('DIV');
			        divTitleArea.setAttribute('id','divTitleArea');
			        divTitleArea.style.width = "195px";
			        divTitleArea.style.height = "20px";
			        divTitleArea.style.textAlign = "left";
			        divTitleArea.style.paddingLeft = "5px";
			        divTitleArea.style.color = "White";
			        divTitleArea.style.fontSize = "12px";
			        divTitleArea.style.fontWeight = "bold";
			        divTitleArea.style.fontFamily = "Arial";
			        divTitleArea.style.verticalAlign = "middle";
			        divTitleArea.style.backgroundColor = "Maroon";
			        divTitleArea.style.borderBottom = "solid 1px Maroon";
			        //divTitleArea.appendChild(document.createTextNode(userName + " (Cell No. : " + div_Id + ")"));
			        divTitleArea.appendChild(document.createTextNode('Loading... (' + divId + ')'));
			        divLoading.appendChild(divTitleArea);
			        
			        //===== To Add Image Holder Div =======//
    			    var divImg = document.createElement('DIV');
			        divImg.setAttribute('id','divImg');
			        divImg.style.width = "190px";
			        divImg.style.height = "55px";
			        divImg.style.textAlign = "center";
			        divImg.style.padding = "3px 2px 2px 0px";
			        divImg.style.cssFloat = "center";   //=== This is for Mozilla =====//
			        //divImg.style.styleFloat = "center"; //=== This is for IE =====//
			        divLoading.appendChild(divImg);
			        
			        //===== This is for UserImage ======//
			        var imgUser = document.createElement('IMG');
			        imgUser.setAttribute('id','imgUser');
			        imgUser.setAttribute('src','images/indicator_remembermilk_orange.gif');
			        imgUser.style.border = "solid 0px Black";
			        imgUser.style.width="25px";
			        imgUser.style.height="25px";
			        divImg.appendChild(imgUser);
			 }
			 catch(err)
			 {
			    alert("Loading Error :: " + err);
			 }
        }
        function blankInfo1(divId)
        {
            var  x = document.getElementById("divBlank");
            var  y = document.getElementById("divLoading");
            if(x!=null)
            {
                document.getElementById("divGrid").removeChild(x);
            }
            else if(y != null)
            {
                try
                {
			        //========= Loading Div Close =========//
			        divClose("divLoading");
                
                    var containerDiv = document.getElementById("divGrid");
                    //==== This is Parent Div =====//
                    var divBlank = document.createElement('DIV');
			        divBlank.setAttribute('id','divBlank');
			        divBlank.style.position = "absolute";
			        divBlank.style.width = "200px";
			        divBlank.style.height = "auto";
			        divBlank.style.border = "solid 1px Black";
			        divBlank.style.backgroundColor = "Silver";
			        
			        //===== This is for Show Div along with Mouse Move ======//
			        divBlank.style.left = divLeftPosition;
                    divBlank.style.top = divTopPosition;
                    
			        containerDiv.appendChild(divBlank);
        						
			        //===== This is Title Area =====//
			        var divTitleArea=document.createElement('DIV');
			        divTitleArea.setAttribute('id','divTitleArea');
			        divTitleArea.style.width = "195px";
			        divTitleArea.style.height = "20px";
			        divTitleArea.style.textAlign = "left";
			        divTitleArea.style.paddingLeft = "5px";
			        divTitleArea.style.color = "White";
			        divTitleArea.style.fontSize = "12px";
			        divTitleArea.style.fontWeight = "bold";
			        divTitleArea.style.fontFamily = "Arial";
			        divTitleArea.style.verticalAlign = "middle";
			        divTitleArea.style.backgroundColor = "Maroon";
			        divTitleArea.style.borderBottom = "solid 1px Maroon";
			        divBlank.appendChild(divTitleArea);
        			
			        //===== To Add Message Holder Div =======//
    			    var divMessage = document.createElement('DIV');
			        divMessage.setAttribute('id','divMessage');
			        divMessage.style.width = "190px";
			        divMessage.style.height = "55px";
			        divMessage.style.color = "White";
			        divMessage.style.fontSize = "12px";
			        divMessage.style.fontWeight = "bold";
			        divMessage.style.textAlign = "center";
			        divMessage.style.padding = "3px 2px 2px 0px";
			        divMessage.style.cssFloat = "center";   //=== This is for Mozilla =====//
			        //divImg.style.styleFloat = "center"; //=== This is for IE =====//
			        divMessage.appendChild(document.createTextNode(" Square Id : "+ divId +" is empty."));
			        divBlank.appendChild(divMessage);
			    }
			    catch(err)
			    {
			        alert("Error :: " + err);
			        divClose("divBlank");
			    }
			}
        }
        function blankInfo()
        {
            var  x = document.getElementById("divBlank");
            var  y = document.getElementById("divLoading");
            if(x!=null)
            {
                document.getElementById("divGrid").removeChild(x);
            }
            else if(y != null)
            {
                try
                {
			        //========= Loading Div Close =========//
			        divClose("divLoading");
                
                    var containerDiv = document.getElementById("divGrid");
                    //==== This is Parent Div =====//
                    var divBlank = document.createElement('DIV');
			        divBlank.setAttribute('id','divBlank');
			        divBlank.style.position = "absolute";
			        divBlank.style.width = "200px";
			        divBlank.style.height = "auto";
			        divBlank.style.border = "solid 1px Black";
			        divBlank.style.backgroundColor = "Silver";
			        
			        //===== This is for Show Div along with Mouse Move ======//
			        divBlank.style.left = divLeftPosition;
                    divBlank.style.top = divTopPosition;
                    
			        containerDiv.appendChild(divBlank);
        						
			        //===== This is Title Area =====//
			        var divTitleArea=document.createElement('DIV');
			        divTitleArea.setAttribute('id','divTitleArea');
			        divTitleArea.style.width = "195px";
			        divTitleArea.style.height = "20px";
			        divTitleArea.style.textAlign = "left";
			        divTitleArea.style.paddingLeft = "5px";
			        divTitleArea.style.color = "White";
			        divTitleArea.style.fontSize = "12px";
			        divTitleArea.style.fontWeight = "bold";
			        divTitleArea.style.fontFamily = "Arial";
			        divTitleArea.style.verticalAlign = "middle";
			        divTitleArea.style.backgroundColor = "Maroon";
			        divTitleArea.style.borderBottom = "solid 1px Maroon";
			        divBlank.appendChild(divTitleArea);
        			
			        //===== To Add Message Holder Div =======//
    			    var divMessage = document.createElement('DIV');
			        divMessage.setAttribute('id','divMessage');
			        divMessage.style.width = "190px";
			        divMessage.style.height = "55px";
			        divMessage.style.color = "White";
			        divMessage.style.fontSize = "12px";
			        divMessage.style.fontWeight = "bold";
			        divMessage.style.textAlign = "center";
			        divMessage.style.padding = "3px 2px 2px 0px";
			        divMessage.style.cssFloat = "center";   //=== This is for Mozilla =====//
			        //divImg.style.styleFloat = "center"; //=== This is for IE =====//
			        divMessage.appendChild(document.createTextNode(" This square is empty."));
			        divBlank.appendChild(divMessage);
			    }
			    catch(err)
			    {
			        alert("Error :: " + err);
			        divClose("divBlank");
			    }
			}
        }
        function divClose(divId)
        {
            try
            {
                var loadDiv = document.getElementById(divId);
                if(loadDiv != null)
                {
                    document.getElementById("divGrid").removeChild(loadDiv);
                }
            }
            catch(err)
            {
                alert("Load Close Error :: " + err);
            }
        }
        
        function mouseOutClose()
        {
            var  x=document.getElementById("divParent");
            if(x!=null)
            {
                document.getElementById("divGrid").removeChild(x);
            }
            divClose("divLoading");
            divClose("divBlank");
        }
        function getDocumentSize(forWhich)
        {
            var docWidth = 0, docHeight = 0;
            if( typeof( window.innerWidth ) == 'number' )
            {
                //Non-IE
                docWidth = window.innerWidth;
                docHeight = window.innerHeight;
            } 
            else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) 
            {
                //IE 6+ in 'standards compliant mode'
                docWidth = document.documentElement.clientWidth;
                docHeight = document.documentElement.clientHeight;
            } 
            else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) 
            {
                //IE 4 compatible
                docWidth = document.body.clientWidth;
                docHeight = document.body.clientHeight;
            }
            if(forWhich=='width')
            {
                return docWidth;
            }
            else if(forWhich=='height')
            {
                return docHeight;
            }
        }
        
        function Get_Scroller_Value(whichValue)
        {
          var scrollX, scrollY;
          try
          {
              if (document.all)
              {
                 if (!document.documentElement.scrollLeft)
                    scrollX = document.body.scrollLeft;
                 else
                    scrollX = document.documentElement.scrollLeft;
                       
                 if (!document.documentElement.scrollTop)
                    scrollY = document.body.scrollTop;
                 else
                    scrollY = document.documentElement.scrollTop;
              }   
              else
              {
                 scrollX = window.pageXOffset;
                 scrollY = window.pageYOffset;
              }
              
              if(whichValue == 'Top')
              {
                return scrollY;
              }
              else if(whichValue == 'Left')
              { 
                return scrollX;
              }
          }
          catch(err)
          {
            alert('Scroll Error : ' + err);
          }
       }
       
       //===== This is for "Timer_Control" with JavaScript =====//
       var xmlHttpTimer = null;
       function jsTimer() 
       {
            //====================================================//
            //===== Here Javascript AJAX will be implemented =====//
            //====================================================//
            try
            {
                xmlHttpTimer=new XMLHttpRequest();   // This is for Firefox, Opera 8.0+, Safari, IE7.
            }
            catch(e)
            {
                 // This is for Old lower version of IE7...
                 try
                 {
                    xmlHttpTimer=new ActiveXObject("Microsoft.XMLHTTP");
                 }
                 catch(err)
                 {
                    alert ("This Browser is not 'XMLHTTP' Compatible!");
                    return;  
                 }
            }
            var url = "GetAjaxValue.aspx";
            var data = "sqrInfo=1";
            xmlHttpTimer.open("POST", url, true);
            xmlHttpTimer.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
            xmlHttpTimer.send(data);
                
            xmlHttpTimer.onreadystatechange = OnCompletedShow;
            
            //====================================================//
            //=========== This is for Iteration ==================//
            //====================================================//
            
            //====== setTimeout("javascript statement",milliseconds) ======//
            setTimeout("jsTimer()", 5000);
       }
       function OnCompletedShow() 
        {
            try
            {
                if (xmlHttpTimer.readyState == 4)
                {
                    var xmlDoc = null;
                    if(xmlHttpTimer.responseXML != null)
                    {
                        xmlDoc = xmlHttpTimer.responseXML.documentElement;
                        var x = xmlDoc.getElementsByTagName("SquareId");
                        var count = x.length;
                        for(var i=0; i<count; i++)
                        {
                            var sqrId = xmlDoc.getElementsByTagName("SquareId")[i].childNodes[0].nodeValue;
                            var square = document.getElementById(sqrId);
                            if(square != null)
                            {
                                square.style.backgroundColor = '#FFFF00';
                            }
                        }
                    }
                }
            }
            catch(err)
            {
                alert("Error : " + err);
            }
        }
        
//=============== NEW END ========//

