@extends('app')
@section('content')
<link href="{{ asset('assets/plugins/jquery-notifications/css/messenger.css')}}" rel="stylesheet" type="text/css"
    media="screen" />
<link href="{{ asset('assets/plugins/jquery-notifications/css/messenger-theme-flat.css')}}" rel="stylesheet"
    type="text/css" media="screen" />
<link href="{{ asset('assets/plugins/bootstrap-datepicker/css/bootstrap-datepicker.min.css')}}" rel="stylesheet"
    type="text/css" media="screen" />
<link href="{{ asset('assets/plugins/boostrap-clockpicker/bootstrap-clockpicker.min.css')}}" rel="stylesheet"
    type="text/css" media="screen" />
<style type="text/css">
.clockpicker-popover {
    z-index: 2000;
}

.clockpicker-button {
    display: none;
}

.control {
    height: 45px;
}

.control h3 {
    display: inline !important;
}

.poll_custom_menu {
    padding: 2px !important;
    font-size: 21px;
}

.poll_custom_menu:hover,
.poll_custom_menu:focus {
    background-color: transparent !important;
}
</style>

@if(Session::has('flash_message'))
<div class="alert {{ (Session::has('flash_message_status'))?'alert-error':'alert-success'}}">
    <button class="close" data-dismiss="alert"></button>
    {!!Session::get('flash_message') !!}
</div>
@endif

