{% extends 'base.html.twig' %}
{% block stylesheets %}
    <style>
        .page-background{background-color:#3fc6f5 !important;height:100%;color:#fff;}
        .btn{font-size:24px !important;color:#fff;width:300px;padding:20px !important;margin:10px !important;border:solid 3px black !important;border-radius: 50px !important;}
        .great-button{background-color:green !important;}
        .average-button{background-color:yellow !important;color:#000 !important;}
        .poor-button{background-color:red !important;}
        .review-platform-button{background-color:#0b48a1;}
        .submit-button{background-color:#0b48a1;}
        textarea{color:#000 !important;height:300px;width: 300px;border:solid 3px black !important;}
    </style>
{% endblock %}

{% block body %}
    <div class="container-fluid page-background">
        <div class="row" style="background-color:#0d47a1;height: 90px;">
            <div class="col-md-12 text-center" style="padding:10px;">
                <span class="text-white text-uppercase logo-text"><img src="{{ asset('images/PreviewLogo.png') }}" height="50px;"/></span>
                <p class="text-white powered-by">Powered by <img src="http://member.iserviceauto.com/iServiceLogo.png" height="20px;"></p>
            </div>
        </div>
        {% if myReview == true %}
        <div class="row page-background text-center" id="prompt-great">
            <h1>Where would you like to leave your review</h1>
            {% if myReviewSettings.googleUrl %}
                <p><a href="{{ myReviewSettings.googleUrl }}" target="_blank" class="btn btn-big review-platform-button" id="google">Google</a></p>
            {% endif %}
            {% if myReviewSettings.facebookUrl %}
            <p><a href="{{ myReviewSettings.facebookUrl }}" target="_blank" class="btn btn-big review-platform-button" id="fb">Facebook</a></p>
            {% endif %}
        </div>
        <div class="row page-background text-center" style="display:none;" id="prompt-average-poor">
            <h1>Please tell us how<br />we can improve.</h1>
            <textarea id="feedback" name="feedback" maxlength="240" placeholder="Type Here"></textarea>
            <p><a href="#" class="btn btn-big submit-button" id="submitForm">SUBMIT</a></p>
        </div>
        <div class="row page-background text-center" style="display:none;" id="prompt-thank-you">
            <h1>Thank you for taking<br />the time to help us<br /> improve. </h1>
            <img src="{{ logo }}" width="300px;">
        </div>
        {% else %}
        <div class="row page-background text-center">
            <div class="col-md-12">
                <h1>You have already left feedback.<br /> Thank you for taking the time to help us improve.</h1>
            </div>
        </div>
        {% endif %}
    </div>
{% endblock %}
{% block javascripts %}
    <script type="text/javascript">

        $.post('{{ member_url }}api/preview/client-interaction/new', {
            sales_lead_id: {{ sales_lead.id }},
            type           : 'preview_review_customer_view'
        }, function (resp) {
            console.log(resp);
        }).error(function (e) {
            console.log(e);
        });

        $('body').on('click', '#great', function () {
            performanceClick();
            $.post('{{ member_url }}api/preview/client-interaction/new', {
                sales_lead_id: {{ sales_lead.id }},
                type           : 'preview_review_great_selected'
            }, function (resp) {
                console.log(resp);
            }).error(function (e) {
                console.log(e);
            });
        });

        function feedbackForm() {
            $('#prompt-one').hide();
            $('#prompt-average-poor').show();
        }

        $('body').on('click', '#average', function () {
            feedbackForm();
            $.post('{{ member_url }}api/preview/client-interaction/new', {
                sales_lead_id: {{ sales_lead.id }},
                type           : 'preview_review_average_selected'
            }, function (resp) {
                console.log(resp);
            }).error(function (e) {
                console.log(e);
            });
        });
        $('body').on('click', '#poor', function () {
            feedbackForm();
            $.post('{{ member_url }}api/preview/client-interaction/new', {
                sales_lead_id: {{ sales_lead.id }},
                type           : 'preview_review_poor_selected'
            }, function (resp) {
                console.log(resp);
            }).error(function (e) {
                console.log(e);
            });
        });

        $('body').on('click', '#fb', function () {
            feedbackForm();
            $.post('{{ member_url }}api/preview/client-interaction/new', {
                sales_lead_id: {{ sales_lead.id }},
                type           : 'preview_review_facebook_review_selected'
            }, function (resp) {
                console.log(resp);
            }).error(function (e) {
                console.log(e);
            });
        });

        $('body').on('click', '#google', function () {
            feedbackForm();
            $.post('{{ member_url }}api/preview/client-interaction/new', {
                sales_lead_id: {{ sales_lead.id }},
                type           : 'preview_review_google_review_selected'
            }, function (resp) {
                console.log(resp);
            }).error(function (e) {
                console.log(e);
            });
        });

        function submitClick() {
            $('#prompt-great').hide();
            $('#prompt-average-poor').hide();
            $('#prompt-thank-you').show();
        }

        $('body').on('click', '#submitForm', function () {
            submitClick();
            var text = 'PRECHECK REVIEW NOTE: ' + $('textarea#feedback').val();
            $.post('{{ member_url }}api/preview/client-interaction/new', {
                sales_lead_id: {{ sales_lead.id }},
                type           : text
            }, function (resp) {
                console.log(resp);
            }).error(function (e) {
                console.log(e);
            });
        });

        $('body').on('click', '.review-platform-button', function () {
            submitClick();
        });

    </script>
{% endblock %}