Invalid Array Length when Moment Locale is set to en-gb

[warrenbuckley]

Problem

When using locales with the calendar we get some weird quirks & UI weirdness. For example if we set the momentjs locale to en-gb then click the second date in the date range and you will see no dates being shown.

Additionally if you page through the calendar months into the past, some months will load & others will display the same problem of no dates for that month.

If you need further details or any steps to replicate further then please let me know.

Thanks, Warren

JavaScript Console Stack Trace Log

Uncaught RangeError: Invalid array length
Calendar.range @ calendar.js?umb__rnd=7.4.3.564337076:802
Calendar.calendarArray @ calendar.js?umb__rnd=7.4.3.564337076:666
Calendar.calendarCreate @ calendar.js?umb__rnd=7.4.3.564337076:614
Calendar.calendarOpen @ calendar.js?umb__rnd=7.4.3.564337076:439
Calendar.$.on.click @ calendar.js?umb__rnd=7.4.3.564337076:81
x.event.dispatch @ jquery.min.js?cdv=564337076:5
y.handle @ jquery.min.js?cdv=564337076:5

I get the following error when using the Calendar DateRange Picker when the user's moment locale is set to en-gb with moment.locale("en-gb")

Current code

//Breaks if set to en-gb (this comes from an API, that fetches the current users locale)
moment.locale("en-gb");

var dd = new Calendar({
    element: $(".daterange--double"),
    earliest_date: 'January 1, 2000',
    latest_date: moment(),
    start_date: moment().subtract(29, 'days'),
    end_date: moment(),
    same_day_range: true,
    callback: function () {

        //Date update/changed

        //Parse the dates from this component to Moment dates
        var start = moment(this.start_date);
        var end = moment(this.end_date);

        //If the item passed to this directive is an object (not string or array)
        if(angular.isObject(scope.ngModel)){
            //Set the properties on the model passed in
            scope.ngModel.startDate = start.format('YYYY-MM-DD');
            scope.ngModel.endDate = end.format('YYYY-MM-DD');
        }
        else
        {
            //If we do not have an object perhaps yet
            //We can set the dates on the filter model
            var dateFilter = {};
            dateFilter.startDate = start.format('YYYY-MM-DD');
            dateFilter.endDate = end.format('YYYY-MM-DD');
            scope.ngModel = dateFilter;
        }

        //Update scope - so anything watching it can change as needed
        scope.$apply();
    }
});

[kalepail]

Really sorry to hear this isn't working for you. Unfortunately I didn't implement the locale feature and since we don't use it at Baremetrics you're on your own. Shouldn't be too hard to dig in and sort it out though. You might ping @RocAlayo as he submitted the PR that brought this feature in. :/

[warrenbuckley]

To update on this, the problem is with this piece of code moment().localeData().firstDayOfWeek() Some locale do not use Sunday as the starting day of the week, and others use Monday.

[warrenbuckley]

Any news/update on the PR I have submitted for you to consider/review @tyvdh @scottrobertson @Shpigford

[kalepail]

Sorry. Haven't had the chance to look it over yet. Maybe this weekend.