<div class="row" id="reports-tabs">
    <div class="col-md-12">
        <ul id="tab-01" class="nav nav-tabs nav-tabs-rtl" style="background-color: transparent;">
            <li id="general_news" class="active"><a href="#privateEvents"><span class="semi-bold">التصويت</span></a>
            </li>
            <li id="requests" class=""><a href="#Requests"><span class="semi-bold">منتهي</span></a></li>
            <li id="archives" class=""><a href="#Archives"><span class="semi-bold">الارشيف</span></a></li>
        </ul>
        <div class="tab-content" style="padding: 0px !important;">

            {{--Private Events Data Table--}}
            <div id="privateEvents" class="tab-pane active">
                <div class="grid simple vertical mobile-scroll">
                    <div class="grid-body no-border">

                        <div class='row control'>
                            <div class="col-sm-3 col-xs-12">
                                <div class="pull-right markaction">
                                    {{--<a id="show" href="javascript:void(0)" class="btn btn-success" data-url="{{ URL::to('admin/reports/bulkshow') }}">Un</a>--}}
                                    @if(Auth::user()->hasPermission("poll-edit"))
                                    <a id="hide" href="javascript:void(0)" class="btn btn-warning"
                                        data-url="{{ URL::to('admin/poll/bulkhide') }}">إيقاف النشر</a>
                                        @endif
                                        @if(Auth::user()->hasPermission("poll-destroy"))
                                    <a id="del" href="javascript:void(0)" class="btn btn-danger"
                                        data-url="{{ URL::to('admin/poll/bulkdelete') }}">حذف</a>
                                        @endif
                                </div>
                            </div>
                        <div class="col-sm-6 col-xs-12 c-page-title">
                            <span>التصويت</span>
                        </div>
                        @if(Auth::user()->hasPermission("poll-create"))
                            <div class="col-sm-3 col-xs-12">
                                <a class="btn btn-primary btn-cons" href="{{ URL::to('admin/poll/createPoll') }}">إنشاء
                                    تصويت</a>
                            </div>
                            @endif
                        </div>
                        <table class="table table-bordered table-hover datatable" id="datatable-example">
                            <thead>
                                <tr>
                                @if(Auth::user()->hasPermission("poll-destroy") || Auth::user()->hasPermission("poll-edit"))
                                <th width="5%"><input type="checkbox" class="group-checkable" data-set="#datatable-example .checkboxes" /></th>
                                @else
                                    <th width="5%"><input type="checkbox" class="group-checkable" data-set="#datatable-example .checkboxes" disabled/></th>
                                @endif
                                    <th>#</th>
                                    <th width="60%">المعلومات</th>
                                    <th width="10%">التنبيه</th>
                                    <th width="20%">اخر تعديل</th>
                                    <th width="5%"></th>
                                </tr>
                            </thead>

                        </table>
                    </div>
                </div>

                <div class="grid simple vertical mobile-scroll">
                    <div class="grid-title no-border">

                    </div>
                    <div class="grid-body no-border">
                        <div class='row control'>
                            <!-- <h3>المسودة</h3> -->
                            <div class="col-sm-3 col-xs-12">
                                <div class="pull-right markaction">
                                @if(Auth::user()->hasPermission("poll-edit"))
                                    <a id="hide2" href="javascript:void(0)" class="btn btn-success"
                                        data-url="{{ URL::to('admin/poll/bulkshow') }}">انشر </a>
                                @endif
                                @if(Auth::user()->hasPermission("poll-destroy"))
                                    <a id="del2" href="javascript:void(0)" class="btn btn-danger"
                                        data-url="{{ URL::to('admin/poll/bulkdelete') }}">حذف</a>
                                @endif
                                </div>
                            </div>
                            <div class="col-sm-6 col-xs-12 c-page-title">
                                <span>المسودة</span>
                            </div>
                        </div>
                        <table class="table table-bordered table-hover datatable" id="datatable-example2">
                            <thead>
                                <tr>
                                @if(Auth::user()->hasPermission("poll-destroy") || Auth::user()->hasPermission("poll-edit"))
                                <th width="5%"><input type="checkbox" class="group-checkable" data-set="#datatable-example2 .checkboxes" /></th>
                                @else
                                    <th width="5%"><input type="checkbox" class="group-checkable" data-set="#datatable-example2 .checkboxes" disabled/></th>
                                @endif
                                    <th>#</th>
                                    <th width="60%">المعلومات</th>
                                    <th width="10%">التنبيه</th>
                                    <th width="20%">اخر تعديل</th>
                                    <th width="5%"></th>

                                </tr>
                            </thead>

                        </table>
                    </div>
                </div>
                <br>
            </div>

            {{--Requests Data Table--}}
            <div id="Requests" class="tab-pane">
                <div class="grid simple vertical mobile-scroll">
                    <div class="grid-body no-border">

                        <div class='control'>
                            <div class="col-sm-3 col-xs-12">
                                <div class="pull-right markaction">
                                @if(Auth::user()->hasPermission("poll-destroy"))
                                    <a id="del3" href="javascript:void(0)" class="btn btn-danger"
                                        data-url="{{ URL::to('admin/poll/bulkdelete') }}">حذف</a>
                                        @endif
                                </div>
                            </div>
                            <div class="col-sm-6 col-xs-12 c-page-title">
                                <span>التصويت - منتهي</span>
                            </div>
                            <div class="col-sm-3 col-xs-12"></div>
                        </div>
                        <table class="table table-bordered table-hover datatable" id="datatable-example3">
                            <thead>
                                <tr>
                                @if(Auth::user()->hasPermission("poll-destroy") || Auth::user()->hasPermission("poll-edit"))
                                <th width="5%"><input type="checkbox" class="group-checkable" data-set="#datatable-example3 .checkboxes" /></th>
                                @else
                                    <th width="5%"><input type="checkbox" class="group-checkable" data-set="#datatable-example3 .checkboxes" disabled/></th>
                                @endif
                                    <th>#</th>
                                    <th width="60%">المعلومات</th>
                                    <th width="10%">التنبيه</th>
                                    <th width="20%">اخر تعديل</th>
                                    <th width="5%"></th>

                                </tr>
                            </thead>

                        </table>
                    </div>
                </div>


            </div>

            {{--Archives Data Table--}}
            <div id="Archives" class="tab-pane">
                <div class="grid simple vertical mobile-scroll">
                    <div class="grid-body no-border">
                        <div class='control'>
                            <div class="col-sm-3 col-xs-12">
                                <div class="pull-right markaction">
                                    {{--<a id="show" href="javascript:void(0)" class="btn btn-success" data-url="{{ URL::to('admin/reports/bulkshow') }}">Un</a>--}}
                                    {{--<a id="show4" href="javascript:void(0)" class="btn btn-success" data-url="{{ URL::to('admin/poll/bulkshow') }}">انشر
                                    </a>
                                    <a id="hide4" href="javascript:void(0)" class="btn btn-warning"
                                        data-url="{{ URL::to('admin/poll/bulkhide') }}">نقل الى المسودة</a>--}}
                                        @if(Auth::user()->hasPermission("poll-destroy"))
                                    <a id="del4" href="javascript:void(0)" class="btn btn-danger"
                                        data-url="{{ URL::to('admin/poll/bulkdelete') }}">حذف</a>
                                        @endif
                                </div>
                            </div>
                            <div class="col-sm-6 col-xs-12 c-page-title">
                                <span>التصويت - الارشيف</span>
                            </div>
                            <div class="col-sm-3 col-xs-12"></div>
                        </div>
                        <table class="table table-bordered table-hover datatable" id="datatable-example4">
                            <thead>
                                <tr>
                                @if(Auth::user()->hasPermission("poll-destroy") || Auth::user()->hasPermission("poll-edit"))
                                <th width="5%"><input type="checkbox" class="group-checkable" data-set="#datatable-example4 .checkboxes" /></th>
                                @else
                                    <th width="5%"><input type="checkbox" class="group-checkable" data-set="#datatable-example4 .checkboxes" disabled/></th>
                                @endif
                                    <th>#</th>
                                    <th width="60%">المعلومات</th>
                                    <th width="10%">التنبيه</th>
                                    <th width="20%">اخر تعديل</th>
                                    <th width="5%"></th>
                                </tr>
                            </thead>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

