diff --git a/README.md b/README.md index 6e347ea..07a418c 100644 --- a/README.md +++ b/README.md @@ -94,6 +94,36 @@ function MyAppController($scope) { } ``` +#### special-dates + +You can specify a function that will determine if a date is special or not. You can pass `formattedDate` as an argument to receive the date formatted in the current locale, or `date` to receive the date object. You can pass both of them if you need. + +```html +
+``` + +```javascript +function MyAppController($scope) { + $scope.specialDatesFn = function(formattedDate) { + return ['2013-11-10', '2013-11-15', '2013-11-19'].indexOf(formattedDate) > -1; + } +} +``` + +This is handy if you want to disable dates programatically. + +```html +
+``` + +```javascript +function MyAppController($scope) { + $scope.specialDatesFn = function(date) { + return date.getDay() === 6; // Disable every Sunday + } +} +``` + #### default-date Allows you to preset the calendar to a particular month without setting the chosen date. diff --git a/dist/angular-pickadate.css b/dist/angular-pickadate.css index f54b8b9..fe12389 100644 --- a/dist/angular-pickadate.css +++ b/dist/angular-pickadate.css @@ -34,6 +34,8 @@ border-right: 1px solid #DCDCDC; } .pickadate-cell li:nth-child(1), .pickadate-cell li:nth-child(8), .pickadate-cell li:nth-child(15), .pickadate-cell li:nth-child(22), .pickadate-cell li:nth-child(29), .pickadate-cell li:nth-child(36) { border-left: 1px solid #DCDCDC; } + .pickadate-cell .pickadate-special { + text-decoration: underline; } .pickadate-cell .pickadate-disabled { color: #DCDCDC; } .pickadate-cell .pickadate-disabled a { diff --git a/dist/angular-pickadate.js b/dist/angular-pickadate.js index ad93618..15424a1 100755 --- a/dist/angular-pickadate.js +++ b/dist/angular-pickadate.js @@ -98,13 +98,14 @@ } return function(format, options) { - var minDate, maxDate, disabledDates, currentDate, weekStartsOn, noExtraRows; + var minDate, maxDate, disabledDates, specialDates, currentDate, weekStartsOn, noExtraRows; options = options || {}; format = format || 'yyyy-MM-dd'; weekStartsOn = options.weekStartsOn; noExtraRows = options.noExtraRows; disabledDates = options.disabledDates || angular.noop; + specialDates = options.specialDates || angular.noop; if (!angular.isNumber(weekStartsOn) || weekStartsOn < 0 || weekStartsOn > 6) weekStartsOn = 0; @@ -152,6 +153,7 @@ var localDate = angular.copy(date), formattedDate = dateFilter(localDate, format), disabled = disabledDates({date: localDate, formattedDate: formattedDate}), + special = specialDates({date: localDate, formattedDate: formattedDate}), monthOffset = this.getMonthOffset(localDate, currentDate), outOfMinRange = localDate < minDate, outOfMaxRange = localDate > maxDate, @@ -163,6 +165,7 @@ formattedDate: formattedDate, today: formattedDate === dateFilter(new Date(), format), disabled: disabled, + special: special, outOfMinRange: outOfMinRange, outOfMaxRange: outOfMaxRange, monthOffset: monthOffset, @@ -250,7 +253,8 @@ minDate: '=', maxDate: '=', disabledDates: '&', - weekStartsOn: '=' + weekStartsOn: '=', + specialDates: '&' }, link: function(scope, element, attrs, ngModel) { @@ -265,7 +269,8 @@ nextMonthSelectable: /^(next|both)$/.test(attrs.selectOtherMonths), weekStartsOn: scope.weekStartsOn, noExtraRows: attrs.hasOwnProperty('noExtraRows'), - disabledDates: scope.disabledDates + disabledDates: scope.disabledDates, + specialDates: scope.specialDates }); scope.displayPicker = !wantsModal; @@ -282,6 +287,8 @@ }; var $render = ngModel.$render = function(options) { + if (!ngModel.$viewValue) return; + if (angular.isArray(ngModel.$viewValue)) { selectedDates = ngModel.$viewValue; } else if (ngModel.$viewValue) { @@ -360,6 +367,7 @@ if (date.today) date.classNames.push('pickadate-today'); if (date.disabled) date.classNames.push('pickadate-unavailable'); + if (date.special) date.classNames.push('pickadate-special'); return date; }); diff --git a/dist/angular-pickadate.min.js b/dist/angular-pickadate.min.js index 09f19e5..aa01d39 100755 --- a/dist/angular-pickadate.min.js +++ b/dist/angular-pickadate.min.js @@ -1 +1 @@ -!function(e){"use strict";function t(t,a){var n=[];return e.forEach(t,function(t){n.push(e.isFunction(a)?a(t):t[a])}),n}var a=[].indexOf||function(e){for(var t=0,a=this.length;t=300?l.left=r+a.getBoundingClientRect().left+"px":l.right=s-a.getBoundingClientRect().right-r+"px",l},o=function(e,t){for(var a=t.parentNode;null!==a;){if(a===e)return!0;a=a.parentNode}return!1};return function(e,n,i){var s=function(t){e.displayPicker=t,e.$apply()};n.on("focus",function(){e.modalStyles=r(n[0]),s(!0)}),n.on("keydown",function(e){a.call([9,13,27],e.keyCode)>=0&&s(!1)}),t.on("click",function(e){o(i,e.target)||e.target===n[0]||s(!1)})}}]).factory("pickadateDateHelper",["$locale","dateFilter",function(t,a){function n(e){switch(e){case"dd":return"day";case"MM":return"month";case"yyyy":return"year"}}return function(i,r){var o,s,l,c,d,u;return r=r||{},i=i||"yyyy-MM-dd",d=r.weekStartsOn,u=r.noExtraRows,l=r.disabledDates||e.noop,(!e.isNumber(d)||d<0||d>6)&&(d=0),{parseDate:function(t){if(t){if(e.isDate(t))return new Date(t);var a="(dd|MM|yyyy)",r=i.match(/[-|\/]/)[0],o=t.split(r),s=new RegExp([a,a,a].join(r)),l=i.match(s),c={};if(l.shift(),e.forEach(l,function(e,t){c[n(e)]=parseInt(o[t],10)}),!(isNaN(c.year)||isNaN(c.month)||isNaN(c.day)))return new Date(c.year,c.month-1,c.day,3)}},setRestrictions:function(e){o=this.parseDate(e.minDate)||new Date(0),s=this.parseDate(e.maxDate)||new Date(99999999999999),c=e.currentDate},allowPrevMonth:function(){return c>o},allowNextMonth:function(){var t=e.copy(c);return t.setMonth(t.getMonth()+1),t<=s},buildDateObject:function(t){var n=e.copy(t),d=a(n,i),u=l({date:n,formattedDate:d}),f=this.getMonthOffset(n,c),p=ns,D=f===-1&&!r.previousMonthSelectable||1===f&&!r.nextMonthSelectable;return{date:n,formattedDate:d,today:d===a(new Date,i),disabled:u,outOfMinRange:p,outOfMaxRange:h,monthOffset:f,enabled:!(u||p||h||D)}},buildDates:function(t,a,n){var i=[],r=new Date(t,a,1,3),o=new Date(t,a+1,0,3);for(n=n||{},c=e.copy(r);r.getDay()!==d;)r.setDate(r.getDate()-1);for(var s=0;s<42&&!(u&&r.getDay()===d&&r>o);s++)i.push(this.buildDateObject(r)),r.setDate(r.getDate()+1);return i},buildDayNames:function(){var e=t.DATETIME_FORMATS.SHORTDAY;if(d){e=e.slice(0);for(var a=0;a'+i.trustAsHtml(c.t("next"))+'

{{currentDate | date:"MMMM yyyy"}}

  • {{dayName}}
  • {{dateObj.date | date:"d"}}
';return{require:"ngModel",scope:{defaultDate:"=",minDate:"=",maxDate:"=",disabledDates:"&",weekStartsOn:"="},link:function(n,i,o,s){function c(){var e=k.buildDates(n.currentDate.getFullYear(),n.currentDate.getMonth());n.allowPrevMonth=k.allowPrevMonth(),n.allowNextMonth=k.allowNextMonth(),n.dayNames=k.buildDayNames(),n.dates=t(e,function(e){return e.classNames=[e.enabled?"pickadate-enabled":"pickadate-disabled"],e.today&&e.classNames.push("pickadate-today"),e.disabled&&e.classNames.push("pickadate-unavailable"),e})}function p(e,a){a=a||{},y?s.$setViewValue(t(e,"formattedDate")):s.$setViewValue(e[0]&&e[0].formattedDate),a.skipRenderInput||i.val(s.$viewValue)}function h(e,n){var i=a.call(t(n,"formattedDate"),e.formattedDate);return i===-1?n=D(e,n):(v||n.length>1)&&n.splice(i,1),n}function D(e,t){return y?t.push(e):t=[e],t}var y=o.hasOwnProperty("multiple"),v=o.hasOwnProperty("allowBlankDate"),g=[],m=i[0]instanceof HTMLInputElement,w=r(f)(n),M=(o.format||"yyyy-MM-dd").replace(/m/g,"M"),k=l(M,{previousMonthSelectable:/^(previous|both)$/.test(o.selectOtherMonths),nextMonthSelectable:/^(next|both)$/.test(o.selectOtherMonths),weekStartsOn:n.weekStartsOn,noExtraRows:o.hasOwnProperty("noExtraRows"),disabledDates:n.disabledDates});n.displayPicker=!m,n.setDate=function(e){e.enabled&&(g=h(e,g),p(g),n.changeMonth(e.monthOffset),n.displayPicker=!m)};var b=s.$render=function(a){e.isArray(s.$viewValue)?g=s.$viewValue:s.$viewValue&&(g=[s.$viewValue]),n.currentDate=k.parseDate(n.defaultDate||g[0])||new Date,k.setRestrictions(n),g=t(g,function(e){return k.buildDateObject(k.parseDate(e))}),g=u(g,{enabled:!0}),p(g,a),c()};n.classesFor=function(e){var n=t(g,"formattedDate"),i=a.call(n,e.formattedDate)>=0?"pickadate-active":null;return e.classNames.concat(i)},n.changeMonth=function(e){e&&(n.currentDate.setDate(1),n.currentDate.setMonth(n.currentDate.getMonth()+e),c())},n.$watch(function(){return e.toJson([n.minDate,n.maxDate])},b),m?(d(n,i,w[0]),n.$watch(function(){return s.$viewValue},function(e){var t=k.parseDate(e);t&&b({skipRenderInput:!0}),s.$setValidity("date",!!t)}),n.$$postDigest(function(){o.value&&(s.$viewValue=o.value,b())}),i.after(w.addClass("pickadate-modal"))):i.append(w)}}}])}(window.angular); \ No newline at end of file +!function(e){"use strict";function t(t,a){var n=[];return e.forEach(t,function(t){n.push(e.isFunction(a)?a(t):t[a])}),n}var a=[].indexOf||function(e){for(var t=0,a=this.length;t=300?l.left=r+a.getBoundingClientRect().left+"px":l.right=s-a.getBoundingClientRect().right-r+"px",l},o=function(e,t){for(var a=t.parentNode;null!==a;){if(a===e)return!0;a=a.parentNode}return!1};return function(e,n,i){var s=function(t){e.displayPicker=t,e.$apply()};n.on("focus",function(){e.modalStyles=r(n[0]),s(!0)}),n.on("keydown",function(e){a.call([9,13,27],e.keyCode)>=0&&s(!1)}),t.on("click",function(e){o(i,e.target)||e.target===n[0]||s(!1)})}}]).factory("pickadateDateHelper",["$locale","dateFilter",function(t,a){function n(e){switch(e){case"dd":return"day";case"MM":return"month";case"yyyy":return"year"}}return function(i,r){var o,s,l,c,d,u,p;return r=r||{},i=i||"yyyy-MM-dd",u=r.weekStartsOn,p=r.noExtraRows,l=r.disabledDates||e.noop,c=r.specialDates||e.noop,(!e.isNumber(u)||u<0||u>6)&&(u=0),{parseDate:function(t){if(t){if(e.isDate(t))return new Date(t);var a="(dd|MM|yyyy)",r=i.match(/[-|\/]/)[0],o=t.split(r),s=new RegExp([a,a,a].join(r)),l=i.match(s),c={};if(l.shift(),e.forEach(l,function(e,t){c[n(e)]=parseInt(o[t],10)}),!(isNaN(c.year)||isNaN(c.month)||isNaN(c.day)))return new Date(c.year,c.month-1,c.day,3)}},setRestrictions:function(e){o=this.parseDate(e.minDate)||new Date(0),s=this.parseDate(e.maxDate)||new Date(99999999999999),d=e.currentDate},allowPrevMonth:function(){return d>o},allowNextMonth:function(){var t=e.copy(d);return t.setMonth(t.getMonth()+1),t<=s},buildDateObject:function(t){var n=e.copy(t),u=a(n,i),p=l({date:n,formattedDate:u}),f=c({date:n,formattedDate:u}),h=this.getMonthOffset(n,d),D=ns,y=h===-1&&!r.previousMonthSelectable||1===h&&!r.nextMonthSelectable;return{date:n,formattedDate:u,today:u===a(new Date,i),disabled:p,special:f,outOfMinRange:D,outOfMaxRange:v,monthOffset:h,enabled:!(p||D||v||y)}},buildDates:function(t,a,n){var i=[],r=new Date(t,a,1,3),o=new Date(t,a+1,0,3);for(n=n||{},d=e.copy(r);r.getDay()!==u;)r.setDate(r.getDate()-1);for(var s=0;s<42&&!(p&&r.getDay()===u&&r>o);s++)i.push(this.buildDateObject(r)),r.setDate(r.getDate()+1);return i},buildDayNames:function(){var e=t.DATETIME_FORMATS.SHORTDAY;if(u){e=e.slice(0);for(var a=0;a'+i.trustAsHtml(c.t("next"))+'

{{currentDate | date:"MMMM yyyy"}}

  • {{dayName}}
  • {{dateObj.date | date:"d"}}
';return{require:"ngModel",scope:{defaultDate:"=",minDate:"=",maxDate:"=",disabledDates:"&",weekStartsOn:"=",specialDates:"&"},link:function(n,i,o,s){function c(){var e=k.buildDates(n.currentDate.getFullYear(),n.currentDate.getMonth());n.allowPrevMonth=k.allowPrevMonth(),n.allowNextMonth=k.allowNextMonth(),n.dayNames=k.buildDayNames(),n.dates=t(e,function(e){return e.classNames=[e.enabled?"pickadate-enabled":"pickadate-disabled"],e.today&&e.classNames.push("pickadate-today"),e.disabled&&e.classNames.push("pickadate-unavailable"),e.special&&e.classNames.push("pickadate-special"),e})}function f(e,a){a=a||{},v?s.$setViewValue(t(e,"formattedDate")):s.$setViewValue(e[0]&&e[0].formattedDate),a.skipRenderInput||i.val(s.$viewValue)}function h(e,n){var i=a.call(t(n,"formattedDate"),e.formattedDate);return i===-1?n=D(e,n):(y||n.length>1)&&n.splice(i,1),n}function D(e,t){return v?t.push(e):t=[e],t}var v=o.hasOwnProperty("multiple"),y=o.hasOwnProperty("allowBlankDate"),m=[],g=i[0]instanceof HTMLInputElement,w=r(p)(n),M=(o.format||"yyyy-MM-dd").replace(/m/g,"M"),k=l(M,{previousMonthSelectable:/^(previous|both)$/.test(o.selectOtherMonths),nextMonthSelectable:/^(next|both)$/.test(o.selectOtherMonths),weekStartsOn:n.weekStartsOn,noExtraRows:o.hasOwnProperty("noExtraRows"),disabledDates:n.disabledDates,specialDates:n.specialDates});n.displayPicker=!g,n.setDate=function(e){e.enabled&&(m=h(e,m),f(m),n.changeMonth(e.monthOffset),n.displayPicker=!g)};var b=s.$render=function(a){s.$viewValue&&(e.isArray(s.$viewValue)?m=s.$viewValue:s.$viewValue&&(m=[s.$viewValue]),n.currentDate=k.parseDate(n.defaultDate||m[0])||new Date,k.setRestrictions(n),m=t(m,function(e){return k.buildDateObject(k.parseDate(e))}),m=u(m,{enabled:!0}),f(m,a),c())};n.classesFor=function(e){var n=t(m,"formattedDate"),i=a.call(n,e.formattedDate)>=0?"pickadate-active":null;return e.classNames.concat(i)},n.changeMonth=function(e){e&&(n.currentDate.setDate(1),n.currentDate.setMonth(n.currentDate.getMonth()+e),c())},n.$watch(function(){return e.toJson([n.minDate,n.maxDate])},b),g?(d(n,i,w[0]),n.$watch(function(){return s.$viewValue},function(e){var t=k.parseDate(e);t&&b({skipRenderInput:!0}),s.$setValidity("date",!!t)}),n.$$postDigest(function(){o.value&&(s.$viewValue=o.value,b())}),i.after(w.addClass("pickadate-modal"))):i.append(w)}}}])}(window.angular); \ No newline at end of file diff --git a/src/angular-pickadate.js b/src/angular-pickadate.js index ad93618..15424a1 100755 --- a/src/angular-pickadate.js +++ b/src/angular-pickadate.js @@ -98,13 +98,14 @@ } return function(format, options) { - var minDate, maxDate, disabledDates, currentDate, weekStartsOn, noExtraRows; + var minDate, maxDate, disabledDates, specialDates, currentDate, weekStartsOn, noExtraRows; options = options || {}; format = format || 'yyyy-MM-dd'; weekStartsOn = options.weekStartsOn; noExtraRows = options.noExtraRows; disabledDates = options.disabledDates || angular.noop; + specialDates = options.specialDates || angular.noop; if (!angular.isNumber(weekStartsOn) || weekStartsOn < 0 || weekStartsOn > 6) weekStartsOn = 0; @@ -152,6 +153,7 @@ var localDate = angular.copy(date), formattedDate = dateFilter(localDate, format), disabled = disabledDates({date: localDate, formattedDate: formattedDate}), + special = specialDates({date: localDate, formattedDate: formattedDate}), monthOffset = this.getMonthOffset(localDate, currentDate), outOfMinRange = localDate < minDate, outOfMaxRange = localDate > maxDate, @@ -163,6 +165,7 @@ formattedDate: formattedDate, today: formattedDate === dateFilter(new Date(), format), disabled: disabled, + special: special, outOfMinRange: outOfMinRange, outOfMaxRange: outOfMaxRange, monthOffset: monthOffset, @@ -250,7 +253,8 @@ minDate: '=', maxDate: '=', disabledDates: '&', - weekStartsOn: '=' + weekStartsOn: '=', + specialDates: '&' }, link: function(scope, element, attrs, ngModel) { @@ -265,7 +269,8 @@ nextMonthSelectable: /^(next|both)$/.test(attrs.selectOtherMonths), weekStartsOn: scope.weekStartsOn, noExtraRows: attrs.hasOwnProperty('noExtraRows'), - disabledDates: scope.disabledDates + disabledDates: scope.disabledDates, + specialDates: scope.specialDates }); scope.displayPicker = !wantsModal; @@ -282,6 +287,8 @@ }; var $render = ngModel.$render = function(options) { + if (!ngModel.$viewValue) return; + if (angular.isArray(ngModel.$viewValue)) { selectedDates = ngModel.$viewValue; } else if (ngModel.$viewValue) { @@ -360,6 +367,7 @@ if (date.today) date.classNames.push('pickadate-today'); if (date.disabled) date.classNames.push('pickadate-unavailable'); + if (date.special) date.classNames.push('pickadate-special'); return date; }); diff --git a/src/angular-pickadate.scss b/src/angular-pickadate.scss index 1880d5a..c8573e7 100644 --- a/src/angular-pickadate.scss +++ b/src/angular-pickadate.scss @@ -43,6 +43,9 @@ border-left: 1px solid #DCDCDC; } } + .pickadate-special { + text-decoration: underline + } .pickadate-disabled { color: #DCDCDC; a { diff --git a/test/angular-pickadate.spec.js b/test/angular-pickadate.spec.js index 0d4b626..e4abb4c 100644 --- a/test/angular-pickadate.spec.js +++ b/test/angular-pickadate.spec.js @@ -10,6 +10,7 @@ describe('pickadate', function () { pickadateI18nProvider, defaultHtml = '
' + '
'; @@ -27,6 +28,9 @@ describe('pickadate', function () { $document = _$document_; $scope.disabledDatesFn = function(date, formattedDate) { return ($scope.disabledDates || []).indexOf(formattedDate) > -1; + }, + $scope.specialDatesFn = function(date, formattedDate) { + return ($scope.specialDates || []).indexOf(formattedDate) > -1; } }); }); @@ -145,6 +149,40 @@ describe('pickadate', function () { }); + describe('Special dates', function() { + + describe('As an array', function() { + beforeEach(function() { + $scope.specialDates = ['2014-05-20', '2014-05-26']; + compile(); + }); + + it("adds the 'pickadate-special' class to the special dates", function() { + expect($('li:contains(20)')).to.have.class('pickadate-special'); + expect($('li:contains(26)')).to.have.class('pickadate-special'); + }); + }); + + describe('As a function', function() { + beforeEach(function() { + $scope.specialDatesFn = function(date) { + return date.getDay() <= 1; + } + compile(); + }); + + it("adds the 'pickadate-special' class to the special dates", function() { + expect($('li:contains(11)')).to.have.class('pickadate-special'); + expect($('li:contains(12)')).to.have.class('pickadate-special'); + expect($('li:contains(18)')).to.have.class('pickadate-special'); + expect($('li:contains(19)')).to.have.class('pickadate-special'); + expect($('li:contains(25)')).to.have.class('pickadate-special'); + expect($('li:contains(26)')).to.have.class('pickadate-special'); + }); + }) + + }); + describe('Watchers', function() { describe('Min && max date', function() {