UNPKG

ng-jalaali-flat-datepicker

Version:

Angular.js Datepicker built with Moment.js for Jalaali Calendar

1 lines 7.27 kB
!function(){"use strict";function a(a,e,t,n){return{restrict:"A",require:"ngModel",scope:{config:"=?datepickerConfig",gPickedDate:"=?gregorianPickedDate",gFormattedPickedDate:"=?gregorianFormattedPickedDate"},link:function(r,s,i,o){function c(a){u===a.target||u[0].contains(a.target)||a.target===s[0]||(t.off("click",c),r.$apply(function(){r.calendarCursor=g?g:f,r.pickerDisplayed=r.showMonthsList=r.showYearsList=!1}))}function l(){s.wrap('<div class="ng-jalaali-flat-datepicker-wrapper"></div>'),e(u)(r),s.after(u),angular.isDefined(o.$modelValue)&&moment.isDate(o.$modelValue)&&(r.calendarCursor=o.$modelValue)}function d(a){var e=[];a=moment.utc(a);var t=moment.utc(a).jDate(1),n=moment.utc(a).jDate(moment.jDaysInMonth(moment(a).jYear,moment(a).jMonth())),s=moment.utc(t),i=moment.utc(n);s=0===t.weekday()?s:s.weekday(0),i=6===n.weekday()?i:i.weekday(6);for(var o=[],c=moment.utc(s.toDate());c.isBefore(moment.utc(i).add(1,"days"));c.add(1,"days")){var l=!r.config.minDate||c.isAfter(r.config.minDate,"day"),d=!r.config.maxDate||c.isBefore(r.config.maxDate,"day"),m=c.isAfter(f),u=r.config.allowFuture||!m,p=moment.utc(c.toDate()),h=moment.utc(c.toDate()),k={date:moment(c).toDate(),jDate:moment(c).format("jDD"),isToday:c.isSame(f,"day"),isInMonth:p.isSame(t,"jmonth"),isSelected:h.isSame(g,"day"),isSelectable:l&&d&&u};o.push(k),6!==c.weekday()&&c!==i||(e.push(o),o=[])}return e}function m(){r.currentWeeks.forEach(function(a,e){a.forEach(function(a,t){r.currentWeeks[e][t].isSelected=!1})})}moment.loadPersian();var u=angular.element(a.get("datepicker.html")),g="",f=moment.utc(),p={allowFuture:!0,dateFormat:null,gregorianDateFormat:null,dropDownYears:10,minDate:null,maxDate:null},h=function(){return"undefined"==typeof r.config.minDate?r.config.minDate.format("YYYY"):r.config.allowFuture?moment.utc().subtract("5","years").format("YYYY"):moment.utc().subtract("10","years").format("YYYY")};r.config=angular.extend(p,r.config),angular.isDefined(r.config.minDate)&&moment.utc(r.config.minDate).subtract(1,"day"),angular.isDefined(r.config.maxDate)&&moment.utc(r.config.maxDate).add(1,"day"),angular.isDefined(r.config.gregorianDateFormat)||(r.config.gregorianDateFormat=r.config.dateFormat.replace(/j/g,"")),r.calendarCursor=f,r.currentWeeks=[],r.daysNameList=n.getDaysNames(),r.monthsList=moment.localeData()._jMonths,r.yearsList=n.getYearsList(h(),r.config.dropDownYears),r.pickerDisplayed=!1,r.$watch(function(){return o.$modelValue},function(a){a&&(g=r.calendarCursor=moment.utc(a,r.config.dateFormat))}),r.$watch("calendarCursor",function(a){r.currentWeeks=d(a)}),s.bind("click",function(a){r.$apply(function(){r.pickerDisplayed=!0,t.on("click",c)})}),l(),r.prevMonth=function(){r.calendarCursor=moment(r.calendarCursor).subtract(1,"jMonths")},r.nextMonth=function(){r.calendarCursor=moment(r.calendarCursor).add(1,"jMonths")},r.selectMonth=function(a){r.showMonthsList=!1,r.calendarCursor=moment(r.calendarCursor).jMonth(a)},r.selectYear=function(a){r.showYearsList=!1,r.calendarCursor=moment(r.calendarCursor).jYear(parseInt(a))},r.selectDay=function(a){(a.isSelectable&&!a.isFuture||r.config.allowFuture&&a.isFuture)&&(m(),a.isSelected=!0,o.$setViewValue(moment.utc(a.date).format(r.config.dateFormat)),o.$render(),r.gPickedDate=moment.utc(a.date),r.gFormattedPickedDate=moment.utc(a.date).format(r.config.gregorianDateFormat),r.pickerDisplayed=!1)}}}}a.$inject=["$templateCache","$compile","$document","datesCalculator"],angular.module("ngJalaaliFlatDatepicker",[]).directive("ngJalaaliFlatDatepicker",a)}(),function(){"use strict";function a(){function a(a,e){for(var t=[],n=a;n<=parseInt(a)+parseInt(e);n++)t.push(moment.utc(n.toString(),"YYYY").format("jYYYY"));return t}function e(){for(var a=[],e=0;7>e;e++)a.push(moment().weekday(e).format("dd"));return a}return{getYearsList:a,getDaysNames:e}}angular.module("ngJalaaliFlatDatepicker").factory("datesCalculator",a)}(),angular.module("ngJalaaliFlatDatepicker").run(["$templateCache",function(a){a.put("datepicker.html",'<div class="ng-jalaali-flat-datepicker" ng-show="pickerDisplayed">\n <div class="ng-jalaali-flat-datepicker-table-header-bckgrnd"></div>\n <table>\n <caption>\n <div class="ng-jalaali-flat-datepicker-header-wrapper">\n <span class="ng-jalaali-flat-datepicker-arrow ng-jalaali-flat-datepicker-arrow-left" ng-click="nextMonth()">\n <svg version="1.0" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="50" y="50" viewBox="0 0 100 100" xml:space="preserve">\n <polygon points="64.8,36.2 35.2,6.5 22.3,19.4 51.9,49.1 22.3,78.8 35.2,91.7 77.7,49.1" />\n </svg>\n </span>\n <div class="ng-jalaali-flat-datepicker-header-year">\n <div class="ng-jalaali-flat-datepicker-custom-select-box" outside-click="showMonthsList = false">\n <span class="ng-jalaali-flat-datepicker-custom-select-title ng-jalaali-flat-datepicker-month-name" ng-click="showMonthsList = !showMonthsList; showYearsList = false" ng-class="{selected: showMonthsList }">{{ calendarCursor.isValid() ? calendarCursor.format(\'jMMMM\') : "" }}</span>\n <div class="ng-jalaali-flat-datepicker-custom-select" ng-show="showMonthsList">\n <span ng-repeat="monthName in monthsList" ng-click="selectMonth(monthName); showMonthsList = false">{{ monthName }}</span>\n </div>\n </div>\n <div class="ng-jalaali-flat-datepicker-custom-select-box" outside-click="showYearsList = false">\n <span class="ng-jalaali-flat-datepicker-custom-select-title" ng-click="showYearsList = !showYearsList; showMonthsList = false" ng-class="{selected: showYearsList }">{{ calendarCursor.isValid() ? calendarCursor.format(\'jYYYY\') : "" }}</span>\n <div class="ng-jalaali-flat-datepicker-custom-select" ng-show="showYearsList">\n <span ng-repeat="yearNumber in yearsList" ng-click="selectYear(yearNumber)">{{ yearNumber }}</span>\n </div>\n </div>\n </div>\n <span class="ng-jalaali-flat-datepicker-arrow ng-jalaali-flat-datepicker-arrow-right" ng-click="prevMonth()">\n <svg version="1.0" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="50" y="50" viewBox="0 0 100 100" xml:space="preserve">\n <polygon points="64.8,36.2 35.2,6.5 22.3,19.4 51.9,49.1 22.3,78.8 35.2,91.7 77.7,49.1" />\n </svg>\n </span>\n </div>\n </caption>\n <tbody>\n <tr class="days-head">\n <td class="day-head" ng-repeat="dayName in daysNameList">{{ dayName }}</td>\n </tr>\n <tr class="days" ng-repeat="week in currentWeeks">\n <td ng-repeat="day in week" ng-click="selectDay(day)" ng-class="[\'day-item\', { \'isToday\': day.isToday, \'isInMonth\': day.isInMonth, \'isDisabled\': !day.isSelectable, \'isSelected\': day.isSelected }]">{{ day.jDate }}</td>\n </tr>\n </tbody>\n </table>\n</div>\n')}]);