feat(calendar.js) added a watcher for the calendars options closes #55

Signed-off-by: Josh Kurz <josh.kurz@turner.com>

Author: jkurz

demo/calendarDemo.js

@@ -8,6 +8,8 @@ function CalendarCtrl($scope) {
     var d = date.getDate();
     var m = date.getMonth();
     var y = date.getFullYear();
+    
+    $scope.changeTo = 'Hungarian';
     /* event source that pulls from google.com */
     $scope.eventSource = {
             url: "http://www.google.com/calendar/feeds/usa__en%40holiday.calendar.google.com/public/basic",
@@ -107,6 +109,19 @@ function CalendarCtrl($scope) {
         eventDrop: $scope.alertOnDrop,
         eventResize: $scope.alertOnResize
       }
+    };
+     $scope.uiConfig = {calendar: {}};
+
+    $scope.changeLang = function() {
+      if($scope.changeTo === 'Hungarian'){
+        $scope.uiConfig.calendar.dayNames = ["Vasárnap", "Hétfő", "Kedd", "Szerda", "Csütörtök", "Péntek", "Szombat"];
+        $scope.uiConfig.calendar.dayNamesShort = ["Vas", "Hét", "Kedd", "Sze", "Csüt", "Pén", "Szo"];
+        $scope.changeTo= 'English';
+      } else {
+        $scope.uiConfig.calendar.dayNames = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
+        $scope.uiConfig.calendar.dayNamesShort = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
+        $scope.changeTo = 'Hungarian';
+      };
     };
     /* event sources array*/
     $scope.eventSources = [$scope.events, $scope.eventSource, $scope.eventsF];

demo/index.html

@@ -66,10 +66,12 @@ <h3>Why?</h3>
                         <p>Why Not?</p>
 
                         <div class="btn-group calTools">
-                          <button class="btn btn-info" ng-click="addRemoveEventSource(eventSources,eventSource)">
-                            Toggle an event source
+                          <button class="btn" ng-click="changeLang()">
+                            {{changeTo}}
+                          </button>              
+                          <button class="btn" ng-click="addRemoveEventSource(eventSources,eventSource)">
+                            Toggle Source
                           </button>
-
                           <button type="button" class="btn btn-primary" ng-click="addEvent()">
                             Add Event
                           </button>

src/calendar.js

@@ -155,14 +155,27 @@ angular.module('ui.calendar', [])
 
     return {
       restrict: 'A',
-      scope: {eventSources:'=ngModel',config:'=',calendarWatchEvent: '&'},
+      scope: {eventSources:'=ngModel',calendarWatchEvent: '&'},
       controller: 'uiCalendarCtrl',
       link: function(scope, elm, attrs, controller) {
 
         var sources = scope.eventSources,
             sourcesChanged = false;
             eventSourcesWatcher = controller.changeWatcher(sources, controller.sourcesFingerprint),
-            eventsWatcher = controller.changeWatcher(controller.allEvents, controller.eventsFingerprint);
+            eventsWatcher = controller.changeWatcher(controller.allEvents, controller.eventsFingerprint),
+            options = null;
+        
+        function getOptions(){
+          options = { eventSources: sources };
+          angular.extend(options, uiCalendarConfig, attrs.uiCalendar ? scope.$parent.$eval(attrs.uiCalendar) : {});
+          var options2 = {};
+          for(var o in options){
+            if(o !== 'eventSources'){
+              options2[o] = options[o];
+            }
+          }
+          return JSON.stringify(options2);
+        }
 
         scope.destroy = function(){
           if(attrs.calendar) {
@@ -173,8 +186,7 @@ angular.module('ui.calendar', [])
         };
 
         scope.init = function(){
-          var options = { eventSources: sources };
-          angular.extend(options, uiCalendarConfig, attrs.uiCalendar ? scope.$parent.$eval(attrs.uiCalendar) : {});
+          getOptions();
           scope.calendar.fullCalendar(options);
         };
 
@@ -212,7 +224,14 @@ angular.module('ui.calendar', [])
             return false;
           }
         });
-        }
+
+        scope.$watch(getOptions, function(newO,oldO){
+          if(newO !== oldO){
+            scope.destroy();
+            scope.init();
+          }
+        });
+      }
     };
 }]);
 

test/calendar.spec.js

@@ -75,7 +75,7 @@ describe('uiCalendar', function () {
               height: 200,
               weekends: false,
               defaultView: 'month'
-           }
+            }
           };
 
     }));
@@ -172,6 +172,14 @@ describe('uiCalendar', function () {
             expect(fullCalendarParam1).toEqual(scope.events[0]);
         });
 
+        it('make sure that if the calendars options change then the fullcalendar method is called with the new options', function () {
+            expect($.fn.fullCalendar.mostRecentCall.args[0].weekends).toEqual(false);
+            scope.uiConfig.calendar.weekends = true;
+            scope.$apply();
+            expect($.fn.fullCalendar.callCount).toEqual(2);
+            expect($.fn.fullCalendar.mostRecentCall.args[0].weekends).toEqual(true);
+        });
+
     });
 
     describe('calendarCtrl', function(){