<?php
require_once("Classes/AutoLoader.php");

use Classes\Reporting;
use Classes\googlePost;

$report = new Reporting();
$previous = $report->getPreviousLunch();
//top 5 favorite foods
$top5 = $report->getTopFive();
//Lunch attendance and satisfaction Report
$asReport = $report->getASReport();


$googlePost = new googlePost();
//GET 5 recoment have hightest plus
$topPlusPost = $googlePost->getTopFivePost();
?>
<!DOCTYPE html>
<html>
    <head>
        <title>Offy Lunch Reporting</title>
        <meta charset="UTF-8" name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="viewport" content="width=device-width, maximum-scale=1.0" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge">

        <link href="css/main.css" rel="stylesheet" media="screen">
    </head>
    <body>
        <div class="wrapper">

            <div id="main">
                <div class="wrap-container">

                    <div class="block open-pos left">
                        <div class="title">
                            <img class="image" alt="list-style-image" src="images/blind.png"/>
                            <span>Previous Lunch Satisfaction (<?php echo $previous["date"]?>) </span>
                        </div>
                        <div id="piechart" style="height: 300px;"></div>
                    </div>

                    <div class="block new-coms right">
                        <div class="title">
                            <img class="image" alt="list-style-image" src="images/blind.png"/>
                            <span>Top 5 Favorite Foods </span>
                        </div>

                        <ul class="imgList">
                            <?php
                            $rate = 1;
                            foreach ($top5 as $food) {
                                ?>
                                <li>
                                    <img alt="Embedded Image"  src="data:image/png;base64,<?php echo $food["image_base64"]; ?>"/>
                                    <div><span class="medal"><?php echo $rate++;?></span><span><?php echo $food["name"]; ?></span></div>
                                    
                                </li> 
                                <?php
                            }
                            ?>
                        </ul>
                    </div>

                    <div class="block status left" style="height: 400px;">
                        <div class="title">
                            <img class="image" alt="list-style-image" src="images/blind.png"/>
                            <span>Top 5 recommendations </span>
                        </div>
                        <ul class="list-commention">
                            <?php
                            foreach ($topPlusPost as $recomment) {
                                ?>
                                <li class="comment">
                                    <span class="comment-title"><?php echo $recomment['content']; ?></span>
                                    <span class="comment-plus"><?php echo $recomment['plus']; ?></span>
                                </li>
                                <?php
                            }
                            ?>



                        </ul>

                    </div>

                    <div class="block evolution right"  style="height: 400px;">
                        <div class="title">
                            <img class="image" alt="list-style-image" src="images/blind.png"/>
                            <span>Lunch attendance & Satisfaction </span>
                        </div>
                        <div id="asreport" style="height: 350px;"></div>
                    </div>

                    <div class="clearfix"></div>
                </div> <!-- wrap-container-->		

            </div><!--end main-->	

            <div class="logo"></div>

        </div><!--end wrapper-->
        <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
        <script type="text/javascript" src="https://www.google.com/jsapi"></script>
        <script type="text/javascript">
            google.load('visualization', '1', {packages: ['corechart']});
        </script>

        <!--Pie chart-->
        <script type="text/javascript">
            google.setOnLoadCallback(drawChart);
            function drawChart() {
                var dataTable = new google.visualization.DataTable();
                dataTable.addColumn('string', 'Feeling');
                // Use custom HTML content for the domain tooltip.
                dataTable.addColumn('number', "Percentage of votes");


                dataTable.addRows([
                    ['Delicious', <?php echo $previous["delicious"]; ?>],
                    ['Good', <?php echo $previous["good"]; ?>],
                    ['Normal', <?php echo $previous["like"]; ?>],
                    ['Dislike', <?php echo $previous["dislike"]; ?>],
                    
                    
                ]);
                var options = {
                    title: '',
                    tooltip: {isHtml: true},
                    pieSliceText: 'label',
                    is3D: true,
                    colors: ['#b3ce58','#0489B1', '#fdbd40', '#f0736e', ]
                };

                var chart = new google.visualization.PieChart(document.getElementById('piechart'));
                chart.draw(dataTable, options);
            }
        </script>
        <!-- Bars chart-->
        <script type="text/javascript">

            function drawVisualization() {
                // Some raw data (not necessarily accurate)
                var dataTable = new google.visualization.DataTable();
                dataTable.addColumn('string', 'Date');

                dataTable.addColumn('number', "Number Vote");
                dataTable.addColumn('number', "Average");
<?php foreach ($asReport as $row) { ?>
                    dataTable.addRow([
                        '<?php echo $row["date"]; ?>',
    <?php echo $row["number_vote"]; ?>,
    <?php echo $row["average"]; ?>
                    ]);
<?php }
?>
//                var options = {
//                    title: '',
//                    vAxes: {title: ""},
//                    seriesType: "bars",
//                    series: {0: {type: "line"}},
//                    colors: ['#fdbd40', '#39aba7', ]
//
//                };
                var options = {vAxes: [
                        {title: 'Number Vote', titleTextStyle: {color: '#39aba7', fontSize: 16, }, }, // Left axis
                        {title: 'Average', titleTextStyle: {color: '#fdbd40', fontSize: 16, }, }, // Left axis


                    ], series: [
                        {targetAxisIndex: 0, type: "bars", },
                        {targetAxisIndex: 1, type: "line", },
                    ],
                    colors: ['#39aba7', '#fdbd40']
                }

                var chart = new google.visualization.ComboChart(document.getElementById('asreport'));
                chart.draw(dataTable, options);
            }
            google.setOnLoadCallback(drawVisualization);


        </script>
    </body>
</html>