@extends ('layouts.default')
@section ('content')
    @include('xero.partials._header')

    <div class="row">
        @if (Session::has('error'))
            <div class="alert alert-warning m-b-20">
                {{{ Session::get('error') }}}
            </div>
        @endif
    </div>

    <div class="row">
        <div class="text-center turnover m-t-20">
            {{ $organisation->org_name }}
        </div>
        <input type="hidden" id="location_id" value="{{ $organisation->id }}" />
    </div>

    <div class="text-center m-t-15" style="color:white;">Required by all branches</div>
    <div class="row m-t-5 padding-20">
        <form>
            @foreach($allquestions as $allq)
                <div class="col-xs-12 m-b-5">
                    <a class="menu-buttons">
                        <div class="btn btn-primary text-left full-width padding-10 uppercase-text smallest-text">
                            {{ $allq->question }}
                            @if (isset($allq->answer))
                                <i class="fa fa-2x fa-check pull-right m-r-5 tooler" title="You answered this question" aria-hidden="true"></i>
                            @else
                                <i class="fa fa-2x fa-exclamation-triangle pull-right m-r-5 tooler" title="You still need to answer this question" aria-hidden="true"></i>
                            @endif
                        </div>
                        <div class="btn text-left full-width padding-10 uppercase-text smallest-text">
                            {{ (isset($allq->answer)) ? $allq->answer : '' }}
                        </div>
                    </a>
                </div>
            @endforeach
        </form>
    </div>

    <div class="text-center m-t-15" style="color:white;">Customer added info</div>
    <div class="row m-t-15 padding-20">
        <form>
            @foreach($userquestions as $question)
                <div class="col-xs-12 m-b-5">
                    <a class="menu-buttons">
                        <div class="btn btn-info text-left full-width padding-10 uppercase-text smallest-text">
                            {{ $question->question }}
                            @if (isset($question->answer))
                                <i class="fa fa-2x fa-check pull-right m-r-5 tooler" title="You answered this question" aria-hidden="true"></i>
                            @else
                                <i class="fa fa-2x fa-exclamation-triangle pull-right m-r-5 tooler" title="You still need to answer this question" aria-hidden="true"></i>
                            @endif
                        </div>
                        <div class="btn text-left full-width padding-10 uppercase-text smallest-text">
                            {{ (isset($question->answer)) ? $question->answer : ' ' }}
                        </div>
                    </a>
                </div>
            @endforeach
        </form>
    </div>

    <div class="row m-t-40 m-b-30">
        <div class="col-xs-12">
            <a href="/questions/branch/{{ $organisation->id }}">
                <div class="btn btn-figero half-width padding-20 uppercase-text">
                    <i class="fa fa-info-circle m-r-5" aria-hidden="true"></i>
                    Update / Change Location Info
                </div>
            </a>
        </div>
    </div>

    @include('xero.partials._footer')

    <div id="newinfo" class="modal" tabindex="-1" role="dialog">

    </div>

    <div id="newquestionmodal" class="modal" tabindex="-1" role="dialog">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">Add New Info</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>

                <div class="modal-body">
                    <form id="new_question_form">
                        <input type="hidden" id="model_id" />
                        <div class="form-group">
                            <label for="model_question">What is your info heading ?</label>
                            <input type="text" class="form-control" id="model_question" aria-describedby="emailHelp" placeholder="Enter info heading">
                            <small id="help" class="form-text text-muted">Please enter the heading for the info you want to add.</small>
                        </div>
                        <div class="form-group">
                            <label for="model_answer">What is your info content ?</label>
                            <textarea class="form-control" rows="5" id="model_answer" aria-describedby="answerhelp" placeholder="Enter info content"></textarea>
                            <small id="answerhelp" class="form-text text-muted">Please enter the content.</small>
                        </div>
                        <div class="form-check">
                            <input id="model_others" class="form-check-input" type="checkbox" value="" />
                            <label class="form-check-label" for="defaultCheck1">
                                Add this to all my other branches
                            </label>
                        </div>
                    </form>
                </div>

                <div class="modal-footer">
                    <button type="button" onclick="saveUserQuestion();" class="btn btn-primary">Save changes</button>
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                </div>
            </div>
        </div>
    </div>

    <script>
        function saveNormal(i){
            var qid = i;
            var answer = $("#question_" + i).val();

            var q = {};
            q.id = qid;
            q.answer = answer;
            q.location_id = $('#location_id').val();

            $.ajax({
                contentType: 'application/json',
                data: JSON.stringify(q),
                dataType: 'json',
                success: function(data){
                    console.log(data);
                },
                error: function(){
                    console.log("fail");
                },
                processData: false,
                type: 'POST',
                url: '/questions/saveanswer',
            });
        }

        function saveUser(i){
            var qid = i;
            var answer = $("#question_" + i).val();

            var q = {};
            q.id = qid;
            q.answer = answer;
            q.location_id = $('#location_id').val();

            $.ajax({
                contentType: 'application/json',
                data: JSON.stringify(q),
                dataType: 'json',
                success: function(data){
                    console.log(data);
                },
                error: function(){
                    console.log("fail");
                },
                processData: false,
                type: 'POST',
                url: '/questions/saveuseranswer',
            });
        }

        function saveUserQuestion(){
            var question = $('#model_question').val();
            var answer = $('#model_answer').val();
            var others = $('#model_others').is(":checked");
            var type = 'text';
            var min = 0;
            var max = 0;
            var required = 1;
            var q = {};
            q.question = question;
            q.type = type;
            q.min = min;
            q.max = max;
            q.required = required;
            q.location_id = $('#location_id').val();
            q.answer = answer;
            q.others = others;

            $.ajax({
                contentType: 'application/json',
                data: JSON.stringify(q),
                dataType: 'json',
                success: function(data){
                    console.log(data);
                    location.reload();
                },
                error: function(){
                    console.log("fail");
                },
                processData: false,
                type: 'POST',
                url: '/questions/saveuserquestion',
            });
        }
    </script>
@stop