<?php 
session_start();
require("config/conn.php");
require("functions.php");
include("includes/header.php");
include("includes/topbar.php");
include("includes/sidebar.php");


session_regenerate_id(true);

if (!isset($_SESSION['AdminLoginId'])) {
    header("Location: index.php");
} 

?>





<main>
    <div class="container-fluid px-4">

        <h1 class="mt-4 dash-heading">Dashboard</h1>
        <ol class="breadcrumb mb-4">
            <li class="breadcrumb-item active">Dashboard</li>
        </ol>




        


        <div class="row cards-container">
            <div class="col-2 stats-heading-container">
                <h1 class="stats" style="">
                    Stats
                </h1>

                <p>
                    Quizze Engagememt Stats
                </p>
            </div>
            <div class="col-10 card-cont mb-4">
                <div class="card card-item">
                    <div class="icon">
                        <i class="fa-solid fa-users"></i>
                    </div>
                    <div class="data">
                        <h1>
                            Users
                        </h1>
                        <p>
                            <span class="numdata">
                               <?=  getNoData('users' , '', ''); ?>                </span>
                            <span class="growthNum">

                            <?php 
                            
                                $sql = "SELECT * FROM `users`";

                                $query_run = mysqli_query($conn, $sql);
                                
                                if ($query_run):

                                    if (mysqli_num_rows($query_run) > 0):

                                        $userCount = 0;

                                        foreach ($query_run as $row):

                                            $date = date('d/m/y');

                                            $userDate = date_format(date_create($row['accountCreated']), "d/m/y");

                                            if ($date == $userDate) {
                                                $userCount++;

                                            } else{
                                                
                                            }
                                          
                                           
                                        endforeach;

                                        if ($userCount > 0):

                                            ?>
                                            
                                                                                            +<?= $userCount; ?>
                                            
                                            <?php
                                                                                        else:
                                            
                                                                                        endif;
                                            
                                            

                                    else:

                                        echo "";

                                    endif;

                                else:

                                    echo "Some Error Occured !";

                                endif;

                            
                            ?>


                            </span>
                        </p>
                    </div>
                </div>
                <div class="card card-item">
                    <div class="icon">
                    <i class="fa-brands fa-quinscape"></i>
                    </div>
                    <div class="data">
                        <h1>
                            Categories
                        </h1>
                        <p>
                            <span class="numdata">
                            <?=  getNoData('categories', '', ''); ?>                            </span>
                        </p>
                    </div>
                </div>
                <div class="card card-item">
                    <div class="icon">
                    <i class="fa-solid fa-q"></i>
                    </div>
                    <div class="data">
                        <h1>
                            Quizzes
                        </h1>
                        <p>
                            <span class="numdata">
                            <?=  getNoData('quizzes', '', ''); ?>                          </span>
                    
                        </p>
                    </div>
                </div>
                <div class="card card-item">
                    <div class="icon">
                    <i class="fa-solid fa-money-bill-transfer"></i>
                    </div>
                    <div class="data">
                        <h1 style="font-size: 1.2rem;">
                            Withdraw Requests
                        </h1>
                        <p>
                            <span class="numdata">
                            <?=  getNoData('withdrawrequests', 'status', 'true'); ?>                       </span>
                            
                        </p>
                    </div>
                </div>
                <div class="card card-item">
                    <div class="icon">
                    <i class="fa-solid fa-trophy"></i>
                    </div>
                    <div class="data">
                        <h1>
                            Games
                        </h1>
                        <p>
                            <span class="numdata">
                            <?=  getNoData('games', '', ''); ?>                       </span>
                            
                        </p>
                    </div>
                </div>
                <div class="card card-item">
                    <div class="icon">
                    <i class="fa-solid fa-users-slash"></i>
                    </div>
                    <div class="data">
                        <h1 style="font-size: 1.2rem;">
                           Banned Users
                        </h1>
                        <p>
                            <span class="numdata">
                            <?=  getNoData('users', 'isBanned', '1'); ?>                          </span>
                           
                        </p>
                    </div>
                </div>
            </div>

                            </div>








