<%@ Page Title="" Language="C#" MasterPageFile="~/Master/UserMaster.master" CodeBehind="FriendList.aspx.cs" Inherits="WAP2P.Web.PC.User.SNS.FriendList" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server"></asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="content" runat="server">
    <div class="m-userbox m-buserbox">
        <div class="m-friendmsg mt20">
            <div class="friendmsg-left">
                <form id="form1" action="?action=search&uid=<% =foreignUid %>" method="get" class="search" data-ajax-auto="true" data-ajax-fill="#js-ajaxlist" data-ajax-loading="<div class='pa10'>加载中</div>" data-ajax-error="<div class='pa10'>加载错误</div>">
                    <div class="friendmsg-tabs">
                        <a href="javascript:void(0);" class="g-left on" data-type="0">站内信</a>
                        <a href="javascript:void(0);" class="g-right" data-type="2">查看黑名单</a>
                        <a href="javascript:void(0);" class="g-right mr5" data-type="1">查看好友</a>
                        <input type="hidden" name="type" value="0" id="type" />
                        <input type="hidden" id="page" name="page" />
                        <input type="hidden" id="face_<%= CurrentUser.Id %>" src="<%= CurrentUser.GetFace() %>" />
                        <input type="hidden" id="face_0" src="/Res/core/Images/default/defaultphoto.png" />                        
                    </div>
                </form>
                <div class="friendmsg-friendlist">                    
                    <dl id="js-ajaxlist" class="js-ajaxlist">
                        <ruson:Space runat="server" ID="dataList">
                            <ruson:Repater runat="server" ID="rptMessageList" ItemType="WAP2P.Member.Message">
                                <HeaderTemplate>
                                    <% if(Request.QueryString["type"] == "0") { %>
                                    <dd>
                                        <ul class="js-user" data-uid="0">
                                            <li class="friendmsg-img"><img src="/Res/core/Images/default/defaultphoto.png" /></li>
                                            <li class="friendmsg-name"><a href="javascript:void(0);">系统消息</a></li>
                                        </ul>
                                    </dd>
                                    <% }
                                    if (foreignUser != null) { %>
                                    <dd>
                                        <ul class="js-user" data-uid="<% =foreignUser.Id %>">
                                            <li class="friendmsg-img"><img src="<%= foreignUser.GetFace() %>" id="face_<% =foreignUser.Id %>" /></li>
                                            <li class="friendmsg-name"><a href="javascript:void(0);"><%= foreignUser.GetNickname() %></a></li>
                                            <li class="friendmsg-oper" data-uid="<% =foreignUser.Id %>">
                                                <%= foreignRelated == null  ? "<a href=\"javascript:void(0);\" class=\"operate\" js-handle=\"addFriend\">添加好友</a>" : foreignRelated.Type == WAP2P.Member.Related.RelatedType.Friend ? "<a href=\"javascript:void(0);\" class=\"operate\" js-handle=\"deleteFriend\">删除好友</a>" : string.Empty %></a>
                                                <%= foreignRelated == null || foreignRelated.Type == WAP2P.Member.Related.RelatedType.Friend ? "<a href=\"javascript:void(0);\" class=\"operate\" js-handle=\"addBlackList\">加入黑名单</a>" : "<a href=\"javascript:void(0);\" class=\"operate\" js-handle=\"cancelBlackList\">取消黑名单</a>" %>
                                            </li>
                                        </ul>
                                    </dd>
                                    <% } %>
                                </HeaderTemplate>
                                <ItemTemplate>
                                    <dd>
                                        <ul class="js-user" data-uid="<%# Item.TargetId %>">
                                            <li class="friendmsg-img">
                                                <img src="<%# userList.First(item => item.Id == Item.TargetId).GetFace() %>" id="face_<%# Item.TargetId %>" />
                                                <i class="friendmsg-tip iconfont" <%# !Item.HaveNew ? " style=\"display: none;\"" : string.Empty %>>&#xe633;</i>
                                                <a class="friendmsg-off iconfont" href="javascript:void(0);" data-uid="<%# Item.TargetId %>" title="删除对话">&#xe634;</a>
                                            </li>
                                            <li class="friendmsg-name"><a href="javascript:void(0);"><%# userList.First(item => item.Id == Item.TargetId).GetNickname() %></a></li>
                                            <li class="friendmsg-oper" data-uid="<%# Item.TargetId %>">
                                                <%# userRelated.Where(item => item.TargetId == Item.TargetId).FirstOrDefault() == null  ? "<a href=\"javascript:void(0);\" class=\"operate\" js-handle=\"addFriend\">添加好友</a>": userRelated.Where(item => item.TargetId == Item.TargetId).FirstOrDefault().Type == WAP2P.Member.Related.RelatedType.Friend ? "<a href=\"javascript:void(0);\" class=\"operate\" js-handle=\"deleteFriend\">删除好友</a>" : string.Empty %></a>
                                                <%# userRelated.Where(item => item.TargetId == Item.TargetId).FirstOrDefault() == null || userRelated.Where(item => item.TargetId == Item.TargetId).FirstOrDefault().Type == WAP2P.Member.Related.RelatedType.Friend ? "<a href=\"javascript:void(0);\" class=\"operate\"js-handle=\"addBlackList\">加入黑名单</a>" : "<a href=\"javascript:void(0);\" class=\"operate\" js-handle=\"cancelBlackList\">取消黑名单</a>" %>
                                            </li>
                                        </ul>
                                    </dd>
                                </ItemTemplate>
                            </ruson:Repater>
                            <ruson:Repater runat="server" ID="rptRelatedList" ItemType=" WAP2P.Member.Related">
                                <ItemTemplate>
                                    <dd>
                                        <ul class="js-user" data-uid="<%# Item.TargetId %>">
                                            <li class="friendmsg-img">
                                                <img src="<%# userList.First(item => item.Id == Item.TargetId).GetFace() %>" id="face_<%# Item.TargetId %>" />
                                                <i class="friendmsg-tip iconfont" <%# (userMessage.Where(item => item.TargetId == Item.TargetId).FirstOrDefault() ?? new WAP2P.Member.Message()).HaveNew ? string.Empty : " style=\"display: none;\""  %>>&#xe633;</i>
                                            </li>
                                            <li class="friendmsg-name">
                                                <a href="javascript:void(0);"><%# userList.First(item => item.Id == Item.TargetId).GetNickname() %></a>
                                            </li>
                                            <li class="friendmsg-oper" data-uid="<%# Item.TargetId %>">
                                                <%# Item.Type == WAP2P.Member.Related.RelatedType.Friend ? "<a href=\"javascript:void(0);\" class=\"operate\" js-handle=\"deleteFriend\">删除好友</a>" : "<a href=\"javascript:void(0);\" class=\"operate\" js-handle=\"cancelBlackList\">取消黑名单</a>" %>                                                
                                            </li>
                                        </ul>
                                    </dd>
                                </ItemTemplate>
                                <EmptyTemplate>
                                    <dt style="display: block;">暂无数据。</dt>
                                </EmptyTemplate>
                            </ruson:Repater>
                            <script type="text/html" class="js-run">
                                $(function () {
                                    $('#js-ajaxlist .friendmsg-oper a.operate').click(function () {
                                        var a = $(this);
                                        $.jConfirm('确定要将[' + $(a).closest('ul').find('.friendmsg-name').text() + ']' + $(a).text() + '吗？', function () {
                                            $.ajax({
                                                type: 'get',
                                                url: '?',
                                                cache: false,
                                                dataType: 'json',
                                                data: { action: $(a).attr('js-handle'), uid: a.closest('.friendmsg-oper').attr('data-uid') },
                                                success: function (res) {
                                                    if (res.Success) {
                                                        var currentPage = $('#js-currentPage');
                                                        if (currentPage.length) $('#page').val(currentPage.val());
                                                        $('#form1').trigger('submit');
                                                    } else {
                                                        $.jError(res.Message);
                                                    }
                                                }
                                            });
                                        });

                                        return false;
                                    });

                                    $('#js-ajaxlist .js-user').click(function () {
                                        var me = $(this);
                                        me.find('.friendmsg-tip').hide();
                                        getMessage(me.attr('data-uid'));
                                    });

                                    //显示隐藏删除会话
                                    $('#js-ajaxlist dd').hover(function () {
                                        $(this).find('.friendmsg-off').show();
                                    }, function () {
                                        $(this).find('.friendmsg-off').hide();
                                    });

                                    $('.friendmsg-off').on('click', function () {                                
                                        var me = $(this), myParent = me.closest('dd');
                                 
                                        $.ajax({
                                            type: 'get',
                                            url: '?',
                                            cache: false,
                                            dataType: 'json',                           
                                            data: { action: 'deleteDialogue', uid: me.attr('data-uid') },
                                            success: function (res) {
                                                if (res.Success) {
                                                    if($('#btnSend_' + me.attr('data-uid')).length > 0){
                                                        getMessage(0);
                                                    }                                                 
                                                    myParent.slideUp('fast', function () {
                                                        myParent.remove();
                                                        if ($('.friendmsg-friendlist').find('dd').length == 0) {
                                                            $('#form1').trigger('submit');
                                                        }
                                                    });
                                                } else {
                                                    $.jError(res.Message);
                                                }                             
                                            }
                                        });
                                        return false;                                     
                                    });
                                });
                            </script>
                            <div class="friendmsg-pager">
                                <div class="pages">
                                    <ruson:Pager runat="server" ID="pages" CssClass="pages" PageSize="10" />
                                    <a href="<% =Request.RawUrl.UrlEncodeParam() %>" class="g-hide"></a>
                                </div>
                                <input type="hidden" id="js-currentPage" value="<% =pages.PageIndex %>" />
                            </div>
                        </ruson:Space>
                    </dl>

                </div>
            </div>
            <div class="friendmsg-right" id="js-mymsg">
            </div>
        </div>
    </div>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="script" runat="server">
    <script>        
        $(function () {
            getMessage('<% =foreignUid ?? 0 %>');

            $('.friendmsg-tabs a').click(function () {
                var type = $(this).attr('data-type');
                $('#type').val(type);
                $('.friendmsg-tabs a').removeClass('on');
                $(this).addClass('on');
                $('#page').val('');
                $('#form1').trigger('submit');
            });
        });

        function getMessage(uid) {            
            $.ajax({
                type: 'get',
                url: '?',
                cache: false,
                dataType: 'json',
                data: { action: 'getMsg', uid: uid },
                success: function (res) {
                    var messgeHtml = '<div class="friendmsg-lettersbox">';

                    for (var data in res) {
                        var sendId = res[data].SendId;                        
                        var body = res[data].Body;                        
                        messgeHtml += '<div class="friendmsg-' + (sendId == uid ? "issue" : "goes") + ' js-msg">';
                        messgeHtml += '<img src="' + $('#face_' + sendId).attr('src') + '" />';
                        messgeHtml += '<p>' + body + '<a class="iconfont friendmsg-delmsg" data-uid="' + uid + '" data-index="' + res[data].Id  + '" href="javascript:void(0);">&#xe632;</a></p>';
                        messgeHtml += '</div>';
                    }

                    messgeHtml += '<div class="friendmsg-empty" id="null_' + uid + '" ' + (res.length == 0 ? ' style="display: block;"' : '') + '>' + (uid != 0 ? "您没有与Ta的消息记录!" : "暂无系统消息!") + '</div>';
                    messgeHtml += '</div>';

                    if (uid != 0) {
                        messgeHtml += '<div class="friendmsg-release">';
                        messgeHtml += '<textarea rows="5" maxlength="225" style="width:91%; margin-top:10px;" tabindex="1" id="body_' + uid + '" placeholder="请在这里输入您要发给Ta的信息"></textarea>';
                        messgeHtml += '<div class="g-ohide w450 mt5 ml10">';
                        messgeHtml += '<div class="input-big codeinput w290 g-left">';
                        messgeHtml += '<a href="javascript:void(0)" id="js-vcode" onclick="$(\'img\',this).attr(\'src\', \'/User/ValidCode<% =PageExt %>?v=\' + (new Date()).getTime())" class="mt5">';
                        messgeHtml += '<img src="/User/ValidCode<% =PageExt %>?v=<% =DateTime.Now.Ticks %>" width="85" height="31" />';
                        messgeHtml += '<span>看不清？<br />换一张</span>';
                        messgeHtml += '</a>';
                        messgeHtml += '<input type="text" id="vcode" class="text w95" tabindex="2" name="vcode" maxlength="4" placeholder="请输入验证码">';
                        messgeHtml += '</div>';
                        messgeHtml += '<input type="button" value="发 送" onclick="sendMessage(' + uid + ');" id="btnSend_' + uid + '" class="btn-nobordbig c-normal w115 g-right">';
                        messgeHtml += '</div>';
                        messgeHtml += '</div>';
                    }

                    $('#js-mymsg').html(messgeHtml);
                    $('.friendmsg-lettersbox').scrollTop($('.friendmsg-lettersbox')[0].scrollHeight);
                    changeBoxHight();
                }
            });
        };

        //消息事件绑定
        $('#js-mymsg').on('mouseenter', 'p', function() {
            $(this).find('.friendmsg-delmsg').show();
        }).on('mouseleave', 'p', function() {
            $(this).find('.friendmsg-delmsg').hide();
        }).on('click', '.friendmsg-delmsg', function() {
            var me = $(this), myParent = me.closest('.js-msg');
            $.ajax({
                type: 'get',
                url: '?',                            
                cache: false,
                dataType: 'json',
                data: { action: 'deleteMessage', uid: me.attr('data-uid'), index: me.attr('data-index') },
                success: function (res) {
                    if (res.Success) {
                        myParent.slideUp('fast', function () {
                            myParent.remove();
                            if ($('.friendmsg-lettersbox').find('.js-msg').length == 0) {
                                $('.friendmsg-empty').show();
                            }
                        });
                    } else {
                        $.jError(res.Message);
                    }                             
                }
            });
        });

        //发送
        function sendMessage(uid) {
            var body = $("#body_" + uid).val();
            var btn = ("#btnSend_" + uid);
            $.ajax({
                type: 'post',
                url: '?action=sendMsg',
                cache: false,
                dataType: 'json',
                beforeSend: function () {
                    $(btn).attr('disabled', 'disabled');
                    $(btn).val('正在发送');
                },
                data: { uid: uid, body: body, vcode: $('#vcode').val() },
                success: function (res) {
                    $(btn).removeAttr('disabled');
                    $(btn).val('发 送');
                    if (res.Success) {                        
                        $('#js-vcode').trigger('click');
                        $('#null_' + uid).remove();
                        var messgeHtml = '<div class="friendmsg-goes">';
                        messgeHtml += '<img src="' + $('#face_' + <% =CurrentUser.Id %>).attr('src') + '" />';
                        messgeHtml += '<p>' + body + '<a class="iconfont friendmsg-delmsg" data-uid="' + uid + '" data-index="' + res.Message  + '" href="javascript:void(0);">&#xe632;</a></p>';
                        messgeHtml += '</div>';
                        $('#js-mymsg .friendmsg-lettersbox').append(messgeHtml);
                        $("#body_" + uid).val('');
                        changeBoxHight();
                        $('.friendmsg-lettersbox').scrollTop($('.friendmsg-lettersbox')[0].scrollHeight);
                        $.jSuccess('发送成功');
                    } else {
                        $('#js-vcode').trigger('click');                       
                        $.jError(res.Message);
                    }
                }
            });
        }      

        ////改变框体大小
        function changeBoxHight() {
            var inputBox = $('.friendmsg-release'),
                lettersBox = $('.friendmsg-lettersbox');               
            if (inputBox.is(':hidden')) {
                lettersBox.height(lettersBox.parent().height() - 20);
            } else {
                lettersBox.height(lettersBox.parent().height() - inputBox.height() - 30);
            }
        }                 
    </script>
</asp:Content>