@extends('layout.master')
@section('parentPageTitle', 'Agendamiento')
@section('title', 'Calendario')

@section('page-style')
    <link rel="stylesheet" href="{{asset('assets/plugins/fullcalendar/fullcalendar.min.css')}}" />
@stop

@section('content')


<meta name="csrf-token" content="{{ csrf_token() }}">

    <div class="row clearfix">
        <div class="col-md-12">
            <div class="card patients-list">
                <div class="header">
                    <h2><strong>Calendario del doctor y doctores</strong> </h2>
                    <ul class="header-dropdown">
                        <li class="dropdown"> <a href="javascript:void(0);" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"> <i class="zmdi zmdi-more"></i> </a>
                            <ul class="dropdown-menu dropdown-menu-right slideUp">
                                <li><a href="ingresar">Nuevo</a></li>
                            </ul>
                        </li>
                        <li class="remove">
                            <a role="button" class="boxs-close"><i class="zmdi zmdi-close"></i></a>
                        </li>
                    </ul>
                </div>
                <div class="body">
                    <!-- Nav tabs -->
                    
          
                        
                    <div id="calendar"></div>
                </div>
            </div>
        </div>
    </div>
    
    

@stop

@section('page-script')
    <script src="{{asset('assets/bundles/fullcalendarscripts.bundle.js')}}"></script>

    <script>


        function eliminar(id){
            var r = confirm("Confirma eliminar");
            if (r == true) {
                var token = $('meta[name="csrf-token"]').attr('content');
                var url='eliminar';
                var data={"id" : id};

                $.ajax({
                    type:'POST',
                    url: url,
                    data: data,
                    headers: {
                        'X-CSRF-TOKEN': token
                    },
                    success:function(data){
                        //alert(data);
                        //redirect('roles/listado-roles');
                        window.location.href = "listado";
                    }
                });
            }                 
        }


    function addCeroFecha(i) {
        if (i < 10) {
            i = '0' + i;
        }
        return i;
    }

    "use strict";
    $('#calendar').fullCalendar({
        header: {
            //left: 'prev',
            center: 'title',
            //right: 'next'
            left: 'prev,next today',
            right: 'month,agendaWeek,agendaDay'
        },
        firstDay: 1,
        locale: 'es',
        lang: 'es',
        monthNames: ['Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio', 'Julio', 'Agosto', 'Septiembre', 'Octubre', 'Noviembre', 'Diciembre'],
        monthNamesShort: ['Ene','Feb','Mar','Abr', 'May','Jun','Jul','Ago','Sep', 'Oct','Nov','Dic'],
        dayNames: ['Domingo', 'Lunes', 'Martes', 'Miércoles', 'Jueves', 'Viernes', 'Sábado'],
        dayNamesShort: ['Dom','Lun','Mar','Mié','Juv','Vie','Sáb'],
        dayNamesMin: ['Do','Lu','Ma','Mi','Ju','Vi','Sá'],
        defaultDate: '2020-02-20',
        editable: true,
        droppable: true, // this allows things to be dropped onto the calendar
        drop: function() {
            // is the "remove after drop" checkbox checked?
            if ($('#drop-remove').is(':checked')) {
                // if so, remove the element from the "Draggable Events" list
                $(this).remove();
            }
        },
        dayClick: function( date, allDay, jsEvent, view ) { 
            var myDate = new Date();
            
            //How many days to add from today?
            var daysToAdd = 15;
            
            myDate.setDate(myDate.getDate() + daysToAdd);
        
            if (date < myDate) {
                //TRUE Clicked date smaller than today + daysToadd
            //alert("You cannot book on this day!");    
            }
            else
            {
                //FLASE Clicked date larger than today + daysToadd
                //alert("Excellent choice! We can book today..");    
             }   
            
                
        },    
        eventLimit: true, // allow "more" link when too many events
        events: [

            {
                start: '2020-02-20T10:00:00',
                end: '2020-02-20T16:00:00',
                rendering: 'background',
                title: 'Cliente',
                className: 'bg-cyan'
            },
            {
                title: 'Hito',
                start: '2020-02-27',
                className: 'b-l b-2x b-greensea'
            },
            {
                title: 'Vacaciones',
                start: '2020-03-07',
                end: '2020-03-10',
                className: 'bg-cyan'
            },
            {
                title: 'Cita1',
                start: '2020-03-12T10:30:00',
                end: '2020-03-12 T12:30:00',
                className: 'b-l b-2x b-amethyst'
            },
            {
                title: 'Cita2',
                start: '2020-03-12T13:30:00',
                end: '2020-03-12 T13:45:00',
                className: 'b-l b-2x b-amethyst'
            },
            {
                title: 'Cita4',
                start: '2020-03-12T15:30:00',
                end: '2020-03-12 T16:20:00',
                className: 'b-l b-2x b-amethyst'
            },
            {
                title: 'Cita6',
                start: '2020-03-12T17:30:00',
                end: '2020-03-12 T18:30:00',
                className: 'b-l b-2x b-amethyst'
            }
            /*
            ,
            
            {
                id: 999,
                title: 'Repeating Event',
                start: '2018-01-09T16:00:00',
                className: 'b-l b-2x b-lightred'
            },
            {
                id: 999,
                title: 'Repeating Event',
                start: '2018-12-16T16:00:00',
                className: 'b-l b-2x b-success'
            },
            {
                title: 'Conference',
                start: '2018-01-11',
                end: '2018-01-13',
                className: 'b-l b-2x b-primary'
            },
            {
                title: 'Meeting',
                start: '2018-01-12T10:30:00',
                end: '2018-01-12 T12:30:00',
                className: 'b-l b-2x b-amethyst'
            },
            {
                title: 'Lunch',
                start: '2018-01-12T12:00:00',
                className: 'b-l b-2x b-primary'
            },
            {
                title: 'Meeting',
                start: '2018-01-12T14:30:00',
                className: 'b-l b-2x b-drank'
            },
            {
                title: 'Happy Hour',
                start: '2018-01-12T17:30:00',
                className: 'b-l b-2x b-lightred'
            },
            {
                title: 'Dinner',
                start: '2018-12-12T20:00:00',
                className: 'b-l b-2x b-amethyst'
            },
            {
                title: 'Birthday Party',
                start: '2018-01-13T07:00:00',
                className: 'b-l b-2x b-primary'
            },
            {
                title: 'Click for Google',
                url: 'http://google.com/',
                start: '2018-01-28',
                className: 'b-l b-2x b-greensea'
            }*/
        ]
    });




    // Previous month action
    $('#cal-prev').on('click',function(){
        $('#calendar').fullCalendar( 'prev' );
    });

    // Next month action
    $('#cal-next').on('click',function(){
        $('#calendar').fullCalendar( 'next' );
    });

    // Change to month view
    $('#change-view-month').on('click',function(){
        $('#calendar').fullCalendar('changeView', 'month');

        // safari fix
        $('#content .main').fadeOut(0, function() {
            setTimeout( function() {
                $('#content .main').css({'display':'table'});
            }, 0);
        });

    });

    // Change to week view
    $('#change-view-week').on('click',function(){
        $('#calendar').fullCalendar( 'changeView', 'agendaWeek');

        // safari fix
        $('#content .main').fadeOut(0, function() {
            setTimeout( function() {
                $('#content .main').css({'display':'table'});
            }, 0);
        });

    });

    // Change to day view
    $('#change-view-day').on('click',function(){
        $('#calendar').fullCalendar( 'changeView','agendaDay');

        // safari fix
        $('#content .main').fadeOut(0, function() {
            setTimeout( function() {
                $('#content .main').css({'display':'table'});
            }, 0);
        });

    });

    // Change to today view
    $('#change-view-today').on('click',function(){
        $('#calendar').fullCalendar('today');
    });

    /* initialize the external events
     -----------------------------------------------------------------*/
    $('#external-events .event-control').each(function() {

        // store data so the calendar knows to render an event upon drop
        $(this).data('event', {
            title: $.trim($(this).text()), // use the element's text as the event title
            stick: true // maintain when user navigates (see docs on the renderEvent method)
        });

        // make the event draggable using jQuery UI
        $(this).draggable({
            zIndex: 999,
            revert: true,      // will cause the event to go back to its
            revertDuration: 0  //  original position after the drag
        });

    });

    $('#external-events .event-control .event-remove').on('click', function(){
        $(this).parent().remove();
    });

    // Submitting new event form
    $('#add-event').submit(function(e){
        e.preventDefault();
        var form = $(this);

        var newEvent = $('<div class="event-control p-10 mb-10">'+$('#event-title').val() +'<a class="pull-right text-muted event-remove"><i class="fa fa-trash-o"></i></a></div>');

        $('#external-events .event-control:last').after(newEvent);

        $('#external-events .event-control').each(function() {

            // store data so the calendar knows to render an event upon drop
            $(this).data('event', {
                title: $.trim($(this).text()), // use the element's text as the event title
                stick: true // maintain when user navigates (see docs on the renderEvent method)
            });

            // make the event draggable using jQuery UI
            $(this).draggable({
                zIndex: 999,
                revert: true,      // will cause the event to go back to its
                revertDuration: 0  //  original position after the drag
            });

        });

        $('#external-events .event-control .event-remove').on('click', function(){
            $(this).parent().remove();
        });

        form[0].reset();

        $('#cal-new-event').modal('hide');

    });
    </script>
@stop