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

<style>
  .cal-success{
    background-color: #C8A2C8;
  }
   .aw-more-block {
   display:none;
   }
   .aw-logo img {
   display:none !important;
   }
   .aw-get-this-widget {
   display:none;
   }
   .aw-six-hours {
   display:none;
   }
   div.aw-widget-36hour-inner div.aw-top-content {
   border-width:0px !important;
   }
   div.aw-widget-36hour-inner div.aw-fc-status {
   display:none;
   }
   div.aw-widget-36hour-inner a.aw-current-weather div.aw-interest, div.aw-widget-36hour-inner div.aw-36-hours li div.aw-interest{
   height:30px !important;
   }
   ::-webkit-input-placeholder { /* WebKit, Blink, Edge */
   color:    #909;
   }
   :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    #909;
   opacity:  1;
   }
   ::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    #909;
   opacity:  1;
   }
   :-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:    #909;
   }
   ::-ms-input-placeholder { /* Microsoft Edge */
   color:    #909;
   }
   .ui-autocomplete{
   background-color:#fff;
   }
   .element.style{
   color:black;
   }
   .form-control::-moz-placeholder {
    color: #FFFFFF;
    opacity: 1;
}
</style>
<!-- page content -->
<div class="right_col" role="main">
  <!-- top tiles -->
  <div class="row tile_count">
    <div class="col-md-2 col-sm-4 col-xs-6 tile_stats_count">
      <a href="{{url('scheduledbatch')}}">
        <span class="count_top"><i class="fa fa-tags"></i> Scheduled Batches</span>
        <div class="count">{{ $batch_count }}</div>
        <span class="count_bottom"><i class="green">4% </i> In Current Week</span>
      </a>      
    </div>
    <div class="col-md-2 col-sm-4 col-xs-6 tile_stats_count">
      <a href="{{ url('individualEmployeesList/'.$consultants[0]->status) }}">
         <span class="count_top"><i class="fa fa-user"></i> In Training Students</span>
         <div class="count">{{ $students_count }}</div>
         <span class="count_bottom"><i class="green"><i class="fa fa-sort-asc"></i>3% </i> In Current Week</span>
      </a>     
    </div>    
    <div class="col-md-2 col-sm-4 col-xs-6 tile_stats_count">
      <a href="{{url('refere_student')}}">
        <span class="count_top"><i class="fa fa-user"></i> Total Referals</span>
        <div class="count">{{ $referal_count }}</div>
        <span class="count_bottom"><i class="red"><i class="fa fa-sort-desc"></i>12% </i> From last Week</span>
      </a>      
    </div>
    <div class="col-md-2 col-sm-4 col-xs-6 tile_stats_count">
      <a href="{{url('material_view')}}">
        <span class="count_top"><i class="fa fa-user"></i> Total Meterails</span>
        <div class="count green">{{ $materials_count }}</div>
        <span class="count_bottom"><i class="green"><i class="fa fa-sort-asc"></i>34% </i> From last Week</span>
      </a>
      
    </div>
    <!-- <div class="col-md-2 col-sm-4 col-xs-6 tile_stats_count">
      <span class="count_top"><i class="fa fa-user"></i> Total Collections</span>
      <div class="count">2,315</div>
      <span class="count_bottom"><i class="green"><i class="fa fa-sort-asc"></i>34% </i> From last Week</span>
    </div>
    <div class="col-md-2 col-sm-4 col-xs-6 tile_stats_count">
      <span class="count_top"><i class="fa fa-user"></i> Total Connections</span>
      <div class="count">7,325</div>
      <span class="count_bottom"><i class="green"><i class="fa fa-sort-asc"></i>34% </i> From last Week</span>
    </div> -->
  </div>
  <!-- /top tiles -->

  <div class="row">
    <div class="col-md-12 col-sm-12 col-xs-12">
      <div class="dashboard_graph">

        <div class="row x_title">
          <div class="col-md-6">
            <h3>Network Activities <small>Graph title sub-title</small></h3>
          </div>
          <div class="col-md-6">
            <div id="reportrange" class="pull-right" style="background: #fff; cursor: pointer; padding: 5px 10px; border: 1px solid #ccc">
              <i class="glyphicon glyphicon-calendar fa fa-calendar"></i>
              <span>December 30, 2014 - January 28, 2015</span> <b class="caret"></b>
            </div>
          </div>
        </div>

        <div class="col-md-6 col-sm-6 col-xs-12">
          <div id="chart_plot_01" class="demo-placeholder"></div>
        </div>
        <div class="col-md-6 col-sm-6 col-xs-12 bg-white">
          <a href="https://www.accuweather.com/en/br/indianopolis/2725881/current-weather/2725881" class="aw-widget-legal">
         <!--
            By accessing and/or using this code snippet, you agree to AccuWeather’s terms and conditions (in English) which can be found at https://www.accuweather.com/en/free-weather-widgets/terms and AccuWeather’s Privacy Statement (in English) which can be found at https://www.accuweather.com/en/privacy.
            -->
      </a>
      <div id="awtd1504522389802" class="aw-widget-36hour"  data-locationkey="2725881" data-unit="f" data-language="en-us" data-useip="false" data-uid="awtd1504522389802" data-editlocation="true" style="height: 350px; background-color: #7CBAFC; padding: 15px;"></div>
      <script type="text/javascript" src="https://oap.accuweather.com/launch.js"></script>

        </div>

        <div class="clearfix"></div>
      </div>
    </div>

  </div>
  <br />

 <div class="clearfix"></div>
    <div class="row">
        <div class="col-md-12">
            <div class="x_panel">
                <div class="x_title">
                    <h2>Calendar Events <small>Sessions</small></h2>
                    <div class="clearfix"></div>
                </div>
                <div class="x_content">
                    <div id="mycalendar"></div>
                </div>
            </div>
        </div>
    </div>

     <div class="row">
        <div class="col-md-4 col-sm-4 col-xs-12">
            <div class="x_panel">
                <div class="x_title">
                    <h2>Recent Activities <small>Sessions</small></h2>
                    <div class="clearfix"></div>
                </div>
                <div class="x_content">
                    <div class="dashboard-widget-content recent_activities">
                        <ul class="list-unstyled timeline widget">
                            @if(count($latest_activities)>0)
                            @foreach($latest_activities as $latest_activity)
                            <li>
                                <div class="block">
                                    <div class="block_content">
                                        <h2 class="title">
                                            <div class="byline">
                                                <span>{{ date('d M',strtotime($latest_activity['created_at'])) }}</span> <a>{{ date('Y',strtotime($latest_activity['created_at'])) }}</a>
                                            </div>
                                        </h2>
                                        <p class="excerpt">{{ $latest_activity['text'] }}</a>
                                        </p>
                                    </div>
                                </div>
                            </li>
                            @endforeach
                            @else
                            <li>
                                <div class="block">
                                    <div class="block_content">
                                        <h2 class="title">
                                            <div class="byline">
                                                No Recent Activity!
                                            </div>
                                        </h2>
                                    </div>
                                </div>
                            </li>
                            @endif
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-8 col-sm-8 col-xs-12">
            <div class="row">
                <div class="col-md-12 col-sm-12 col-xs-12">
                    <div class="x_panel">
                        <div class="x_title">
                            <h2>Clients location <small>geo-presentation</small></h2>
                            <div class="clearfix"></div>
                        </div>
                        <div class="x_content">
                            <div class="dashboard-widget-content">
                                <div class="col-md-4 hidden-small">
                                    <h2 class="line_30">{{ $clients[0]->total_clients }} Clients from {{ $clients[0]->total_client_countries }} countries</h2>
                                    <table class="countries_list">
                                        <tbody>
                                            <tr>
                                                <td>United States</td>
                                                <td class="fs15 fw700 text-right">{{ $clients[0]->total_us_clients }}</td>
                                            </tr>
                                            <tr>
                                                <td>United Kingdom</td>
                                                <td class="fs15 fw700 text-right">{{ $clients[0]->total_uk_clients }}</td>
                                            </tr>
                                            <tr>
                                                <td>India</td>
                                                <td class="fs15 fw700 text-right">{{ $clients[0]->total_india_clients }}</td>
                                            </tr>
                                            <tr>
                                                <td>Others</td>
                                                <td class="fs15 fw700 text-right">{{ $clients[0]->total_other_clients }}</td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                                <div id="world-map-gdp" class="col-md-8 col-sm-12 col-xs-12" style="height:230px;"></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                @include('chat.dashboard_chat')
            </div>
        </div>
    </div>





        
      
        <div class="row">

          <div id="CalenderModalNew" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                <h4 class="modal-title" id="myModalLabel">New Calendar Entry (<span id="schedule_create_timings"></span>)</h4>
            </div>
            <div class="modal-body">
                <div id="testmodal" style="padding: 5px 20px;">
                    <form id="antoform" class="form-horizontal calender" role="form">
                        <div class="form-group">
                            <label class="col-sm-3 control-label">Title</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control" id="create_title" name="create_title">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">Description</label>
                            <div class="col-sm-9">
                                <textarea class="form-control" style="height:100px;" id="create_description" name="create_description"></textarea>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default antoclose" data-dismiss="modal">Close</button>
                <button type="button" id="antosubmit" class="btn btn-primary">Save changes</button>
            </div>
        </div>
    </div>
