@php 
$users= App\User::all();
@endphp
 <link rel="stylesheet" href="/assets/default/css/chatbox.css">

  <button class="open-button btn btn-secondary" onclick="openForm()"><i class="fas fa-comments"></i></button>
  <div id="LiveChat" class="chat-popup">
    <div id="chat-body" class="chat-body" style="display: block;">
      <header class="chat-header">
        <div class="chat-header-left"><i class="fas fa-comments"></i> Live Chat</div>
        <div class="chat-header-right"><a onclick="getSettings()"><i class="fas fa-ellipsis-v"></i></a><a onclick="closeForm()"><i class="fas fa-times"></i></a></div>
      </header>

      <ul class="nav nav-tabs" role="tablist">
        <li class="nav-item">
          <a class="nav-link active" data-toggle="tab" href="#tabs-1" role="tab">Batch</a>
        </li>
        <li class="nav-item">
          <a class="nav-link" data-toggle="tab" href="#tabs-2" role="tab">Student</a>
        </li>
        <li class="nav-item">
          <a class="nav-link" data-toggle="tab" href="#tabs-3" role="tab">Message box</a>
        </li>
      </ul><!-- Tab panes -->

      <div class="tab-content">
        <div class="tab-pane active" id="tabs-1" role="tabpanel">
          <h1>Batch</h1>
        </div>
        <div class="tab-pane" id="tabs-2" role="tabpanel">
          <div class="row">
            <div class="col-md-12 border-right">
              <div class="settings-tray">
                <img class="profile-image" src="{{auth()->user()->avatar}}" alt=""  onerror="this.src='assets/admin/img/avatar/avatar-1.png';"/>
              
              </div>
              <div class="search-box">
                <div class="input-wrapper">
                  <i class="fa fa-search">search</i>
                  <input placeholder="Search here" type="text">
                </div>
              </div>
			  <div  style="overflow-y: auto; height:400px">
			  @foreach($users as $user)
              <div class="friend-drawer friend-drawer--onhover">
                <img class="profile-image" src="{{$user->avatar}}" alt="" onerror="this.src='assets/admin/img/avatar/avatar-1.png';">
                <div class="text" data-usr="{{$user->id}}">

                  <h6>{{$user->full_name}}</h6>

                
                </div>
                <span class="time text-muted small">13:21</span>
              </div>
              <hr>
			  @endforeach
			</div>
            </div>
          </div>
        </div>
        <div class="tab-pane" id="tabs-3" role="tabpanel">
          <div id="chat-conversation">
            <div id="chat-history" class="chat-hist">
              <div class="chat-container chat-left">
                <i class="fas fa-beer"></i>
                <p> Hello. How are you today?</p>
                <span class="time-left">11:00 AM</span>
              </div>
              <div class="chat-container chat-right">
                <i class="fa fa-beer right"></i>
                <p>Hey! I'm fine. Thanks for asking!</p>
                <span class="time-right">11:01 AM</span>
              </div>
              <div class="chat-container chat-left">
                <i class="fa fa-beer"></i>
                <p> Sweet! So, what do you wanna do today?</p>
                <span class="time-left">11:01 AM</span>
              </div>
              <div class="chat-container chat-right">
                <i class="fa fa-beer right"></i>
                <p>I dunno. Play soccer.. or learn more coding perhaps?</p>
                <span class="time-right">11:02 AM</span>
              </div>
              <div class="chat-container chat-left">
                <i class="fa fa-beer"></i>
                <p> Sounds great. Free Code Camp?</p>
                <span class="time-left">11:03 AM</span>
              </div>
            </div>
          </div>
          <div id="chat-form-container" class="form-container">

         

			   <div class="chat-footer">
			   <input type="hidden" id="recieverid">
					<div class="input-group md-form form-sm form-2 pl-0">
						<input class="form-control my-0 py-1 red-border" id="messagetext" type="text" placeholder="Write a message...">
						<div class="input-group-append">
							<button class="input-group-text red lighten-3" style="color:white" id="basic-text" onclick="sendPrivateMessage();">
							<i class="fa fa-paper-plane-o" aria-hidden="true">Send</i>
							</button>
						</div>
					</div>
				</div>
			
          </div>
        </div>
      </div>


    </div>
  </div>