@extends('layouts.calendar')

@section('content')

    <div class="uk-grid">
        <div class="uk-width-1-1 uk-text-center uk-margin-small-top uk-margin-small-bottom uk-hidden@l" id="header-mobile">
        </div>
    </div>
    <div id="page_content_inner">
        <div class="uk-container uk-align-center">
            <div class="uk-grid" data-uk-grid-match id="slider_lists">
                <div class="uk-width-large-1-1">
                    <div class="md-card uk-margin-medium-bottom">
                        <div class="uk-width-large-1-1 header-event">
                            <ul class="uk-navbar-nav user_actions">
                                <li>
                                    <i class="material-icons-chevron"id="right-btn">chevron_right</i>
                                </li>
                                <li data-uk-dropdown="{mode:'click',pos:'bottom-right'}">
                                    <p style="margin: 6px 0px 15px 0;">
                                        <a href="#" class="user_action_image" id="month-btn"><span class="event-title-header">ماه</span></a>
                                    </p>
                                    <div class="uk-dropdown uk-dropdown-small">
                                        <ul class="uk-nav js-uk-prevent user-actions">
                                            <li id="right-btn">
                                                <a href="#"><span class="menu_title">ماه</span></a>
                                            </li>
                                            <li id="week-btn">
                                                <a href="#"><span class="menu_title">هفته</span></a>
                                            </li>
                                            <li id="day-btn">
                                                <a href="#"><span class="menu_title">روز</span></a>
                                            </li>
                                        </ul>
                                    </div>
                                </li>
                                <li>
                                    <i class="material-icons-chevron" id="left-btn">chevron_left</i>
                                </li>
                            </ul>
                        </div>
                        <div class="md-card-content">
                            <ul class="md-list uk-grid" id="no-border-list">
                                <li class="uk-width-medium-1-2">
                                    <div class="md-list-content">
                                        <span class="md-list-heading">امروز</span><span class="today"></span>
                                    </div>
                                </li>
                                <li class="uk-width-medium-1-2 text-align-left">
                                    <span class="title-event" id="title-calender"></span><br>
                                    <span class="title-event" id="txt"></span>
                                </li>
                            </ul>
                            <div class="uk-width-1-1 border-top-calendar">
                                <div id='calendar'></div>
                            </div>
                            <div class="uk-grid" data-uk-grid-margin id="filter-event">
                                <div class="uk-width-large-1-2">
                                    <div id="filter">
                                        <h4 class="h4-title">فیلتر</h4>
                                        <ul class="md-list uk-grid" id="no-border-list">
                                            <li class="uk-width-medium-1-1">
                                                <label><input class="uk-checkbox-event events-filter-checkbox" value="general_events" type="checkbox" checked><span class="inline-label-event">مناسبت</span></label>
                                            </li>
                                            <li class="uk-width-medium-1-1">
                                                <label><input class="uk-checkbox-private events-filter-checkbox" value="private" type="checkbox"><span class="inline-label-private">شخصی</span></label>
                                            </li>
                                            <li class="uk-width-medium-1-1">
                                                <label><input class="uk-checkbox-share events-filter-checkbox" value="share" type="checkbox"><span class="inline-label-share">اشتراک گزاری شده</span></label>
                                            </li>
                                            <li class="uk-width-medium-1-1">
                                                <label><input class="uk-checkbox-event events-filter-checkbox" value="google_events" type="checkbox" checked><span class="inline-label-event">تقویم گوگل</span></label>
                                            </li>
                                            <li class="uk-width-medium-1-1">
                                                <label><input class="uk-checkbox-yekita events-filter-checkbox" value="yekita_events" type="checkbox" checked><span class="inline-label-yekita">یکیتا</span></label>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                                <div class="uk-width-large-1-2">
                                    <div class="uk-accordion" data-uk-accordion>
                                        <i class="material-icons-check">check_box</i><i class="material-icons-check" style="display: none">indeterminate_check_box</i><h3 class="uk-accordion-title color-grey">برگزارکننده</h3>
                                        <div class="uk-accordion-content">
                                            <ul>
                                            </ul>
                                            <li>
                                                <label><input class="uk-checkbox-event" type="checkbox" checked><span class="inline-label-event"></span></label>
                                                <ul>
                                                    <li>
                                                        <label><input class="uk-checkbox-event events-filter-checkbox" value="" type="checkbox" ><span class="inline-label-event"></span></label>
                                                    </li>
                                                    <li>
                                                        <label><input class="uk-checkbox-event events-filter-checkbox" value="" type="checkbox" ><span class="inline-label-event"></span></label>
                                                    </li>
                                                </ul>
                                            </li>
                                            </ul>
                                        </div>
                                        <i class="material-icons-check">check_box</i><i class="material-icons-check" style="display: none">indeterminate_check_box</i><h3 class="uk-accordion-title color-grey">مدرس</h3>
                                        <div class="uk-accordion-content">
                                            <ul>
                                            </ul>
                                            <li>
                                                <label><input class="uk-checkbox-event" type="checkbox" checked><span class="inline-label-event"></span></label>
                                                <ul>
                                                    <li>
                                                        <label><input class="uk-checkbox-event events-filter-checkbox" value="" type="checkbox" ><span class="inline-label-event"></span></label>
                                                    </li>
                                                    <li>
                                                        <label><input class="uk-checkbox-event events-filter-checkbox" value="" type="checkbox" ><span class="inline-label-event"></span></label>
                                                    </li>
                                                </ul>
                                            </li>
                                            </ul>
                                        </div>
                                        <i class="material-icons-check">check_box</i><i class="material-icons-check" style="display: none">indeterminate_check_box</i><h3 class="uk-accordion-title color-grey">شرکت کننده</h3>
                                        <div class="uk-accordion-content">
                                            <ul>
                                            </ul>
                                            <li>
                                                <label><input class="uk-checkbox-event" type="checkbox" checked><span class="inline-label-event"></span></label>
                                                <ul>
                                                    <li>
                                                        <label><input class="uk-checkbox-event events-filter-checkbox" value="" type="checkbox" ><span class="inline-label-event"></span></label>
                                                    </li>
                                                    <li>
                                                        <label><input class="uk-checkbox-event events-filter-checkbox" value="" type="checkbox" ><span class="inline-label-event"></span></label>
                                                    </li>
                                                </ul>
                                            </li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="uk-width-large-1-1">
                                <h4 class="h4-title">رویدادها:</h4>
                                <div id="event" style="margin-bottom: 10px">
                                    <label for="course-capacity"></label>
                                    <input type="text" id="event_title_search" required="" placeholder="جست و جو در رویداد" class="event-title-input" value="">
                                    <input type="" id="start_search" required="" class="event-date-input initial-date" value="">
                                    <input type="" id="end_search" required="" class="event-date-input initial-date" value="">
                                    <i class="material-icons-search">search</i>
                                </div>
                                <div  id="event-title"></div>
                                <a data-fancybox href="#modal-example" id="button-add-event" class="" style="display: none">add</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="width-card popup uk-border-rounded" id="modal-example">
        <div class="add-event-modal">
            <span class="close-btn secondary-color uk-margin-right uk-margin-left close-modal-auth"><i class="material-icons-close">close</i></span>
            <div class="uk-grid" data-uk-grid-match>
                <div class="uk-width-large-1-2">
                    <input type="" name="" id="start_date" required="" class="event-add-date initial-date" value="">
                    <input type="" name="" id="start_time" required="" class="event-add-date time-picker" value="">
                </div>
                <div class="uk-width-large-1-2">
                    <input type="" name="" id="end_date" required="" class="event-add-date initial-date" value="">
                    <input type="" name="" id="end_time" required="" class="event-add-date time-picker" value="">
                </div>
            </div>
            <div class="uk-width-medium-1-1 uk-width-large-1-1">
                <div class="uk-form-row">
                    <div class="parsley-row">
                        <div class="md-input-wrapper">
                            <label for="course-capacity"> عنوان<span class="req">*</span></label>
                            <input id="id_event" type="hidden">
                            <input type="text" id="modalTitle" name="title" required="" class="md-input numberInput" value=""><i class="material-iconss-modal">today</i>
                        </div>
                    </div>
                </div>
            </div>
            <div class="uk-width-medium-1-1 uk-width-large-1-1 div-margin">
                <div class="uk-accordion" data-uk-accordion>
                    <h3 class="uk-accordion-title color-grey" style="display: none"></h3>
                    <div class="uk-accordion-content">

                    </div>
                    <h3 class="uk-accordion-title color-grey more-span">جزیات بیشتر</h3>
                    <div class="uk-accordion-content">
                        <span class="span-share-event">افزودن مهمان در این رویداد</span>
                        <div class="uk-width-medium-1-1 uk-row-first div-margin">
                            <form>
                                <div class="">
                                    <input type="radio" class="uk-radio" name="radios" value="" onclick="show1();"><label class="lable-radio">اشخاص</label>
                                </div>
                            </form>
                            <div id="div1" class="hide-div div-margin">
                                <div class="uk-form-row">
                                    <div class="parsley-row">
                                        <div class="md-input-wrapper">
                                            <div id="tagfield"></div><i class="material-iconss-modal">group</i>
                                        </div>
                                    </div>
                                </div>
                                <div class="div-margin">
                                    <span class="span-share-event">مهمان میتواند</span>
                                    <ul class="modal-ul">
                                        <li class="uk-width-medium-1-1">
                                            <label><input class="uk-checkbox-event" type="checkbox" checked><span class="inline-label-event">رویداد حذف کند</span></label>
                                        </li>
                                        <li class="uk-width-medium-1-1">
                                            <label><input class="uk-checkbox-event" type="checkbox" checked><span class="inline-label-event">رویداد ویرایش کند</span></label>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="uk-width-medium-1-1 uk-width-large-1-1" style="position: relative;">
                <span class="span-share-event">افزودن یاداوری</span><br>
                <input type="" name="" required="" class="event-add-date initial-date" value="">
                <input type="" name="" required="" class="event-add-date time-picker" value=""><i class="material-iconss-modal">alarm</i>
            </div>
            <div class="margin-button-modal">
                <button id="save-event" class="close-btn no-padding md-btn md-btn-primary md-btn-wave-light waves-effect waves-button waves-light" onclick="create_event()">ثبت</button>
                <button id="delete-event" class="closeon close-btn no-padding md-btn md-btn-danger md-btn-wave-light waves-effect waves-button waves-light">حذف</button>
            </div>
        </div>
    </div>
@endsection

@section('footer')

@endsection