@extends('smartadmin.layout')

@section('title', 'List • Ancillaries • Sites')

@section('content')
    
    @include('pages.sites.includes.site-name-bar')
    
    @include('pages.sites.includes.assessment-shortcuts')

    <section id="widget-grid" class="">
        <div class="row">
            @include('pages.sites.includes.add-ancillary-shortcut')

            <article class="col-xs-12">
                <div id="ancillariesTableWidget" class="jarviswidget jarviswidget-color-darken" data-widget-collapsed="false" data-widget-editbutton="false" data-widget-custombutton="false" data-widget-sortable="false">
                    <header>
                        <span class="widget-icon"> <i class="fa fa-list"></i> </span>
                        <h2>Ancillaries List</h2>
                    </header>
                    <div>
                        <div class="jarviswidget-editbox"></div>
                        <div class="widget-body no-padding">
                            {!! $dataTable->table() !!}
                        </div>
                    </div>
                </div>
            </article>

            <article class="col-xs-12">
                <div id="ancillaryAssessmentWidget" class="jarviswidget jarviswidget-color-darken" data-widget-editbutton="false" data-widget-custombutton="false" data-widget-collapsed="true" data-widget-sortable="false">
                    <header>
                        <span class="widget-icon"> <i class="fa fa-file-text-o"></i> </span>
                        <h2>
                            Ancillary Assessment
                        </h2>
                    </header>
                    <div>
                        <div class="jarviswidget-editbox"></div>
                        <div class="widget-body">
                            <div id="noAssessmentSelectedText" class="text-center">
                                <h1 class="text-danger">
                                    <b>No assessment selected.</b>
                                </h1>
                            </div>

                            <div id="assessmentFormContainer"></div>
                        </div>
                    </div>
                </div>
            </article>
        </div>
    </section>
@stop

@section('pr-scripts')
    <!-- PAGE RELATED PLUGIN(S) -->
@stop

@section('scripts')
    {!! $dataTable->scripts() !!}

    <script type="text/javascript">
        $(function() {
            var ancillariesTableWidget = $('#ancillariesTableWidget');
            var ancillariesTableWidgetToggleButton = ancillariesTableWidget.find('.jarviswidget-toggle-btn');
            var ancillaryAssessmentWidget = $('#ancillaryAssessmentWidget');
            var ancillaryAssessmentWidgetToggleButton = ancillaryAssessmentWidget.find('.jarviswidget-toggle-btn');

            $('table').on('click', '.editAssessmentButton', function(event) {
                event.preventDefault();
                /* Act on the event */

                var url = $(this).attr('href');
                var name = $(this).data('name');

                $.ajax({
                    url: url,
                    type: 'GET',
                    success: function(response) {
                        $('#noAssessmentSelectedText').fadeOut(function() {
                            $('#assessmentFormContainer').html(response).fadeIn();

                            ancillariesTableWidgetToggleButton.trigger('click');

                            if (ancillaryAssessmentWidget.hasClass('jarviswidget-collapsed')) {
                                ancillaryAssessmentWidgetToggleButton.trigger('click');
                            }

                            pageSetUp();
                        });
                    }
                });
            });
        });
    </script>
@stop