fantazer
5/15/2019 - 8:46 AM

datepicker simple

//Doc doc http://t1m0n.name/air-datepicker/docs/index-ru.html

//bower i air-datepicker --save-dev
//link(rel="stylesheet", href="bower/air-datepicker/dist/css/datepicker.css")
//script(src='bower/air-datepicker/dist/js/datepicker.js')

input(type="text" placeholder="Дата" ).input.getdate

========
Убрать из open modal body:"fixed"
========
	//datepicker
	function isElementInViewport(el) {
        var rect = el.getBoundingClientRect();
        var fitsLeft = (rect.left >= 0 && rect.left <= $(window).width());
        var fitsTop = (rect.top >= 0 && rect.top <= $(window).height());
        var fitsRight = (rect.right >= 0 && rect.right <= $(window).width());
        var fitsBottom = (rect.bottom >= 0 && rect.bottom <= $(window).height());
        return {
            top: fitsTop,
            left: fitsLeft,
            right: fitsRight,
            bottom: fitsBottom,
            all: (fitsLeft && fitsTop && fitsRight && fitsBottom)
        };
    }

	var dp = $('.getdate').datepicker({
		minDate: new Date(),
		autoClose: true,
		onHide: function(inst){
        inst.update('position', 'right center'); // Update the position to the default again
    },
    onShow: function(inst, animationComplete){
        // Just before showing the datepicker
        if(!animationComplete){
            var iFits = false;
            // Loop through a few possible position and see which one fits
            $.each(['right center', 'right bottom', 'right top', 'top center', 'bottom center'], function (i, pos) {
                if (!iFits) {
                    inst.update('position', pos);
                    var fits = isElementInViewport(inst.$datepicker[0]);
                    if (fits.all) {
                        iFits = true;
                    }
                }
            });
        }
    }
	}).data('datepicker');

	//При использовании в модальном окне чтобы при скроле оставалось в той же позиции
	$('.modal-wrap').on('scroll', function () {
		dp.update();
	});
	//datepicker===end
.datepicker
	z-index 9999

.datepicker--day-name
	color $mark

.datepicker--cell.-current-
	color black
	font-weight: 700

.datepicker--cell.-selected-
	background: $mark!important
	font-weight: 700!important
	color black