{!! Form::open(['method' => 'POST','class' => 'inline','id'=> 'bulkaction']) !!}
<input type="hidden" value="" name="ids" id="ids" />
{!! Form::close() !!}

<div class="modal fade" id="pollResultsModal" tabindex="-1" role="dialog" aria-labelledby="pollResultsModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="pollResultsModalLabel">نتائج التصويت</h4>
            </div>

            <div class="modal-body" style="background-color: white;">
                <div class="poll-container">
                    <!-- <h4 class="modal-title">This is poll result.This is poll result.This is poll result.This is poll result.This is poll result.</h4> -->
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" onclick='closePollResultsModal("#pollResultsModal")'
                    aria-label="Close"><span aria-hidden="true">نعم </span></button>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="extendDateModal" tabindex="-1" role="dialog" aria-labelledby="extendDateModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="extendDateModalLabel"><b>تمديد تاريخ انتهاء التصويت</b></h4>
            </div>
            <div class="modal-body" style="background-color: white;">
                <b>تاريخ الانتهاء الحالي</b>
                <div class="currentExpiry"></div></br>

                <b>تمديد تاريخ انتهاء التصويت</b></br>
                {!! Form::open(['method' => 'POST','route' => 'poll.extendDateUpdate','id'=>'extend_date_form'])
                !!}
                <input type="hidden" name="poll_id" value="" id="poll_id">
                <div class="form-group row">
                    <div class='radio-group inline col-md-6 col-md-offset-6 col-sm-12'>
                        <div class="radio">
                            <input type="radio" value="open" name="poll_expiry_type" id="open"
                                onclick="emptyDateField()">
                            <label for="open">بدون تاريخ انتهاء</label>
                            <input type="radio" value="date" name="poll_expiry_type" id="date">
                            <label for="date">تاريخ</label>
                        </div>
                    </div>
                </div>

                <div class="form-group row" style="display: none" id="selectDateInput">
                    <div class="input-with-icon  right col-md-6 col-md-offset-6 col-sm-12">
                        {!! Form::text('expiry_date',null, ['class' => 'form-control','id'=>'expiry_date']) !!}
                    </div>
                </div>


            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default pull-left"
                    onclick='closeExtendDateModal("#extendDateModal")' aria-label="Close"><span
                        aria-hidden="true">إلغاء</span></button>
                <button type="submit" class="btn btn-primary btn-submit">تحديث</button>
                {!! Form::close() !!}
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="editPublishModal" tabindex="-1" role="dialog" aria-labelledby="editPublishModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            {!! Form::open(['method' => 'POST','route' => 'poll.updatepublish','id'=>'form_editpublish']) !!}
            <div class="modal-header">
                <h4 class="modal-title" id="editPublishModalLabel">تغيير تاريخ النشر</h4>

            </div>
            <div class="modal-body">
                <input type="hidden" name="poll_id" id="poll_id_input" value="">

                <div class="form-group row">
                    <div class="col-md-1 col-sm-12">

                    </div>
                    <div class="col-md-9 col-sm-12">
                    </div>
                </div>
                <div class="form-group row">
                    <div class="col-md-1 col-sm-12">

                    </div>
                    <div class="input-with-icon  right col-md-3 col-sm-12 col-md-offset-1">
                        <label class="form-label">الوقت</label>
                        {!! Form::text('published_at_time', null, ['class' =>
                        'form-control','id'=>'publish_date_time_field']) !!}
                    </div>
                    <div class="input-with-icon  right col-md-5 col-sm-12">
                        <label class="form-label">تاريخ النشر</label>
                        {!! Form::text('publish_date', null, ['class' => 'form-control','id'=>'published_at_input']) !!}
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" onclick='$("#editPublishModal").modal("hide");'
                    aria-label="Close"><span aria-hidden="true">إلغاء</span></button>
                <button type="submit" class="btn btn-primary btn-cons">حفظ</button>
            </div>
            {!! Form::close() !!}
        </div>
    </div>
