Datetime-bling NPM

Date-bling

An ember-cli addon to display calendar month(s) using moment.js.

Usage

Single month

{{calendar-month
  month=currentMonth
  year=currentYear
  customClassFunction=oneMonthClassFunction}}

currentMonth: null,
currentYear: null,

init() {
  this.set('currentMonth', moment().month());
  this.set('currentYear', moment().year());  
},

oneMonthClassFunction(date) {
  let selectedDays = [1, 2, 3, 5, 8, 13, 21];
    if (selectedDays.includes(date.date()) && moment().isSame(date, 'month')) {
      return 'selected';
    }
},

Multiple months

{{calendar-month-multi
  startDate=today
  endDate=threeMonthsFromNow
  context=(hash
    startDate=today
    endDate=threeMonthsFromNow
  )
  customClassFunction=threeMonthClassFunction}}

today: null,
threeMonthsFromNow: null,

init() {
  this.set('today', moment().startOf('day'));
  this.set('threeMonthsFromNow', moment().startOf('day').add(2, 'months'));
},

threeMonthClassFunction(date) {
  // pass anything you will need anything into this function in 'context'
  const { startDate, endDate } = this.get('context');

  if (date.isSame(startDate, 'day')) {
    return 'start-date';
  }

  if (date.isSame(endDate, 'day')) {
    return 'end-date';
  }

  if (date.isBetween(startDate, endDate)) {
    return 'selected';
  }
}