<div class="row my-4 align-items-start">
            <div class="col-6">
            <div class="user-table-data  user-table-data" style="padding: 1rem 1rem;">
                        <div class="card-heading  text-black d-flex justify-content-between align-items-center">
                            <span>Users Chart <span class="user-chart-heading">[Yearly]</span></span> 

                            <div class="btn-group">
                                <button type="button" class="simple-btn yearly-chart disabled"  style="padding: 5px 10px;">
                               Yearly
                                </button>
                                <button type="button" class="simple-btn monthly-chart"  style="padding: 5px 10px;">
                               Monthly
                                </button>
                            </div>
                        </div>
                        <div class="card-body">
                            <canvas id="userMonthChart"></canvas>
                            <canvas id="userDaysMonthChart"></canvas>
                        </div>
                    </div>
                </div>
                <div class="col-6" >
                    <div class="user-table-data  user-table-data" style="padding: 1rem 1rem;">
                        <div class="card-heading text-black">
                            Top Users
                        </div>
                        <div class="card-body">
                        <table id="example" class="table table-striped" style="width:100%">
                        <thead>
                            <tr>
                                <th>SR No.</th>
                                <th>Avatar</th>
                                <th>Name</th>
                                <th>Email</th>
                                <th>Account Created</th>
                                <th>Status</th>
                            </tr>
                        </thead>
                        <tbody>
                            <?php
            
            $sql = "SELECT * FROM `users` ORDER BY `users`.`coins` DESC";

            $query_run = mysqli_query($conn, $sql);

            if ($query_run):
                if (mysqli_num_rows($query_run) > 0):

                    $i = 1;

                    foreach ($query_run as $row):
                        if ($row['isBanned'] == 0):
                            $text = "Active";
                            $style = "active";
                        else:
                            $text = "Banned";
                            $style = "banned";
                        endif;
                        ?>



                            <tr id="box<?= $row['id']; ?>">
                                <td>
                                    <?= $i; ?>
                                </td>
                                <td><img style="width: 50px; height: 50px;" src="<?= $row['avatar']; ?>" alt="avatar">
                                </td>
                                <td>
                                    <?= $row['name']; ?>
                                </td>
                                <td>
                                    <?= $row['email'] ?>
                                </td>
                                <td>
                                    <?=  date('d-M-Y',strtotime($row['accountCreated']))?>
                                </td>
                                <td class="d-flex align-items-center"><span class="<?= $style; ?>">
                                        <?= $text ?>
                                    </span>
                                </td>
                            </tr>


                            <?php

                        $i++;
                    endforeach;








                else:
                    echo "No User Data";
                endif;
            else:
                echo "Some Error Occured";
            endif;
            
            
            
            ?>

                        </tbody>
                    </table>
                        </div>
                    </div>
            </div>


        </div>
        

                            </div>
                       











</main>




<?php 

include("includes/script.php");



$sql = "SELECT * FROM `users`";
$query_run = mysqli_query($conn, $sql);

if ($query_run) {
        $January = 0;
        $Febuary = 0;
        $March = 0;
        $April = 0;
        $May = 0;
        $June = 0;
        $July = 0;
        $August = 0;
        $September = 0;
        $October = 0;
        $November = 0;
        $December = 0;

        $data = [];

    foreach ($query_run as $row) {
        $date =  $row['accountCreated'];
       
        $userMonth = date_format(date_create($row['accountCreated']), "m/Y");
        // echo $userMonth;
        $date = date('Y');
        $monthNo = $userMonth;

        // echo $monthNo; 
         $case1 = '01/'.$date.'';
         $case2 = '02/'.$date.'';
         $case3 = '03/'.$date.'';
         $case4 = '04/'.$date.'';
         $case5 = '05/'.$date.'';
         $case6 = '06/'.$date.'';
         $case7 = '07/'.$date.'';
         $case8 = '08/'.$date.'';
         $case9 = '09/'.$date.'';
         $case10 = '10/'.$date.'';
         $case11 = '11/'.$date.'';
         $case12 = '12/'.$date.'';
      
        switch ($monthNo) {
            case $case1 :
                $January++;
                break;
            
            case $case2 :
                $Febuary++;
                break;
            
            case $case3 :
                $March++;
                break;
            
            case $case4 :
                $April++;
                break;
            
            case $case5 :
                $May++;
                break;
            
            case $case6 :
                $June++;
                break;
            
            case $case7 :
                $July++;
                break;
            
            case $case8 :
                $August++;
                break;
            
            case $case9 :
                $September++;
                break;
            
            case $case10 :
                $October++;
                break;
            
            case $case11 :
                $November++;
                break;
            
            case $case12 :
                $December++;
                break;
            
            default:
                # code...
                break;
        }

       
      
    
        
    }

    $data[0] = $January;
    $data[1] = $Febuary;
    $data[2] = $March;
    $data[3] = $April;
    $data[4] = $May;
    $data[5] = $June;
    $data[6] = $July;
    $data[7] = $August;
    $data[8] = $September;
    $data[9] = $October;
    $data[10] = $November;
    $data[11] = $December;


}




