@extends('backend.amainlayout')
@section('title', 'RERF-Admin')
@section('maincontrol')
@if (session()->has('user'))
    <div class="content-body">

        <div class="container-fluid">
            <div class="row">
                <div class="col-12">
                    <div class="card">
                        <!--Card Header-->
                        <div class="card-header text-center">
                            <button type="button" class="btn btn-primary btn-lg " data-toggle="modal" data-target="#addNoticeModal" title="Edit" data-placement="top">Add Scrolling Text</button>
                            @if (Session::has('msg'))
                                <p class="text-danger text-center pt-5">{{ session('msg') }}</p>
                            @endif
                            @if (count($errors) > 0)
                            <div class="row justify-content-md-center pt-2">
                                <div class="alert alert-danger text-center">
                                    <strong>Whoops!</strong> There were some problems with your input file.<br>
                                    <ul>
                                    @foreach ($errors->all() as $error)
                                        <li>{{ $error }}</li>
                                    @endforeach
                                    </ul>
                                </div>
                            </div>    
                            @endif
                        </div>
                        <!--ADD-->
                        <div class="modal fade bd-example-modal-lg" id="addNoticeModal" tabindex="-1" role="dialog"
                            aria-labelledby="exampleModalLabel" aria-hidden="true">
                            <div class="modal-dialog modal-lg" role="document">
                                <div class="modal-content">
                                    <div class="modal-header">
                                        <h5 class="modal-title" id="exampleModalLabel">Add Scrolling Text</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 action="/addScrollText" method="POST" enctype="multipart/form-data">
                                            @csrf
                                            <div class="form-group mt-0 department_tag_desc">
                                              
                                            </div>
                                            <div class="form-row">                                                  
                                               
                                                <div class="form-group col-md-12">
                                                    <label for="inputState">Scrolling Section</label>
                                                    <select id="ajaxinstitution" class="form-control input-xs"
                                                        name="section" required>    
                                                        <option value="" selected>--Select--</option>
                                                        <option value="Home" >Home</option>
                                                        <option value="Grievances" >Grievances</option>
                                                        <option value="Other" >Other</option>
                                                        <option value="Placement" >Placement</option>
                                                        
                                                    </select>
                                                </div>
                                                <div class="form-group col-md-12">
                                                    <label for="inputState">Scrolling Text</label>
                                                    <textarea class="summernote " name="scrolling_text" required></textarea>
                                                </div>
                                            </div>                                            
                                           
                                            <div class="form-group">
                                                <div class="form-check">
                                                    <input class="form-check-input" type="checkbox" id="gridCheck"
                                                        required>
                                                    <label class="form-check-label" for="gridCheck">
                                                        Check me out
                                                    </label>
                                                </div>
                                            </div>
                                            <div class="row justify-content-md-center">
                                                <button type="submit" class="btn btn-primary">Add Scrolling Text</button>
                                            </div>
                                        </form>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script>
                        <script type="text/javascript">
                            $(document).ready(function() {
                                $('.summernote').summernote({
                                    height: 100
                                });
                                $('#ajaxinstitution').change(function() {
                                    var id = $(this).val();
                                    //alert(id);
                                    $('#ajaxcourse').find('option').not(':first').remove();
                                    $("#ajaxcourse").append("<option value=all>All</option>");
                                    $.ajax({
                                        url: 'getCourse/' + id,
                                        type: 'get',
                                        dataType: 'json',
                                        success: function(response) {
                                            var len = 0;
                                            if (response.data != null) {
                                                len = response.data.length;
                                            }
                                            if (len > 0) {
                                                for (var i = 0; i < len; i++) {
                                                    var id = response.data[i].id;
                                                    var name = response.data[i].name;
                                                    var option = "<option value='" + id + "'>" + name + "</option>";
                                                    $("#ajaxcourse").append(option);
                                                }
                                            }
                                        }
                                    });
                                });
                            });
                            $(document).ready(function() {
                                $("#addfile").click(function() {
                                    $("#noticefile").attr("style", "display:block");
                                    $("#addfile").attr("style", "display:none");
                                    $("#addfile").attr("value", "Yes");
                                    $("#file_title").attr("required", "true");
                                    $("#files").attr("required", "true");

                                });
                            });
                            $(document).ready(function() {

                                $('#ajaxcourse').change(function() {
                                    var id = $(this).val();
                                    //alert(id);
                                    $('#ajaxdepartment').find('option').not(':first').remove();
                                    $("#ajaxdepartment").append("<option value=all>All</option>");
                                    $.ajax({
                                        url: 'getDepartment/' + id,
                                        type: 'get',
                                        dataType: 'json',
                                        success: function(response) {
                                            var len = 0;
                                            if (response.data != null) {
                                                len = response.data.length;
                                            }
                                            if (len > 0) {
                                                for (var i = 0; i < len; i++) {
                                                    var id = response.data[i].id;
                                                    var name = response.data[i].name;
                                                    var option = "<option value='" + id + "'>" + name + "</option>";
                                                    $("#ajaxdepartment").append(option);
                                                }
                                            }
                                        }
                                    });
                                });

                            });
                            $(document).ready(function () {
                                  $('#dataTable').DataTable({
                                    order: [[0, 'desc']],
                                  });
                              });
                        </script>
                        <!--Card Header-->
                        <div class="card-body pt-0">
                            <!-- End Row -->
                            <div class="table-responsive">
                                <table class="table  table-bordered zero-configuration" id="dataTable" width="100%" cellspacing="0">
                                    <thead>
                                        <tr>
                                            <th>Scrolling Text</th>                                                                                          
                                            <th>Active</th>
                                            <th>Section</th>
                                            <th>Delete</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                    @foreach ($scrollingTexts as $item)
                                        <tr>
                                            <td>{!!strip_tags($item['scrolling_text'],'<b><i><a>')!!}</td>
                                            <td>{{$item['active']}}</td>
                                            <td>{{$item['section']}}</td>
                                            <td> <a href="/deleteScrollText/{{ Crypt::encryptString($item['id']) }}" type="button" class="btn btn-secondary btn-sm mr-1" title="Delete" data-placement="top"  onclick="return confirm('Are you sure you want to delete this item?');">
                                                <i class="icon-trash"> Del</i>
                                            </a></td>
                                        </tr>
                                    @endforeach
                                    </tbody>
                                </table>
                          </div>
                            <!-- End Row -->
                        </div>
                    </div>
                </div>
            </div>

        </div>

@endif
@endsection