0.0.18

• when two datepickers are used for range selection, additional parameters (range-from and range-to) allow to highlight selected time range

Docs are missing this function and how to use it. Probably also needed a higher version of Momentjs: 'moment.range' is undefined

I want to change the weekday order from Sunday to Saturday to Mon to Sunday.

Example,

Su Mo Tu We Th Fr Sa

to

Mo Tu We Th Fr Sa Su

So I changed the code in the _buildWeek method in the directive from

days = [0, 1, 2, 3, 4, 5, 6].map(function(d) {

to

days = [1, 2, 3, 4, 5, 6, 0].map(function(d) {

the days render correctly at the top but the actual day for each week on the Sunday shifts down, so displays as

Mo Tu We Th Fr Sa Su

30   31  1   2   3   4   29

6     7    8   9  10  11  5

...

You can see the Sunday has got the date of 29 and the 5th which is down a week.

Any ideas how I can fix this?

Many Thanks

Maybe this is implemented, but I can't find it.

I'd like to hide the month navigation buttons so that the user is required to only select dates within the month that I display.

Add support for

I18N: day of the week and month of the year in other languages than English
L10N: date format for country

How to overwrite the pickerTemplate? @monterail @jandudulski

Hello !

Here is a way to make clean and separated template instead of writing them in variables ?

Thanks for your help !

Hi,
Can you please add a class to dates which are placed between the start and the end date of a selected range?

I wasn't able to use double picker starting with a blank range, the problem is that if my data is { from: '', to: '' }, the picker will not let me select anything.

So I dug into the library and found if I can make the following change, it'll work. Basically, I just check is the model is empty.

          _withinLimits = function(day, month) {
            var withinLimits;
            withinLimits = true;
            if ($scope.model && $scope.model.isValid()) {
              if ($scope.before) {
                withinLimits && (withinLimits = day.isSameOrBefore($scope.before, 'day'));
              }
              if ($scope.after) {
                withinLimits && (withinLimits = day.isSameOrAfter($scope.after, 'day'));
              }
            }
            return withinLimits;
          };

npm installation currently fails with the not-very-useful 'Arguments to path.resolve must be strings' error, as it expects the 'main' property to be a string, not an array.

Can be resolved by replacing
"main": [
"build/angular-mighty-datepicker.js",
"build/angular-mighty-datepicker.css"
]
with
"main": "build/angular-mighty-datepicker.js"

Any plan to localize? In my local weeks do start from "Mo", not "Su"...

Please update moment.js, 2.6.0 is too old version

Hi, I installed 0.1.4 using bower, and get an error saying that pasvaz.bindonce is required. In build/angular-mighty-datepicker.js, its required:

angular.module("mightyDatepicker", ["pasvaz.bindonce"]);

I thought this was removed? Any way to get around it?

Hi, there is the function moveMonth(1) for going to the next month, but is there a way that I can get the month in text already for the next month in place of the > thats there by default?

@monterail-deploy @jandudulski

Is there any possibility to show only Month and year view of the calendar with all the attributes and options which are applicable for normal dd-mm-yyyy.

Error: $injector:unpr
Unknown Provider
Unknown provider: eProvider <- e <- mightyDatepickerDirective

It's related to using implicit DI on the directive. Making the change so that the following line:

angular.module("mightyDatepicker").directive("mightyDatepicker", function($compile) {
...
})

becomes:

angular.module("mightyDatepicker").directive("mightyDatepicker", ['$compile', function($compile) {
...
}])

fixes the error.

Add UMD support to be used with AMD or CommonJs libraries like RequireJs.

I'm getting this warning in the console:

Deprecation warning: moment().add(period, number) is deprecated. Please use moment().add(number, period).

I'm not sure with which Moment.js version this came with, but should probably be updated.

I cannot select the same date in the "Double datepicker for date range" demo on http://monterail.github.io/angular-mighty-datepicker/.

Right in the beginning, I can select today's date on the left picker, but not on the right one. If I then select yesterday's date on the left picker, I can select today on the right and left. If I then click on tomorrow's date on the right picker, I can't select today on the right or tomorrow on the left. So in essence, it half-works in the start, but after some clicking around, it stops working on both sides.

I had it working with change before and after attributes, but that brakes the rangeFrom and rangeTo functionality.

It would be awesome if this could be fixed.

downloaded the project but the index.html is test folder is not showing the calendar

It'd be nice to bump the dependency for moment-range to the latest version. It's usually not a bad idea to have the latest version of libs, and that includes moment-range.

In practice, our application depends on moment-range 2.x, so I'm running into a dependency conflict.

See this video:
https://www.dropbox.com/s/hjtunfqeimbyfny/strange.mov?dl=0

As you can see the callback only is returned correctly when clicking for the second time..

    _callthis = function(day) {

        var _from = $scope.date_from.format('YYYY-MM-DD');
        var _to = $scope.date_to.format('YYYY-MM-DD');

        if(_to != 'Invalid date')
        {
            console.info(_from);
            console.info(_to);
        }
    }
    $scope.options_date_from = {callback: _callthis}; // start: moment().add('day', 2),
    $scope.options_date_to = {callback: _callthis};


    This HTML

    <mighty-datepicker ng-model="date_from" options="options_date_from" not-before="date_to"></mighty-datepicker>
    <mighty-datepicker ng-model="date_to" options="options_date_to" after="date_from"></mighty-datepicker>

How to make the Start date always to be in the future?

There's an optional field in my form which the user may not want to fill in. I've added a button that assigns the model to undefined, but the angular-mighty-datepicker coerces undefined values to the current date using moment.js (https://github.com/monterail/angular-mighty-datepicker/blob/master/src/angular-mighty-datepicker.coffee#L221).

I've managed to avoid that by not using the ngModel option (passing a dummy value, since the directive doesn't work without a ngModel), and using the callback to set the selected value to my model. This works, but the date keeps selected, even though the model is empty, which is misleading for the user.

Is there an appropriate way to deselect the date in angular-mighty-datepicker?

Hi,

First of all, great and very clean directive! I ran into an issue when trying to filter out available dates in the directive. I tried the following:

var _filter_available_dates = function(day) {
      _.forEach($scope.event.occurrences, function(occurrence) {
        if(day.isSame(moment(occurrence.event_date))) {
          console.log('day', day.day(), moment(occurrence.event_date).day());
          return true;
         //return day.day();
        }
      });
    }

$scope.calendarOptions = {
      start: moment().add('month', -1),
      months: 1,
      mode: "multiple",
      callback: _selectedDate,
      filter: _filter_available_dates
    };

So the idea is that I would iterate over every day in my event's array, wrap it in a moment object and check if it's the same day as the day returned from the directive. If it is, i would return day.day().

This does not work and instead the entire calendar is greyed out even though I have matches.
Any ideas why?

Thank you!

The calendar is very slow when there are markers added ánd you wanna select some dates.
Pretty basis, but only tweaked the template. The select() is unchanged and this is causing slowness.

<mighty-datepicker markers="markers" ng-model="selected_dates" options="calendar_options">
</mighty-datepicker>

This options:

$scope.calendar_options = {
        callback: _callback_prices,
        months: 3,
        mode: 'multiple',
        start: moment().startOf('year'),
        end: moment().endOf('year'),
        before: moment().endOf('year'),
        filter: _filter,
        markerTemplate: null,
        template: "Tweaked template",
    };

With this Markers added:

angular.forEach(foobar, function(value, key) {
    $scope.markers.push({
        day: moment(value.date),
        marker: value.text,
    });
});

See video:
https://www.dropbox.com/s/hrq0ttxwd9sacv8/slow.mov?dl=0

As of Angular 1.3, bind once functionality is built in and so this dependency shouldn't be required any more?

I'd happily supply a patch removing the requirement if this would help.

I configure my calendar to display two months and hide the buttons using CSS as I want to limit the period (which doesn't seem to be an option I can pass?).

ctrl.datePickerOptions = {
    start: null,
    months: 2,
    mode: 'simple',
    filter: ctrl._filter,
    callback: ctrl._callback
};

The initial display works fine but when a date is selected in the second calendar, that second month becomes the first month. Is there a way to prevent this behaviour so that the starting month is retained when a date is selected?

Currently there are CSS classes for selectable dates, selected dates and disabled dates.

Currently dates that are not in the month use the 'disabled' class but I think having their own class is useful so that they can be styled independently of the disabled dates.

Will enable projects to include angular-mighty-datepicker as a dependency at build time.

see pull request #39 for details

Can we add this feature? I'd like the ability to disable or hide the month navigation button for future months from current month. Thanks!

When you change the style of the mighty-picker-calendar__day--disabled class, it also gives that same style to the days that are not in the current month. But what I want is to have an extra class somewhere for the current month, so you can style the --disabled days different then from the not-current-month-days.

Please look to the image
https://monosnap.com/file/LIjZOLvqxiLfqYYlQSywO8FtkROhVH

When trying to changed the ng-model from withing a controller, the view is not refreshed automatically, only when clicking the calendar.
I am trying to add new dates (moments) to a $scope.multi array, and expect to see the changed on the screen.
Any idea on how to fix this?

Hi, is it possible to drop 'pasvaz.bindonce' module in favor of ::single bindings in angular ?

Hi, I try to install and run it, I have expected will work like http://monterail.github.io/angular-mighty-datepicker/ . I included css into project path poin to 'bower_components/angular-mighty-datepicker/build/angular-mighty-datepicker.css' , What step I missed

Thank you