@extends('app')
@push('styles')
    <style>
        .widget{
            background-color:#fff;
            box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
            transition: all 0.3s cubic-bezier(.25,.8,.25,1);
        }
    </style>
@endpush
@section('page_content')
    <div class="page-content container-fluid" style="margin-top: 1em">

        <div class="row">

            <div class="col-md-12">
                <div class="widget widget-shadow text" style="background-image: url({{asset('NewUI/Register/images/fb.jpg')}}); background-position: center ;background-size: cover;height: 20em">
                    <div class="widget-body text-center">

                    </div>

                </div>
            </div>


        </div>

        <div id="mypages">

{{--            <div class="col-md-4" style="margin-top: -4em">--}}
{{--                <div class="widget widget-shadow text">--}}
{{--                    <div class="widget-body text-center">--}}
{{--                        <img src="{{asset('UI/5b072f20c08c1.png')}}" style="width:9em">--}}
{{--                        <a class="btn btn-primary btn-outline"> Facebook</a>--}}
{{--                    </div>--}}
{{--                    <div class="widget-footer">--}}
{{--                        <div class="row no-space" style="height: 1em">--}}
{{--                            <p align="center" id="load">{!!  !empty(Auth::user()->social()->first()->fb_access_token) ? '<a class="btn btn-success btn-xs" style="width:100%;background-color:#1b5e20;color:#fff"><i class="fa fa-check"></i> Done</a>' : '<a class="btn btn-xs" style="width:100%;background-color:#3b5998;color:#fff"><i class="fa fa-times"></i> Setup Incomplete</a>' !!}</p>--}}
{{--                        </div>--}}
{{--                    </div>--}}
{{--                </div>--}}
{{--            </div>--}}

        </div>


    </div>
    <br>
    <br>
    <br>
@endsection





@push('scripts')
    <script src="{{asset('js/tulenke.js')}}"></script>
    <script>
        $(document).ready(function(){

            // Consume End point for user details
            var facebook_access_token = '{!!  $facebook_access_token->fb_user_access ?? null !!}';
            console.log(facebook_access_token);

            var mydata = {
                'user_access_token': facebook_access_token,
            };

            var url = 'https://social.snwolley.com/facebook-api/user/details';


            $.post(url,mydata,function (data) {

                console.log(data);
                $.each(data,function(i,item) {

                    $('#mypages').append('<div class="col-md-4" style="margin-top: -4em">\n' +
                        '                <div class="widget widget-shadow text">\n' +
                        '                    <div class="widget-body text-center">\n' +
                        '                        <img src="https://cdn4.iconfinder.com/data/icons/social-icon-4/842/facebook-512.png" style="width:9em">\n' +
                        '                        <a onclick="mytins(\'' + item.access_token + '\' , \'' + item.id + '\',  \'' + encodeURIComponent(item.picture.data.url) + '\' , \'' + item.name + '\' )" class="btn btn-primary btn-outline"> '+item.name+'</a>\n' +
                        '                    </div>\n' +
                        '                </div>\n' +
                        '            </div>')

                });

            }).done(function() {


            })
                .fail(function() {
                    alert( "Could not fetch pages from Facebook" );
                })
                .always(function() {
                    console.log( "finished executing" );
                });

        });

        function mytins($selected_access_token, $selected_page_id,$page_image, $page_name ) {
            localStorage.setItem('selected_access_token', $selected_access_token);
            localStorage.setItem('selected_page_id',$selected_page_id);
            localStorage.setItem('page_image',$page_image);
            localStorage.setItem('page_name',$page_name);
            //    Route to sentiment page
            window.location.href = '{{URL::to('social/facebook/dashboard')}}';
        }

    </script>
@endpush