@extends('modules.head') @section('contenido')
<h3 ><a class="ruta" class="" href="{{url('/chats')}}">{{ Lang::get('messages.screen_check_chat_tag1')}}  </a> <span class="separador-ruta">|</span><a class="ruta" class="" href="{{url('/chats/check/'.$messages[0]->messages->user_id)}}">{{ Lang::get('messages.screen_check_chat_tag3')}} </a> </h3>

<div class="box  direct-chat direct-chat-warning">
  <div class="box-header with-border">
    <h3 class="box-title">{{ Lang::get('messages.screen_check_chat_tag1')}} {{$user->user->first_name.' '.$user->user->last_name }}</h3>

    {{-- <div class="box-tools pull-right">
      <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i>
      </button>
    </div> --}}
  </div>

  <div class="box-body chatSize">
    <div class="direct-chat-messages chatSize" id="chatContent">

      @foreach ($messages as $message)


        @if( $message->messages->user_id != null)

          <div class="direct-chat-msg">

            <div class="direct-chat-info clearfix">
              <span class="direct-chat-name pull-left"  id="chat" data-chat="{{$message->id}}">{{$user->user->first_name.' '.$user->user->last_name }}</span>
            </div>

            <img class="direct-chat-img" src="{{ asset('img/user.png') }}" alt="message user image">

            <div class="direct-chat-text">
              {{ $message->messages->message }}
            </div>
            <div class="direct-chat-info clearfix">
              <span class="direct-chat-timestamp pull-left"> {{$message->messages->time_elapsed_string($message->messages->created_at)}}</span>
            </div>
            <!-- /.direct-chat-text -->
          </div>

        @elseif ($message->messages->admin_id != null)

          <div class="direct-chat-msg right bigWidthBox">

            <div class="direct-chat-info clearfix">
            <?php  $admin = $message->messages->getAdmin($message->messages->admin_id)?>
              <span class="direct-chat-name pull-right padLabel">{{$admin->first_name.' '.$admin->last_name}}</span>
            </div>

            <div class="direct-chat-text btnBox btnBoxBorder floatBoxChat">
              {{ $message->messages->message }}
            </div>


          </div>

        @endif

      @endforeach

    </div>
  </div>

  <div class="box-footer">
    <form method="post" id="chatMessage" onClick="sendMessage({{$messages[0]->chat_id}})">
      <div class="row">
        <div class="col-xs-10">
            <div class="form-group">
                <textarea class="form-control" maxlength="255" placeholder="Escriba un Mensage ..." name="message" id="text" cols="20" rows="2" data-emoji-picker="true" required></textarea>

            </div>
      </div>
      <div class="col-xs-2">
      <div class="form-group">
          <button class="btn btnBox btnSendChat" onClick="sendMessage({{$messages[0]->chat_id}})"><i class="fa fa-send"></i></button>
        </div>
      </div>
      </div>

    </form>
  </div>

</div>
@endsection
<script src="{{ asset('js/jQuery/jquery-2.2.3.min.js') }}"></script>
<script src="{{ asset('js/chats.js') }}"></script>
<script src="{{ asset('js/checkChats.js') }}"></script>
<script src="{{ asset('js/bootstrap/js/bootstrap.min.js') }}"></script>
<script src="{{ asset('js/vanilla-emoji-picker-master/src/emojiPicker.js') }}"></script>
<script type="text/javascript">
  $(document).ready(function () {
    $("#text").keypress(function (e) {
      if(e.which == 13 && !e.shiftKey) {
          $(this).closest("form").submit();
          e.preventDefault();
          return false;
      }
    });
    $('#chatContent').scroll();
    $("#chatContent").animate({
      scrollTop: 1000
    }, 100);

    new EmojiPicker();
  });


  </script>