</div>
<div id="pushNotificationModal" class="modal fade">
    <div class="modal-dialog">
        <div class="modal-content">

            <!-- <div class="modal-header">
                <label style="font-size: 16px;color: grey;"></label>
            </div> -->
            {!! Form::open(['url' => 'admin/poll/pushnotification','method' => 'POST'
            ,'id'=>'push_notification_form']) !!}
            <input type="hidden" name="id" id="push_modal_poll_id">
            <input type="hidden" name="publish" id="push_modal_publish_field">
            <input type="hidden" name="push_modal_push_and_publish" id="push_modal_push_and_publish_field" value="no">
            <div class="modal-body">
                <div class="form-group row">
                    <div class="col-md-1 col-sm-12">

                    </div>
                    <div class="input-with-icon  right col-md-9 col-sm-12 notification-box">
                        <label class="form-label">إرسلت رسالة تنبيه من قبل؟ <span
                                id="push_was_sent_flag">لا</span></label>
                    </div>
                </div>
                <div class="form-group row">
                    <div class="col-md-1 col-sm-12">

                    </div>
                    <div class="input-with-icon  right col-md-9 col-sm-12 notification-box">
                        {!! Form::label('notification', 'اكتب رسالة التنبيه في الاسفل', ['class' => 'form-label']) !!}
                        {!! Form::text('notification', null, ['class' =>
                        'form-control','id'=>'push_notification_field']) !!}
                    </div>
                </div>
            </div>

            <div class="modal-footer">
                <button type="button" class="btn btn-default pull-left" data-dismiss="modal">إلغاء</button>
                <a href="javascript:void()" class="btn btn-primary" id="push_modal_push_and_publish_btn">نشر مع ارسال
                    تنبيه</a>
                {!! Form::submit('نشر فقط', ['class' => 'btn btn-primary','id'=>'push_modal_submit']) !!}
            </div>
            {!! Form::close() !!}

        </div>
        <!-- /.modal-content -->
    </div>
    <!-- /.modal-dialog -->
</div>

<script type="text/javascript" language="javascript" class="init">
$.ajaxSetup({
        headers: {'X-CSRF-Token': $('meta[name=_token]').attr('content')},
    });
