@extends('admin/layouts/default')

{{-- Page title --}}
@section('title')
    Active Images
    @parent
@stop

{{-- page level styles --}}
@section('header_styles')
    <link href="{{ asset('assets/vendors/jasny-bootstrap/css/jasny-bootstrap.css') }}"  rel="stylesheet" type="text/css" />
    <link href="{{ asset('assets/vendors/iCheck/css/all.css') }}"  rel="stylesheet" type="text/css" />
    <style type="text/css">
        .table-responsive{
            -ms-overflow-style: none;
            scrollbar-width: none;
        }
        .table-responsive::-webkit-scrollbar{
            display: none;
        }
        .dataTables_paginate, .dataTables_filter{
            text-align: right;
        }
        .pagination{
            margin: 0;
        }
    </style>
@stop
@section('content')
    <section class="content-header">
        <h1>Images</h1>
        <ol class="breadcrumb">
            <li>
                <a href="{{ route('admin.dashboard') }}">
                    <i class="livicon" data-name="home" data-size="14" data-color="#000"></i>
                    Dashboard
                </a>
            </li>
            <li><a href="#"> Images</a></li>
            <li class="active">Images</li>
        </ol>
    </section>
    <section class="content">
        <div class="row">
            <div class="col-md-12">
                <div class="panel panel-primary">
                    <div class="panel-heading">
                        <h3 class="panel-title">
                            <i class="livicon" data-name="user-add" data-size="18" data-c="#fff" data-hc="#fff" data-loop="true"></i>
                            Images
                        </h3>
                                <span class="pull-right clickable">
                                    <i class="glyphicon glyphicon-chevron-up"></i>
                                </span>
                    </div>
                    <div class="panel-body">
    <div class="mB-20">

        <div class="dropdown">
            <a href="{{ route(ADMIN . '.images.create') }}" class="btn btn-info">
                {{ trans('app.add_button') }}
            </a>
            <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
              Multiple Action
            </button>

            <div class="dropdown-menu" style="text-align: center">
              <a class="dropdown-item" href="#" data-toggle="modal" data-target="#editModalKeyword">  Add Keywords</a><br>
              <a class="dropdown-item" href="#" data-toggle="modal" data-target="#editModalSeries">  Add Series</a><br>
              <a class="dropdown-item" href="#" data-toggle="modal" data-target="#editModalCategory">  Add Category</a><br>
              <a class="dropdown-item" href="#" data-toggle="modal" data-target="#editModalLicence">  Change Licence Type</a><br>
            <!--  <a class="dropdown-item" href="#" data-toggle="modal" data-target="#editModalPeople">Change People Option Type</a>-->
              <a class="dropdown-item" href="#" id="activate_row">  Activate Selected </a><br>
              <a class="dropdown-item" href="#" id="deactivate_row">  De-Activate Selected </a>
              <!--<a class="dropdown-item" href="#" id="delete_row">Delete  Selected </a>-->
            </div>
          </div>
    </div>

  
    <div class="bgc-white bd bdrs-3 p-20 mB-20">
        <div class="">
            <div class="table-responsive">
                <table class="table table-bordered " id="table">  <thead>
                    <tr>
                        <th><input type="checkbox" class="select_all"></th>
                        <th>#</th>
                        <th>Image Id</th>
                        <th>Series</th>
                        <th>Image Title</th>
                        <th>Copyright</th>
                        <th>Image</th>
                        <th>Categories</th>
                        <th>License Type  </th>
                        <th>Status</th>
                        <th>Keywords</th>
                        {{-- <th>Orientation</th>
                        <th>People</th> --}}
                        <th>Actions(Edit/delete)</th>
                                    </tr>
                </thead>

                <tfoot>
                    <tr>
                        <th><input type="checkbox" class="select_all large_check"></th>
                        <th>#</th>
                        <th>Image Id</th>
                        <th>Series</th>
                        <th>Image Title</th>
                        <th>Copyright</th>
                        <th>Image</th>
                        <th>Price(S,M,L)</th>
                        <th>License Type  </th>
                        <th>Status</th>
                        <th>Keywords</th>
                        {{-- <th>Orientation</th>
                        <th>People</th> --}}
                        <th>Actions(Edit/delete)</th>

                    </tr>
                </tfoot>

                <tbody>
                    @foreach ($items as $key => $item)
                        <tr>
                            <td><label for="checkbox"><input id="check_id" class="images large_check row-select" type="checkbox" value="{{$item->image_id}}" name="checkbox[]"></label></td>
                            <td><label for="checkbox">{{++$key}}</label></td>
                            <td>{{ $item->image_name_id }}</td>
                            <td>{{ $item->Series }} <span class="text-danger">@if($item->Series == "")Series Missing @endif</span></td>
                            <td><a href="{{ route(ADMIN . '.images.edit', $item->image_id) }}">{{ $item->image_title }}</a><span class="text-danger">@if($item->image_title == "")Title Missing @endif</span></td>
                            <td>{{ $item->copyright }} <span class="text-danger">@if($item->copyright == "")Copyright Missing @endif</span></td>
                            <td><img class="zoom" width="100px" class="" src="{{ $item->thumbnail }}" alt=""></td>
                          <!--  <td></td>-->
                            <td>                                 @foreach($selected_category as $cat)
                                @foreach($universal->categories as $category)
                                    @if($category->category_id == $cat)
                                    {{ $category->category_name }}
                                        @endif
                                        @endforeach
                                    @endforeach<span class="text-danger">@if($item->category == "")Category Missing @endif</span></td>
                            <td>{{Arr::get(config('variables.License'),$item->license_type)}}</td>
                            <td> <a href="{{route(ADMIN . '.images.status',[$item->image_id,$item->status])}}"
                                class="btn btn-{{config('variables.color')[$item->status]}} btn-sm"> {{config('variables.publish')[$item->status]}}  </a></td>
                            <td style="max-width:400px;word-wrap: break-word"><span data-placement="top" title="{{$item->keyword}}">{{Str::substr($item->keyword,0) }} </span><span class="text-danger">@if($item->keyword == "")Keyword Missing @endif</span></td>


                            {{-- <td>{{Arr::get(config('variables.Orientation'),$item->orientation)}}</td> --}}

                            <td>
                                    <ul class="list-inline">
                                        <li class="list-inline-item">
                                            <a href="{{ route(ADMIN . '.images.edit', $item->image_id) }}" title="{{ trans('app.edit_title') }}" class="btn btn-primary btn-sm"><span class="fa fa-pencil"></span></a></li>
                                        <li class="list-inline-item">
                                            {!! Form::open([
                                                'class'=>'delete',
                                                'url'  => route(ADMIN . '.images.destroy', $item->image_id),
                                                'method' => 'DELETE',
                                                ])
                                            !!}

                                                <button class="btn btn-danger btn-sm" title="{{ trans('app.delete_title') }}"><i class="fa fa-trash"></i></button>

                                            {!! Form::close() !!}

                                            {!! Form::open(['url' => action('Admin\ImageController@deactivate'), 'method' => 'post', 'id' => 'mass_deactivate_form' ]) !!}
                                            {!! Form::hidden('selected_products', null, ['id' => 'selected_products']) !!}
                                            {!! Form::close() !!}

                                            {!! Form::open(['url' => action('Admin\ImageController@activate'), 'method' => 'post', 'id' => 'mass_activate_form' ]) !!}
                                            {!! Form::hidden('selected_products', null, ['id' => 'selected_products']) !!}
                                            {!! Form::close() !!}
                                        </li>
                                    </ul>
                            </td>
                        </tr>
                    @endforeach
                </tbody>

            </table>
                </div>
        </div>
    </div>
    {{-- <-- Edit Modal --> --}}
    <div class="modal fade" id="editModalKeyword" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <div class="panel panel-primary">
                        <div class="panel-heading">
                    <h5 class="modal-title panel-title" id="exampleModalLabel">Update Keywords</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div></div>

                    <div class="panel-body">
                <div class="modal-body">
                    {!! Form::open(['url' => action('Admin\ImageController@ChangeKeywords'), 'method' => 'post', 'id' => 'mass_update_keywords' ]) !!}
                    {!! Form::hidden('selected_keywords', null, ['id' => 'selected_keywords']) !!}

                    <div class="form-group">
                        {!! Form::myTextArea('keyword', 'Meta Keyword', [], null, 6) !!}
                    </div>

                    <div class="modal-footer">
                        {!! Form::submit(__('Update'), array('class' => 'btn btn-primary', 'id' => 'keywordup')) !!}
                    </div>
                    {!! Form::close() !!}
                </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    {{-- <-- Edit Modal --> --}}
    <div class="modal fade" id="editModalSeries" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <div class="panel panel-primary">
                        <div class="panel-heading">
                            <h5 class="modal-title panel-title" id="exampleModalLabel">Update Series</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div></div>
                    <div class="panel-body">
                <div class="modal-body">
                    {!! Form::open(['url' => action('Admin\ImageController@Series'), 'method' => 'post', 'id' => 'mass_update_series' ]) !!}
                    {!! Form::hidden('selected_series', null, ['id' => 'selected_series']) !!}

                    <div class="form-group">
                        {!! Form::myInput('text', 'series', 'Series', [], null, 6) !!}
                    </div>

                    <div class="modal-footer">
                        {!! Form::submit(__('Update'), array('class' => 'btn btn-primary', 'id' => 'seriesup')) !!}
                    </div>
                    {!! Form::close() !!}
                </div></div>
                </div>
            </div>
        </div>
    </div>
    {{-- <-- Edit Modal --> --}}
    <div class="modal fade" id="editModalCategory" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <div class="panel panel-primary">
                        <div class="panel-heading">
                            <h5 class="modal-title panel-title" id="exampleModalLabel">Add Category</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                        </div></div>
                    <div class="panel-body">
                <div class="modal-body">
                    {!! Form::open(['url' => action('Admin\ImageController@Category'), 'method' => 'post', 'id' => 'mass_update_category' ]) !!}
                    {!! Form::hidden('selected_category', null, ['id' => 'selected_category']) !!}

                    <div class="col-sm-6">
                        {!! Form::mySelect('category[]', 'Category', Arr::pluck($categories, 'category_name','category_id'), null, ['class' => 'form-control select2', 'multiple' => 'multiple']) !!}
                    </div>


                    <div class="modal-footer">
                        {!! Form::submit(__('Add'), array('class' => 'btn btn-primary', 'id' => 'categoryup')) !!}
                    </div>
                    {!! Form::close() !!}
                </div></div>
                </div>
            </div>
        </div>
    </div>

    {{-- <-- Edit Modal --> --}}
    <div class="modal fade" id="editModalLicence" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">

                    <div class="panel panel-primary">
                        <div class="panel-heading">
                            <h5 class="modal-title panel-title" id="exampleModalLabel">Update Licence</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div></div>
                    <div class="panel-body">
                <div class="modal-body">
                    {!! Form::open(['url' => action('Admin\ImageController@Licence'), 'method' => 'post', 'id' => 'mass_update_licence' ]) !!}
                    {!! Form::hidden('selected_products', null, ['id' => 'selected_products']) !!}

                    <div class="col-sm-6">
                        {!! Form::mySelect('license_type','License type', config('variables.License'), null, ['class' => 'form-control select2','id' => 'license_type' ]) !!}
                    </div>


                    <div class="modal-footer">
                        {!! Form::submit(__('Update'), array('class' => 'btn btn-primary', 'id' => 'licenceup')) !!}
                    </div>
                    {!! Form::close() !!}
                </div></div>
                </div>
            </div>
        </div>
    </div>
    {{-- <-- Edit Modal --> --}}
    <div class="modal fade" id="editModalPeople" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Update People Option</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::open(['url' => action('Admin\ImageController@PeopleOption'), 'method' => 'post', 'id' => 'mass_update_people' ]) !!}
                    {!! Form::hidden('selected_products', null, ['id' => 'selected_products']) !!}

                    <div class="form-group">
                            {!! Form::mySelect('people','People type', config('variables.People'), null, ['class' => 'form-control select2']) !!}
                        </div>

                    <div class="modal-footer">
                        {!! Form::submit(__('Update'), array('class' => 'btn btn-primary', 'id' => 'peopleup')) !!}
                    </div>
                    {!! Form::close() !!}
                </div>

            </div>
        </div>
    </div>
                    </div>
                </div>
            </div>
        </div>
        <!--row end-->
    </section>
