@extends('layouts.default')
@section('content')

<div class="right_col" role="main">
  	<div class="">
        <div class="page-title">
          	<div class="title_left">
            	<h3>{{ucwords(Auth::user()->name)}} Profile</h3>
          	</div>
        </div>
        <div class="clearfix"></div>
        <div class="row">
      		<div class="col-md-12 col-sm-12 col-xs-12">
      			{{ Userdefined::showMessage() }}
	            <div class="x_panel">
	              	<div class="x_title">
	                	<h2>{{ ucwords(Auth::user()->name)}} Report <small>Activity report</small></h2>
	                	<div class="clearfix"></div>
	              	</div>
	              	<div class="x_content">
		                <div class="col-md-3 col-sm-3 col-xs-12 profile_left">
		                  	<div class="profile_img">
		                  		<form id="uploadImageForm" action="{{ url('profile') }}" method="post" enctype="multipart/form-data">
				                    <div id="crop-avatar">
				                      	<label for="profile_img" style="cursor: pointer">
				                      		<img class="img-responsive avatar-view" src="{{ Userdefined::getAvatar(Auth::user()->id) }}" alt="Avatar" title="Click to change the Avatar">
				                      	</label>
				                    </div>
				                    <i class="fa fa-info-circle"> Click on the Image to change the Avatar</i>
				                    <input type="file" id="profile_img" name="profile_img" style="display: none;">
				                    {{ csrf_field() }}
			                    </form>
		                  	</div>
		                  	<h3>{{ ucwords($user_details->name) }}</h3>
		                  	<ul class="list-unstyled user_data">
			                    <li>
			                    	<i class="fa fa-map-marker user-profile-icon"></i> {{ isset($user_details->city_name)?ucwords($user_details->city_name).', ':'' }}{{ isset($user_details->state_name)?ucwords($user_details->state_name).', ':'' }}{{ isset($user_details->country_name)?ucwords($user_details->country_name):'' }}
			                    </li>
			                    <li>
			                      	<i class="fa fa-briefcase user-profile-icon"></i> {{ $user_details->display_name }}
			                    </li>
			                    <li class="m-top-xs">
			                      	<i class="fa fa-envelope user-profile-icon"></i> {{ $user_details->email }}
			                    </li>
		                  	</ul>
		                  	<a class="btn btn-success" href="{{ url('profile/'.encrypt($user_details->user_id).'/edit') }}">
		                  		<i class="fa fa-edit m-right-xs"></i> Edit Profile
	                  		</a>
		                  	<br />
		                  	<!-- start skills -->
		                  	<!--h4>Skills</h4>
		                  	<ul class="list-unstyled user_data">
			                    <li>
			                      	<p>Web Applications</p>
			                      	<div class="progress progress_sm">
			                        	<div class="progress-bar bg-green" role="progressbar" data-transitiongoal="50"></div>
			                      	</div>
			                    </li>
			                    <li>
			                      	<p>Website Design</p>
			                      	<div class="progress progress_sm">
			                        	<div class="progress-bar bg-green" role="progressbar" data-transitiongoal="70"></div>
			                      	</div>
			                    </li>
			                    <li>
			                      	<p>Automation & Testing</p>
			                      	<div class="progress progress_sm">
			                        	<div class="progress-bar bg-green" role="progressbar" data-transitiongoal="30"></div>
			                      	</div>
			                    </li>
			                    <li>
			                      	<p>UI / UX</p>
			                      	<div class="progress progress_sm">
			                        	<div class="progress-bar bg-green" role="progressbar" data-transitiongoal="50"></div>
			                      	</div>
			                    </li>
		                  	</ul-->
		                  	<!-- end of skills -->
		                </div>
		                <div class="col-md-9 col-sm-9 col-xs-12">
		                  	<div class="profile_title">
			                    <div class="col-md-6">
			                      	<h2>Consultants joined in Job  {{ date('Y') }}</h2>
			                    </div>
			                    <!--div class="col-md-6">
			                      	<div id="reportrange" class="pull-right" style="margin-top: 5px; background: #fff; cursor: pointer; padding: 5px 10px; border: 1px solid #E6E9ED">
			                        	<i class="glyphicon glyphicon-calendar fa fa-calendar"></i>
			                        	<span>December 30, 2014 - January 28, 2015</span> <b class="caret"></b>
			                      	</div>
			                    </div-->
		                  	</div>
	              			<!-- start of user-activity-graph -->
	                  		<div id="student_details" style="width:100%; height:280px;"></div>
	                  		<!-- end of user-activity-graph -->
		                  	<div class="" role="tabpanel" data-example-id="togglable-tabs">
			                    <ul id="myTab" class="nav nav-tabs" role="tablist">
			                      	<li role="presentation" class="active">
			                      		<a href="#tab_content1" id="home-tab" role="tab" data-toggle="tab" aria-expanded="true">Recent Activity</a>
			                      	</li>
			                    </ul>
			                    <div id="myTabContent" class="tab-content">
			                      	<div role="tabpanel" class="tab-pane fade active in" id="tab_content1" aria-labelledby="home-tab" style="max-height: 300px;overflow: auto">
			                        	<!-- start recent activity -->
				                        <ul class="messages">
				                        	@if(count($latest_activities)>0)
				                        	@foreach($latest_activities as $latest_activity)
				                          	<li>
				                            	<img src="{{ Userdefined::getAvatar(Auth::user()->id) }}" class="avatar" alt="Avatar">
					                            <div class="message_date">
					                              	<span class="date text-info">{{ date('d',strtotime($latest_activity['created_at'])) }}</span>
					                              	<span class="month">{{ date('M',strtotime($latest_activity['created_at'])) }}</span>
					                            </div>
					                            <div class="message_wrapper">
					                              	<!--h4 class="heading">Desmond Davison</h4-->
					                              	<blockquote class="message">{{ $latest_activity['text'] }}</blockquote>
					                              	<br />
					                              	<!--p class="url">
					                                	<span class="fs1 text-info" aria-hidden="true" data-icon=""></span>
					                                	<a href="#"><i class="fa fa-paperclip"></i> User Acceptance Test.doc </a>
					                              	</p-->
					                            </div>
				                          	</li>
				                          	@endforeach
				                          	@else
				                          	<li>No Recent Activity!</li>
				                          	@endif
				                        </ul>
			                        	<!-- end recent activity -->
			                      	</div>
			                    </div>
		                  	</div>
		                </div>
	              	</div>
	            </div>
          	</div>
        </div>
  	</div>
</div>
<script type="text/javascript">
$(document).ready(function(){
	$("#profile_img").change(function(){
		$("#uploadImageForm").submit();
	});

	if($('#student_details').length){
		Morris.Bar({
	  		element: 'student_details',
		  	data: ,
			xkey: 'period',
			ykeys: ['employees'],
			labels: ['Joined Employees'],
			barRatio: 0.4,
			barColors: ['#26B99A', '#34495E', '#ACADAC', '#3498DB'],
			xLabelAngle: 35,
			hideHover: 'auto',
			resize: true
		});
	}
});
</script>
@stop