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 e(e,a,t,n){return{restrict:"A",require:"ngModel",scope:{config:"=?datepickerConfig",gPickedDate:"=?gregorianPickedDate",gFormattedPickedDate:"=?gregorianFormattedPickedDate"},link:function(r,s,i,o){function c(e){u===e.target||u[0].contains(e.target)||e.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>'),a(u)(r),s.after(u),angular.isDefined(o.$modelValue)&&moment.isDate(o.$modelValue)&&(r.calendarCursor=o.$modelValue)}function d(e){var a=[];e=moment.utc(e);var t=moment.utc(e).jDate(1),n=moment.utc(e).jDate(moment.jDaysInMonth(moment(e).jYear,moment(e).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||(a.push(o),o=[])}return a}function m(){r.currentWeeks.forEach(function(e,a){e.forEach(function(e,t){r.currentWeeks[a][t].isSelected=!1})})}moment.loadPersian();var u=angular.element(e.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(e){e&&(g=r.calendarCursor=moment.utc(e,r.config.dateFormat))}),r.$watch("calendarCursor",function(e){r.currentWeeks=d(e)}),s.bind("click",function(e){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(e){r.showMonthsList=!1,r.calendarCursor=moment(r.calendarCursor).jMonth(e)},r.selectYear=function(e){r.showYearsList=!1,r.calendarCursor=moment(r.calendarCursor).jYear(parseInt(e))},r.selectDay=function(e){(e.isSelectable&&!e.isFuture||r.config.allowFuture&&e.isFuture)&&(m(),e.isSelected=!0,o.$setViewValue(moment.utc(e.date).format(r.config.dateFormat)),o.$render(),r.gPickedDate=moment.utc(e.date),r.gFormattedPickedDate=moment.utc(e.date).format(r.config.gregorianDateFormat),r.pickerDisplayed=!1)}}}}e.$inject=["$templateCache","$compile","$document","datesCalculator"],angular.module("ngJalaaliFlatDatepicker",[]).directive("ngJalaaliFlatDatepicker",e)}(),function(){"use strict";function e(){function e(e,a){for(var t=[],n=e;n<=parseInt(e)+parseInt(a);n++)t.push(moment.utc(n.toString(),"YYYY").format("jYYYY"));return t}function a(){for(var e=[],a=0;7>a;a++)e.push(moment().weekday(a).format("dd"));return e}return{getYearsList:e,getDaysNames:a}}angular.module("ngJalaaliFlatDatepicker").factory("datesCalculator",e)}(),angular.module("ngJalaaliFlatDatepicker").run(["$templateCache",function(e){e.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')}]);