	<!-- Date Picker -->
    <link rel="stylesheet" href="<?= base_url('bower_components/bootstrap-datepicker/dist/css/bootstrap-datepicker.min.css') ?>">
    <!-- Daterange picker -->
    <link rel="stylesheet" href="<?= base_url('bower_components/bootstrap-daterangepicker/daterangepicker.css') ?>">
    <!-- ChartJS -->
    <script src="<?= base_url('bower_components/Chart.js/Chart.js') ?>"></script>

    <?php
    $month = time();
    $months[]=convertDate(date("M"));
    $label_months [] = date("M")." ".date("Y");
    $years[]= date("Y");
    for ($i = 1; $i <= 11; $i++) {
        $month = strtotime('last month', $month);
        $months [] = convertDate(date("M", $month));
        $years[] = date("Y", $month);
        $label_months [] = date("M", $month)." ".date("Y", $month);
    }
    /**
     ** Simple User Treatment
     **/

    $date = date("Y");

    $demandes_data[] = '';
    $demandes_data =array();
    for ($i = 1; $i <= 12; $i++) {
        $demandes_query_mounth = $this->db->query("SELECT demande_id FROM info_demandeCredits
                      WHERE MONTH(dateAjout) = '".$months[$i-1]."' AND YEAR(dateAjout) = ".$years[$i-1]."
                        AND codeParrain='".$this->session->userdata('member_code')."'"
                        );
        $demandes_data[] = $demandes_query_mounth->num_rows();
    }

    $demandes_query = $listdem;

    if($demandes_query!=false){
        $demandes=$demandes_query->num_rows();
        // Count networks for simple users
        $array_simple = array();
        $num = 0;
        if ($demandes > 0) {
            foreach($demandes_query->result() as $row) {
                $num++;
                $array_simple[] = $row->codeMembre;
            }

            $vals_simple = array_count_values($array_simple);
            //echo 'No. of NON Duplicate Items: '.count($vals_simple).'<br><br>';
            //print_r($vals_simple);
            $pieChart2 = array();
            foreach(array_keys($vals_simple) as $paramName2) {
                $color2 = dechex(rand(0x000000, 0xFFFFFF));
                $trash2 = array("value" => $vals_simple[$paramName2],
                    "color"    => "#".$color2,
                    "highlight" => "#".$color2,
                    "label" => $paramName2);

                $pieChart2[]= $trash2;

            }
        }
    }else{
        $pieChart2 = array();
    }

    /**
     ** Geolocated User Treatment
     **/
    $users_geolocated_query = $list_geolocated_users;
    // Geolocated Users by month replace 2016 by NOW()
    $users_geolocated_data[] = '';
    $users_geolocated_data =array();
    for ($i = 1; $i <= 12; $i++) {
        $users_geolocated_query_january = $this->db->query("SELECT agent_id FROM super_infos
                      WHERE MONTH(date_created) = '".$months[$i-1]."' AND YEAR(date_created) = ".$years[$i-1]." 
                      AND category='geolocated' AND code_parrain='".$this->session->userdata('member_code')."'");
        $users_geolocated_data[] = $users_geolocated_query_january->num_rows();
    }

    if($users_geolocated_query!=false){

        $users_geolocated=$users_geolocated_query->num_rows();
        //$users_geolocated_query =  json_encode($users_geolocated_query->result());
        // Counts network for geolocated users
        $array_geolocated = array();
        $num = 0;
        if ($users_geolocated > 0) {
            foreach($users_geolocated_query->result() as $row) {
                $num++;
                $array_geolocated[] = date("M", strtotime($row->date_created));
            }
            $vals_geolocated = array_count_values($array_geolocated);
            //echo 'No. of NON Duplicate Items: '.count($vals_geolocated).'<br><br>';
            //print_r($vals_geolocated);
            $pieChart = array();
            foreach(array_keys($vals_geolocated) as $paramName) {
                $color = dechex(rand(0x000000, 0xFFFFFF));
                $trash = array("value" => $vals_geolocated[$paramName],
                    "color"    => "#".$color,
                    "highlight" => "#".$color,
                    "label" => $paramName);

                $pieChart[]= $trash;
            }
        }
    }else{
        $pieChart = array();
    }
    ?>

<div class="content-wrapper">

    <!-- Content Header (Page header) -->
    <section class="content-header">
        <h1>
            <?= $this->lang->line('Superviseur'); ?>
            <small><?= $this->lang->line('Tableau de bord'); ?></small>
        </h1>
    </section>

    <section class="content">
        <!-- Small boxes (Stat box) -->
        <div class="row">

            <div class="col-lg-2 col-md-4 col-xs-6">
                <!-- small box -->
                <div class="small-box bg-yellow">
                    <div class="inner">
                        <h3><?= $count_g_users;?></h3>

                        <p><?= $this->lang->line('Utilisateurs géolocalisés'); ?></p>
                    </div>
                    <div class="icon">
                        <i class="ion ion-location"></i>
                    </div>
                    <a href="<?= base_url('Superviseur_dash/getAllUser_g') ?>" class="small-box-footer"><?= $this->lang->line("Plus d'informations"); ?><i class="fa fa-arrow-circle-right"></i></a>
                </div>
            </div>
            <div class="col-lg-2 col-md-4 col-xs-6">
                <!-- small box -->
                <div class="small-box bg-aqua">
                    <div class="inner">
                        <h3><?= $count_d_users;?></h3>

                        <p><?= $this->lang->line('Demandes de crédits'); ?></p>
                    </div>
                    <div class="icon">
                        <i class="ion ion-cash"></i>
                    </div>
                    <a href="<?= base_url('Superviseur_dash/getDemandes') ?>" class="small-box-footer"><?= $this->lang->line("Plus d'informations"); ?><i class="fa fa-arrow-circle-right"></i></a>
                </div>
            </div>
            <div class="col-lg-2 col-md-4 col-xs-6">
                <!-- small box -->
                <div class="small-box bg-green">
                    <div class="inner">
                        <h3><?= $count_d_traite;?></h3>

                        <p><?= $this->lang->line('accepted_demands'); ?></p>
                    </div>
                    <div class="icon">
                        <i class="ion ion-checkmark-circled"></i>
                    </div>
                    <a href="<?= base_url('Superviseur_dash/getDemandes') ?>" class="small-box-footer"><?= $this->lang->line("Plus d'informations"); ?><i class="fa fa-arrow-circle-right"></i></a>
                </div>
            </div>
            <div class="col-lg-2 col-md-4 col-xs-6">
                <!-- small box -->
                <div class="small-box bg-orange">
                    <div class="inner">
                        <h3><?= $count_d_no_traite;?></h3>

                        <p><?= $this->lang->line('Demandes non traitées'); ?></p>
                    </div>
                    <div class="icon">
                        <i class="ion ion-alert-circled"></i>
                    </div>
                    <a href="<?= base_url('Superviseur_dash/getDemandes') ?>" class="small-box-footer"><?= $this->lang->line("Plus d'informations"); ?> <i class="fa fa-arrow-circle-right"></i></a>
                </div>
            </div>
			<div class="col-lg-2 col-md-4 col-xs-6">
				<!-- small box -->
				<div class="small-box bg-red">
					<div class="inner">
						<h3><?= $count_d_no_canceled;?></h3>

						<p><?= $this->lang->line("canceled_demands"); ?></p>
					</div>
					<div class="icon">
						<i class="ion ion-close-circled"></i>
					</div>
					<a href="#" data-toggle="modal" data-target="#modal-default2" class="small-box-footer"><?= $this->lang->line("Plus d'informations"); ?> <i class="fa fa-arrow-circle-right"></i></a>
				</div>
			</div>

            <div class="col-xs-12">
                <!-- BAR CHART -->
                <div class="box box-success">
                    <div class="box-header with-border">
                        <h3 class="box-title"><?= $this->lang->line('Adhésions'); ?></h3>
                    </div>
                    <div class="box-body">
                        <div class="chart">
                            <canvas id="barChart" style="height:230px"></canvas>
                        </div>
                    </div>
                    <!-- /.box-body -->
                </div>
                <!-- /.box -->
            </div>
            <!-- /.col -->
            <div class="col-xs-6">
                <!-- DONUT CHART -->
                <div class="box box-danger">
                    <div class="box-header with-border">
                        <h3 class="box-title"><?= $this->lang->line('Adhésions par mois sur une année'); ?></h3>
                    </div>
                    <div class="box-body" id="chartAd">
                        <canvas id="pieChart" style="height:250px"></canvas>
                    </div>
                    <!-- /.box-body -->
                </div>
                <!-- /.box -->
            </div>
            <div class="col-xs-6">
                <!-- DONUT CHART -->
                <div class="box box-danger">
                    <div class="box-header with-border">
                        <h3 class="box-title"><?= $this->lang->line('Demande de crédits par utilisateurs'); ?></h3>
                    </div>
                    <div class="box-body" id="chartDem">
                        <canvas id="pieChart2" style="height:250px"></canvas>
                    </div>
                    <!-- /.box-body -->
                </div>
                <!-- /.box -->
            </div>
        </div>
        <!-- /.row -->
    </section>

</div>


    <!-- jQuery 2.2.4 -->
    <script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>

    <!-- jQuery UI 1.11.4 -->
    <script src="<?= base_url('bower_components/jquery-ui/jquery-ui.min.js') ?>"></script>
    <!-- Resolve conflict in jQuery UI tooltip with Bootstrap tooltip -->
    <script>
        $.widget.bridge('uibutton', $.ui.button);
    </script>
    <!-- Bootstrap 3.3.7 -->
    <script src="<?= base_url('bower_components/bootstrap/dist/js/bootstrap.min.js') ?>"></script>
    <!-- Morris.js charts -->
    <script src="<?= base_url('bower_components/raphael/raphael.min.js') ?>"></script>
    <!-- Sparkline -->
    <script src="<?= base_url('bower_components/jquery-sparkline/dist/jquery.sparkline.min.js') ?>"></script>
    <!-- jvectormap -->
    <script src="<?= base_url('plugins/jvectormap/jquery-jvectormap-1.2.2.min.js') ?>"></script>
    <script src="<?= base_url('plugins/jvectormap/jquery-jvectormap-world-mill-en.js') ?>"></script>
    <!-- jQuery Knob Chart -->
    <script src="<?= base_url('bower_components/jquery-knob/dist/jquery.knob.min.js') ?>"></script>
    <!-- daterangepicker -->
    <script src="<?= base_url('bower_components/moment/min/moment.min.js') ?>"></script>
    <script src="<?= base_url('bower_components/bootstrap-daterangepicker/daterangepicker.js') ?>"></script>
    <!-- datepicker -->
    <script src="<?= base_url('bower_components/bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js') ?>"></script>
    <!-- Bootstrap WYSIHTML5 -->
    <script src="<?= base_url('plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js') ?>"></script>
    <!-- Slimscroll -->
    <script src="<?= base_url('bower_components/jquery-slimscroll/jquery.slimscroll.min.js') ?>"></script>
    <!-- FastClick -->
    <script src="<?= base_url('bower_components/fastclick/lib/fastclick.js') ?>"></script>
    <!-- AdminLTE App -->
    <script src="<?= base_url('dist/js/adminlte.min.js') ?>"></script>
    <!-- AdminLTE for demo purposes -->
    <script src="<?= base_url('dist/js/demo.js') ?>"></script>

    <!-- ChartJS -->
    <script src="<?= base_url('bower_components/chart.js/Chart.js') ?>"></script>

    <script >
        /*

        var cities = [];
        var cities_simple = [];

        //console.log(geocodeposition(52.5487429714954,-1.81602098644987));


        for(var i = 0 ; i < 1 ; i++ ) {
          var cit;
          var latit = Number(users[i]['latitude']);
          var longi = Number(users[i]['longitude']);


          //cit = geocodeposition(latit, longi);
          cities[i] = {};
          cities[i] = cit;
        }
        */
        //console.log(cities);

        var Pie = '<?= json_encode($pieChart) ?>';
        if(Pie==='[]'){
            var select = document.getElementById('chartAd');
            $(select.children).hide();
            $(select).append("<p><?= $this->lang->line('Aucune adhesion'); ?></p>");
        }else{
            Pie = JSON.parse(Pie);
        }

        var Pie2 = '<?= json_encode($pieChart2) ?>';
        if(Pie2==='[]') {
            var select = document.getElementById('chartDem');
            $(select.children).hide();
            $(select).append("<p><?= $this->lang->line('Aucune demande'); ?></p>");
        }else{
            Pie2 = JSON.parse(Pie2);
        }



        var areaChartData = {
            labels  : <?= json_encode($label_months) ?>,
            datasets: [
                {
                    label               : 'Electronics',
                    fillColor           : 'rgba(255, 162, 0, 1)',
                    strokeColor         : 'rgba(255, 162, 0, 1)',
                    pointColor          : 'rgba(255, 162, 0, 1)',
                    pointStrokeColor    : '#ffa200',
                    pointHighlightFill  : '#fff',
                    pointHighlightStroke: 'rgba(220,220,220,1)',
                    data: <?= json_encode($users_geolocated_data) ?>
                },
                {
                    label               : 'Digital Goods',
                    fillColor           : 'rgba(0, 187, 255, 1)',
                    strokeColor         : 'rgba(0, 187, 255, 1)',
                    pointColor          : '#00bbff',
                    pointStrokeColor    : 'rgba(0, 187, 255, 1)',
                    pointHighlightFill  : '#fff',
                    pointHighlightStroke: 'rgba(0, 187, 255, 1)',
                    data                : <?= json_encode($demandes_data) ?>
                }
            ]
        };

        var ctx = document.getElementById('barChart').getContext('2d');
        var chart = new Chart(ctx, {
            // The type of chart we want to create
            type: 'line',

            // The data for our dataset
            data: {
                labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July','August','September','October','November','December'],
                datasets: [{
                    label: "My First dataset",
                    backgroundColor: 'rgb(255, 99, 132)',
                    borderColor: 'rgb(255, 99, 132)',
                    data: [0, 10, 5, 2, 20, 30, 45]
                }]
            },

            // Configuration options go here
            options: {}
        });
    </script>
    <!-- Page script -->
    <script src="<?= base_url('dist/js/custom.js') ?>"></script>