jQuery('#form_editpublish').submit(function(event) {
    var pass = true;
    //some validations

    if (pass == false) {
        return false;
    }
    form = this;
    jQuery('#btn-submit').attr('disabled', 'disabled');
    event.preventDefault();
    setTimeout(function() {
        form.submit();
    }, 500);
    jQuery('#progressbar').show();

    return true;
});
jQuery('#push_notification_form').submit(function(event) {
    var pass = true;
    //some validations

    if (pass == false) {
        return false;
    }
    form = this;
    jQuery('#btn-submit').attr('disabled', 'disabled');
    event.preventDefault();
    setTimeout(function() {
        form.submit();
    }, 500);
    jQuery('#progressbar').show();

    return true;
});
jQuery(document).ready(function($) {
    var date = new Date();
    date.setDate(date.getDate());

    // When click on Push notification btn or publish btn show notification modal
    $(document).on('click', '.send_push_btn', function(e) {
        var id = $(this).data('id');
        var title = $(this).data('title');
        var pushed = $(this).data('pushed');
        var pushed_flag = pushed == 0 ? 'لا' : 'نعم';
        var notification = 'التصويت: ' + title;
        var request_type = $(this).data('type')
        if (request_type == 'push_and_publish') {
            $('#push_modal_publish_field').val('yes');
            $('#push_modal_submit').val('نشر فقط');
            $('#push_modal_push_and_publish_btn').show();
        } else {
            $('#push_modal_submit').val('نشر مع ارسال تنبيه');
            $('#push_modal_publish_field').val('no');
            $('#push_modal_push_and_publish_btn').hide();
        }
        if (pushed == 0) {
            // $('#push_notification_field').prop('readonly',true);
            $('#push_notification_field').removeAttr('readonly');
        } else {
            $('#push_notification_field').removeAttr('readonly');
            // $('#push_notification_field').prop('readonly',true);
        }
        $('#push_notification_field').val(notification);
        $('#push_was_sent_flag').text(pushed_flag);
        $('#push_modal_poll_id').val(id);

        pushNotificationModal();
    });
    $('#push_modal_push_and_publish_btn').click(function(e) {
        $('#push_modal_push_and_publish_field').val('yes')
        $('#push_notification_form').trigger('submit');
    });
    // End push notification


    /*$('#expiry_date').datepicker({
        startDate: date
    });*/
    $('#expiry_date').datepicker({
        format: 'dd/mm/yyyy',
        autoclose: true,
        startDate: date
    });
    $('#published_at_input').datepicker({
        format: 'dd/mm/yyyy',
        autoclose: true
    });
    $('#publish_date_time_field').clockpicker({
        autoclose: true
    });


    $('input[type="radio"]').click(function() {
        if ($(this).attr("value") == "date") {
            $("#selectDateInput").show();
        } else {
            $("#selectDateInput").hide();
        }
    });

    $('input[type="radio"]').click(function() {
        if ($(this).attr("value") == "open") {
            $('#expiry_date').val('');
        }
    });

    function emptyDateField() {
        $('#date').val('');
    }

    jQuery('#extend_date_form').submit(function(event) {
        var pass = true;
        //some validations

        if (pass == false) {
            return false;
        }
        form = this;
        jQuery('#btn-submit').attr('disabled', 'disabled');
        event.preventDefault();
        setTimeout(function() {
            form.submit();
        }, 500);
        jQuery('#progressbar').show();

        return true;
    });

    // Columns and column defs to be used in both tables
    var columns = [{
            data: 'check',
            name: 'check'
        },
        {
            data: 'id',
            name: 'id'
        },
        {
            data: 'information',
            name: 'information'
        },
        {
            data: 'is_pushed',
            name: 'is_pushed'
        },
        {
            data: 'updated_at',
            name: 'updated_at'
        },
        {
            data: 'actions',
            name: 'actions'
        }
    ];
    var columnDefs = [{
            "targets": [1],
            "visible": false,
            "searchable": false
        },
        {
            "targets": [0, 1, 2, 3],
            "orderable": false
        },
        {
            "targets": [1,2,3,4],
            "className": 'dt-body-right'
        }
    ];

    $('#datatable-example').DataTable({

        processing: true,
        serverSide: false,
        "autoWidth": false,
        ordering: false,
        language: {
            search: "",
                searchPlaceholder: "بحث",
            processing: "<img src='{{url('/')}}/assets/img/Webp.net-resizeimage.gif' />",
            emptyTable: "لا يوجد محتوى",
            zeroRecords: "لا يوجد محتوى",

        },
        ajax: {
            "url": "{{ URL::to('admin/poll/publisheddatatable?status=1') }}",
            "type": "POST"
        },
        columns: columns,
        "columnDefs": columnDefs
    });

    $('#datatable-example2').DataTable({

        processing: true,
        serverSide: false,
        "autoWidth": false,
        ordering: false,
        language: {
            search: "",
                searchPlaceholder: "بحث",
            processing: "<img src='{{url('/')}}/assets/img/Webp.net-resizeimage.gif' />",
            emptyTable: "لا يوجد محتوى",
            zeroRecords: "لا يوجد محتوى",

        },
        ajax: {
            "url": "{{ URL::to('admin/poll/draftsdatatable?status=0') }}",
            "type": "POST"
        },
        columns: columns,
        "columnDefs": columnDefs
    });

    $('#datatable-example3').DataTable({

        processing: true,
        serverSide: false,
        ordering: false,
        "autoWidth": false,
        pageLength: 25,
        language: {
            search: "",
                searchPlaceholder: "بحث",
            processing: "<img src='{{url('/')}}/assets/img/Webp.net-resizeimage.gif' />",
            emptyTable: "لا يوجد محتوى",
            zeroRecords: "لا يوجد محتوى",

        },
        ajax: {
            "url": "{{ URL::to('admin/poll/expireddatatable') }}",
            "type": "POST"
        },
        columns: columns,
        "columnDefs": columnDefs
    });

    $('#datatable-example4').DataTable({

        processing: true,
        serverSide: false,
        ordering: false,
        "autoWidth": false,
        pageLength: 25,
        language: {
            search: "",
                searchPlaceholder: "بحث",
            processing: "<img src='{{url('/')}}/assets/img/Webp.net-resizeimage.gif' />",
            emptyTable: "لا يوجد محتوى",
            zeroRecords: "لا يوجد محتوى",

        },
        ajax: {
            "url": "{{ URL::to('admin/poll/archivesdatatable?status=3') }}",
            "type": "POST"
        },
        columns: columns,
        "columnDefs": columnDefs
    });
    $('#datatable-example_wrapper .dataTables_filter input').addClass(
    "input-medium "); // modify table search input
    $('#datatable-example_wrapper .dataTables_length select').addClass(
    "select2-wrapper span12"); // modify table per page dropdown
    $('#datatable-example_wrapper .dataTables_length select').removeClass("form-control");

    $('#datatable-example2_wrapper .dataTables_filter input').addClass(
    "input-medium "); // modify table search input
    $('#datatable-example2_wrapper .dataTables_length select').addClass(
    "select2-wrapper span12"); // modify table per page dropdown
    $('#datatable-example2_wrapper .dataTables_length select').removeClass("form-control");

    $('#datatable-example3_wrapper .dataTables_filter input').addClass(
    "input-medium "); // modify table search input
    $('#datatable-example3_wrapper .dataTables_length select').addClass(
    "select2-wrapper span12"); // modify table per page dropdown
    $('#datatable-example3_wrapper .dataTables_length select').removeClass("form-control");

    $('#datatable-example4_wrapper .dataTables_filter input').addClass(
    "input-medium "); // modify table search input
    $('#datatable-example4_wrapper .dataTables_length select').addClass(
    "select2-wrapper span12"); // modify table per page dropdown
    $('#datatable-example4_wrapper .dataTables_length select').removeClass("form-control");

    $(".select2-wrapper").select2({
        minimumResultsForSearch: -1
    });
});

