<div class="chat-wrapper" id="chat_<?php echo $wo['chat']['recipient']['user_id'];?>">
   <div class="online-toggle pointer" onclick="javascript:$('.chat-tab-container').slideToggle(100);">
      <a style="color:#fff;" href="<?php echo $wo['chat']['recipient']['url'];?>"> 
      <span class="chat-tab-status <?php echo (Wo_IsOnline($wo['chat']['recipient']['user_id']) === true) ? 'active' : ''; ?>"><i class="fa fa-circle fa-fw"></i></span><?php echo $wo['chat']['recipient']['name'];?>
      </a>
      <span class="<?php echo Wo_RightToLeft('pull-right');?> close-chat" onclick="Wo_CloseChat();">
      <a class="white" href="<?php echo Wo_SeoLink("index.php?tab1=messages&user=" . $wo['chat']['recipient']['user_id']);?>">
      <i class="fa fa-external-link-square"></i> 
      </a>
      <i class="fa fa-times-circle"></i>
      </span>
   </div>
   <div class="chat-tab-container">
      <div class="chat-messages-wrapper">
         <div class="chat-messages">
          
         </div>
         <div class="clear"></div>
      </div>
      <div class="chat-textarea btn-group">
         <div class="emo-container">
            <?php  
            foreach ($wo['emo'] as $code => $name) {
              $code   = $code;
              echo  '<span onclick="Wo_AddEmoToChat(\'' . $code . '\');"><i class="pointer twa-lg twa twa-' . $name . '"></i></span>'; 
            } 
            ?>
         </div>
         <form action="#" method="post" class="chat-sending-form">
            <textarea name="textSendMessage" id="sendMessage" class="form-control" cols="10" rows="5" placeholder="<?php echo $wo['lang']['write_something'];?>"  onkeydown="Wo_SubmitChatForm(event);" onfocus="Wo_SubmitChatForm(event);" dir="auto"></textarea>
            <span class="input-group-btn">
            <span class="btn btn-file" id="progressIcon">
            <?php if($wo['config']['fileSharing'] == 1) { ?>
            <i class="fa fa-file-text-o progress-icon" data-icon="file-text-o"></i>
            <input type="file" id="sendMessasgeFile" name="sendMessageFile" class="pointer" onchange="Wo_ShareChatFile();" />
            <?php } else { ?>
            <i class="fa fa-picture-o  progress-icon" data-icon="picture-o"></i>
            <input type="file" id="sendMessasgeFile" name="sendMessageFile" onchange="Wo_ShareChatFile();" accept="image/x-png, image/gif, image/jpeg"  />
            <?php } ?>
            </span>
            </span>
            <span class="input-group-btn emo-btn" style="<?php echo Wo_RightToLeft('right');?>:60px;">
            <span class="btn btn-file">
            <i class="fa fa-smile-o progress-icon" data-icon="file-smile-o"></i>
            </span>
            </span>
            <input type="hidden" id="user-id" name="user_id" value="<?php echo $wo['chat']['recipient']['user_id'];?>" />
         </form>
      </div>
   </div>
</div>
<script type="text/javascript">
$(function() {
    $('.emo-btn').click(function () {
        $('.emo-container').toggle();
    });
    $('form.chat-sending-form').ajaxForm({
        url: Wo_Ajax_Requests_File() + '?f=chat&s=send_message',
        beforeSend: function() {
            <?php if ($wo['config']['message_typing'] == 1) { ?>
            //Wo_DeleteTyping();
            <?php } ?>
            $('.chat-sending-form').attr('disabled', true);
            Wo_progressIconLoader($('form.chat-sending-form').find('#progressIcon'));
        },
        success: function(data) {
            if (data.status == 200) {
                $(".chat-messages-wrapper").find("div[class*='message-seen']").empty();
                $(".chat-messages-wrapper").find("div[class*='message-typing']").empty();
                if ($('.chat-messages-wrapper').length == 0) {
                    $(".chat-messages-wrapper").html(data.html);
                } else {
                    //$(".no-messages").hide();
                    $(".chat-messages-wrapper").append(data.html);
                }
                $('form.chat-sending-form').clearForm();
                // $('#sendMessage').val('').attr('disabled', false).keyup().focus();
                setTimeout(function() {
                  $('.chat-messages-wrapper').scrollTop($('.chat-messages-wrapper')[0].scrollHeight);
                }, 100);
                Wo_DeleteTyping();
            }
            Wo_progressIconLoader($('form.chat-sending-form').find('#progressIcon'));
        }
    });
});   
</script>