<%@ page language="C#" autoeventwireup="true" inherits="MsgGroup_MsgGroupShow, App_Web_zqyakmif" %>

<!DOCTYPE html>

<html manifest="SisenMESS-Mobile-MsgGroupShow.appcache" >
<head runat="server">
    <title>无标题页</title>
    <script src="../Scripts/MyDate.js"></script>
    <script src="../Scripts/UserMsgClass.js"></script>
    <script type="text/javascript">
        
        //群组编号
        var _MsgGroupId;
        //禁止返回键
        javascript:window.history.forward(1);
        
        //window.onresize = ResetImageSize;
        
        //页面加载的方法
        function PageLoadFun()
        {
            _MsgGroupId = document.getElementById("txt_MsgGroupId").value;
            
            window.parent.ShowOrHideToolBar(false);
            
            MsgShowDiv.innerHTML = "<br>";//顶上有一块被挡住了。所以加两个换行。
            
            LoadLocalMsgList();
            
            XMLHttpGetLoadUserList();
            
            LoadServerMsgList();
            
            document.getElementById("FaceFrame").contentWindow.location.href = "../WaitingPage.aspx";
            
            ResetImageSize();
        }
        //还回上一页
        function BackPage()
        {
            window.location.href = "MsgGroup.aspx?UserNo=" + window.parent._UserNo;
        }
        //加载本地聊天记录
        function LoadLocalMsgList()
        {
            LoadLocalMsgGroupMsgList(_MsgGroupId,window.parent._UserNo);
        }
        //加载服务器端聊天记录
        function LoadServerMsgList()
        {
            XMLHttpGet();
        }
        //接收到群组消息
        function RecvMsgGroupShow(msggroupid)
        {
            if(msggroupid!=_MsgGroupId)
            {
                return 0;
            }
            XMLHttpGet();
            return 1;
        }
        
        var xmlHttpRequest = null;
        //收到消息，发现没有用户信息，就到服务器端下载用户信息
        function XMLHttpGet()
        { 
            xmlHttpRequest = new XMLHttpRequest();
            xmlHttpRequest.open("POST", "../SisenMESS-Mobile-WebService.asmx/GetMsgGroupMsgList", true);
            // 当发生状态变化时就调用这个回调函数
            xmlHttpRequest.onreadystatechange = ShowMsgCallback;
            // 使用post提交时必须加上下面这行代码
            xmlHttpRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
            
            // 向服务器发出一个请求
            xmlHttpRequest.send("msgGroupId="+_MsgGroupId+"&userNo=" + window.parent._UserNo);
        }
        
        function ShowMsgCallback()
        {
            if(xmlHttpRequest.readyState == 4)
            {
                if(xmlHttpRequest.status == 200)
                {
                    var content = xmlHttpRequest.responseText;
                                        
                    if(content=="")
                    {
                        return;
                    }
                    
                    var msghhtt = content.split('\n');
                    
                    for (var i=0;i<msghhtt.length;i++)
                    {
                        if(msghhtt[i]=="")
                        {
                            continue;
                        }
                        
                        msghhtt[i] = msghhtt[i].replace(/SisenMESS_ReLine_Code/g,"<br>");
                        
                        var tempmmssgg = msghhtt[i].split('\t');
                        
                        var msgshowhtml = GetMsgRecvHtml(tempmmssgg[0],GetMsgGroupUserTName(tempmmssgg[2]),tempmmssgg[3]) + "<br>";
                        
                        MsgShowDiv.innerHTML += msgshowhtml;
                        
                        //保存聊天记录
                        SaveLocalMsgGroupMsgList(_MsgGroupId,window.parent._UserNo,tempmmssgg[2],tempmmssgg[3],tempmmssgg[0],tempmmssgg[1],"0");
                        
                    }
                    
                    //DoImageResize();
                    
                    MsgShowDiv.scrollTop = MsgShowDiv.scrollHeight;
                    
                    ResetImageSize();

                }
            }
        }
        //得到用户名字
        function GetMsgGroupUserTName(userno)
        {
            var username = userno;
            try
            {
            if(localStorage.getItem(_MsgGroupId + userno))
            {
                var temp = localStorage.getItem(_MsgGroupId + userno).split('\t');
                
                username = temp[1];
                
                if(username=="")
                {
                    username = temp[2];
                }
            }
            }
            catch (e)
            {
            }
            return username;
        }
        
        var xmlLoadUserListHttpRequest = null;
        //收到消息，发现没有用户信息，就到服务器端下载用户信息
        function XMLHttpGetLoadUserList()
        { 
            xmlLoadUserListHttpRequest = new XMLHttpRequest();
            xmlLoadUserListHttpRequest.open("POST", "../SisenMESS-Mobile-WebService.asmx/GetMsgGroupUserList", true);
            // 当发生状态变化时就调用这个回调函数
            xmlLoadUserListHttpRequest.onreadystatechange = LoadUserListCallback;
            // 使用post提交时必须加上下面这行代码
            xmlLoadUserListHttpRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
            
            // 向服务器发出一个请求
            xmlLoadUserListHttpRequest.send("msgGroupId="+_MsgGroupId);
        }
        //保存用户列表
        function LoadUserListCallback()
        {
            if(xmlLoadUserListHttpRequest.readyState == 4)
            {
                if(xmlLoadUserListHttpRequest.status == 200)
                {
                    var content = xmlLoadUserListHttpRequest.responseText;
                    
                    var msghhtt = content.split('\n');
                    
                    for (var i=0;i<msghhtt.length;i++)
                    {
                        if(msghhtt[i]=="")
                        {
                            continue;
                        }
                        
                        var tempmmssgg = msghhtt[i].split('\t');
                        
                        localStorage.setItem(_MsgGroupId + tempmmssgg[0], msghhtt[i]);
                    }
                }
            }
        }
        
        //发送消息
        function SendMsg()
        {
            if(!window.parent._IsLogin)
            {
                alert("与服务器断开连接，无法发送消息...");
                return;
            }
            var msg = document.getElementById("txt_Msg").value;
            
            if(msg=="")
            {
                return;
            }
            
            msg = msg.replace(/\r/g,"").replace(/\n/g,"<br>");

            window.parent.SendMsgToServer("MsgGroup\n" + _MsgGroupId + "\n" + msg);
            
            var myDate = new Date();
            
            var mtim = myDate.toString("yyyy-MM-dd")
            msg +="<div style='width:100%; text-align:right; color:#66CCFF;font-size: 8px; '>" + myDate.toString("HH:mm:ss") + "</div>";
                        
            //保存聊天记录
            SaveLocalMsgGroupMsgList(_MsgGroupId,window.parent._UserNo,window.parent._UserNo,window.parent._MyUserIconUrl,msg,mtim,"1");

            msg = GetMsgSendHtml(msg,window.parent._MyUserIconUrl);
            
            MsgShowDiv.innerHTML += msg + "<br>";
            
            MsgShowDiv.scrollTop = MsgShowDiv.scrollHeight;
            
            document.getElementById("txt_Msg").value = "";
            document.getElementById("txt_Msg").style.height='22px';
            
            ResetImageSize();
            
        }
        
        //打开表情
        function OpenFace()
        {
            FaceDiv.style.height = "288px";
            FaceDiv.style.visibility="visible";
            
            if(document.getElementById("FaceFrame").contentWindow.location.href.indexOf("DefaultFace")==-1)
            {
                document.getElementById("FaceFrame").contentWindow.location.href = "../DefaltFace/DefaultFace.aspx";
            }
        }
        
        //发送表情
        function SendFace(faceName)
        {
            FaceDiv.style.height = "0px";
            FaceDiv.style.visibility = "hidden";
            
            if(faceName=="")
            {
                return;
            }
            if(!window.parent._IsLogin)
            {
                alert("与服务器断开连接，无法发送消息...");
                return;
            }
            var DefaltFaceCode = "SisenStudioFaceImagesReplace2008";
            var msg = "<img src='" + DefaltFaceCode + faceName + "'>";

            window.parent.SendMsgToServer("MsgGroup\n" + _MsgGroupId + "\n" + msg);
            
            var myDate = new Date();
            
            var mtim = myDate.toString("yyyy-MM-dd")
            msg = msg.replace(/SisenStudioFaceImagesReplace2008/g,"../DefaltFace/");
            msg +="<div style='width:100%; text-align:right; color:#66CCFF;font-size: 8px; '>" + myDate.toString("HH:mm:ss") + "</div>";
                        
            //保存聊天记录
            SaveLocalMsgGroupMsgList(_MsgGroupId,window.parent._UserNo,window.parent._UserNo,window.parent._MyUserIconUrl,msg,mtim,"1");

            msg = GetMsgSendHtml(msg,window.parent._MyUserIconUrl);
            
            MsgShowDiv.innerHTML += msg + "<br>";
            
            MsgShowDiv.scrollTop = MsgShowDiv.scrollHeight;
            
            ResetImageSize();

        }
        //显示用户列表
        function ShowUserList()
        {
            window.location.href = "MsgGroupUserList.aspx?MsgGroupId="+_MsgGroupId+"&MsgGroupName="+document.getElementById("labMsgGroupName").innerText;
        }
        
        //重置图片大小
        function ResetImageSize()
        {
            var screenwidth = document.documentElement.clientWidth * 0.74;
            
            var imgs = MsgShowDiv.getElementsByTagName("img");
            for(var i=0, len=imgs.length; i < len; i++)
            {
                if(imgs[i].width>screenwidth)
                {
                    var xcall1 = imgs[i].width/screenwidth;
                    
                    imgs[i].width = imgs[i].width/xcall1;
                    imgs[i].height = imgs[i].height/xcall1;
                    
                }
                //alert( imgs[i].src);
            }
        }
        
    </script>