</div>

<div id="CalenderModalEdit" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                <h4 class="modal-title" id="myModalLabel2">Edit Calendar Entry</h4>
            </div>
            <div class="modal-body">
                <div id="testmodal2" style="padding: 5px 20px;">
                    <form id="antoform2" class="form-horizontal calender" role="form">
                        <div class="form-group">
                            <label class="col-sm-3 control-label">Title</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control" id="edit_title" name="edit_title">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">Description</label>
                            <div class="col-sm-9">
                                <textarea class="form-control" style="height:100px;" id="edit_description" name="edit_description"></textarea>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default antoclose2" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary antosubmit2">Save changes</button>
            </div>
        </div>
    </div>
</div>

<div id="fc_create" data-toggle="modal" data-target="#CalenderModalNew"></div>
<div id="fc_edit" data-toggle="modal" data-target="#CalenderModalEdit"></div>

          
        </div>
        <!-- end of weather widget -->
      </div>
    </div>
  </div>
</div>
<!-- /page content -->
<script type="text/javascript">
    $(document).ready(function() {
        /*Calendar code starts here by Ashwin*/
    var date = new Date(),
        d = date.getDate(),
        m = date.getMonth(),
        y = date.getFullYear(),
        started,
        categoryClass;

    $('#mycalendar').fullCalendar({
        /* Google calender API*/
        googleCalendarApiKey: 'AIzaSyBua_C2VizzdmGioQto86b7HSOMaecPgao',
        /* Google calender API*/

        defaultView: 'agendaWeek',
        header: {
            left: 'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
        },
        views: {
            month: {
                columnFormat: 'ddd'
            },
            agenda: {
                // options apply to agendaWeek and agendaDay views
                columnFormat: 'ddd D-MMM'
            }
        },
        editable: true,
        /*********************/
        selectable: true,
        allDaySlot: false,
        minTime: "8:00:00",
        maxTime: "21:30:00",
        //slotDuration: "00:30:00",
        height: 'auto',
        slotLabelInterval: 15,
        slotLabelFormat: 'h(:mm)t',
        select: function(start, end, allDay, jsEvent, view) {
            $('#fc_create').click();

            started = start;
            ended = end;

            var s = moment(started).format("YYYY-MM-DD HH:mm:ss");
            var e = moment(ended).format("YYYY-MM-DD HH:mm:ss");

            localStorage.setItem('started', s);
            localStorage.setItem('ended', e);

            $("#schedule_create_timings").html(moment(s).format("DD-MMM-YYYY HH:mm A")+' - '+moment(e).format("DD-MMM-YYYY HH:mm A"));

            $("#antosubmit").on("click", function() {
                var title = $("#create_title").val();
                var description = $("#create_description").val();

                if (end) {
                    ended = end;
                }

                categoryClass = $("#event_type").val();

                if (title) {
                    var startdate = localStorage.getItem('started');
                    var enddate = localStorage.getItem('ended');

                    $.ajax({
                        url: '