<%@ page language="C#" autoeventwireup="true" inherits="MsgGroup_MsgGroupUserList, App_Web_zqyakmif" %>
<!DOCTYPE html>
<html>
<head runat="server">
    <title>无标题页</title>
    <script type="text/javascript">
    
        //群组编号
        var _MsgGroupId;
        
        function PageLoadFun()
        {
            _MsgGroupId = document.getElementById("txt_MsgGroupId").value;
            
            MsgShowDiv.innerHTML = "<br><br>";//顶上有一块被挡住了。所以加两个换行。
            
            LoadUserList();
        }
        //还回上一页
        function BackPage()
        {
            window.location.href = "MsgGroupShow.aspx?MsgGroupId=" + _MsgGroupId+"&MsgGroupName="+document.getElementById("labMsgGroupName").innerText;
        }
        //加载用户列表
        function LoadUserList()
        {
            XMLHttpGetLoadUserList();
        }
        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');
                    
                    var hhhtt = "";
                    
                    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]);
                        
                        hhhtt += GetUserMsgShowItem(tempmmssgg[0], tempmmssgg[2], tempmmssgg[1], "0", "hidden", "../UserIcon/SisenMESS-User-None-Icon.gif");
                    }
                    
                    MsgShowDiv.innerHTML = hhhtt;
                }
            }
        }
        
        //得到用户Item（visible、hidden）
        function GetUserMsgShowItem(userno,username,userdetail,msgCount,isVisible,usericonpath)
        {
            userdetail += "&nbsp;";
            var htmltxt = "<div id = \"SisenMESSUserItem-" + userno + "\" class ='MsgListDivPro' onclick=\"OpenUserMsg('" + userno + "','" + username + "');\" >";
            htmltxt += "<table width=\"100%\" height=\"100%\"  border=\"0\" cellspacing=\"0\" cellpadding=\"0\">";
            htmltxt += "<tr>";
            htmltxt += "<td style=\"width:48px; height:48px;\" align=\"center\"><img id = 'userIcon-" + userno + "' style='border:1px #e0e1e3 solid;background-color:#FFFFFF' src=\"" + usericonpath + "\" width=\"32\" height=\"32\"></td>";
            htmltxt += "<td style='color:#4f5152;'><span id ='UserInfo-UserName-" + userno + "'>" + username  + "</span><br><span class = 'UserDetail' id ='UserInfo-UserDetail-" + userno + "'>" + userdetail + "</span></td>";
            htmltxt += "<td align='right'>";
            htmltxt += " <table id ='MsgCount-" + userno + "' style='height:16px;visibility:" + isVisible + "' border='0' cellspacing='0' cellpadding='0'>";
            htmltxt += " <tr style='height:16px; '>";
            htmltxt += " <td style='width:5px; background-image:url(../Images/y1.gif);background-size:5px 16px;'></td>";
            htmltxt += " <td style='width:5px; height:16px; background-image:url(../Images/y2.gif);background-size:40px 16px; font-size:10px; color:#FFFFFF;' align='center'>";
            htmltxt += " <div style='margin-top:2px;width:100%;text-align:right;' id ='msg_count_" + userno + "'>" + msgCount + "</div>";
            htmltxt += " </td>";
            htmltxt += " <td style='width:6px; background-image:url(../Images/y3.gif);background-size:6px 16px'></td>";
            htmltxt += " </tr>";
            htmltxt += " </table>";
            htmltxt += "</td>";//<span id ='msg_count_" + tempmsg[0] + "'>1</span>
            htmltxt += "<td style='width:4px;'></td>";                    
            htmltxt += "</tr>";
            htmltxt += "</table>";
            htmltxt += "</div>";
            
            return htmltxt;
        }
        
    </script>
    <link href="../Css/MsgList.css" rel="stylesheet" />
</head>
<body onload="PageLoadFun();" >
    <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: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>
    </form>
</body>
</html>
