diff --git a/.gitignore b/.gitignore index 123ae94..a6f2ffa 100644 --- a/.gitignore +++ b/.gitignore @@ -25,3 +25,44 @@ build/Release # Dependency directory # https://www.npmjs.org/doc/misc/npm-faq.html#should-i-check-my-node_modules-folder-into-git node_modules + +# Folders +target/ +.settings/ +node_modules/ + +# Java class files +*.class +*.com +*.dll +*.exe +*.o +*.so + +# Package Files # +*.7z +*.dmg +*.gz +*.iso +*.jar +*.war +*.ear +*.rar +*.tar + +# Logs and databases # +###################### +*.log +*.sqlite + +# virtual machine crash logs, see http://www.java.com/en/download/help/error_hotspot.xml +hs_err_pid* + +# Eclipse Files +.classpath +.project + +# Intellij Files +.idea +*.iml + diff --git a/.idea/workspace.xml b/.idea/workspace.xml new file mode 100644 index 0000000..6af9b4a --- /dev/null +++ b/.idea/workspace.xml @@ -0,0 +1,777 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + datetime-picker + dateFilter + onChangeCallback + onCh + future + callback + $eval + here + date-only + future-only + futureOnly + some + dateformat + format + dateOnly + someday + dateFormat + startDate + attrs.startDate + date-format + gmtDate + someda + ;a + + + + + + + + + + + + + + true + DEFINITION_ORDER + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + project + + + + + + + + + + + + + + + + + + + + + + + + + + + 1481540185631 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/README.md b/README.md index 44c799b..c42083d 100644 --- a/README.md +++ b/README.md @@ -1,17 +1,17 @@ -Simple DateTime Picker For AngularJS -=================================== +Simple Date / DateTime Picker For AngularJS +=========================================== -No JQuery, No Bootstrap, Just AngularJS (ver. 1.3+) +No JQuery, No Bootstrap, Just AngularJS (ver. 1.4+) -[DEMO](https://rawgit.com/kineticsocial/angularjs-datetime-picker/master/index.html) -[![Imgur](http://i.imgur.com/UJfYMN6.png?1)](https://rawgit.com/kineticsocial/angularjs-datetime-picker/master/index.html) +[DEMO](https://rawgit.com/mani-s17/angularjs-datetime-picker/master/index.html) +[![Imgur](http://i.imgur.com/UJfYMN6.png?1)](https://rawgit.com/mani-s17/angularjs-datetime-picker/master/index.html) To Get Started -------------- -For Bower users, +For npm users, - `$ bower install angularjs-datetime-picker` + `$ npm i angularjs-datetime-picker-v0.2.0` 1. Include `angularjs-datetime-picker.js` and `angularjs-datetime-picker.css` @@ -32,19 +32,30 @@ Attributes - date-format: optional, date format e.g. 'yyyy-MM-dd' - year: optional, year selected, e.g. 2015 - month: optional, month selected, e.g. 5 - - day: optiona, day selected, e.g. 31 + - day: optional, day selected, e.g. 31 - hour: optional, hour selected, 23 - minute: optional, minute selected, 59 - date-only: optional, if set, timepicker will be hidden - - future-only: optional, if set, forces validation errors on dates earlier than now + - future-only: optional, if set, Date which is older than today's Date will be not be selectable (Past time for same date is not handled) + - start-date optional, if set, date which is on or after start-date will be selectable + - end-date optional, if set, date which is on or before end-date will be selectable + - start-date & end-date: optional, if set, date which is in between the range will only be selectable + Note: + future-only tag has more precedence than start-date & end-date tags Examples -------- - + + + + + + + @@ -53,3 +64,6 @@ Examples + +This project has been forked from [KineticSocial-angularjs-datetime-picker](https://github.com/kineticsocial/angularjs-datetime-picker) an inactive project. +We are actively working on this project to enhance & fix issues. diff --git a/angularjs-datetime-picker.css b/angularjs-datetime-picker.css index 240be45..9e3ae5b 100644 --- a/angularjs-datetime-picker.css +++ b/angularjs-datetime-picker.css @@ -34,15 +34,14 @@ right: 10px; } .angularjs-datetime-picker > .adp-days { - width: 210px; /* 30 x 7 */ - margin: 10px; + padding: 10px; text-align: center; } .angularjs-datetime-picker > .adp-days > .adp-day-of-week, .angularjs-datetime-picker > .adp-days > .adp-day { box-sizing: border-box; -moz-box-sizing: border-box; border: 1px solid transparent; - width: 30px; + width: 14%; line-height: 28px; float: left; } @@ -70,5 +69,5 @@ } .angularjs-datetime-picker input[type=range] { - width: 150px; -} + width: 100%; +} \ No newline at end of file diff --git a/angularjs-datetime-picker.js b/angularjs-datetime-picker.js index e86247d..1746f48 100644 --- a/angularjs-datetime-picker.js +++ b/angularjs-datetime-picker.js @@ -34,7 +34,7 @@ var datetimePickerEl; var _this = this; var removeEl = function(el) { - el && el.remove(); + el && el.parentElement.removeChild(el); $document[0].body.removeEventListener('click', _this.closeDatetimePicker); }; @@ -51,6 +51,12 @@ if (options.dateOnly === '' || options.dateOnly === true) { div.attr('date-only', 'true'); } + if (options.futureOnly === '' || options.futureOnly === true) { + div.attr('future-only', 'true'); + } else { + options.startDate && div.attr('start-date', options.startDate); + options.endDate && div.attr('end-date', options.endDate); + } if (options.closeOnSelect === 'false') { div.attr('close-on-select', 'false'); } @@ -61,26 +67,25 @@ datetimePickerEl.triggerEl = options.triggerEl; $document[0].body.appendChild(datetimePickerEl); - - //show datetimePicker below triggerEl - var bcr = triggerEl.getBoundingClientRect(); - + /*angular.element(triggerEl).after(datetimePickerEl);*/ options.scope.$apply(); + //show datetimePicker below triggerEl with respect to window size + // comment below code to add popup with input and un comment above code + var bcr = triggerEl.getBoundingClientRect(); var datePickerElBcr = datetimePickerEl.getBoundingClientRect(); - datetimePickerEl.style.position='absolute'; if(bcr.width > datePickerElBcr.width){ - datetimePickerEl.style.left= (bcr.left + bcr.width - datePickerElBcr.width + window.scrollX) + 'px'; + datetimePickerEl.style.left= (bcr.left + bcr.width - datePickerElBcr.width + window.pageXOffset) + 'px'; } else { - datetimePickerEl.style.left= (bcr.left + window.scrollX) + 'px'; + datetimePickerEl.style.left= (bcr.left + window.pageXOffset) + 'px'; } if (bcr.top < 300 || window.innerHeight - bcr.bottom > 300) { - datetimePickerEl.style.top = (bcr.bottom + window.scrollY) + 'px'; + datetimePickerEl.style.top = (bcr.bottom + window.pageYOffset) + 'px'; } else { - datetimePickerEl.style.top = (bcr.top - datePickerElBcr.height + window.scrollY) + 'px'; + datetimePickerEl.style.top = (bcr.top - datePickerElBcr.height + window.pageYOffset) + 'px'; } $document[0].body.addEventListener('click', this.closeDatetimePicker); @@ -115,9 +120,10 @@ '
', '
{{::dayOfWeek.firstLetter}}
', '
{{::day}}
', - '
{{::day}}
', '
', '
', - ' {{("0"+inputHour).slice(-2)}} : {{("0"+inputMinute).slice(-2)}}
', - ' ', - ' ', + ' Time: {{("0"+inputHour).slice(-2)}} : {{("0"+inputMinute).slice(-2)}}
', + ' Hour: ', + ' Min: ', '
', ''].join("\n"); @@ -226,26 +232,55 @@ } } + var today = new Date(); if (!scope.selectedDate || isNaN(scope.selectedDate.getTime())) { // no predefined date - var today = new Date(); var year = scope.year || today.getFullYear(); var month = scope.month ? (scope.month-1) : today.getMonth(); var day = scope.day || today.getDate(); - var hour = scope.hour || today.getHours(); - var minute = scope.minute || today.getMinutes(); + var hour = scope.hour || scope.hour === 0 ? scope.hour : today.getHours(); + var minute = scope.minute || scope.minute === 0 ? scope.minute : today.getMinutes(); scope.selectedDate = new Date(year, month, day, hour, minute, 0); } - scope.inputHour = scope.selectedDate.getHours(); - scope.inputMinute = scope.selectedDate.getMinutes(); // Default to current year and month + var elScope = ctrl.triggerEl.scope(); + var preSelectedDate = dateFilter(elScope.$eval(attrs.ngModel), dateFormat); + scope.selectedDate = preSelectedDate ? new Date(preSelectedDate) : scope.selectedDate; + scope.inputHour = preSelectedDate ? new Date(preSelectedDate).getHours() : scope.selectedDate.getHours(); + scope.inputMinute = preSelectedDate ? new Date(preSelectedDate).getMinutes() : scope.selectedDate.getMinutes(); scope.mv = getMonthView(scope.selectedDate.getFullYear(), scope.selectedDate.getMonth()); - scope.today = dateFilter(new Date(), 'yyyy-M-d'); + scope.today = dateFilter(today, 'yyyy-M-d'); if (scope.mv.year == scope.selectedDate.getFullYear() && scope.mv.month == scope.selectedDate.getMonth()) { scope.selectedDay = scope.selectedDate.getDate(); } else { scope.selectedDay = null; } + + scope.isDateSelectable = function (day, month, year) { + var someday = new Date((month+1) + '/' + day + '/' + year); + someday.setHours(0,0,0,0); + if (attrs.futureOnly) { + var today = new Date(); + today.setHours(0,0,0,0); + return someday >= today; + } else if (!isNaN(Date.parse(attrs.startDate)) && !isNaN(Date.parse(attrs.endDate))) { + var startDate = new Date(attrs.startDate); + var endDate = new Date(attrs.endDate); + startDate.setHours(0,0,0,0); + endDate.setHours(0,0,0,0); + return startDate <= someday && someday <= endDate; + } else if (!isNaN(Date.parse(attrs.startDate)) && isNaN(Date.parse(attrs.endDate))) { + var startDate = new Date(attrs.startDate); + startDate.setHours(0,0,0,0); + return startDate <= someday; + } else if (isNaN(Date.parse(attrs.startDate)) && !isNaN(Date.parse(attrs.endDate))) { + var endDate = new Date(attrs.endDate); + endDate.setHours(0,0,0,0); + return someday <= endDate; + } else { + return true; + } + }; }); scope.addMonth = function (amount) { @@ -310,7 +345,9 @@ link: function(scope, element, attrs, ctrl) { // Attach validation watcher scope.$watch(attrs.ngModel, function(value) { - if( !value || value == '' ){ + var callback = element.scope().$eval(attrs.onChangeCallback); + if( !value || value == '' ) { + callback && typeof callback === 'function' && callback(); return; } // The value has already been cleaned by the above code @@ -320,6 +357,7 @@ if( attrs.hasOwnProperty('futureOnly') ){ ctrl.$setValidity('future-only', date < now? false : true); } + callback && typeof callback === 'function' && callback(); }); element[0].addEventListener('click', function() { @@ -334,7 +372,10 @@ minute: attrs.minute, dateOnly: attrs.dateOnly, futureOnly: attrs.futureOnly, - closeOnSelect: attrs.closeOnSelect + startDate: attrs.startDate, + endDate: attrs.endDate, + closeOnSelect: attrs.closeOnSelect, + onChangeCallback: attrs.onChangeCallback }); }); } diff --git a/angularjs-datetime-picker.min.js b/angularjs-datetime-picker.min.js index fe3a6bc..a1f251d 100644 --- a/angularjs-datetime-picker.min.js +++ b/angularjs-datetime-picker.min.js @@ -1 +1 @@ -!function(){"use strict";angular.module("angularjs-datetime-picker",[]);var e=function(e){"string"==typeof e&&(e=new Date(e));var t=new Date(e.getFullYear(),0,1),a=new Date(e.getFullYear(),6,1),n=Math.max(t.getTimezoneOffset(),a.getTimezoneOffset()),l=e.getTimezoneOffset()=0?"-":"+";return r+("0"+i/60).slice(-2)+":"+("0"+i%60).slice(-2)},t=function(e,t,a){var n=a("DatetimePickerCtrl");return{open:function(e){n.openDatetimePicker(e)},close:function(){n.closeDatetimePicker()}}};t.$inject=["$compile","$document","$controller"],angular.module("angularjs-datetime-picker").factory("DatetimePicker",t);var a=function(e,t){var a,n=this,l=function(e){e&&e.remove(),t[0].body.removeEventListener("click",n.closeDatetimePicker)};this.openDatetimePicker=function(n){this.closeDatetimePicker();var l=angular.element("
");n.dateFormat&&l.attr("date-format",n.dateFormat),n.ngModel&&l.attr("ng-model",n.ngModel),n.year&&l.attr("year",parseInt(n.year)),n.month&&l.attr("month",parseInt(n.month)),n.day&&l.attr("day",parseInt(n.day)),n.hour&&l.attr("hour",parseInt(n.hour)),n.minute&&l.attr("minute",parseInt(n.minute)),(""===n.dateOnly||n.dateOnly===!0)&&l.attr("date-only","true"),"false"===n.closeOnSelect&&l.attr("close-on-select","false");var i=n.triggerEl;n.scope=n.scope||angular.element(i).scope(),a=e(l)(n.scope)[0],a.triggerEl=n.triggerEl,t[0].body.appendChild(a);var r=i.getBoundingClientRect();n.scope.$apply();var o=a.getBoundingClientRect();a.style.position="absolute",a.style.left=r.width>o.width?r.left+r.width-o.width+window.scrollX+"px":r.left+window.scrollX+"px",a.style.top=r.top<300||window.innerHeight-r.bottom>300?r.bottom+window.scrollY+"px":r.top-o.height+window.scrollY+"px",t[0].body.addEventListener("click",this.closeDatetimePicker)},this.closeDatetimePicker=function(e){var a=e&&e.target,n=t[0].querySelector("div[datetime-picker-popup]");e&&a?a.hasAttribute("datetime-picker")||n&&n.contains(a)||l(n):l(n)}};a.$inject=["$compile","$document"],angular.module("angularjs-datetime-picker").controller("DatetimePickerCtrl",a);var n=['
','
',' ',' {{months[mv.month].shortName}} {{mv.year}}',' ',"
",'
','
{{::dayOfWeek.firstLetter}}
','
{{::day}}
','
'," {{::day}}","
",'
{{::day}}
',"
",'
',' {{("0"+inputHour).slice(-2)}} : {{("0"+inputMinute).slice(-2)}}
',' ',' ',"
","
"].join("\n"),l=function(t,a){var l,i,r,o,d=function(){l=[],i=[],r=[],o=0;for(var e=1;31>=e;e++)l.push(e);for(var e=0;12>e;e++)i.push({fullName:t.DATETIME_FORMATS.MONTH[e],shortName:t.DATETIME_FORMATS.SHORTMONTH[e]});for(var e=0;7>e;e++){var a=t.DATETIME_FORMATS.DAY[(e+o)%7];r.push({fullName:a,firstLetter:a.substr(0,1)})}o=0},s=function(e,t){t>11?e++:0>t&&e--,t=(t+12)%12;var a=new Date(e,t,1),n=new Date(e,t+1,0),i=new Date(e,t,0),r=n.getDate(),d=i.getDate(),s=a.getDay(),c=(s-o+7)%7||7,u=l.slice(0,42-(c+r));return u.length>7&&(u=u.slice(0,u.length-7)),{year:e,month:t,days:l.slice(0,r),leadingDays:l.slice(-c-(31-d),d),trailingDays:u}},c=function(t,n,l,o){d();var c=l.dateFormat||"short";t.months=i,t.daysOfWeek=r,t.inputHour,t.inputMinute,t.dateOnly===!0&&(n[0].querySelector("#adp-time").style.display="none"),t.$applyAsync(function(){if(o.triggerEl=angular.element(n[0].triggerEl),l.ngModel){var i=""+o.triggerEl.scope().$eval(l.ngModel);if(i){i.match(/[0-9]{2}:/)||(i+=" 00:00:00"),i=i.replace(/([0-9]{2}-[0-9]{2})-([0-9]{4})/,"$2-$1"),i=i.replace(/([\/-][0-9]{2,4})\ ([0-9]{2}\:[0-9]{2}\:)/,"$1T$2"),i=i.replace(/EDT|EST|CDT|CST|MDT|PDT|PST|UT|GMT/g,""),i=i.replace(/\s*\(\)\s*/,""),i=i.replace(/[\-\+][0-9]{2}:?[0-9]{2}$/,""),i+=e(i);var r=new Date(i);t.selectedDate=new Date(r.getFullYear(),r.getMonth(),r.getDate(),r.getHours(),r.getMinutes(),r.getSeconds())}}if(!t.selectedDate||isNaN(t.selectedDate.getTime())){var d=new Date,c=t.year||d.getFullYear(),u=t.month?t.month-1:d.getMonth(),m=t.day||d.getDate(),g=t.hour||d.getHours(),p=t.minute||d.getMinutes();t.selectedDate=new Date(c,u,m,g,p,0)}t.inputHour=t.selectedDate.getHours(),t.inputMinute=t.selectedDate.getMinutes(),t.mv=s(t.selectedDate.getFullYear(),t.selectedDate.getMonth()),t.today=a(new Date,"yyyy-M-d"),t.selectedDay=t.mv.year==t.selectedDate.getFullYear()&&t.mv.month==t.selectedDate.getMonth()?t.selectedDate.getDate():null}),t.addMonth=function(e){t.mv=s(t.mv.year,t.mv.month+e)},t.setDate=function(e){var a=angular.element(e.target)[0];-1!==a.className.indexOf("selectable")&&(t.updateNgModel(parseInt(a.innerHTML)),t.closeOnSelect!==!1&&o.closeDatetimePicker())},t.updateNgModel=function(e){if(e=e?e:t.selectedDate.getDate(),t.selectedDate=new Date(t.mv.year,t.mv.month,e,t.inputHour,t.inputMinute,0),t.selectedDay=t.selectedDate.getDate(),l.ngModel){var n,i=o.triggerEl.scope();n=i.$eval(l.ngModel)&&"Date"===i.$eval(l.ngModel).constructor.name?new Date(a(t.selectedDate,c)):a(t.selectedDate,c),i.$eval(l.ngModel+"= date",{date:n})}},t.$on("$destroy",o.closeDatetimePicker)};return{restrict:"A",template:n,controller:"DatetimePickerCtrl",replace:!0,scope:{year:"=",month:"=",day:"=",hour:"=",minute:"=",dateOnly:"=",closeOnSelect:"="},link:c}};l.$inject=["$locale","dateFilter"],angular.module("angularjs-datetime-picker").directive("datetimePickerPopup",l);var i=function(e,t){return{require:"ngModel",link:function(e,a,n,l){e.$watch(n.ngModel,function(e){if(e&&""!=e){var t=new Date(e);l.$setValidity("date",t?!0:!1);var a=new Date;n.hasOwnProperty("futureOnly")&&l.$setValidity("future-only",a>t?!1:!0)}}),a[0].addEventListener("click",function(){t.open({triggerEl:a[0],dateFormat:n.dateFormat,ngModel:n.ngModel,year:n.year,month:n.month,day:n.day,hour:n.hour,minute:n.minute,dateOnly:n.dateOnly,futureOnly:n.futureOnly,closeOnSelect:n.closeOnSelect})})}}};i.$inject=["$parse","DatetimePicker"],angular.module("angularjs-datetime-picker").directive("datetimePicker",i)}(); \ No newline at end of file +!function(){"use strict";angular.module("angularjs-datetime-picker",[]);var e=function(e){"string"==typeof e&&(e=new Date(e));var t=new Date(e.getFullYear(),0,1),a=new Date(e.getFullYear(),6,1),n=Math.max(t.getTimezoneOffset(),a.getTimezoneOffset()),r=e.getTimezoneOffset()=0?"-":"+";return i+("0"+l/60).slice(-2)+":"+("0"+l%60).slice(-2)},t=function(e,t,a){var n=a("DatetimePickerCtrl");return{open:function(e){n.openDatetimePicker(e)},close:function(){n.closeDatetimePicker()}}};t.$inject=["$compile","$document","$controller"],angular.module("angularjs-datetime-picker").factory("DatetimePicker",t);var a=function(e,t){var a,n=this,r=function(e){e&&e.parentElement.removeChild(e),t[0].body.removeEventListener("click",n.closeDatetimePicker)};this.openDatetimePicker=function(n){this.closeDatetimePicker();var r=angular.element("
");n.dateFormat&&r.attr("date-format",n.dateFormat),n.ngModel&&r.attr("ng-model",n.ngModel),n.year&&r.attr("year",parseInt(n.year)),n.month&&r.attr("month",parseInt(n.month)),n.day&&r.attr("day",parseInt(n.day)),n.hour&&r.attr("hour",parseInt(n.hour)),n.minute&&r.attr("minute",parseInt(n.minute)),""!==n.dateOnly&&n.dateOnly!==!0||r.attr("date-only","true"),""===n.futureOnly||n.futureOnly===!0?r.attr("future-only","true"):(n.startDate&&r.attr("start-date",n.startDate),n.endDate&&r.attr("end-date",n.endDate)),"false"===n.closeOnSelect&&r.attr("close-on-select","false");var l=n.triggerEl;n.scope=n.scope||angular.element(l).scope(),a=e(r)(n.scope)[0],a.triggerEl=n.triggerEl,t[0].body.appendChild(a),n.scope.$apply();var i=l.getBoundingClientRect(),s=a.getBoundingClientRect();a.style.position="absolute",i.width>s.width?a.style.left=i.left+i.width-s.width+window.pageXOffset+"px":a.style.left=i.left+window.pageXOffset+"px",i.top<300||window.innerHeight-i.bottom>300?a.style.top=i.bottom+window.pageYOffset+"px":a.style.top=i.top-s.height+window.pageYOffset+"px",t[0].body.addEventListener("click",this.closeDatetimePicker)},this.closeDatetimePicker=function(e){var a=e&&e.target,n=t[0].querySelector("div[datetime-picker-popup]");e&&a?a.hasAttribute("datetime-picker")||n&&n.contains(a)||r(n):r(n)}};a.$inject=["$compile","$document"],angular.module("angularjs-datetime-picker").controller("DatetimePickerCtrl",a);var n=['
','
',' ',' {{months[mv.month].shortName}} {{mv.year}}',' ',"
",'
','
{{::dayOfWeek.firstLetter}}
','
{{::day}}
','
'," {{::day}}","
",'
{{::day}}
',"
",'
',' Time: {{("0"+inputHour).slice(-2)}} : {{("0"+inputMinute).slice(-2)}}
',' Hour: ',' Min: ',"
","
"].join("\n"),r=function(t,a){var r,l,i,s,o=function(){r=[],l=[],i=[],s=0;for(var e=1;e<=31;e++)r.push(e);for(var e=0;e<12;e++)l.push({fullName:t.DATETIME_FORMATS.MONTH[e],shortName:t.DATETIME_FORMATS.SHORTMONTH[e]});for(var e=0;e<7;e++){var a=t.DATETIME_FORMATS.DAY[(e+s)%7];i.push({fullName:a,firstLetter:a.substr(0,1)})}s=0},d=function(e,t){t>11?e++:t<0&&e--,t=(t+12)%12;var a=new Date(e,t,1),n=new Date(e,t+1,0),l=new Date(e,t,0),i=n.getDate(),o=l.getDate(),d=a.getDay(),c=(d-s+7)%7||7,u=r.slice(0,42-(c+i));return u.length>7&&(u=u.slice(0,u.length-7)),{year:e,month:t,days:r.slice(0,i),leadingDays:r.slice(-c-(31-o),o),trailingDays:u}},c=function(t,n,r,s){o();var c=r.dateFormat||"short";t.months=l,t.daysOfWeek=i,t.inputHour,t.inputMinute,t.dateOnly===!0&&(n[0].querySelector("#adp-time").style.display="none"),t.$applyAsync(function(){if(s.triggerEl=angular.element(n[0].triggerEl),r.ngModel){var l=""+s.triggerEl.scope().$eval(r.ngModel);if(l){l.match(/[0-9]{2}:/)||(l+=" 00:00:00"),l=l.replace(/([0-9]{2}-[0-9]{2})-([0-9]{4})/,"$2-$1"),l=l.replace(/([\/-][0-9]{2,4})\ ([0-9]{2}\:[0-9]{2}\:)/,"$1T$2"),l=l.replace(/EDT|EST|CDT|CST|MDT|PDT|PST|UT|GMT/g,""),l=l.replace(/\s*\(\)\s*/,""),l=l.replace(/[\-\+][0-9]{2}:?[0-9]{2}$/,""),l+=e(l);var i=new Date(l);t.selectedDate=new Date(i.getFullYear(),i.getMonth(),i.getDate(),i.getHours(),i.getMinutes(),i.getSeconds())}}var o=new Date;if(!t.selectedDate||isNaN(t.selectedDate.getTime())){var u=t.year||o.getFullYear(),g=t.month?t.month-1:o.getMonth(),m=t.day||o.getDate(),p=t.hour||0===t.hour?t.hour:o.getHours(),D=t.minute||0===t.minute?t.minute:o.getMinutes();t.selectedDate=new Date(u,g,m,p,D,0)}var y=s.triggerEl.scope(),v=a(y.$eval(r.ngModel),c);t.selectedDate=v?new Date(v):t.selectedDate,t.inputHour=v?new Date(v).getHours():t.selectedDate.getHours(),t.inputMinute=v?new Date(v).getMinutes():t.selectedDate.getMinutes(),t.mv=d(t.selectedDate.getFullYear(),t.selectedDate.getMonth()),t.today=a(o,"yyyy-M-d"),t.mv.year==t.selectedDate.getFullYear()&&t.mv.month==t.selectedDate.getMonth()?t.selectedDay=t.selectedDate.getDate():t.selectedDay=null,t.isDateSelectable=function(e,t,a){var n=new Date(t+1+"/"+e+"/"+a);if(n.setHours(0,0,0,0),r.futureOnly){var l=new Date;return l.setHours(0,0,0,0),n>=l}if(isNaN(Date.parse(r.startDate))||isNaN(Date.parse(r.endDate))){if(!isNaN(Date.parse(r.startDate))&&isNaN(Date.parse(r.endDate))){var i=new Date(r.startDate);return i.setHours(0,0,0,0),i<=n}if(isNaN(Date.parse(r.startDate))&&!isNaN(Date.parse(r.endDate))){var s=new Date(r.endDate);return s.setHours(0,0,0,0),n<=s}return!0}var i=new Date(r.startDate),s=new Date(r.endDate);return i.setHours(0,0,0,0),s.setHours(0,0,0,0),i<=n&&n<=s}}),t.addMonth=function(e){t.mv=d(t.mv.year,t.mv.month+e)},t.setDate=function(e){var a=angular.element(e.target)[0];a.className.indexOf("selectable")!==-1&&(t.updateNgModel(parseInt(a.innerHTML)),t.closeOnSelect!==!1&&s.closeDatetimePicker())},t.updateNgModel=function(e){if(e=e?e:t.selectedDate.getDate(),t.selectedDate=new Date(t.mv.year,t.mv.month,e,t.inputHour,t.inputMinute,0),t.selectedDay=t.selectedDate.getDate(),r.ngModel){var n,l=s.triggerEl.scope();n=l.$eval(r.ngModel)&&"Date"===l.$eval(r.ngModel).constructor.name?new Date(a(t.selectedDate,c)):a(t.selectedDate,c),l.$eval(r.ngModel+"= date",{date:n})}},t.$on("$destroy",s.closeDatetimePicker)};return{restrict:"A",template:n,controller:"DatetimePickerCtrl",replace:!0,scope:{year:"=",month:"=",day:"=",hour:"=",minute:"=",dateOnly:"=",closeOnSelect:"="},link:c}};r.$inject=["$locale","dateFilter"],angular.module("angularjs-datetime-picker").directive("datetimePickerPopup",r);var l=function(e,t){return{require:"ngModel",link:function(e,a,n,r){e.$watch(n.ngModel,function(e){var t=a.scope().$eval(n.onChangeCallback);if(!e||""==e)return void(t&&"function"==typeof t&&t());var l=new Date(e);r.$setValidity("date",!!l);var i=new Date;n.hasOwnProperty("futureOnly")&&r.$setValidity("future-only",!(l" + "Subramaniam Srinivasan " ], - "description": "Datepicker/Datetime picker for your INPUT tag", + "description": "AngularJs Date / Datetime picker for your INPUT tag. This project is forked from https://github.com/kineticsocial/angularjs-datetime-picker an inactive project.", "keywords": [ "Angular", "Javascript", diff --git a/index.html b/index.html index 338c59e..f09d52c 100644 --- a/index.html +++ b/index.html @@ -1,43 +1,58 @@ + +

