feat(current-day): rename current-day to view-date. Closes #244

BREAKING CHANGE:
the `current-day` attribute has been renamed to `view-date`

README.md

@@ -82,7 +82,7 @@ There is a single directive exposed to create the calendar, use it like so:
 ```javascript
 <mwl-calendar
     view="calendarView"
-    current-day="calendarDay"
+    view-date="calendarDate"
     events="events"
     view-title="calendarTitle"
     on-event-click="eventClicked(calendarEvent)"
@@ -106,9 +106,9 @@ For the calendar to display this variable needs to be set like so:
 $scope.calendarView = 'month';
 ```
 
-### current-day (required attribute)
+### view-date (required attribute)
 
-This variable holds the current day the calendar is centralised on. Each view will decide on its current year / month / week / day depending on the value of this variable.
+This variable holds the current date the calendar is centralised on. Each view will decide on its current year / month / week / day depending on the value of this variable.
 
 ### events (required attribute)
 
@@ -167,7 +167,7 @@ This expression is called when a month, day or hour on the calendar is clicked o
 
 ### cell-is-open
 
-A 2 way bound variable that when set to true will open the year or month view cell that corresponds to the date passed to the date object passed to `current-day`.
+A 2 way bound variable that when set to true will open the year or month view cell that corresponds to the date passed to the date object passed to `view-date`.
 
 ### day-view-start
 

index.html

@@ -86,7 +86,7 @@ <h2 class="text-center">{{ vm.calendarTitle }}</h2>
             events="vm.events"
             view="vm.calendarView"
             view-title="vm.calendarTitle"
-            current-day="vm.calendarDay"
+            view-date="vm.calendarDay"
             on-event-click="vm.eventClicked(calendarEvent)"
             on-event-times-changed="vm.eventTimesChanged(calendarEvent); calendarEvent.startsAt = calendarNewEventStart; calendarEvent.endsAt = calendarNewEventEnd"
             edit-event-html="'<i class=\'glyphicon glyphicon-pencil\'></i>'"

src/directives/mwlCalendar.js

@@ -12,7 +12,7 @@ angular
 
     vm.changeView = function(view, newDay) {
       vm.view = view;
-      vm.currentDay = newDay;
+      vm.viewDate = newDay;
     };
 
     vm.dateClicked = function(date) {
@@ -31,7 +31,7 @@ angular
 
     };
 