@stop

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<script>

$(document).ready(function(){
$('.select_all').on('click',function() {

    $('.images').prop('checked',$(this).prop('checked'));
})

$(document).on('click', '#edit-selected', function(e){
    e.preventDefault();
    var selected_rows = getSelectedRows();

    if(selected_rows.length > 0){
        $('input#selected_products_for_edit').val(selected_rows);
        $('form#bulk_edit_form').submit();
    } else{
        $('input#selected_products').val('');
        swal('@lang("lang_v1.no_row_selected")');
    }
});

function getSelectedRows() {
    var selected_rows = [];
    var i = 0;
    $('.row-select:checked').each(function () {
        selected_rows[i++] = $(this).val();
    })
    return selected_rows;
}

$(document).on('click', '#deactivate_row', function(e){
    e.preventDefault();
    var selected_rows = getSelectedRows();

    if(selected_rows.length > 0){
       $('input#selected_products').val(selected_rows);
        var form = $('form#mass_deactivate_form')

        var data = form.serialize();
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
        $.ajax({
            method: form.attr('method'),
            url: form.attr('action'),
            dataType: 'json',
            data: data,
            success: function(result) {
                if (result.success == true) {
                    toastr.success(result.msg);
                    form
                            .find('#selected_products')
                            .val('');
                    $('input#row-select').val('');
                    location.reload(true);
                } else {
                    toastr.error(result.msg);
                }
            },
        });
    } else{
      $('input#selected_products').val('');
}
});
    $(document).on('click', '#activate_row', function(e){
        e.preventDefault();
        var selected_rows = getSelectedRows();

        if(selected_rows.length > 0){
            $('input#selected_products').val(selected_rows);
            var form = $('form#mass_activate_form')

            var data = form.serialize();
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
            $.ajax({
                method: form.attr('method'),
                url: form.attr('action'),
                dataType: 'json',
                data: data,
                success: function(result) {
                    if (result.success == true) {
                        location.reload(true);
                        form
                                .find('#selected_products')
                                .val('');
                        $('input#row-select').val('');
                    } else {
                        toastr.error(result.msg);
                    }
                },
            });
        } else{
            $('input#selected_products').val('');
        }
    });

    $(document).on('submit', 'form#mass_update_keywords', function(e){
        e.preventDefault();
        $(this)
                .find('button[type="submit"]')
                .attr('disabled', true);
        var selected_rows = getSelectedRows();
        if(selected_rows.length > 0){
            $('input#selected_keywords').val(selected_rows);
            var form = $('form#mass_update_keywords')

           var data = form.serialize();
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
            $.ajax({
                method: form.attr('method'),
                url: form.attr('action'),
                dataType: 'json',
                data: data,
                success: function(result) {
                    if (result.success == true) {
                        $('form#mass_update_keywords')
                                .find('button[type="submit"]')
                                .attr('disabled', false);
                        form
                                .find('#selected_keywords')
                                .val('');
                        $('input#row-select').val('');
                    } else {
                        toastr.error(result.msg);
                    }
                },
            });
        } else{
            $('input#selected_keywords').val('');
        }
    });

    $(document).on('submit', 'form#mass_update_series', function(e){
        e.preventDefault();
        $(this)
                .find('button[type="submit"]')
                .attr('disabled', true);
        var selected_rows = getSelectedRows();

        if(selected_rows.length > 0){
            $('input#selected_series').val(selected_rows);
            var form = $('form#mass_update_series')

            var data = form.serialize();
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
            $.ajax({
                method: form.attr('method'),
                url: form.attr('action'),
                dataType: 'json',
                data: data,
                success: function(result) {
                    if (result.success == true) {
                        toastr.success(result.msg);
                        form
                                .find('#selected_series')
                                .val('');
                        $('input#row-select').val('');
                    } else {
                        toastr.error(result.msg);
                    }
                },
            });
        } else{
            $('input#selected_series').val('');
        }
    });
    $(document).on('submit', 'form#mass_update_category', function(e){
        e.preventDefault();
        $(this)
                .find('button[type="submit"]')
                .attr('disabled', true);
        var selected_rows = getSelectedRows();

        if(selected_rows.length > 0){
            $('input#selected_category').val(selected_rows);
            var form = $('form#mass_update_category')

            var data = form.serialize();
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
            $.ajax({
                method: form.attr('method'),
                url: form.attr('action'),
                dataType: 'json',
                data: data,
                success: function(result) {
                    if (result.success == true) {
                        toastr.success(result.msg);
                        form
                                .find('#selected_category')
                                .val('');
                        $('input#row-select').val('');
                    } else {
                        toastr.error(result.msg);
                    }
                },
            });
        } else{
            $('input#selected_category').val('');
        }
    });

    $(document).on('submit', 'form#mass_update_licence', function(e){
        e.preventDefault();
        $(this)
                .find('button[type="submit"]')
                .attr('disabled', true);
      //  var data = $(this).serialize();
        var selected_rows = getSelectedRows();


        if(selected_rows.length > 0){
            $('input#selected_products').val(selected_rows);
            var form = $('form#mass_update_licence')

            var data = form.serialize();
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
            $.ajax({
                method: form.attr('method'),
                url: form.attr('action'),
                dataType: 'json',
                data: data,
                success: function(result) {
                    if (result.success == true) {
                        toastr.success(result.msg);
                        form
                                .find('#selected_products')
                                .val('');
                        $('input#row-select').val('');
                    } else {
                        toastr.error(result.msg);
                    }
                },
            });
        } else{
            $('input#selected_products').val('');
        }
    });

    $(document).on('submit', '#peopleup', function(e){
        e.preventDefault();
        $(this)
                .find('button[type="submit"]')
                .attr('disabled', true);
        //var data = $(this).serialize();
        var selected_rows = getSelectedRows();


        if(selected_rows.length > 0){
            $('input#selected_products').val(selected_rows);
            var form = $('form#mass_update_people')

            var data = form.serialize();
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
            $.ajax({
                method: form.attr('method'),
                url: form.attr('action'),
                dataType: 'json',
                data: data,
                success: function(result) {
                    if (result.success == true) {
                        toastr.success(result.msg);
                        form
                                .find('#selected_products')
                                .val('');
                    } else {
                        toastr.error(result.msg);
                    }
                },
            });
        } else{
            $('input#selected_products').val('');
        }
    });

    $(document).on('change', 'checkbox.row-select', function() {
    if (this.checked) {
        $(this)
                .closest('tr')
                .addClass('selected');
    } else {
        $(this)
                .closest('tr')
                .removeClass('selected');
    }
});
    $(document).ajaxStop(function(){
        window.location.reload();
    });
});
/*$(function(){

    $("#editModalKeywords").on("click", function(){
            //alert("success");
            $('#id').val($(this).data('id'));
            $('#keyword').val($(this).data('keyword'));
            $("#editModalKeyword").modal("show");
        return false;
    });
})*/
/*$(function(){
    //listen for checkbox clicked, works for check and uncheck
    $("#checkbox").click(function(){
        //get if checked, which returns a boolean value
        var formElementVisible = $(this).is(":checked");

        //show if checked
        if ( formElementVisible ){
            $(".elementToShowOrHide").show( );
            return true;
        }

        //hide if unchecked
        $(".elementToShowOrHide").hide( );

    });

});*/
</script>
@section('footer_scripts')
     <script type="text/javascript" src="{{URL('assets/vendors/datatables/js/jquery.dataTables.js')}}" ></script>
    <script type="text/javascript" src="{{URL('assets/vendors/jeditable/js/jquery.jeditable.js')}}" ></script>
    <script type="text/javascript" src="{{URL('assets/vendors/datatables/js/dataTables.bootstrap.js')}}" ></script>
    <script type="text/javascript" src="{{URL('assets/vendors/datatables/js/dataTables.buttons.js')}}" ></script>
    <script type="text/javascript" src="{{URL('assets/vendors/datatables/js/dataTables.colReorder.js')}}" ></script>
    <script type="text/javascript" src="{{URL('assets/vendors/datatables/js/dataTables.responsive.js')}}" ></script>
    <script type="text/javascript" src="{{URL('assets/vendors/datatables/js/dataTables.rowReorder.js')}}" ></script>
    <script type="text/javascript" src="{{URL('assets/vendors/datatables/js/buttons.colVis.js')}}" ></script>
    <script type="text/javascript" src="{{URL('assets/vendors/datatables/js/buttons.html5.js')}}" ></script>
    <script type="text/javascript" src="{{URL('assets/vendors/datatables/js/buttons.print.js')}}" ></script>
    <script type="text/javascript" src="{{URL('assets/vendors/datatables/js/buttons.bootstrap.js')}}" ></script>
    <script type="text/javascript" src="{{URL('assets/vendors/datatables/js/buttons.print.js')}}" ></script>
    <script type="text/javascript" src="{{URL('assets/vendors/datatables/js/pdfmake.js')}}" ></script>
    <script type="text/javascript" src="{{URL('assets/vendors/datatables/js/vfs_fonts.js')}}" ></script>
    <script type="text/javascript" src="{{URL('assets/vendors/datatables/js/dataTables.scroller.js')}}" ></script>
    <script type="text/javascript">
        $('#table').DataTable();
    </script>
@endsection