if ($query_run) {

    $date_data = [];
    $dd01 = 0;
    $dd02 = 0;
    $dd03 = 0;
    $dd04 = 0;
    $dd05 = 0;
    $dd06 = 0;
    $dd07 = 0;
    $dd08 = 0;
    $dd09 = 0;
    $dd10 = 0;
    $dd11 = 0;
    $dd12 = 0;
    $dd13 = 0;
    $dd14 = 0;
    $dd15 = 0;
    $dd16 = 0;
    $dd17 = 0;
    $dd18 = 0;
    $dd19 = 0;
    $dd20 = 0;
    $dd21 = 0;
    $dd22 = 0;
    $dd23 = 0;
    $dd24 = 0;
    $dd25 = 0;
    $dd26 = 0;
    $dd27 = 0;
    $dd28 = 0;
    $dd29 = 0;
    $dd30 = 0;
    $dd31 = 0;

    $noOfDays = date('t') + 1;

    foreach ($query_run as $row) {
        $userMonth = date_format(date_create($row['accountCreated']), "d/m/Y");
        // echo $userMonth;
        $date = date('/m/Y');
        $monthNo = $userMonth; 
        
       $d01 = '01'.$date;
       $d02 = '02'.$date;
       $d03 = '03'.$date;
       $d04 = '04'.$date;
       $d05 = '05'.$date;
       $d06 = '06'.$date;
       $d07 = '07'.$date;
       $d08 = '08'.$date;
       $d09 = '09'.$date;
       $d10 = '10'.$date;
       $d11 = '11'.$date;
       $d12 = '12'.$date;
       $d13 = '13'.$date;
       $d14 = '14'.$date;
       $d15 = '15'.$date;
       $d16 = '16'.$date;
       $d17 = '17'.$date;
       $d18 = '18'.$date;
       $d19 = '19'.$date;
       $d20 = '20'.$date;
       $d21 = '21'.$date;
       $d22 = '22'.$date;
       $d23 = '23'.$date;
       $d24 = '24'.$date;
       $d25 = '25'.$date;
       $d26 = '26'.$date;
       $d27 = '27'.$date;
       $d28 = '28'.$date;
       $d29 = '29'.$date;
       $d30 = '30'.$date;
       $d31 = '31'.$date;
      
        switch ($monthNo) {
            case $d01:
               $dd01++;
                break;
            
            case $d02:
               $dd02++;
                break;
            
            case $d03:
               $dd03++;
                break;
            
            case $d04:
               $dd04++;
                break;
            
            case $d05:
               $dd05++;
                break;
            
            case $d06:
               $dd06++;
                break;
            
            case $d07:
               $dd07++;
                break;
            
            case $d08:
               $dd08++;
                break;
            
            case $d09:
               $dd09++;
                break;
            
            case $d10:
               $dd10++;
                break;
            
            case $d11:
               $dd11++;
                break;
            
            case $d12:
               $dd12++;
                break;
            
            case $d13:
               $dd13++;
                break;
            
            case $d14:
               $dd14++;
                break;
            
            case $d15:
               $dd15++;
                break;
            
            case $d16:
               $dd16++;
                break;
            
            case $d17:
               $dd17++;
                break;
            
            case $d18:
               $dd18++;
                break;
            
            case $d19:
               $dd19++;
                break;
            
            case $d20:
               $dd20++;
                break;
            
            case $d21:
               $dd21++;
                break;
            
            case $d22:
               $dd22++;
                break;
            
            case $d23:
               $dd23++;
                break;
            
            case $d24:
               $dd24++;
                break;
            
            case $d25:
               $dd25++;
                break;
            
            case $d26:
               $dd26++;
                break;
            
            case $d27:
               $dd27++;
                break;
            
            case $d28:
               $dd28++;
                break;
            
            case $d29:
               $dd29++;
                break;
            
            case $d30:
               $dd30++;
                break;
            
            case $d31:
               $dd31++;
                break;
            
            default:
                # code...
                break;
        }
    }

    
    $i = 1;
    while ($i < $noOfDays) {
       
        global $dd01;
        global $dd02;
        global $dd03;
        global $dd04;
        global $dd05;
        global $dd06;
        global $dd07;
        global $dd08;
        global $dd09;
        global $dd10;
        global $dd11;
        global $dd12;
        global $dd13;
        global $dd14;
        global $dd15;
        global $dd16;
        global $dd17;
        global $dd18;
        global $dd19;
        global $dd20;
        global $dd21;
        global $dd22;
        global $dd23;
        global $dd24;
        global $dd25;
        global $dd26;
        global $dd27;
        global $dd28;
        global $dd29;
        global $dd30;
        global $dd31;




        switch ($i) {
            case '1':
                $date_data[0] = $dd01;
                break;
            case '2':
                $date_data[1] = $dd02;
                break;
            case '3':
                $date_data[2] = $dd03;
                break;
            case '4':
                $date_data[3] = $dd04;
                break;
            case '5':
                $date_data[4] = $dd05;
                break;
            case '6':
                $date_data[5] = $dd06;
                break;
            case '7':
                $date_data[6] = $dd07;
                break;
            case '8':
                $date_data[7] = $dd08;
                break;
            case '9':
                $date_data[8] = $dd09;
                break;
            case '10':
                $date_data[9] = $dd10;
                break;
            case '11':
                $date_data[10] = $dd11;
                break;
            case '12':
                $date_data[11] = $dd12;
                break;
            case '13':
                $date_data[12] = $dd13;
                break;
            case '14':
                $date_data[13] = $dd14;
                break;
            case '15':
                $date_data[14] = $dd15;
                break;
            case '16':
                $date_data[15] = $dd16;
                break;
            case '17':
                $date_data[16] = $dd17;
                break;
            case '18':
                $date_data[17] = $dd18;
                break;
            case '19':
                $date_data[18] = $dd19;
                break;
            case '20':
                $date_data[19] = $dd20;
                break;
            case '21':
                $date_data[20] = $dd21;
                break;
            case '22':
                $date_data[21] = $dd22;
                break;
            case '23':
                $date_data[22] = $dd23;
                break;
            case '24':
                $date_data[23] = $dd24;
                break;
            case '25':
                $date_data[24] = $dd25;
                break;
            case '26':
                $date_data[25] = $dd26;
                break;
            case '27':
                $date_data[26] = $dd27;
                break;
            case '28':
                $date_data[27] = $dd28;
                break;
            case '29':
                $date_data[28] = $dd29;
                break;
            case '30':
                $date_data[29] = $dd30;
                break;
            
            case '31':
                $date_data[30] = $dd31;
                break;
            
            default:
                # code...
                break;
        }

       $i++;
    }

    


}






