@extends('layouts.app')
@section('title', 'Custom Popup | Website')
@section('extrastyles')
    <link rel="stylesheet" href="{{ asset('/plugins/dataTables/datatables.min.css') }}" >
@endsection

@section('content')
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title2">
                    <h5>Manage Popup</h5>
                    <div class="pull-right">
                        <a class="btn btn-primary" href="{{website_url('custom-popup/add')}}">Add Popup</a>
                    </div>
                </div>
                <div class="ibox-content p-md">
                    @include('flash::message')
                    <div class="clearfix"></div>
                    <div class="panel-body">
                        <div class="table-responsive">
                            <table style="width: 100%;" class="table table-striped table-bordered table-hover"  id="user_listing">
                                <thead>
                                <tr>
                                    <th>Title</th>
                                    <th>Trigger URL</th>
                                    <th>Date</th>
                                </tr>
                                </thead>
                            </table>
                            <tbody></tbody>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('footer')
    <script src="{{ asset('/plugins/dataTables/datatables.min.js') }}"></script>
    <script src="{{ asset('/plugins/dataTables/dataTables.bootstrap4.min.js') }}"></script>
    <script>
        $(document).ready(function() {
            $('#user_listing').DataTable({
                responsive: true,
                processing: true,
                serverSide: true,
                dom: 'lftip',
                language: {
                    lengthMenu: " _MENU_ ",
                    searchPlaceholder: "Search...",
                    search: '', /* removed search label */
                },
                columnDefs: [{
                    className: 'details-control',
                    orderable: false,
                    targets:   0
                }],
                ajax : {
                    url: "{{ website_url('custom-popup/records') }}",
                },
                drawCallback : function(settings) {
                    $(".copy_btn_click").popover({
                        trigger: "click",
                        placement: 'top',
                        content: function content() {
                            return 'Copied';
                        }
                    }).click(function (e) {
                        setTimeout(function () {
                            $('.copy_btn_click').popover('hide');
                        }, 2000);
                    });
                },
            });
        });

        $(document).on('click', '.copy_btn_click', function () {
            var $tempInput =  $("<textarea>");
            $("body").append($tempInput);
            const value = $(this).closest('.input-group').find('.custom_popup_url').val();
            $tempInput.val(value).select();
            document.execCommand("copy");
            $tempInput.remove();
        });


        function duplicatePopup(popupId) {
            if(confirm('Are you sure you want to duplicate it?')) {
                $.ajax({
                    method: 'POST',
                    url: '{{ website_url('custom-popup/duplicate')}}',
                    data: 'popup_id='+popupId+'&_token='+csrf_token,
                }).done(function() {
                    location.reload();
                });
            }
        }

        function isEnablePopup(popupId){
            $.ajax({
                method: 'POST',
                url: '{{ website_url('custom-popup/is-enable')}}',
                data: 'popup_id='+popupId+'&_token='+csrf_token,
            }).done(function(data) {
                location.reload();
            });
        }

        function deletePopup(popupId) {
            if(confirm('Are you sure you want to delete it?')) {
                $.ajax({
                    method: 'POST',
                    url: '{{ website_url('custom-popup/delete')}}',
                    data: 'popupId='+popupId+'&_token='+csrf_token,
                }).done(function() {
                    location.reload();
                });
            }
        }
    </script>
@endsection