<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="description" content="Mark Allen Coaching Facebook Quiz App ">
        <meta name="author" content="Mark Allen">
        <!-- Meta properties for Facebook Open Graph -->
        <meta property="og:url" content="{{ URL::full();}}"/>
        <meta property="og:title" content="{{isset($poll_text)?$poll_text:''}}"/>
        <meta property="og:type" content="website"/>
        <meta property="og:image" content="https://scontent-sea1-1.xx.fbcdn.net/t39.2081-0/p168x128/14394504_898654980267716_2065622742_n.png"/>
        <meta property="og:site_name" content="Mark Allen Coaching Poll"/>
        <meta property="og:description" content=" Find out how much you know about your sport."/>
        <!--	Meta properties for Facebook Open Graph -->
        <!-- Site title name from default setting -->
        <title>Mark Allen Coaching Poll</title>
        <!-- Bootstrap CSS -->
        <link href="{{asset('public/css/bootstrap.min.css')}}" rel="stylesheet">
        <!-- Font Awesome CSS  -->
        <link href="{{asset('public/font-awesome-4.3.0/css/font-awesome.min.css')}}" rel="stylesheet">
        <!-- Custom CSS -->
        <link href="{{asset('public/css/main.css')}}" rel="stylesheet">
        <!-- Animate CSS -->
        <link href="{{asset('public/css/animate.css')}}" rel="stylesheet">
        <!-- favicon -->
        <link rel="icon" href="{{asset('public/img/favicon.ico')}}">
        <!-- Jqury Lib Added -->
        <script src="{{asset('public/js/jquery-1.9.1.min.js')}}"></script>
        <!--[if lt IE 9]>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.2/html5shiv-printshiv.js"></script>
        <![endif]-->
        <style>
            .UFICommentActorName{
               color:orange;
            }
            </style>
    </head><!--/head-->
    <body>
        <!-- Navbar -->
        @include('user.navbar')
        <!-- End Navbar -->
        <div class="">
            <div class="col-md-12">
                <!-- Poll Page -->
                <div class="clearfix">&nbsp;</div>
                <div class="clearfix">&nbsp;</div>
                <div class="clearfix">&nbsp;</div>
                <div class="clearfix">&nbsp;</div>
                <div class="clearfix">&nbsp;</div>
                <div class="clearfix">&nbsp;</div>


                <div class="row">
                    <div class="col-md-1"></div>
                    <div class="col-md-10">
                        <div class="col-md-9">
                            <div class="col-md-12 animated slideInDown bg-default poll-content-share" id="poll-content">
                                <div class="clearfix load-content">&nbsp;</div>
                                @if(!empty($poll))
                                @if($poll_image)<img class="img-responsive" src="{{$poll_image}}">@endif
                                <h3 class="vr-text-color"><i class="fa fa-question-circle text-warning"></i>  Poll:   {{$poll_text}}   </h3>
                                <?php
                                $total = 0;
                                foreach ($poll as $p) {
                                    $total += isset($p->number) ? $p->number : 0;
                                }
                                ?>
                                @foreach($poll as $p)

                                <?php
                                $percent = 0;
                                if (isset($p->number) && !empty($p->number)) {
                                    $percent = $p->number / $total * 100;
                                    $percent = number_format((float) $percent, 0, '.', '');  // Outputs -> 105.00
                                }
                                ?>
                                <strong>{{$p->poll_option_text}}</strong><span class="pull-right"></span>
                                <div class="progress">
                                    <div class="progress-bar {{Util::getColor($percent)}}" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width: {{$percent}}%">
                                        <center>  <b style="color:black"> {{$percent}}%</b></center>
                                    </div>
                                </div>
                                @endforeach
                                <hr>
                                <div class="row">
                                    <div class="col-md-2"><button class="btn btn-large btn-info vote btn-block" poll-id="{{$poll[0]->poll_id}}"><i class="fa fa-thumbs-o-up"></i> Vote</button></div>
                                    <div class="col-md-2"><a href="#" class="btn btn-large btn-info btn-facebook btn-block" id="share"><i class="fa fa-facebook"></i> Share </a></div>
                                    <div class="col-md-2"> <a class="twitter-share-button" href="{{url()}}/poll-share/{{$short_code}}"  data-size="large"> Tweet</a> </div>
                                    <div class="col-md-6"><input style="cursor: pointer" type="text" class="form-control input-sm" value="{{url()}}/poll-share/{{$short_code}}" readonly="readonly"></div>
                                </div>
                                <div>&nbsp;</div>
                                <h3>Comments </h3>
                                <div class="fb-comments" data-href="{{URL::full()}}" data-numposts="5"></div>

                                @else
                                <h4> No Poll found !</h4>
                                @endif
                            </div>
                        </div>
                        <div class="col-md-3 bg-default">
                            <b>Ads: </b>
                            <p></p>
                            <a href="{{$settings->footer_image_link}}">
                                <img class="img-responsive portfolio-item" src="{{asset('public/images')}}/{{$settings->footer_image}}" alt="Quiz Viral marketing ">
                            </a>
                            <div class="clearfix">&nbsp;</div>
                            <H4> Quiz Top Score : </h4>
                            <p></p>
                            @if(!empty($top_scrorer))
                            @foreach($top_scrorer as $top)
                            <div class="row">
                                <div class="col-md-3">
                                    <div class="clearfix">&nbsp;</div>
                                    <img class="img-thumbnail" src="https://graph.facebook.com/{{$top->fbid}}/picture">
                                </div>
                                <div class="col-md-9">
                                    <b class="vr-text-color"><a class="vr-text-color" href="http://facebook.com/{{$top->fbid}}">{{$top->name}}</a></b>
                                    <br><b> Quiz group </b>: {{$top->group_name}}
                                    <br><b>Score </b>: {{$top->avg_grade}}%
                                    <br><b>Date  </b>: {{Util::getdate($top->quiz_date,'d M y H:i a')}}
                                </div>
                            </div>
                            <hr>
                            @endforeach
                            @endif
                        </div>
                    </div>
                    <div class="col-md-1"></div>
                </div>
                <div class="clearfix">&nbsp;</div>
            </div>
        </div>
        <hr>
        <div class="footer"> Developed by Scott Zagarino </div>
        <!-- Jquery Lib -->
        <script src="{{asset('public/js/bootstrap.min.js')}}"></script>
        <script src="{{asset('public/js/chartjs/Chart.js')}}"></script>
        <!-- Custom JS -->
        <script src="{{asset('public/js/script.js')}}"></script>
        <script src="{{asset('public/js/jquery.timer.js')}}"></script>

        <!-- Analytics or Others Tracking code -->
         <script> {{isset($settings->analytics_code)?$settings->analytics_code:''}} </script>
        <!-- Analytics or Others Tracking code end -->

        <script>
        window.fbAsyncInit = function() {
        FB.init({
        appId: {{Config::get('facebook.appId')}},
                xfbml: true,
                version: 'v2.3'
        });
        };
        (function(d, s, id) {
        var js, fjs = d.getElementsByTagName(s)[0];
                if (d.getElementById(id)) {
        return;
        }
        js = d.createElement(s);
                js.id = id;
                js.src = "//connect.facebook.net/en_US/sdk.js";
                fjs.parentNode.insertBefore(js, fjs);
        }(document, 'script', 'facebook-jssdk'));</script>



        <script>
                    $('.vote').on('click', function() {
            var btn = $(this);
                    var btn_content = btn.html();
                    btn.html('<i class="fa fa-spinner fa-spin"></i>');
                    var poll_id = $(this).attr('poll-id');
                    $.ajax('/user/poll-form/' + poll_id).done(function(html) {
            if (html.success == 1) {
            modalCall('<i class="fa fa-question-circle"></i> Click and vote', '', html.msg);
                    btn.html(btn_content);
            }
            else {
            modalCall('<i class="fa fa-question-circle"></i> Login failed !', 'Please connect with facebook to cast your vote.', '<br><br> <button onclick="facebookLogin();"class="btn btn-info btn-facebook facebook-btn" id="facebook-btn"><i class="fa fa-facebook"></i> Connecting with Facebook  </button>');
                    btn.html(btn_content);
            }
            });
            });
                    // Share Button action .
                    $('#share').click(function() {
            FB.ui(
            {
            method: 'share',
                    href: '{{url()}}/poll-share/{{$short_code}}',
            },
                    function(response) {
                    if (response && !response.error_code) {
                    modalCall('<i class="fa fa-check"></i> Thank you for sharing your vote. ', '', 'Your friends can see and vote here !');
                    } else {
                    // alert('Error while posting.');
                    }
                    }
            );
            });
        </script>
        <!-- Twitter JS-->
        <script>
                        window.twttr = (function(d, s, id) {
              var js, fjs = d.getElementsByTagName(s)[0],
                t = window.twttr || {};
              if (d.getElementById(id)) return t;
              js = d.createElement(s);
              js.id = id;
              js.src = "https://platform.twitter.com/widgets.js";
              fjs.parentNode.insertBefore(js, fjs);

              t._e = [];
              t.ready = function(f) {
                t._e.push(f);
              };

              return t;
            }(document, "script", "twitter-wjs"));
        </script>
    </body>
</html>