function pollResultsModal(id) {

    $('#pollResultsModal').hide();
    $.ajax({
        url: "poll/pollResult",
        type: "POST",
        data: {
            poll_id: id
        },
        success: function(result) {
            $('#pollResultsModal').modal('show');
            console.log("Get Response", JSON.parse(result).pollOptionCount);
            var totalVotes = JSON.parse(result).totalVotes;
            var response;
            var finalResult;
            var optionResultCount;
            var optionName;
            for (var i = 0; i < JSON.parse(result).pollOptions.length; i++) {
                optionName = JSON.parse(result).pollOptions[i].question_option;
                optionResultCount = JSON.parse(result).pollOptionCount[i].length;
                response = (optionResultCount / totalVotes) * 100;
                finalResult = response + '%';

                // results_count = '<span>'+ optionResultCount +'/'+ totalVotes +'</span>';
                var poll_options_count_detail = JSON.parse(result).pollOptionCount[i];
                var male_count = poll_options_count_detail.filter(function(poll) {
                    return poll.voter_gender === "0";
                });
                var female_count = poll_options_count_detail.filter(function(poll) {
                    return poll.voter_gender === "1";
                });
                results_count = '<span>' + optionResultCount + '</span>' + ' ' +
                    '<span style="color:rgb(0, 179, 238);">' + male_count.length + '</span>' + ' ' +
                    '<span style="color:rgb(219, 112, 147);">' + female_count.length + '</span>' + ' / ' +
                    '<span>' + totalVotes + '</span>';


                $('.poll-container').append(

                    '<p>' + optionName + '</p> ' +
                    '<div class="progress progress-success m-b-10"> ' +
                    '<div data-percentage="0%" style="width:' + finalResult +
                    '" class="progress-bar progress-bar-success">' +
                    '</div> </div><p class="text-left ltr">' + results_count + ' votes</p>'
                );
            }


        }
    });


}