</head>
<body onload="PageLoadFun();" style="background-color:#f4f8f9;overflow:no;">
    <form id="form1" runat="server">
    <div id = "MainDiv" style ="position:fixed;overflow:no; left:0px; top:0px;width:100%;height:100%;" >
    <table width="100%" height="100%" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td style ="height:36px;background-color:#17b4eb;">
            <table width="100%" height="100%" border="0" cellspacing="0" cellpadding="0">
                <tr>
                    <td style ="width:36px; text-align:center;"><img alt="" src="../Images/back.png" width="24" height="24" onclick="BackPage();" /></td>
                    <td style ="text-align:center;"><span id="labMsgGroupName" style="color:#FFFFFF; font-size:16px; font-weight:900;" runat = "server"></span><input id="txt_MsgGroupId" runat="server" readonly="readonly" style="width: 0px; display:none" type="text" /></td>
                    <td style ="width:28px;"><img alt="" onclick="ShowUserList()" id="userInfoImage" src="../Images/groupuser.png" width="28" height="28"/></td>
                    <td style ="width:20px; text-align:center;"></td>
                </tr>
            </table>
        </td>
      </tr>
      <tr>
        <td><div id="MsgShowDiv" style="overflow:auto; width:100%; height:100%; background-color:#FFFFFF; z-index:0"></div></td>
      </tr>
      <tr>
        <td style="height:40px;background-color:#f3f3f3;">
        </td>
      </tr>
    </table> 
    </div>
        <div id="FootBar" style="position:absolute;left:0px;bottom:0;top:expression(document.documentElement.clientHeight + document.documentElement.scrollTop - this.offsetHeight);background-color:#f3f3f3;height:40px;width:100%;font-family:Tahoma; font-size:12px; border-top:1px solid #cccccc;z-index:2;">
            <table width="100%" height="100%" border="0" cellspacing="0" cellpadding="0">
                <tr>
                    <td style ="width:20px;"></td>
                    <td style ="width:40px;"><img alt="表情" id ="btn_Face" src="../Images/face.gif" width="24" height="24" onclick="OpenFace();" /></td>
                    <td><textarea id="txt_Msg" style="cursor:text; font-size:13px; color:#003366;width:95%;line-height:20px;height:22px;font-family:Arial;cursor:text;*overflow-y:hidden; " onfocus="this.style.height='0px';this.style.height=(this.scrollHeight+'px');" oninput="this.style.height='0px';this.style.height=(this.scrollHeight+'px');"></textarea></td>
                    <td style="width:40px;"><img alt="发送" id ="btn_SendMsg" src="../Images/send.gif" width="56" height="30" onclick="SendMsg();" /></td>
                    <td style="width:10px;"></td>
                </tr>
            </table>
    </div>
    <div id="FaceDiv" style="position:fixed;left:0px;bottom:0;top:expression(document.documentElement.clientHeight + document.documentElement.scrollTop - this.offsetHeight);background-color:#f3f3f3;height:288px;width:100%;font-family:Tahoma; font-size:12px; border-top:1px solid #cccccc;z-index:2;visibility:hidden;">
        <iframe id="FaceFrame" border="0" marginwidth="0" marginheight="0"
                src="" frameborder="no" style="width:100%;height:100%;"
                scrolling="auto" name="FaceFrame"></iframe>
    </div>
    
    </form>
</body>
</html>
