From 5b6d9f1ed50d494feb0c887c74d7a7393039bf77 Mon Sep 17 00:00:00 2001 From: Ali Najafi Date: Tue, 24 Oct 2017 11:28:12 +0330 Subject: [PATCH] good change on select today and change time when click on today button select today and change time with input --- dist/ADM-dateTimePicker.js | 332 ++++++++++++++++++++----------------- 1 file changed, 182 insertions(+), 150 deletions(-) diff --git a/dist/ADM-dateTimePicker.js b/dist/ADM-dateTimePicker.js index 6a3bdce..0ef941e 100644 --- a/dist/ADM-dateTimePicker.js +++ b/dist/ADM-dateTimePicker.js @@ -1,6 +1,6 @@ /* * Picking date & time in AngularJS is easier than ever. - * + * * Demo: http://amirkabirdataminers.github.io/ADM-dateTimePicker * * @version 1.2.0 @@ -10,7 +10,7 @@ (function(angular) { 'use strict'; - + if (!angular.merge) angular.merge = angular.extend; @@ -36,7 +36,7 @@ var splitter = '-'; if (/invalid/i.test(new Date('1991-9-12'))) splitter = '/'; - + var date = this.join(splitter); if (this.length == 5) date = this.slice(0,3).join(splitter) +' '+ this.slice(3,5).join(':') @@ -52,12 +52,12 @@ Date.prototype.dtp_shortDate = function () { return [this.getFullYear(), this.getMonth() + 1, this.getDate()].dtp_toDate(); } - + var ADMdtpProvider = function() { var options = { calType: 'gregorian', - format: 'YYYY/MM/DD hh:mm', + format: 'YYYY/MM/DD hh:mm', multiple: true, autoClose: false, transition: true, @@ -66,13 +66,13 @@ minuteStep: 1, gregorianStartDay: 0, gregorianDic: { - title: 'Gregorian', + title: 'جلالی', monthsNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'], daysNames: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'], todayBtn: 'Today', }, jalaliDic: { - title: 'جلالی', + title: 'Gregorian', monthsNames: ['فروردین', 'اردیبهشت', 'خرداد', 'تیر', 'مرداد', 'شهریور', 'مهر', 'آبان', 'آذر', 'دی', 'بهمن', 'اسفند'], daysNames: ['ش', 'ی', 'د', 'س', 'چ', 'پ', 'ج'], todayBtn: 'امروز' @@ -100,15 +100,15 @@ }; }; - + var ADMdtpDigitTypeFilter = function() { return function(input, type) { return type=='jalali' ? String(input).toPersianDigits() : input; }; }; - + var ADMdtpConvertor = function() { - + function getJalaliDate(date) { var daysPassedInGregorianCalender = getDaysPassedInGregorianCalender(date); daysPassedInGregorianCalender -= 226894; @@ -269,7 +269,7 @@ } return leapsCount; } - + function getDaysPassedInGregorianCalender(date) { var gregorianMonths = getGregorianMonths(); var passedLeapYears = howManyGregorianLeapsYearPassed(date.year); @@ -442,14 +442,14 @@ }); return date; } - + return { toJalali: getPersianDate, toGregorian: getGregorianDates, isLeapJalali: isLeapYearInJalaliCalender } } - + var ADMdtpFactory = function(ADMdtpConvertor) { this.dateFormat = function(date, time, format, notView) { @@ -461,7 +461,7 @@ var day = date.day.lZero(); var hour = time.hour.lZero(); var minute = time.minute.lZero(); - + var replaceMap = [ {key: 'YYYY', value: year}, {key: 'YY', value: halfYear}, @@ -470,18 +470,18 @@ {key: 'hh', value: hour}, {key: 'mm', value: minute} ] - + for(var i=0,j=replaceMap.length;i23 || time[0]<0 || time[1]>59 || time[1]<0 || date[0]<0 || date[1]<1 || date[1]>12) return false; - + if (date[1]>0 && date[1]<7) { if (date[2]<1 || date[2]>31) return false; @@ -577,7 +577,7 @@ } this.validateJalaliDate = function(input, format) { var _dateTime; - + if (typeof input == "number") { var _gDate = new Date(input); if (/invalid/i.test(_gDate)) @@ -587,19 +587,19 @@ } else if (typeof input == "string") _dateTime = this.parseString(input, format); - + else if (input instanceof Object) _dateTime = input; - + if (!_dateTime) return false; - + var _date = [_dateTime.year, _dateTime.month, _dateTime.day]; var _time = [_dateTime.hour, _dateTime.minute]; - + if (this.validateJalaliDateSeparate(_date, _time)) { var _gDateC = ADMdtpConvertor.toGregorian(_date[0],_date[1],_date[2]); var _gDate = [_gDateC.year, _gDateC.month, _gDateC.day, _time[0], _time[1]].dtp_toDate('date'); - + return { year: _date[0], month: _date[1], @@ -618,7 +618,7 @@ return null; if (typeof value == "number") return value; - + if (typeof value == "string") { value = this.parseString(value, format); } @@ -626,11 +626,11 @@ value = {year: value.getFullYear(), month: value.getMonth()+1, day: value.getDate(), hour: value.getHours(), minute: value.getMinutes()}; else return null; - + if (value.year<=99) value.year = ((type == 'jalali') ? 1300+value.year : 2000+value.year); - - + + if (type == 'jalali') { var _dateTime = this.validateJalaliDate(value, format); return _dateTime.unix || null; @@ -639,7 +639,7 @@ var _dateTime = new Date(this.toRegularFormat(value, type)); return (/invalid/i.test(_dateTime))?null:_dateTime.getTime(); } - + return null; }; this.convertFromUnix = function(unix, type) { @@ -655,7 +655,7 @@ }; }; this.convertToJalali = function(date) { - + if (date instanceof Date) { var _date = { year: date.getFullYear(), @@ -671,11 +671,11 @@ }; this.parseDisablePattern = function(options) { var arr = options.disabled, smart = options.smartDisabling, calType = options.calType, format = options.format; - + var _inWeek = Array.apply(null, Array(7)).map(Number.prototype.valueOf,0); var _inMonth = Array.apply(null, Array(31)).map(Number.prototype.valueOf,0); var _static = {}; - + if (arr instanceof Array) { for (var i=0,j=arr.length; i

{{current.year | digitType:calType}}

{{yearName | digitType:calType}} {{monthName}}
{{time.hour}}:{{time.minute}}
{{current.monthDscr}} {{current.year | digitType:calType}}
{{dayName}}
{{day.day | digitType:calType}}

{{option.gregorianDic.title}}

{{option.jalaliDic.title}}

' + template: '

{{current.year | digitType:calType}}

{{yearName | digitType:calType}} {{monthName}}
:
{{current.monthDscr}} {{current.year | digitType:calType}}
{{dayName}}
{{day.day | digitType:calType}}

{{option.gregorianDic.title}}

{{option.jalaliDic.title}}

' } } @@ -1046,12 +1082,12 @@ var ngModel = ctrls[0], admDtp = ctrls[1]; scope.api = admDtp; scope.dtpId = 'adm-' + (++ADMdtpFactory.counter); - + if (!element.find('ng-transclude').children().length) { scope.defaultTemplate = true; element.find('ng-transclude').remove(); } - + var _options = scope.options; if (!(_options instanceof Object)) _options = {}; @@ -1060,7 +1096,7 @@ var dayNames = angular.copy(scope.option.gregorianDic.daysNames); scope.option.gregorianDic.daysNamesUntouched = dayNames; scope.option.gregorianDic.daysNames = dayNames.slice(scope.option.gregorianStartDay,7).concat(dayNames.slice(0,scope.option.gregorianStartDay)); - + scope.disableDays = ADMdtpFactory.parseDisablePattern(scope.option); scope.calType = scope.option.calType; scope.monthNames = scope.option[scope.calType + 'Dic'].monthsNames; @@ -1070,19 +1106,19 @@ scope.minDate = scope.mindate?new Date(scope.mindate):null; scope.maxDate = scope.maxdate?new Date(scope.maxdate):null; - + scope.current = { year: '', month: '', monthDscr: '', days: [] }; - + scope.updateMasterValue = function(newDate, releaseTheBeast) { if (!newDate) newDate = (scope.dtpValue.unix ? scope.dtpValue : {}); - + scope.$applyAsync(function() { scope.dtpValue = newDate; @@ -1109,7 +1145,7 @@ ngModel.$setViewValue( scope.dtpValue.formated ); ngModel.$render(); - + if (scope.hasInputDtp) element[0].querySelector('[dtp-input]').value = scope.dtpValue.formated; @@ -1124,12 +1160,12 @@ }); } - + scope.parseInputValue = function(valueStr, resetTime, releaseTheBeast) { if (valueStr == 'today') { valueStr = ADMdtpFactory.removeTime(new Date()).getTime(); } - + var _dateTime = false; if (valueStr) { @@ -1140,7 +1176,7 @@ else { if (typeof valueStr == "string") valueStr = ADMdtpFactory.toRegularFormat(valueStr, scope.calType, scope.option.format); - + _dateTime = new Date(valueStr); _dateTime = (/invalid/i.test(_dateTime))?false:_dateTime; } @@ -1154,7 +1190,7 @@ unix: _dateTime.unix || _dateTime.getTime(), fullDate: _dateTime.gDate || _dateTime } - + scope.dtpValue.fullDate = ADMdtpFactory.removeTime(scope.dtpValue.fullDate); scope.dtpValue.unix = scope.dtpValue.fullDate.getTime(); @@ -1174,7 +1210,7 @@ } } scope.parseInputValue(ngModel.$viewValue || scope.option.default, true, false); - + ngModel.$formatters.push(function (val) { if (!val && scope.dtpValue.unix) { scope.destroy(); @@ -1187,70 +1223,70 @@ return val; }); - + if (scope.option.watchingOptions) { //return; scope.$watch('options', function(nuVal, old) { if (!nuVal || typeof nuVal != 'object') return; if (old && JSON.stringify(old) == JSON.stringify(nuVal)) return; - + var daysNamesUntouched = scope.option.gregorianDic.daysNamesUntouched; scope.option = angular.merge(angular.copy(ADMdtp.getOptions()), nuVal); scope.option.minuteStep = Math.max(Math.min(scope.option.minuteStep, 60), 1); - + if (nuVal.gregorianDic && nuVal.gregorianDic.daysNames) scope.option.gregorianDic.daysNamesUntouched = nuVal.gregorianDic.daysNames; else scope.option.gregorianDic.daysNamesUntouched = daysNamesUntouched; - + var dayNames = angular.copy(scope.option.gregorianDic.daysNamesUntouched); scope.option.gregorianDic.daysNames = dayNames.slice(scope.option.gregorianStartDay,7).concat(dayNames.slice(0,scope.option.gregorianStartDay)); scope.disableDays = ADMdtpFactory.parseDisablePattern(scope.option); if (scope.calTypeChanged) scope.calTypeChanged(scope.option.calType); }, true); - } - + } + attrs.$observe("disable", function (_newVal) { scope.$applyAsync(function() { _newVal = scope.$eval(_newVal); scope.disable = _newVal; }); }); - + attrs.$observe("mindate", function (_newVal) { scope.$applyAsync(function() { _newVal = scope.$eval(_newVal); scope.minDate = ADMdtpFactory.convertToUnix(_newVal, scope.calType, scope.option.format); }); }); - + attrs.$observe("maxdate", function (_newVal) { scope.$applyAsync(function() { _newVal = scope.$eval(_newVal); scope.maxDate = ADMdtpFactory.convertToUnix(_newVal, scope.calType, scope.option.format); }); - }); + }); scope.onKeydown = function(e) { if (e.keyCode == 9) scope.closeCalendar(); } - + scope.openCalendar = function() { if (scope.showCalendarStat || scope.disable) return; - + scope.timeoutValue[0] = 0; scope.showCalendarStat = true; - + var _admDtpCalendarHtml = angular.element(''); angular.element(document.body).append(_admDtpCalendarHtml); scope.$applyAsync(function () { $compile(_admDtpCalendarHtml)(scope); }); - + $timeout(function() { var top = document.documentElement.scrollTop || document.body.scrollTop; var popup = document.getElementById(scope.dtpId); @@ -1266,7 +1302,7 @@ width: popupBound.width + _corner.x, height: popupBound.height + _corner.y } - + var _pos = { top: '', bottom: '', @@ -1277,40 +1313,40 @@ _pos.top = (top + _inputBound.top - popupBound.height) + 'px'; else _pos.top = (top + _inputBound.top + _inputBound.height) + 'px'; - + if (_totalSize.width > window.innerWidth) _pos.left = (_corner.x + window.innerWidth - _totalSize.width - 20) + 'px'; else _pos.left = _corner.x + 'px'; - + angular.element(popup).css({top: _pos.top, bottom: _pos.bottom, left: _pos.left, opacity: 1}); - + }, 70); - + if (scope.onOpen) scope.onOpen(); } - + scope.closeCalendar = function() { if (!scope.showCalendarStat) return; - + scope.$applyAsync(function() { scope.monthPickerStat = false; scope.timePickerStat = false; scope.showCalendarStat = false; }); - + var popup = document.getElementById(scope.dtpId); if (popup) { angular.element(popup).remove(); - + if (scope.onClose) scope.onClose(); } - + } - + scope.toggleCalendar = function() { if (scope.showCalendarStat) scope.closeCalendar(); @@ -1321,10 +1357,10 @@ scope.destroy = function(noRefresh) { if (scope.disable) return; - + scope.monthPickerStat = false; scope.timePickerStat = false; - + scope.current = { year: '', month: '', @@ -1340,30 +1376,30 @@ hour: '00', minute: '00' } - var _standValue = new Date(); + var _standValue = new Date(); if (scope.calType == 'jalali') _standValue = ADMdtpFactory.convertToJalali(_standValue); ngModel.$setViewValue(''); ngModel.$render(); - + if (!noRefresh) admDtp.fillDays(_standValue, !scope.option.transition); - + if (scope.onChange) scope.onChange({date:scope.fullData}); } - + var dtpOpen = element[0].querySelector('[dtp-open]') || {}; dtpOpen.onclick = scope.openCalendar; - + var dtpClose = element[0].querySelector('[dtp-close]') || {}; dtpClose.onclick = scope.closeCalendar; var dtpToggle = element[0].querySelector('[dtp-toggle]') || {}; dtpToggle.onclick = scope.toggleCalendar; - + var dtpDestroy = element[0].querySelector('[dtp-destroy]') || {}; dtpDestroy.onclick = scope.destroy; }, @@ -1468,7 +1504,7 @@ var _unix = _ite_date.getTime(); var _dayName = _ite_date.getDay() + (($scope.calType=='jalali')?1:0); - + var _day = { day: _thisDay, month: _pDate.month || _ite_date.getMonth()+1, @@ -1504,7 +1540,6 @@ $scope.loadingDays = false; }, $scope.timeoutValue[1]); }); - }, $scope.timeoutValue[0]); } @@ -1523,7 +1558,7 @@ template: '
' }; } - + var dtpInputDirective = function() { return { require: ['^^admDtp', 'ngModel'], @@ -1542,7 +1577,7 @@ element.on('blur', function() { admDtp.vm.modelChanged(element[0].value); }); - + } } } @@ -1562,7 +1597,7 @@ element; if (!e.target) return; - + var classList = (attr.alias !== undefined) ? attr.alias.replace(', ', ',').split(',') : []; classList.push(attr.id); @@ -1584,23 +1619,23 @@ } }; } - + var ADMdtpConfig = function(ADMdtp) { - + ADMdtp.setOptions({isDeviceTouch: ('ontouchstart' in window || navigator.maxTouchPoints)}); - + var style = document.createElement('style'); style.type = 'text/css'; - + var vendor = function(css) { return '-moz-' + css + '-o-' + css + '-webkit-' + css + css; } - + for (var i=1; i<51; i++) style.innerHTML += '.ADMdtpDays>span:nth-child('+ i +')>span {'+ vendor('transition: all .5s, transform 0.2s '+ i*.01 +'s cubic-bezier(0.680, -0.550, 0.265, 1.550); ') +'}'; document.getElementsByTagName('head')[0].appendChild(style); - + } return angular.module('ADM-dateTimePicker', []) @@ -1615,6 +1650,3 @@ .directive('clickOut', ['$document', clickOutside]) .config(['ADMdtpProvider', ADMdtpConfig]); }(window.angular)); - - -