function closePollResultsModal(id) {
    $(id).modal('hide');
    $(".poll-container").html("");
}

function extendDateModal(id, poll_expiry_type, expiry_date) {

    $('#poll_id').val(id);
    $('.poll_expiry_type').val(poll_expiry_type);
    $('#expiry_date').val(expiry_date);
    $('#extendDateModal').hide();

    $.ajax({
        url: "poll/extendDateModal",
        type: "POST",
        data: {
            poll_id: id
        },
        success: function(result) {
            $('#extendDateModal').modal('show');
            console.log("Get Response", JSON.parse(result));

            var currentExpiryDate;
            var pollExpiryType;

            currentExpiryDate = JSON.parse(result).expiry_date;
            pollExpiryType = JSON.parse(result).poll_expiry_type;
            if (pollExpiryType == 'date') {
                $('.currentExpiry').html("<div>" + " " + currentExpiryDate + "</div> ");

            } else {
                $('.currentExpiry').html("<div>بدون تاريخ انتهاء</div> ");
            }

            if (pollExpiryType == 'date') {
                $("#date").prop("checked", true);
                $("#selectDateInput").show();
            } else {
                $("#open").prop("checked", true)
            }


        }
    });
}

function closeExtendDateModal(id) {
    $(id).modal('hide');
}

function pushNotificationModal() {
    $('#pushNotificationModal').modal('show');
}

function closePushNotificationModal(id) {
    $(id).modal('hide');
}

function editPublishDate(element) {
    var id = $(element).data('id');
    var publish_date = $(element).data('date');
    var publish_date_time = $(element).data('time');
    $('#poll_id_input').val(id);
    $('#published_at_input').val(publish_date);
    $('#publish_date_time_field').val(publish_date_time);
    $('#editPublishModal').modal('show');
}
</script>
<script src="{{ asset('assets/js/tabs_accordian.js')}}" type="text/javascript"></script>
<script src="{{ asset('assets/plugins/jquery-notifications/js/messenger.min.js')}}" type="text/javascript"></script>
<script src="{{ asset('assets/plugins/jquery-notifications/js/messenger-theme-future.js')}}" type="text/javascript">
</script>
@endsection