-    var previousDate = moment(vm.currentDay);
+    var previousDate = moment(vm.viewDate);
     var previousView = vm.view;
 
     function eventIsValid(event) {
@@ -58,7 +58,7 @@ angular
     function refreshCalendar() {
 
       if (calendarTitle[vm.view] && angular.isDefined($attrs.viewTitle)) {
-        vm.viewTitle = calendarTitle[vm.view](vm.currentDay);
+        vm.viewTitle = calendarTitle[vm.view](vm.viewDate);
       }
 
       vm.events = vm.events.filter(eventIsValid).map(function(event, index) {
@@ -67,7 +67,7 @@ angular
       });
 
       //if on-timespan-click="calendarDay = calendarDate" is set then don't update the view as nothing needs to change
-      var currentDate = moment(vm.currentDay);
+      var currentDate = moment(vm.viewDate);
       var shouldUpdate = true;
       if (
         previousDate.clone().startOf(vm.view).isSame(currentDate.clone().startOf(vm.view)) &&
@@ -91,7 +91,7 @@ angular
 
     //Refresh the calendar when any of these variables change.
     $scope.$watchGroup([
-      'vm.currentDay',
+      'vm.viewDate',
       'vm.view',
       'vm.cellIsOpen',
       function() {
@@ -117,7 +117,7 @@ angular
         events: '=',
         view: '=',
         viewTitle: '=?',
-        currentDay: '=',
+        viewDate: '=',
         editEventHtml: '=',
         deleteEventHtml: '=',
         cellIsOpen: '=',

src/directives/mwlCalendarDay.js

@@ -21,7 +21,7 @@ angular
 
       vm.view = calendarHelper.getDayView(
         vm.events,
-        vm.currentDay,
+        vm.viewDate,
         vm.dayViewStart,
         vm.dayViewEnd,
         vm.dayViewSplit
@@ -81,7 +81,7 @@ angular
       require: '^mwlCalendar',
       scope: {
         events: '=',
-        currentDay: '=',
+        viewDate: '=',
         onEventClick: '=',
         onEventTimesChanged: '=',
         onTimespanClick: '=',

src/directives/mwlCalendarHourList.js

@@ -13,7 +13,7 @@ angular
       dayViewEnd = moment(vm.dayViewEnd || '23:00', 'HH:mm');
       vm.dayViewSplit = parseInt(vm.dayViewSplit);
       vm.hours = [];
-      var dayCounter = moment(vm.currentDay)
+      var dayCounter = moment(vm.viewDate)
         .clone()
         .hours(dayViewStart.hours())
         .minutes(dayViewStart.minutes())
@@ -42,7 +42,7 @@ angular
       'vm.dayViewStart',
       'vm.dayViewEnd',
       'vm.dayViewSplit',
-      'vm.currentDay'
+      'vm.viewDate'
     ], function() {
       updateDays();
     });
@@ -55,7 +55,7 @@ angular
       template: calendarUseTemplates ? require('./../templates/calendarHourList.html') : '',
       controller: 'MwlCalendarHourListCtrl as vm',
       scope: {
-        currentDay: '=',
+        viewDate: '=',
         dayViewStart: '=',
         dayViewEnd: '=',
         dayViewSplit: '=',

src/directives/mwlCalendarMonth.js

@@ -14,7 +14,7 @@ angular
 
       vm.weekDays = calendarHelper.getWeekDayNames();
 
-      vm.view = calendarHelper.getMonthView(vm.events, vm.currentDay, vm.cellModifier);
+      vm.view = calendarHelper.getMonthView(vm.events, vm.viewDate, vm.cellModifier);
       var rows = Math.floor(vm.view.length / 7);
       vm.monthOffsets = [];
       for (var i = 0; i < rows; i++) {
@@ -25,7 +25,7 @@ angular
       if (vm.cellIsOpen && vm.openRowIndex === null) {
         vm.openDayIndex = null;
         vm.view.forEach(function(day) {
-          if (day.inMonth && moment(vm.currentDay).startOf('day').isSame(day.date)) {
+          if (day.inMonth && moment(vm.viewDate).startOf('day').isSame(day.date)) {
             vm.dayClicked(day, true);
           }
         });
@@ -97,7 +97,7 @@ angular
       require: '^mwlCalendar',
       scope: {
         events: '=',
-        currentDay: '=',
+        viewDate: '=',
         onEventClick: '=',
         onEditEventClick: '=',
         onDeleteEventClick: '=',

src/directives/mwlCalendarWeek.js

@@ -21,13 +21,13 @@ angular
       if (vm.showTimes) {
         vm.view = calendarHelper.getWeekViewWithTimes(
           vm.events,
-          vm.currentDay,
+          vm.viewDate,
           vm.dayViewStart,
           vm.dayViewEnd,
           vm.dayViewSplit
         );
       } else {
-        vm.view = calendarHelper.getWeekView(vm.events, vm.currentDay);
+        vm.view = calendarHelper.getWeekView(vm.events, vm.viewDate);
       }
     });
 
@@ -83,7 +83,7 @@ angular
       require: '^mwlCalendar',
       scope: {
         events: '=',
-        currentDay: '=',
+        viewDate: '=',
         onEventClick: '=',
         onEventTimesChanged: '=',
         dayViewStart: '=',

src/directives/mwlCalendarYear.js

@@ -10,13 +10,13 @@ angular
     vm.openMonthIndex = null;
 
     $scope.$on('calendar.refreshView', function() {
-      vm.view = calendarHelper.getYearView(vm.events, vm.currentDay, vm.cellModifier);
+      vm.view = calendarHelper.getYearView(vm.events, vm.viewDate, vm.cellModifier);
 
       //Auto open the calendar to the current day if set
       if (vm.cellIsOpen && vm.openMonthIndex === null) {
         vm.openMonthIndex = null;
         vm.view.forEach(function(month) {
-          if (moment(vm.currentDay).startOf('month').isSame(month.date)) {
+          if (moment(vm.viewDate).startOf('month').isSame(month.date)) {
             vm.monthClicked(month, true);
           }
         });
@@ -70,7 +70,7 @@ angular
       require: '^mwlCalendar',
       scope: {
         events: '=',
-        currentDay: '=',
+        viewDate: '=',
         onEventClick: '=',
         onEventTimesChanged: '=',
         onEditEventClick: '=',

src/services/calendarHelper.js

@@ -88,11 +88,11 @@ angular
       return weekdays;
     }
 
-    function getYearView(events, currentDay, cellModifier) {
+    function getYearView(events, viewDate, cellModifier) {
 
       var view = [];
-      var eventsInPeriod = getEventsInPeriod(currentDay, 'year', events);
-      var month = moment(currentDay).startOf('year');
+      var eventsInPeriod = getEventsInPeriod(viewDate, 'year', events);
+      var month = moment(viewDate).startOf('year');
       var count = 0;
       while (count < 12) {
         var startPeriod = month.clone();
@@ -116,11 +116,11 @@ angular
 
     }
 
-    function getMonthView(events, currentDay, cellModifier) {
+    function getMonthView(events, viewDate, cellModifier) {
 
-      var startOfMonth = moment(currentDay).startOf('month');
+      var startOfMonth = moment(viewDate).startOf('month');
       var day = startOfMonth.clone().startOf('week');
-      var endOfMonthView = moment(currentDay).endOf('month').endOf('week');
+      var endOfMonthView = moment(viewDate).endOf('month').endOf('week');
       var eventsInPeriod;
       if (calendarConfig.displayAllMonthEvents) {
         eventsInPeriod = filterEventsInPeriod(events, day, endOfMonthView);
@@ -132,7 +132,7 @@ angular
 
       while (day.isBefore(endOfMonthView)) {
 
-        var inMonth = day.month() === moment(currentDay).month();
+        var inMonth = day.month() === moment(viewDate).month();
         var monthEvents = [];
         if (inMonth || calendarConfig.displayAllMonthEvents) {
           monthEvents = filterEventsInPeriod(eventsInPeriod, day, day.clone().endOf('day'));
@@ -161,10 +161,10 @@ angular
 
     }
 
-    function getWeekView(events, currentDay) {
+    function getWeekView(events, viewDate) {
 
-      var startOfWeek = moment(currentDay).startOf('week');
-      var endOfWeek = moment(currentDay).endOf('week');
+      var startOfWeek = moment(viewDate).startOf('week');
+      var endOfWeek = moment(viewDate).endOf('week');
       var dayCounter = startOfWeek.clone();
       var days = [];
       var today = moment().startOf('day');
@@ -215,20 +215,20 @@ angular
 
     }
 
-    function getDayView(events, currentDay, dayViewStart, dayViewEnd, dayViewSplit) {
+    function getDayView(events, viewDate, dayViewStart, dayViewEnd, dayViewSplit) {
 
       var dayStartHour = moment(dayViewStart || '00:00', 'HH:mm').hours();
       var dayEndHour = moment(dayViewEnd || '23:00', 'HH:mm').hours();
       var hourHeight = (60 / dayViewSplit) * 30;
-      var calendarStart = moment(currentDay).startOf('day').add(dayStartHour, 'hours');
-      var calendarEnd = moment(currentDay).startOf('day').add(dayEndHour, 'hours');
+      var calendarStart = moment(viewDate).startOf('day').add(dayStartHour, 'hours');
+      var calendarEnd = moment(viewDate).startOf('day').add(dayEndHour, 'hours');
       var calendarHeight = (dayEndHour - dayStartHour + 1) * hourHeight;
       var hourHeightMultiplier = hourHeight / 60;
       var buckets = [];
       var eventsInPeriod = filterEventsInPeriod(
         events,
-        moment(currentDay).startOf('day').toDate(),
-        moment(currentDay).endOf('day').toDate()
+        moment(viewDate).startOf('day').toDate(),
+        moment(viewDate).endOf('day').toDate()
       );
 
       return eventsInPeriod.map(function(event) {
@@ -293,8 +293,8 @@ angular
 
     }
 
-    function getWeekViewWithTimes(events, currentDay, dayViewStart, dayViewEnd, dayViewSplit) {
-      var weekView = getWeekView(events, currentDay);
+    function getWeekViewWithTimes(events, viewDate, dayViewStart, dayViewEnd, dayViewSplit) {
+      var weekView = getWeekView(events, viewDate);
       var newEvents = [];
       weekView.days.forEach(function(day) {
         var dayEvents = weekView.events.filter(function(event) {

src/services/calendarTitle.js

@@ -6,21 +6,21 @@ angular
   .module('mwl.calendar')
   .factory('calendarTitle', function(moment, calendarConfig, calendarHelper) {
 
-    function day(currentDay) {
-      return calendarHelper.formatDate(currentDay, calendarConfig.titleFormats.day);
+    function day(viewDate) {
+      return calendarHelper.formatDate(viewDate, calendarConfig.titleFormats.day);
     }
 
-    function week(currentDay) {
+    function week(viewDate) {
       var weekTitleLabel = calendarConfig.titleFormats.week;
-      return weekTitleLabel.replace('{week}', moment(currentDay).week()).replace('{year}', moment(currentDay).format('YYYY'));
+      return weekTitleLabel.replace('{week}', moment(viewDate).week()).replace('{year}', moment(viewDate).format('YYYY'));
     }
 
-    function month(currentDay) {
-      return calendarHelper.formatDate(currentDay, calendarConfig.titleFormats.month);
+    function month(viewDate) {
+      return calendarHelper.formatDate(viewDate, calendarConfig.titleFormats.month);
     }
 
-    function year(currentDay) {
-      return calendarHelper.formatDate(currentDay, calendarConfig.titleFormats.year);
+    function year(viewDate) {
+      return calendarHelper.formatDate(viewDate, calendarConfig.titleFormats.year);
     }
 
     return {

src/templates/calendar.html

@@ -2,11 +2,11 @@
 
   <div class="alert alert-danger" ng-switch-default>The value passed to the view attribute of the calendar is not set</div>
 
-  <div class="alert alert-danger" ng-hide="vm.currentDay">The value passed to current-day attribute of the calendar is not set</div>
+  <div class="alert alert-danger" ng-hide="vm.viewDate">The value passed to view-date attribute of the calendar is not set</div>
 
   <mwl-calendar-year
     events="vm.events"
-    current-day="vm.currentDay"
+    view-date="vm.viewDate"
     on-event-click="vm.onEventClick"
     on-event-times-changed="vm.onEventTimesChanged"
     on-edit-event-click="vm.onEditEventClick"
@@ -21,7 +21,7 @@
 
   <mwl-calendar-month
     events="vm.events"
-    current-day="vm.currentDay"
+    view-date="vm.viewDate"
     on-event-click="vm.onEventClick"
     on-event-times-changed="vm.onEventTimesChanged"
     on-edit-event-click="vm.onEditEventClick"
@@ -38,7 +38,7 @@
 
   <mwl-calendar-week
     events="vm.events"
-    current-day="vm.currentDay"
+    view-date="vm.viewDate"
     on-event-click="vm.onEventClick"
     on-event-times-changed="vm.onEventTimesChanged"
     day-view-start="vm.dayViewStart"
@@ -50,7 +50,7 @@
 
   <mwl-calendar-day
     events="vm.events"
-    current-day="vm.currentDay"
+    view-date="vm.viewDate"
     on-event-click="vm.onEventClick"
     on-event-times-changed="vm.onEventTimesChanged"
     on-timespan-click="vm.onTimespanClick"

src/templates/calendarDayView.html

@@ -11,7 +11,7 @@
       day-view-end="vm.dayViewEnd"
       day-view-split="vm.dayViewSplit"
       on-timespan-click="vm.onTimespanClick"
-      current-day="vm.currentDay">
+      view-date="vm.viewDate">
     </mwl-calendar-hour-list>
 
     <div

src/templates/calendarWeekView.html

@@ -32,7 +32,7 @@
       day-view-start="vm.dayViewStart"
       day-view-end="vm.dayViewEnd"
       day-view-split="vm.dayViewSplit"
-      current-day="vm.currentDay"
+      view-date="vm.viewDate"
       on-timespan-click="vm.onTimespanClick"
       ng-if="vm.showTimes">
     </mwl-calendar-hour-list>