?>



<script>
    <?php

    if (isset($_SESSION['status'])) {
    ?>
            swal("<?= $_SESSION['message']; ?>", {
                icon: "<?= $_SESSION['icon'] ?>",

            }
            );
    <?php
  unset($_SESSION['status']);
        unset($_SESSION['message']);
        unset($_SESSION['icon']);
    }

?>


</script>



<script>
    // Set new default font family and font color to mimic Bootstrap's default styling
Chart.defaults.global.defaultFontFamily = '-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif';
Chart.defaults.global.defaultFontColor = '#292b2c';


$('#userDaysMonthChart').hide();

        // Area Chart Example
        var ctx = document.getElementById("userMonthChart");
        var myLineChart = new Chart(ctx, {
          type: 'line',
          data: {
            labels: ["January", "Febuary", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],
            datasets: [{
              label: "Users",
              lineTension: 0.3,
              backgroundColor: "rgba(2,117,216,0.2)",
              borderColor: "rgba(21, 18, 45, 1)",
              pointRadius: 5,
              pointBackgroundColor: "rgba(2,117,216,1)",
              pointBorderColor: "rgba(255,255,255,0.8)",
              pointHoverRadius: 5,
              pointHoverBackgroundColor: "rgba(2,117,216,1)",
              pointHitRadius: 50,
              pointBorderWidth: 2,
              data: <?=  json_encode($data) ?>,
            }],
          },
          options: {
            scales: {
              xAxes: [{
                time: {
                  unit: 'date'
                },
                gridLines: {
                  display: false
                },
                ticks: {
                  maxTicksLimit: 13
                }
              }],
              yAxes: [{
                ticks: {
                  min: 0,
                //   max: 10,
                  maxTicksLimit: 10
                },
                gridLines: {
                  display: false,
                }
              }],
            },
            legend: {
              display: false
            }
          }
});