Datetime Picker

- <input ng-model="date4" datetime-picker date-only />
-

+ <input ng-model="date0" datetime-picker date-only />
+

+ + <input ng-model="date1" datetime-picker date-only future-only />
+

+ + <input ng-model="date6" datetime-picker date-only start-date="11-20-2016" end-date="22-25-2017" />
+

+ + <input ng-model="date7" datetime-picker date-only start-date="11-20-2016" />
+

+ + <input ng-model="date8" datetime-picker date-only end-date="02-25-2017" />
+

<input ng-model="date2" datetime-picker date-format="yyyy-MM-dd" date-only />
-


+


<input ng-model="date3" datetime-picker date-format="yyyy-MM-dd HH:mm:ss" close-on-select="false" />
-

+

<input ng-model="date4" datetime-picker hour="23" minute='59'/>


gmtDate : {{gmtDate}}
<input type="date" ng-model="gmtDate" size="30" />
- +

-
- <input ng-model="date5" datetime-picker date-format="yyyy-MM-dd HH:mm:ss" year="2014" month="12" day="31" hour="23" minute="59" />
-

-
+ <input ng-model="date5" datetime-picker date-format="yyyy-MM-dd HH:mm:ss" year="2014" month="12" day="31" hour="23" minute="59" />
+

diff --git a/package.json b/package.json index 64fac8b..553e838 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { - "name": "angularjs-datetime-picker", - "version": "0.1.20", + "name": "angularjs-datetime-picker-v2", + "version": "0.2.2", "description": "Very Lightweight AngularJS DateTime Picker Without Using jQuery, bootStrap, or moment", "main": "angularjs-datetime-picker.js", "scripts": { @@ -8,7 +8,7 @@ }, "repository": { "type": "git", - "url": "https://github.com/kineticsocial/angularjs-datetime-picker.git" + "url": "https://github.com/mani-s17/angularjs-datetime-picker.git" }, "keywords": [ "angularjs", @@ -16,10 +16,10 @@ "date", "datetime" ], - "author": "Allen Kim ", + "author": "Subramaniam Srinivasan ", "license": "MIT", "bugs": { - "url": "https://github.com/kineticsocial/angularjs-datetime-picker/issues" + "url": "https://github.com/mani-s17/angularjs-datetime-picker/issues" }, "devDependencies": { "gulp": "^3.8.11", @@ -29,6 +29,6 @@ "gulp-strip-debug": "^1.0.2", "gulp-uglify": "^1.2.0", "run-sequence": "^1.1.0" - } - "homepage": "https://github.com/kineticsocial/angularjs-datetime-picker" + }, + "homepage": "https://github.com/mani-s17/angularjs-datetime-picker" }