</script>
<script>
    var getDaysInMonth = function(month,year) {
  
    return new Date(year, month, 0).getDate();

};
</script>
<script>
    $('.yearly-chart').on('click', function (e) {
        e.preventDefault();


        $('.monthly-chart').removeClass('disabled');
        $('.weekly-chart').removeClass('disabled');
        $(this).addClass('disabled');
        $('#userMonthChart').show();
        $('#userDaysMonthChart').hide();

        $('.user-chart-heading').text('[Yearly]');
        
        // console.log('yearly');

        var ctx = document.getElementById("userMonthChart");
        var myLineChart = new Chart(ctx, {
          type: 'line',
          data: {
            labels: ["January", "Febuary", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],
            datasets: [{
              label: "Users",
              lineTension: 0.3,
              backgroundColor: "rgba(2,117,216,0.2)",
              borderColor: "rgba(21, 18, 45, 1)",
              pointRadius: 5,
              pointBackgroundColor: "rgba(2,117,216,1)",
              pointBorderColor: "rgba(255,255,255,0.8)",
              pointHoverRadius: 5,
              pointHoverBackgroundColor: "rgba(2,117,216,1)",
              pointHitRadius: 50,
              pointBorderWidth: 2,
              data: <?=  json_encode($data) ?>,
            }],
          },
          options: {
            scales: {
              xAxes: [{
                time: {
                  unit: 'date'
                },
                gridLines: {
                  display: false
                },
                ticks: {
                  maxTicksLimit: 13
                }
              }],
              yAxes: [{
                ticks: {
                  min: 0,
                //   max: 10,
                  maxTicksLimit: 10
                },
                gridLines: {
                  display: false,
                }
              }],
            },
            legend: {
              display: false
            }
          }
});


    });
    $('.monthly-chart').on('click', function (e) {
        e.preventDefault();

        $('.yearly-chart').removeClass('disabled');
        $('.weekly-chart').removeClass('disabled');
        $(this).addClass('disabled');
       
        $('#userMonthChart').hide();
        $('#userDaysMonthChart').show();

        $('.user-chart-heading').text('[Monthly]');




        const d = new Date();
        
        let year = d.getFullYear();
        let month = d.getMonth()+1;
        
        let days = getDaysInMonth(month, year) + 1;
        
        let i = 1;
        let days_array = [];
        
        while (i < days) {
            console.log(i);
            days_array.push(i);
            
            i++;
        }

        
        // Area Chart Example
        var ctx = document.getElementById("userDaysMonthChart");
        var myLineChart = new Chart(ctx, {
          type: 'line',
          data: {
            labels: days_array,
            datasets: [{
              label: "Users",
              lineTension: 0.3,
              backgroundColor: "rgba(2,117,216,0.2)",
              borderColor: "rgba(21, 18, 45, 1)",
              pointRadius: 5,
              pointBackgroundColor: "rgba(2,117,216,1)",
              pointBorderColor: "rgba(255,255,255,0.8)",
              pointHoverRadius: 5,
              pointHoverBackgroundColor: "rgba(2,117,216,1)",
              pointHitRadius: 50,
              pointBorderWidth: 2,
              data: <?=  json_encode($date_data) ?>,
            }],
          },
          options: {
            scales: {
              xAxes: [{
                time: {
                  unit: 'date'
                },
                gridLines: {
                  display: false
                },
                ticks: {
                  maxTicksLimit: 13
                }
              }],
              yAxes: [{
                ticks: {
                  min: 0,
                //   max: 10,
                  maxTicksLimit: 10
                },
                gridLines: {
                  display: false,
                }
              }],
            },
            legend: {
              display: false
            }
          }
});
        
        console.log(days_array);

        console.log('monthly');
    });
</script>


<script>
    $(document).ready(function () {
        var table = $('#example').DataTable({
            language: {
                searchPlaceholder: "Search Users"
            },
            columnDefs: [
                {
                    targets: 0,
                    checkboxes: {
                        selectRow: true
                    }
                }
            ],
            select: {
                style: 'multi'
            },
            order: [[1, 'asc']]

        });

    });



</script>




<?php

include("includes/footer.php");



?>