mirror of
https://github.com/frappe/air-datepicker.git
synced 2026-01-14 11:01:22 +08:00
Compare commits
No commits in common. "master" and "v2.2.0" have entirely different histories.
10
README.md
10
README.md
@ -26,16 +26,6 @@ $('.my-datepicker').datepicker([options])
|
||||
|
||||
## Change log
|
||||
|
||||
### v2.2.3
|
||||
* fixed min,max dates in decade mode
|
||||
|
||||
### v2.2.2
|
||||
* fixed min,max dates handling
|
||||
|
||||
### v2.2.1
|
||||
* changed RegExp for recognizing date parts
|
||||
* changed jquery version dependency
|
||||
|
||||
### v2.2.0
|
||||
* added `onlyTimepicker` option
|
||||
* added `onShow` and `onHide` callbacks
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "air-datepicker",
|
||||
"version": "2.2.3",
|
||||
"version": "2.2.0",
|
||||
"authors": [
|
||||
"t1m0n <t1m0n.tr@gmail.com>"
|
||||
],
|
||||
@ -30,6 +30,6 @@
|
||||
"tests"
|
||||
],
|
||||
"dependencies": {
|
||||
"jquery": ">=2.0.0 <4.0.0"
|
||||
"jquery": "^3.0.0"
|
||||
}
|
||||
}
|
||||
208
dist/css/datepicker.css
vendored
208
dist/css/datepicker.css
vendored
@ -18,46 +18,31 @@
|
||||
background: none;
|
||||
border: none; }
|
||||
|
||||
.datepicker--cell-day.-other-month-, .datepicker--cell-year.-other-decade- {
|
||||
color: #dedede; }
|
||||
.datepicker--cell-day.-other-month-:hover, .datepicker--cell-year.-other-decade-:hover {
|
||||
color: #c5c5c5; }
|
||||
.-disabled-.-focus-.datepicker--cell-day.-other-month-, .-disabled-.-focus-.datepicker--cell-year.-other-decade- {
|
||||
color: #dedede; }
|
||||
.-selected-.datepicker--cell-day.-other-month-, .-selected-.datepicker--cell-year.-other-decade- {
|
||||
color: #fff;
|
||||
background: #a2ddf6; }
|
||||
.-selected-.-focus-.datepicker--cell-day.-other-month-, .-selected-.-focus-.datepicker--cell-year.-other-decade- {
|
||||
background: #8ad5f4; }
|
||||
.-in-range-.datepicker--cell-day.-other-month-, .-in-range-.datepicker--cell-year.-other-decade- {
|
||||
background-color: rgba(92, 196, 239, 0.1);
|
||||
color: #cccccc; }
|
||||
.-in-range-.-focus-.datepicker--cell-day.-other-month-, .-in-range-.-focus-.datepicker--cell-year.-other-decade- {
|
||||
background-color: rgba(92, 196, 239, 0.2); }
|
||||
.datepicker--cell-day.-other-month-:empty, .datepicker--cell-year.-other-decade-:empty {
|
||||
background: none;
|
||||
border: none; }
|
||||
|
||||
/* -------------------------------------------------
|
||||
Datepicker cells
|
||||
------------------------------------------------- */
|
||||
.datepicker--cells {
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-ms-flex-wrap: wrap;
|
||||
flex-wrap: wrap; }
|
||||
-webkit-flex-wrap: wrap;
|
||||
-ms-flex-wrap: wrap;
|
||||
flex-wrap: wrap; }
|
||||
|
||||
.datepicker--cell {
|
||||
border-radius: 4px;
|
||||
box-sizing: border-box;
|
||||
cursor: pointer;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
position: relative;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
-webkit-align-items: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
height: 32px;
|
||||
z-index: 1; }
|
||||
.datepicker--cell.-focus- {
|
||||
@ -106,22 +91,28 @@
|
||||
cursor: default; }
|
||||
|
||||
.datepicker--days-names {
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-ms-flex-wrap: wrap;
|
||||
flex-wrap: wrap;
|
||||
-webkit-flex-wrap: wrap;
|
||||
-ms-flex-wrap: wrap;
|
||||
flex-wrap: wrap;
|
||||
margin: 8px 0 3px; }
|
||||
|
||||
.datepicker--day-name {
|
||||
color: #FF9A19;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
-ms-flex: 1;
|
||||
flex: 1;
|
||||
-webkit-align-items: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
-webkit-flex: 1;
|
||||
-ms-flex: 1;
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
text-transform: uppercase;
|
||||
font-size: .8em; }
|
||||
@ -190,20 +181,29 @@
|
||||
position: absolute;
|
||||
left: -100000px;
|
||||
opacity: 0;
|
||||
transition: opacity 0.3s ease, left 0s 0.3s, -webkit-transform 0.3s ease;
|
||||
transition: opacity 0.3s ease, transform 0.3s ease, left 0s 0.3s;
|
||||
transition: opacity 0.3s ease, transform 0.3s ease, left 0s 0.3s, -webkit-transform 0.3s ease;
|
||||
z-index: 100; }
|
||||
.datepicker.-from-top- {
|
||||
transform: translateY(-8px); }
|
||||
-webkit-transform: translateY(-8px);
|
||||
transform: translateY(-8px); }
|
||||
.datepicker.-from-right- {
|
||||
transform: translateX(8px); }
|
||||
-webkit-transform: translateX(8px);
|
||||
transform: translateX(8px); }
|
||||
.datepicker.-from-bottom- {
|
||||
transform: translateY(8px); }
|
||||
-webkit-transform: translateY(8px);
|
||||
transform: translateY(8px); }
|
||||
.datepicker.-from-left- {
|
||||
transform: translateX(-8px); }
|
||||
-webkit-transform: translateX(-8px);
|
||||
transform: translateX(-8px); }
|
||||
.datepicker.active {
|
||||
opacity: 1;
|
||||
transform: translate(0);
|
||||
transition: opacity 0.3s ease, transform 0.3s ease, left 0s 0s; }
|
||||
-webkit-transform: translate(0);
|
||||
transform: translate(0);
|
||||
transition: opacity 0.3s ease, left 0s 0s, -webkit-transform 0.3s ease;
|
||||
transition: opacity 0.3s ease, transform 0.3s ease, left 0s 0s;
|
||||
transition: opacity 0.3s ease, transform 0.3s ease, left 0s 0s, -webkit-transform 0.3s ease; }
|
||||
|
||||
.datepicker-inline .datepicker {
|
||||
border-color: #d7d7d7;
|
||||
@ -212,7 +212,8 @@
|
||||
left: auto;
|
||||
right: auto;
|
||||
opacity: 1;
|
||||
transform: none; }
|
||||
-webkit-transform: none;
|
||||
transform: none; }
|
||||
|
||||
.datepicker-inline .datepicker--pointer {
|
||||
display: none; }
|
||||
@ -233,16 +234,20 @@
|
||||
z-index: -1; }
|
||||
.-top-left- .datepicker--pointer, .-top-center- .datepicker--pointer, .-top-right- .datepicker--pointer {
|
||||
top: calc(100% - 4px);
|
||||
transform: rotate(135deg); }
|
||||
-webkit-transform: rotate(135deg);
|
||||
transform: rotate(135deg); }
|
||||
.-right-top- .datepicker--pointer, .-right-center- .datepicker--pointer, .-right-bottom- .datepicker--pointer {
|
||||
right: calc(100% - 4px);
|
||||
transform: rotate(225deg); }
|
||||
-webkit-transform: rotate(225deg);
|
||||
transform: rotate(225deg); }
|
||||
.-bottom-left- .datepicker--pointer, .-bottom-center- .datepicker--pointer, .-bottom-right- .datepicker--pointer {
|
||||
bottom: calc(100% - 4px);
|
||||
transform: rotate(315deg); }
|
||||
-webkit-transform: rotate(315deg);
|
||||
transform: rotate(315deg); }
|
||||
.-left-top- .datepicker--pointer, .-left-center- .datepicker--pointer, .-left-bottom- .datepicker--pointer {
|
||||
left: calc(100% - 4px);
|
||||
transform: rotate(45deg); }
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg); }
|
||||
.-top-left- .datepicker--pointer, .-bottom-left- .datepicker--pointer {
|
||||
left: 10px; }
|
||||
.-top-right- .datepicker--pointer, .-bottom-right- .datepicker--pointer {
|
||||
@ -285,10 +290,12 @@
|
||||
Navigation
|
||||
------------------------------------------------- */
|
||||
.datepicker--nav {
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-ms-flex-pack: justify;
|
||||
justify-content: space-between;
|
||||
-webkit-justify-content: space-between;
|
||||
-ms-flex-pack: justify;
|
||||
justify-content: space-between;
|
||||
border-bottom: 1px solid #efefef;
|
||||
min-height: 32px;
|
||||
padding: 4px; }
|
||||
@ -297,13 +304,16 @@
|
||||
|
||||
.datepicker--nav-title,
|
||||
.datepicker--nav-action {
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
cursor: pointer;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center; }
|
||||
-webkit-align-items: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center; }
|
||||
|
||||
.datepicker--nav-action {
|
||||
width: 32px;
|
||||
@ -338,6 +348,7 @@
|
||||
background: none; }
|
||||
|
||||
.datepicker--buttons {
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
padding: 4px;
|
||||
@ -347,14 +358,18 @@
|
||||
color: #4EB5E6;
|
||||
cursor: pointer;
|
||||
border-radius: 4px;
|
||||
-ms-flex: 1;
|
||||
flex: 1;
|
||||
-webkit-flex: 1;
|
||||
-ms-flex: 1;
|
||||
flex: 1;
|
||||
display: -webkit-inline-flex;
|
||||
display: -ms-inline-flexbox;
|
||||
display: inline-flex;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
-webkit-align-items: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
height: 32px; }
|
||||
.datepicker--button:hover {
|
||||
color: #4a4a4a;
|
||||
@ -385,22 +400,26 @@
|
||||
------------------------------------------------- */
|
||||
.datepicker--time {
|
||||
border-top: 1px solid #efefef;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
-webkit-align-items: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
padding: 4px;
|
||||
position: relative; }
|
||||
.datepicker--time.-am-pm- .datepicker--time-sliders {
|
||||
-ms-flex: 0 1 138px;
|
||||
flex: 0 1 138px;
|
||||
-webkit-flex: 0 1 138px;
|
||||
-ms-flex: 0 1 138px;
|
||||
flex: 0 1 138px;
|
||||
max-width: 138px; }
|
||||
.-only-timepicker- .datepicker--time {
|
||||
border-top: none; }
|
||||
|
||||
.datepicker--time-sliders {
|
||||
-ms-flex: 0 1 153px;
|
||||
flex: 0 1 153px;
|
||||
-webkit-flex: 0 1 153px;
|
||||
-ms-flex: 0 1 153px;
|
||||
flex: 0 1 153px;
|
||||
margin-right: 10px;
|
||||
max-width: 153px; }
|
||||
|
||||
@ -409,31 +428,32 @@
|
||||
font-size: 12px; }
|
||||
|
||||
.datepicker--time-current {
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
-ms-flex: 1;
|
||||
flex: 1;
|
||||
-webkit-align-items: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
-webkit-flex: 1;
|
||||
-ms-flex: 1;
|
||||
flex: 1;
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
margin: 0 10px; }
|
||||
margin: 0 0 0 10px; }
|
||||
|
||||
.datepicker--time-current-colon {
|
||||
margin: 0 2px 3px;
|
||||
line-height: 1; }
|
||||
|
||||
.datepicker--time-current-hours,
|
||||
.datepicker--time-current-minutes,
|
||||
.datepicker--time-current-seconds {
|
||||
.datepicker--time-current-minutes {
|
||||
line-height: 1;
|
||||
font-size: 14px;
|
||||
font-size: 19px;
|
||||
font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
|
||||
position: relative;
|
||||
z-index: 1; }
|
||||
.datepicker--time-current-hours:after,
|
||||
.datepicker--time-current-minutes:after,
|
||||
.datepicker--time-current-seconds:after {
|
||||
.datepicker--time-current-minutes:after {
|
||||
content: '';
|
||||
background: #f0f0f0;
|
||||
border-radius: 4px;
|
||||
@ -445,24 +465,26 @@
|
||||
z-index: -1;
|
||||
opacity: 0; }
|
||||
.datepicker--time-current-hours.-focus-:after,
|
||||
.datepicker--time-current-minutes.-focus-:after,
|
||||
.datepicker--time-current-seconds.-focus-:after {
|
||||
.datepicker--time-current-minutes.-focus-:after {
|
||||
opacity: 1; }
|
||||
|
||||
.datepicker--time-current-ampm {
|
||||
text-transform: uppercase;
|
||||
-ms-flex-item-align: start;
|
||||
align-self: flex-start;
|
||||
-webkit-align-self: flex-end;
|
||||
-ms-flex-item-align: end;
|
||||
align-self: flex-end;
|
||||
color: #9c9c9c;
|
||||
margin-left: 6px;
|
||||
font-size: 11px;
|
||||
margin-bottom: 1px; }
|
||||
|
||||
.datepicker--time-row {
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
-webkit-align-items: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
font-size: 11px;
|
||||
height: 17px;
|
||||
background: linear-gradient(to right, #dedede, #dedede) left 50%/100% 1px no-repeat; }
|
||||
@ -471,8 +493,9 @@
|
||||
.datepicker--time-row input[type='range'] {
|
||||
background: none;
|
||||
cursor: pointer;
|
||||
-ms-flex: 1;
|
||||
flex: 1;
|
||||
-webkit-flex: 1;
|
||||
-ms-flex: 1;
|
||||
flex: 1;
|
||||
height: 100%;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
@ -570,9 +593,30 @@
|
||||
width: 1px;
|
||||
left: calc(50% - 1px);
|
||||
top: calc(50% + 1px);
|
||||
transform: translateY(-100%); }
|
||||
-webkit-transform: translateY(-100%);
|
||||
transform: translateY(-100%); }
|
||||
.datepicker--time-icon:before {
|
||||
width: .4em;
|
||||
height: 1px;
|
||||
top: calc(50% + 1px);
|
||||
left: calc(50% - 1px); }
|
||||
|
||||
.datepicker--cell-day.-other-month-, .datepicker--cell-year.-other-decade- {
|
||||
color: #dedede; }
|
||||
.datepicker--cell-day.-other-month-:hover, .datepicker--cell-year.-other-decade-:hover {
|
||||
color: #c5c5c5; }
|
||||
.-disabled-.-focus-.datepicker--cell-day.-other-month-, .-disabled-.-focus-.datepicker--cell-year.-other-decade- {
|
||||
color: #dedede; }
|
||||
.-selected-.datepicker--cell-day.-other-month-, .-selected-.datepicker--cell-year.-other-decade- {
|
||||
color: #fff;
|
||||
background: #a2ddf6; }
|
||||
.-selected-.-focus-.datepicker--cell-day.-other-month-, .-selected-.-focus-.datepicker--cell-year.-other-decade- {
|
||||
background: #8ad5f4; }
|
||||
.-in-range-.datepicker--cell-day.-other-month-, .-in-range-.datepicker--cell-year.-other-decade- {
|
||||
background-color: rgba(92, 196, 239, 0.1);
|
||||
color: #cccccc; }
|
||||
.-in-range-.-focus-.datepicker--cell-day.-other-month-, .-in-range-.-focus-.datepicker--cell-year.-other-decade- {
|
||||
background-color: rgba(92, 196, 239, 0.2); }
|
||||
.datepicker--cell-day.-other-month-:empty, .datepicker--cell-year.-other-decade-:empty {
|
||||
background: none;
|
||||
border: none; }
|
||||
|
||||
2
dist/css/datepicker.min.css
vendored
2
dist/css/datepicker.min.css
vendored
File diff suppressed because one or more lines are too long
122
dist/js/datepicker.js
vendored
122
dist/js/datepicker.js
vendored
@ -1,5 +1,5 @@
|
||||
;(function (window, $, undefined) { ;(function () {
|
||||
var VERSION = '2.2.3',
|
||||
var VERSION = '2.2.0',
|
||||
pluginName = 'datepicker',
|
||||
autoInitSelector = '.datepicker-here',
|
||||
$body, $datepickersContainer,
|
||||
@ -70,11 +70,8 @@
|
||||
maxHours: 24,
|
||||
minMinutes: 0,
|
||||
maxMinutes: 59,
|
||||
minSeconds: 0,
|
||||
maxSeconds: 59,
|
||||
hoursStep: 1,
|
||||
minutesStep: 1,
|
||||
secondsStep: 1,
|
||||
|
||||
// events
|
||||
onSelect: '',
|
||||
@ -305,8 +302,7 @@
|
||||
parsedSelected.month,
|
||||
parsedSelected.date,
|
||||
parsedSelected.hours,
|
||||
parsedSelected.minutes,
|
||||
parsedSelected.seconds
|
||||
parsedSelected.minutes
|
||||
);
|
||||
|
||||
formattedDates = selectedDates.map(function (date) {
|
||||
@ -322,11 +318,11 @@
|
||||
parsedDate.month,
|
||||
parsedDate.date,
|
||||
parsedDate.hours,
|
||||
parsedDate.minutes,
|
||||
parsedDate.seconds
|
||||
parsedDate.minutes
|
||||
);
|
||||
})
|
||||
}
|
||||
|
||||
this._prevOnSelectValue = formattedDates;
|
||||
this.opts.onSelect(formattedDates, dates, this);
|
||||
},
|
||||
@ -381,7 +377,6 @@
|
||||
hours = d.hours,
|
||||
ampm = string.match(boundary('aa')) || string.match(boundary('AA')),
|
||||
dayPeriod = 'am',
|
||||
replacer = this._replacer,
|
||||
validHours;
|
||||
|
||||
if (this.opts.timepicker && this.timepicker && ampm) {
|
||||
@ -395,63 +390,50 @@
|
||||
case /@/.test(result):
|
||||
result = result.replace(/@/, date.getTime());
|
||||
case /aa/.test(result):
|
||||
result = replacer(result, boundary('aa'), dayPeriod);
|
||||
result = result.replace(boundary('aa'), dayPeriod);
|
||||
case /AA/.test(result):
|
||||
result = replacer(result, boundary('AA'), dayPeriod.toUpperCase());
|
||||
result = result.replace(boundary('AA'), dayPeriod.toUpperCase());
|
||||
case /dd/.test(result):
|
||||
result = replacer(result, boundary('dd'), d.fullDate);
|
||||
result = result.replace(boundary('dd'), d.fullDate);
|
||||
case /d/.test(result):
|
||||
result = replacer(result, boundary('d'), d.date);
|
||||
result = result.replace(boundary('d'), d.date);
|
||||
case /DD/.test(result):
|
||||
result = replacer(result, boundary('DD'), locale.days[d.day]);
|
||||
result = result.replace(boundary('DD'), locale.days[d.day]);
|
||||
case /D/.test(result):
|
||||
result = replacer(result, boundary('D'), locale.daysShort[d.day]);
|
||||
result = result.replace(boundary('D'), locale.daysShort[d.day]);
|
||||
case /mm/.test(result):
|
||||
result = replacer(result, boundary('mm'), d.fullMonth);
|
||||
result = result.replace(boundary('mm'), d.fullMonth);
|
||||
case /m/.test(result):
|
||||
result = replacer(result, boundary('m'), d.month + 1);
|
||||
result = result.replace(boundary('m'), d.month + 1);
|
||||
case /MM/.test(result):
|
||||
result = replacer(result, boundary('MM'), this.loc.months[d.month]);
|
||||
result = result.replace(boundary('MM'), this.loc.months[d.month]);
|
||||
case /M/.test(result):
|
||||
result = replacer(result, boundary('M'), locale.monthsShort[d.month]);
|
||||
case /ss/.test(result):
|
||||
result = replacer(result, boundary('ss'), d.fullSeconds);
|
||||
case /s/.test(result):
|
||||
result = replacer(result, boundary('s'), d.seconds);
|
||||
result = result.replace(boundary('M'), locale.monthsShort[d.month]);
|
||||
case /ii/.test(result):
|
||||
result = replacer(result, boundary('ii'), d.fullMinutes);
|
||||
result = result.replace(boundary('ii'), d.fullMinutes);
|
||||
case /i/.test(result):
|
||||
result = replacer(result, boundary('i'), d.minutes);
|
||||
result = result.replace(boundary('i'), d.minutes);
|
||||
case /hh/.test(result):
|
||||
result = replacer(result, boundary('hh'), fullHours);
|
||||
result = result.replace(boundary('hh'), fullHours);
|
||||
case /h/.test(result):
|
||||
result = replacer(result, boundary('h'), hours);
|
||||
result = result.replace(boundary('h'), hours);
|
||||
case /yyyy/.test(result):
|
||||
result = replacer(result, boundary('yyyy'), d.year);
|
||||
result = result.replace(boundary('yyyy'), d.year);
|
||||
case /yyyy1/.test(result):
|
||||
result = replacer(result, boundary('yyyy1'), decade[0]);
|
||||
result = result.replace(boundary('yyyy1'), decade[0]);
|
||||
case /yyyy2/.test(result):
|
||||
result = replacer(result, boundary('yyyy2'), decade[1]);
|
||||
result = result.replace(boundary('yyyy2'), decade[1]);
|
||||
case /yy/.test(result):
|
||||
result = replacer(result, boundary('yy'), d.year.toString().slice(-2));
|
||||
result = result.replace(boundary('yy'), d.year.toString().slice(-2));
|
||||
}
|
||||
|
||||
return result;
|
||||
},
|
||||
|
||||
_replacer: function (str, reg, data) {
|
||||
return str.replace(reg, function (match, p1,p2,p3) {
|
||||
return p1 + data + p3;
|
||||
})
|
||||
},
|
||||
|
||||
_getWordBoundaryRegExp: function (sign) {
|
||||
var symbols = '\\s|\\.|-|/|\\\\|,|\\$|\\!|\\?|:|;';
|
||||
|
||||
return new RegExp('(^|>|' + symbols + ')(' + sign + ')($|<|' + symbols + ')', 'g');
|
||||
return new RegExp('\\b(?=[a-zA-Z0-9áäöüúÁßÉÄÖÜÚ<])' + sign + '(?![>a-zA-Z0-9áäöüÁßÉÄÖÜÚ])');
|
||||
},
|
||||
|
||||
|
||||
selectDate: function (date) {
|
||||
var _this = this,
|
||||
opts = _this.opts,
|
||||
@ -485,7 +467,6 @@
|
||||
if (this.timepicker) {
|
||||
date.setHours(this.timepicker.hours);
|
||||
date.setMinutes(this.timepicker.minutes)
|
||||
date.setSeconds(this.timepicker.seconds)
|
||||
}
|
||||
|
||||
if (_this.view == 'days') {
|
||||
@ -653,7 +634,6 @@
|
||||
if (lastSelectedDate) {
|
||||
lastSelectedDate.setHours(this.timepicker.hours);
|
||||
lastSelectedDate.setMinutes(this.timepicker.minutes);
|
||||
lastSelectedDate.setSeconds(this.timepicker.seconds);
|
||||
}
|
||||
}
|
||||
|
||||
@ -1197,7 +1177,6 @@
|
||||
if (this.timepicker) {
|
||||
this.focused.setHours(this.timepicker.hours);
|
||||
this.focused.setMinutes(this.timepicker.minutes);
|
||||
this.focused.setSeconds(this.timepicker.seconds);
|
||||
}
|
||||
this.selectDate(this.focused);
|
||||
return;
|
||||
@ -1259,7 +1238,7 @@
|
||||
this.silent = false;
|
||||
},
|
||||
|
||||
_onTimeChange: function (e, h, m, s) {
|
||||
_onTimeChange: function (e, h, m) {
|
||||
var date = new Date(),
|
||||
selectedDates = this.selectedDates,
|
||||
selected = false;
|
||||
@ -1271,7 +1250,6 @@
|
||||
|
||||
date.setHours(h);
|
||||
date.setMinutes(m);
|
||||
date.setSeconds(s);
|
||||
|
||||
if (!selected && !this._getCell(date).hasClass('-disabled-')) {
|
||||
this.selectDate(date);
|
||||
@ -1287,7 +1265,6 @@
|
||||
if (this.timepicker) {
|
||||
date.setHours(this.timepicker.hours);
|
||||
date.setMinutes(this.timepicker.minutes);
|
||||
date.setSeconds(this.timepicker.seconds)
|
||||
}
|
||||
this.selectDate(date);
|
||||
},
|
||||
@ -1411,9 +1388,7 @@
|
||||
hours: date.getHours(),
|
||||
fullHours: date.getHours() < 10 ? '0' + date.getHours() : date.getHours() ,
|
||||
minutes: date.getMinutes(),
|
||||
fullMinutes: date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes(),
|
||||
seconds: date.getSeconds(),
|
||||
fullSeconds: date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds()
|
||||
fullMinutes: date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()
|
||||
}
|
||||
};
|
||||
|
||||
@ -1910,10 +1885,10 @@
|
||||
|
||||
switch (this.d.view) {
|
||||
case 'days':
|
||||
if (!this.d._isInRange(new Date(y, m-1, 1), 'month')) {
|
||||
if (!this.d._isInRange(new Date(y, m-1, d), 'month')) {
|
||||
this._disableNav('prev')
|
||||
}
|
||||
if (!this.d._isInRange(new Date(y, m+1, 1), 'month')) {
|
||||
if (!this.d._isInRange(new Date(y, m+1, d), 'month')) {
|
||||
this._disableNav('next')
|
||||
}
|
||||
break;
|
||||
@ -1926,11 +1901,10 @@
|
||||
}
|
||||
break;
|
||||
case 'years':
|
||||
var decade = dp.getDecade(this.d.date);
|
||||
if (!this.d._isInRange(new Date(decade[0] - 1, 0, 1), 'year')) {
|
||||
if (!this.d._isInRange(new Date(y-10, m, d), 'year')) {
|
||||
this._disableNav('prev')
|
||||
}
|
||||
if (!this.d._isInRange(new Date(decade[1] + 1, 0, 1), 'year')) {
|
||||
if (!this.d._isInRange(new Date(y+10, m, d), 'year')) {
|
||||
this._disableNav('next')
|
||||
}
|
||||
break;
|
||||
@ -1971,8 +1945,6 @@
|
||||
' <span class="datepicker--time-current-hours">#{hourVisible}</span>' +
|
||||
' <span class="datepicker--time-current-colon">:</span>' +
|
||||
' <span class="datepicker--time-current-minutes">#{minValue}</span>' +
|
||||
' <span class="datepicker--time-current-colon">:</span>' +
|
||||
' <span class="datepicker--time-current-seconds">#{secValue}</span>' +
|
||||
'</div>' +
|
||||
'<div class="datepicker--time-sliders">' +
|
||||
' <div class="datepicker--time-row">' +
|
||||
@ -1981,9 +1953,6 @@
|
||||
' <div class="datepicker--time-row">' +
|
||||
' <input type="range" name="minutes" value="#{minValue}" min="#{minMin}" max="#{minMax}" step="#{minStep}"/>' +
|
||||
' </div>' +
|
||||
' <div class="datepicker--time-row">' +
|
||||
' <input type="range" name="seconds" value="#{secValue}" min="#{secMin}" max="#{secMax}" step="#{secStep}"/>' +
|
||||
' </div>' +
|
||||
'</div>' +
|
||||
'</div>',
|
||||
datepicker = $.fn.datepicker,
|
||||
@ -2019,7 +1988,6 @@
|
||||
this._handleDate(date);
|
||||
this.hours = _date.hours < this.minHours ? this.minHours : _date.hours;
|
||||
this.minutes = _date.minutes < this.minMinutes ? this.minMinutes : _date.minutes;
|
||||
this.seconds = _date.seconds < this.minSeconds ? this.minSeconds : _date.seconds;
|
||||
},
|
||||
|
||||
/**
|
||||
@ -2031,7 +1999,6 @@
|
||||
_setMinTimeFromDate: function (date) {
|
||||
this.minHours = date.getHours();
|
||||
this.minMinutes = date.getMinutes();
|
||||
this.minSeconds = date.getSeconds();
|
||||
|
||||
// If, for example, min hours are 10, and current hours are 12,
|
||||
// update minMinutes to default value, to be able to choose whole range of values
|
||||
@ -2045,7 +2012,6 @@
|
||||
_setMaxTimeFromDate: function (date) {
|
||||
this.maxHours = date.getHours();
|
||||
this.maxMinutes = date.getMinutes();
|
||||
this.maxSeconds = date.getSeconds();
|
||||
|
||||
if (this.d.lastSelectedDate) {
|
||||
if (this.d.lastSelectedDate.getHours() < date.getHours()) {
|
||||
@ -2057,15 +2023,12 @@
|
||||
_setDefaultMinMaxTime: function () {
|
||||
var maxHours = 23,
|
||||
maxMinutes = 59,
|
||||
maxSeconds = 59,
|
||||
opts = this.opts;
|
||||
|
||||
this.minHours = opts.minHours < 0 || opts.minHours > maxHours ? 0 : opts.minHours;
|
||||
this.minMinutes = opts.minMinutes < 0 || opts.minMinutes > maxMinutes ? 0 : opts.minMinutes;
|
||||
this.maxHours = opts.maxHours < 0 || opts.maxHours > maxHours ? maxHours : opts.maxHours;
|
||||
this.maxMinutes = opts.maxMinutes < 0 || opts.maxMinutes > maxMinutes ? maxMinutes : opts.maxMinutes;
|
||||
this.minSeconds = opts.minSeconds < 0 || opts.minSeconds > maxSeconds ? 0 : opts.minSeconds;
|
||||
this.maxSeconds = opts.maxSeconds < 0 || opts.maxSeconds > maxSeconds ? maxSeconds : opts.maxSeconds;
|
||||
},
|
||||
|
||||
/**
|
||||
@ -2085,12 +2048,6 @@
|
||||
} else if (this.minutes > this.maxMinutes) {
|
||||
this.minutes = this.maxMinutes;
|
||||
}
|
||||
|
||||
if (this.seconds < this.minSeconds) {
|
||||
this.seconds = this.minSeconds;
|
||||
} else if (this.seconds > this.maxSeconds) {
|
||||
this.seconds = this.maxSeconds;
|
||||
}
|
||||
},
|
||||
|
||||
_buildHTML: function () {
|
||||
@ -2104,11 +2061,7 @@
|
||||
minMin: this.minMinutes,
|
||||
minMax: lz(this.maxMinutes),
|
||||
minStep: this.opts.minutesStep,
|
||||
minValue: lz(this.minutes),
|
||||
secMin: this.minSeconds,
|
||||
secMax: lz(this.maxSeconds),
|
||||
secStep: this.opts.secondsStep,
|
||||
secValue: lz(this.seconds)
|
||||
minValue: lz(this.minutes)
|
||||
},
|
||||
_template = dp.template(template, data);
|
||||
|
||||
@ -2116,10 +2069,8 @@
|
||||
this.$ranges = $('[type="range"]', this.$timepicker);
|
||||
this.$hours = $('[name="hours"]', this.$timepicker);
|
||||
this.$minutes = $('[name="minutes"]', this.$timepicker);
|
||||
this.$seconds = $('[name="seconds"]', this.$timepicker);
|
||||
this.$hoursText = $('.datepicker--time-current-hours', this.$timepicker);
|
||||
this.$minutesText = $('.datepicker--time-current-minutes', this.$timepicker);
|
||||
this.$secondsText = $('.datepicker--time-current-seconds', this.$timepicker);
|
||||
|
||||
if (this.d.ampm) {
|
||||
this.$ampm = $('<span class="datepicker--time-current-ampm">')
|
||||
@ -2132,12 +2083,10 @@
|
||||
|
||||
_updateCurrentTime: function () {
|
||||
var h = dp.getLeadingZeroNum(this.displayHours),
|
||||
m = dp.getLeadingZeroNum(this.minutes),
|
||||
s = dp.getLeadingZeroNum(this.seconds);
|
||||
m = dp.getLeadingZeroNum(this.minutes);
|
||||
|
||||
this.$hoursText.html(h);
|
||||
this.$minutesText.html(m);
|
||||
this.$secondsText.html(s);
|
||||
|
||||
if (this.d.ampm) {
|
||||
this.$ampm.html(this.dayPeriod);
|
||||
@ -2153,12 +2102,7 @@
|
||||
this.$minutes.attr({
|
||||
min: this.minMinutes,
|
||||
max: this.maxMinutes
|
||||
}).val(this.minutes);
|
||||
|
||||
this.$seconds.attr({
|
||||
min: this.minSeconds,
|
||||
max: this.maxSeconds
|
||||
}).val(this.seconds);
|
||||
}).val(this.minutes)
|
||||
},
|
||||
|
||||
/**
|
||||
@ -2251,7 +2195,7 @@
|
||||
|
||||
this[name] = $target.val();
|
||||
this._updateCurrentTime();
|
||||
this.d._trigger('timeChange', [this.hours, this.minutes, this.seconds]);
|
||||
this.d._trigger('timeChange', [this.hours, this.minutes]);
|
||||
|
||||
this._handleDate(this.d.lastSelectedDate);
|
||||
this.update()
|
||||
|
||||
4
dist/js/datepicker.min.js
vendored
4
dist/js/datepicker.min.js
vendored
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "air-datepicker",
|
||||
"version": "2.2.3",
|
||||
"version": "2.2.0",
|
||||
"devDependencies": {
|
||||
"autoprefixer": "^6.1.0",
|
||||
"browserify": "^13.0.0",
|
||||
@ -25,7 +25,7 @@
|
||||
"vinyl-source-stream": "^1.1.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"jquery": ">=2.0.0 <4.0.0"
|
||||
"jquery": "^3.0.0"
|
||||
},
|
||||
"description": "Lightweight customizable cross-browser jQuery datepicker, built with es5 and css-flexbox. Works in all modern desktop and mobile browsers (tested no Android 4.4+ and iOS8+)\r ",
|
||||
"main": "src/js/air-datepicker.js",
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
;(function () {
|
||||
var VERSION = '2.2.3',
|
||||
var VERSION = '2.2.0',
|
||||
pluginName = 'datepicker',
|
||||
autoInitSelector = '.datepicker-here',
|
||||
$body, $datepickersContainer,
|
||||
@ -70,11 +70,8 @@
|
||||
maxHours: 24,
|
||||
minMinutes: 0,
|
||||
maxMinutes: 59,
|
||||
minSeconds: 0,
|
||||
maxSeconds: 59,
|
||||
hoursStep: 1,
|
||||
minutesStep: 1,
|
||||
secondsStep: 1,
|
||||
|
||||
// events
|
||||
onSelect: '',
|
||||
@ -305,8 +302,7 @@
|
||||
parsedSelected.month,
|
||||
parsedSelected.date,
|
||||
parsedSelected.hours,
|
||||
parsedSelected.minutes,
|
||||
parsedSelected.seconds
|
||||
parsedSelected.minutes
|
||||
);
|
||||
|
||||
formattedDates = selectedDates.map(function (date) {
|
||||
@ -322,11 +318,11 @@
|
||||
parsedDate.month,
|
||||
parsedDate.date,
|
||||
parsedDate.hours,
|
||||
parsedDate.minutes,
|
||||
parsedDate.seconds
|
||||
parsedDate.minutes
|
||||
);
|
||||
})
|
||||
}
|
||||
|
||||
this._prevOnSelectValue = formattedDates;
|
||||
this.opts.onSelect(formattedDates, dates, this);
|
||||
},
|
||||
@ -381,7 +377,6 @@
|
||||
hours = d.hours,
|
||||
ampm = string.match(boundary('aa')) || string.match(boundary('AA')),
|
||||
dayPeriod = 'am',
|
||||
replacer = this._replacer,
|
||||
validHours;
|
||||
|
||||
if (this.opts.timepicker && this.timepicker && ampm) {
|
||||
@ -395,63 +390,50 @@
|
||||
case /@/.test(result):
|
||||
result = result.replace(/@/, date.getTime());
|
||||
case /aa/.test(result):
|
||||
result = replacer(result, boundary('aa'), dayPeriod);
|
||||
result = result.replace(boundary('aa'), dayPeriod);
|
||||
case /AA/.test(result):
|
||||
result = replacer(result, boundary('AA'), dayPeriod.toUpperCase());
|
||||
result = result.replace(boundary('AA'), dayPeriod.toUpperCase());
|
||||
case /dd/.test(result):
|
||||
result = replacer(result, boundary('dd'), d.fullDate);
|
||||
result = result.replace(boundary('dd'), d.fullDate);
|
||||
case /d/.test(result):
|
||||
result = replacer(result, boundary('d'), d.date);
|
||||
result = result.replace(boundary('d'), d.date);
|
||||
case /DD/.test(result):
|
||||
result = replacer(result, boundary('DD'), locale.days[d.day]);
|
||||
result = result.replace(boundary('DD'), locale.days[d.day]);
|
||||
case /D/.test(result):
|
||||
result = replacer(result, boundary('D'), locale.daysShort[d.day]);
|
||||
result = result.replace(boundary('D'), locale.daysShort[d.day]);
|
||||
case /mm/.test(result):
|
||||
result = replacer(result, boundary('mm'), d.fullMonth);
|
||||
result = result.replace(boundary('mm'), d.fullMonth);
|
||||
case /m/.test(result):
|
||||
result = replacer(result, boundary('m'), d.month + 1);
|
||||
result = result.replace(boundary('m'), d.month + 1);
|
||||
case /MM/.test(result):
|
||||
result = replacer(result, boundary('MM'), this.loc.months[d.month]);
|
||||
result = result.replace(boundary('MM'), this.loc.months[d.month]);
|
||||
case /M/.test(result):
|
||||
result = replacer(result, boundary('M'), locale.monthsShort[d.month]);
|
||||
case /ss/.test(result):
|
||||
result = replacer(result, boundary('ss'), d.fullSeconds);
|
||||
case /s/.test(result):
|
||||
result = replacer(result, boundary('s'), d.seconds);
|
||||
result = result.replace(boundary('M'), locale.monthsShort[d.month]);
|
||||
case /ii/.test(result):
|
||||
result = replacer(result, boundary('ii'), d.fullMinutes);
|
||||
result = result.replace(boundary('ii'), d.fullMinutes);
|
||||
case /i/.test(result):
|
||||
result = replacer(result, boundary('i'), d.minutes);
|
||||
result = result.replace(boundary('i'), d.minutes);
|
||||
case /hh/.test(result):
|
||||
result = replacer(result, boundary('hh'), fullHours);
|
||||
result = result.replace(boundary('hh'), fullHours);
|
||||
case /h/.test(result):
|
||||
result = replacer(result, boundary('h'), hours);
|
||||
result = result.replace(boundary('h'), hours);
|
||||
case /yyyy/.test(result):
|
||||
result = replacer(result, boundary('yyyy'), d.year);
|
||||
result = result.replace(boundary('yyyy'), d.year);
|
||||
case /yyyy1/.test(result):
|
||||
result = replacer(result, boundary('yyyy1'), decade[0]);
|
||||
result = result.replace(boundary('yyyy1'), decade[0]);
|
||||
case /yyyy2/.test(result):
|
||||
result = replacer(result, boundary('yyyy2'), decade[1]);
|
||||
result = result.replace(boundary('yyyy2'), decade[1]);
|
||||
case /yy/.test(result):
|
||||
result = replacer(result, boundary('yy'), d.year.toString().slice(-2));
|
||||
result = result.replace(boundary('yy'), d.year.toString().slice(-2));
|
||||
}
|
||||
|
||||
return result;
|
||||
},
|
||||
|
||||
_replacer: function (str, reg, data) {
|
||||
return str.replace(reg, function (match, p1,p2,p3) {
|
||||
return p1 + data + p3;
|
||||
})
|
||||
},
|
||||
|
||||
_getWordBoundaryRegExp: function (sign) {
|
||||
var symbols = '\\s|\\.|-|/|\\\\|,|\\$|\\!|\\?|:|;';
|
||||
|
||||
return new RegExp('(^|>|' + symbols + ')(' + sign + ')($|<|' + symbols + ')', 'g');
|
||||
return new RegExp('\\b(?=[a-zA-Z0-9áäöüúÁßÉÄÖÜÚ<])' + sign + '(?![>a-zA-Z0-9áäöüÁßÉÄÖÜÚ])');
|
||||
},
|
||||
|
||||
|
||||
selectDate: function (date) {
|
||||
var _this = this,
|
||||
opts = _this.opts,
|
||||
@ -485,7 +467,6 @@
|
||||
if (this.timepicker) {
|
||||
date.setHours(this.timepicker.hours);
|
||||
date.setMinutes(this.timepicker.minutes)
|
||||
date.setSeconds(this.timepicker.seconds)
|
||||
}
|
||||
|
||||
if (_this.view == 'days') {
|
||||
@ -653,7 +634,6 @@
|
||||
if (lastSelectedDate) {
|
||||
lastSelectedDate.setHours(this.timepicker.hours);
|
||||
lastSelectedDate.setMinutes(this.timepicker.minutes);
|
||||
lastSelectedDate.setSeconds(this.timepicker.seconds);
|
||||
}
|
||||
}
|
||||
|
||||
@ -1197,7 +1177,6 @@
|
||||
if (this.timepicker) {
|
||||
this.focused.setHours(this.timepicker.hours);
|
||||
this.focused.setMinutes(this.timepicker.minutes);
|
||||
this.focused.setSeconds(this.timepicker.seconds);
|
||||
}
|
||||
this.selectDate(this.focused);
|
||||
return;
|
||||
@ -1259,7 +1238,7 @@
|
||||
this.silent = false;
|
||||
},
|
||||
|
||||
_onTimeChange: function (e, h, m, s) {
|
||||
_onTimeChange: function (e, h, m) {
|
||||
var date = new Date(),
|
||||
selectedDates = this.selectedDates,
|
||||
selected = false;
|
||||
@ -1271,7 +1250,6 @@
|
||||
|
||||
date.setHours(h);
|
||||
date.setMinutes(m);
|
||||
date.setSeconds(s);
|
||||
|
||||
if (!selected && !this._getCell(date).hasClass('-disabled-')) {
|
||||
this.selectDate(date);
|
||||
@ -1287,7 +1265,6 @@
|
||||
if (this.timepicker) {
|
||||
date.setHours(this.timepicker.hours);
|
||||
date.setMinutes(this.timepicker.minutes);
|
||||
date.setSeconds(this.timepicker.seconds)
|
||||
}
|
||||
this.selectDate(date);
|
||||
},
|
||||
@ -1411,9 +1388,7 @@
|
||||
hours: date.getHours(),
|
||||
fullHours: date.getHours() < 10 ? '0' + date.getHours() : date.getHours() ,
|
||||
minutes: date.getMinutes(),
|
||||
fullMinutes: date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes(),
|
||||
seconds: date.getSeconds(),
|
||||
fullSeconds: date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds()
|
||||
fullMinutes: date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
@ -89,10 +89,10 @@
|
||||
|
||||
switch (this.d.view) {
|
||||
case 'days':
|
||||
if (!this.d._isInRange(new Date(y, m-1, 1), 'month')) {
|
||||
if (!this.d._isInRange(new Date(y, m-1, d), 'month')) {
|
||||
this._disableNav('prev')
|
||||
}
|
||||
if (!this.d._isInRange(new Date(y, m+1, 1), 'month')) {
|
||||
if (!this.d._isInRange(new Date(y, m+1, d), 'month')) {
|
||||
this._disableNav('next')
|
||||
}
|
||||
break;
|
||||
@ -105,11 +105,10 @@
|
||||
}
|
||||
break;
|
||||
case 'years':
|
||||
var decade = dp.getDecade(this.d.date);
|
||||
if (!this.d._isInRange(new Date(decade[0] - 1, 0, 1), 'year')) {
|
||||
if (!this.d._isInRange(new Date(y-10, m, d), 'year')) {
|
||||
this._disableNav('prev')
|
||||
}
|
||||
if (!this.d._isInRange(new Date(decade[1] + 1, 0, 1), 'year')) {
|
||||
if (!this.d._isInRange(new Date(y+10, m, d), 'year')) {
|
||||
this._disableNav('next')
|
||||
}
|
||||
break;
|
||||
|
||||
@ -4,8 +4,6 @@
|
||||
' <span class="datepicker--time-current-hours">#{hourVisible}</span>' +
|
||||
' <span class="datepicker--time-current-colon">:</span>' +
|
||||
' <span class="datepicker--time-current-minutes">#{minValue}</span>' +
|
||||
' <span class="datepicker--time-current-colon">:</span>' +
|
||||
' <span class="datepicker--time-current-seconds">#{secValue}</span>' +
|
||||
'</div>' +
|
||||
'<div class="datepicker--time-sliders">' +
|
||||
' <div class="datepicker--time-row">' +
|
||||
@ -14,9 +12,6 @@
|
||||
' <div class="datepicker--time-row">' +
|
||||
' <input type="range" name="minutes" value="#{minValue}" min="#{minMin}" max="#{minMax}" step="#{minStep}"/>' +
|
||||
' </div>' +
|
||||
' <div class="datepicker--time-row">' +
|
||||
' <input type="range" name="seconds" value="#{secValue}" min="#{secMin}" max="#{secMax}" step="#{secStep}"/>' +
|
||||
' </div>' +
|
||||
'</div>' +
|
||||
'</div>',
|
||||
datepicker = $.fn.datepicker,
|
||||
@ -52,7 +47,6 @@
|
||||
this._handleDate(date);
|
||||
this.hours = _date.hours < this.minHours ? this.minHours : _date.hours;
|
||||
this.minutes = _date.minutes < this.minMinutes ? this.minMinutes : _date.minutes;
|
||||
this.seconds = _date.seconds < this.minSeconds ? this.minSeconds : _date.seconds;
|
||||
},
|
||||
|
||||
/**
|
||||
@ -64,7 +58,6 @@
|
||||
_setMinTimeFromDate: function (date) {
|
||||
this.minHours = date.getHours();
|
||||
this.minMinutes = date.getMinutes();
|
||||
this.minSeconds = date.getSeconds();
|
||||
|
||||
// If, for example, min hours are 10, and current hours are 12,
|
||||
// update minMinutes to default value, to be able to choose whole range of values
|
||||
@ -78,7 +71,6 @@
|
||||
_setMaxTimeFromDate: function (date) {
|
||||
this.maxHours = date.getHours();
|
||||
this.maxMinutes = date.getMinutes();
|
||||
this.maxSeconds = date.getSeconds();
|
||||
|
||||
if (this.d.lastSelectedDate) {
|
||||
if (this.d.lastSelectedDate.getHours() < date.getHours()) {
|
||||
@ -90,15 +82,12 @@
|
||||
_setDefaultMinMaxTime: function () {
|
||||
var maxHours = 23,
|
||||
maxMinutes = 59,
|
||||
maxSeconds = 59,
|
||||
opts = this.opts;
|
||||
|
||||
this.minHours = opts.minHours < 0 || opts.minHours > maxHours ? 0 : opts.minHours;
|
||||
this.minMinutes = opts.minMinutes < 0 || opts.minMinutes > maxMinutes ? 0 : opts.minMinutes;
|
||||
this.maxHours = opts.maxHours < 0 || opts.maxHours > maxHours ? maxHours : opts.maxHours;
|
||||
this.maxMinutes = opts.maxMinutes < 0 || opts.maxMinutes > maxMinutes ? maxMinutes : opts.maxMinutes;
|
||||
this.minSeconds = opts.minSeconds < 0 || opts.minSeconds > maxSeconds ? 0 : opts.minSeconds;
|
||||
this.maxSeconds = opts.maxSeconds < 0 || opts.maxSeconds > maxSeconds ? maxSeconds : opts.maxSeconds;
|
||||
},
|
||||
|
||||
/**
|
||||
@ -118,12 +107,6 @@
|
||||
} else if (this.minutes > this.maxMinutes) {
|
||||
this.minutes = this.maxMinutes;
|
||||
}
|
||||
|
||||
if (this.seconds < this.minSeconds) {
|
||||
this.seconds = this.minSeconds;
|
||||
} else if (this.seconds > this.maxSeconds) {
|
||||
this.seconds = this.maxSeconds;
|
||||
}
|
||||
},
|
||||
|
||||
_buildHTML: function () {
|
||||
@ -137,11 +120,7 @@
|
||||
minMin: this.minMinutes,
|
||||
minMax: lz(this.maxMinutes),
|
||||
minStep: this.opts.minutesStep,
|
||||
minValue: lz(this.minutes),
|
||||
secMin: this.minSeconds,
|
||||
secMax: lz(this.maxSeconds),
|
||||
secStep: this.opts.secondsStep,
|
||||
secValue: lz(this.seconds)
|
||||
minValue: lz(this.minutes)
|
||||
},
|
||||
_template = dp.template(template, data);
|
||||
|
||||
@ -149,10 +128,8 @@
|
||||
this.$ranges = $('[type="range"]', this.$timepicker);
|
||||
this.$hours = $('[name="hours"]', this.$timepicker);
|
||||
this.$minutes = $('[name="minutes"]', this.$timepicker);
|
||||
this.$seconds = $('[name="seconds"]', this.$timepicker);
|
||||
this.$hoursText = $('.datepicker--time-current-hours', this.$timepicker);
|
||||
this.$minutesText = $('.datepicker--time-current-minutes', this.$timepicker);
|
||||
this.$secondsText = $('.datepicker--time-current-seconds', this.$timepicker);
|
||||
|
||||
if (this.d.ampm) {
|
||||
this.$ampm = $('<span class="datepicker--time-current-ampm">')
|
||||
@ -165,12 +142,10 @@
|
||||
|
||||
_updateCurrentTime: function () {
|
||||
var h = dp.getLeadingZeroNum(this.displayHours),
|
||||
m = dp.getLeadingZeroNum(this.minutes),
|
||||
s = dp.getLeadingZeroNum(this.seconds);
|
||||
m = dp.getLeadingZeroNum(this.minutes);
|
||||
|
||||
this.$hoursText.html(h);
|
||||
this.$minutesText.html(m);
|
||||
this.$secondsText.html(s);
|
||||
|
||||
if (this.d.ampm) {
|
||||
this.$ampm.html(this.dayPeriod);
|
||||
@ -186,12 +161,7 @@
|
||||
this.$minutes.attr({
|
||||
min: this.minMinutes,
|
||||
max: this.maxMinutes
|
||||
}).val(this.minutes);
|
||||
|
||||
this.$seconds.attr({
|
||||
min: this.minSeconds,
|
||||
max: this.maxSeconds
|
||||
}).val(this.seconds);
|
||||
}).val(this.minutes)
|
||||
},
|
||||
|
||||
/**
|
||||
@ -284,7 +254,7 @@
|
||||
|
||||
this[name] = $target.val();
|
||||
this._updateCurrentTime();
|
||||
this.d._trigger('timeChange', [this.hours, this.minutes, this.seconds]);
|
||||
this.d._trigger('timeChange', [this.hours, this.minutes]);
|
||||
|
||||
this._handleDate(this.d.lastSelectedDate);
|
||||
this.update()
|
||||
|
||||
@ -94,7 +94,7 @@ $rangeThumbBg: #dedede;
|
||||
flex: 1;
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
margin: 0 10px;
|
||||
margin: 0 0 0 10px;
|
||||
}
|
||||
|
||||
.datepicker--time-current-colon {
|
||||
@ -103,10 +103,9 @@ $rangeThumbBg: #dedede;
|
||||
}
|
||||
|
||||
.datepicker--time-current-hours,
|
||||
.datepicker--time-current-minutes,
|
||||
.datepicker--time-current-seconds {
|
||||
.datepicker--time-current-minutes {
|
||||
line-height: 1;
|
||||
font-size: 14px;
|
||||
font-size: 19px;
|
||||
font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
@ -133,7 +132,7 @@ $rangeThumbBg: #dedede;
|
||||
|
||||
.datepicker--time-current-ampm {
|
||||
text-transform: uppercase;
|
||||
align-self: flex-start;
|
||||
align-self: flex-end;
|
||||
color: map_get($datepickerTextColor, navArrows);
|
||||
margin-left: 6px;
|
||||
font-size: 11px;
|
||||
|
||||
@ -3,9 +3,8 @@
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Air datepicker visual tests</title>
|
||||
<script type="text/javascript" src="node_modules/jquery/dist/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="bower_components/jquery/dist/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="dist/js/datepicker.js"></script>
|
||||
<script type="text/javascript" src="dist/js/i18n/datepicker.en.js"></script>
|
||||
<link rel="stylesheet" href="dist/css/datepicker.css"/>
|
||||
<link rel="stylesheet" href="docs/css/style.css"/>
|
||||
<script type="text/javascript">
|
||||
@ -32,7 +31,7 @@
|
||||
<div class="row">
|
||||
<div class="vt-tile">
|
||||
<h2>Default</h2>
|
||||
<div class="datepicker-here" data-language="en"></div>
|
||||
<div class="datepicker-here"></div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
@ -42,11 +41,11 @@
|
||||
<div class="row">
|
||||
<div class="vt-tile">
|
||||
<h2>{range: true}</h2>
|
||||
<div class="datepicker-here" data-language="en" data-range="true"></div>
|
||||
<div class="datepicker-here" data-range="true"></div>
|
||||
</div>
|
||||
<div class="vt-tile">
|
||||
<h2>{range: true, onSelect: ...}</h2>
|
||||
<div class="datepicker-here" data-language="en" id="dp-3" data-range="true"></div>
|
||||
<div class="datepicker-here" id="dp-3" data-range="true"></div>
|
||||
<script type="text/javascript">
|
||||
$('#dp-3').datepicker({
|
||||
onSelect: function (fd) {
|
||||
@ -57,7 +56,7 @@
|
||||
</div>
|
||||
<div class="vt-tile">
|
||||
<h2>{range: true, onSelect: ...}</h2>
|
||||
<input class="datepicker-here" data-language="en" id="dp-4" data-range="true"/>
|
||||
<input class="datepicker-here" id="dp-4" data-range="true"/>
|
||||
<script type="text/javascript">
|
||||
$('#dp-4').datepicker({
|
||||
onSelect: function (fd) {
|
||||
@ -74,29 +73,17 @@
|
||||
<div class="row">
|
||||
<div class="vt-tile">
|
||||
<h2>{timepicker: true}</h2>
|
||||
<div id="test" class="datepicker-here" data-language="en" data-timepicker="true"></div>
|
||||
<script type="text/javascript">
|
||||
$('#test').datepicker({
|
||||
toggleSelected: false,
|
||||
inline: true,
|
||||
timeFormat: 'hh:ii:ss',
|
||||
onSelect: function (fd) {
|
||||
console.log(arguments)
|
||||
log(fd)
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<div class="datepicker-here" data-timepicker="true"></div>
|
||||
</div>
|
||||
<div class="vt-tile">
|
||||
<h2>{onChange: ..., toggleSelected: false, range: true}</h2>
|
||||
<input id="dp-5" class="datepicker-here" data-language="en" data-timepicker="true" />
|
||||
<input id="dp-5" class="datepicker-here" data-timepicker="true" />
|
||||
<script type="text/javascript">
|
||||
$('#dp-5').datepicker({
|
||||
toggleSelected: false,
|
||||
inline: true,
|
||||
range: true,
|
||||
onSelect: function (fd) {
|
||||
console.log(arguments)
|
||||
log(fd)
|
||||
}
|
||||
})
|
||||
@ -104,11 +91,11 @@
|
||||
</div>
|
||||
<div class="vt-tile">
|
||||
<h2>{timepicker: true}</h2>
|
||||
<input class="datepicker-here" data-language="en" data-timepicker="true" />
|
||||
<input class="datepicker-here" data-timepicker="true" />
|
||||
</div>
|
||||
<div class="vt-tile">
|
||||
<h2>{timepicker: true, minDate: new Date()}</h2>
|
||||
<input class="datepicker-here" data-language="en" id="dp-6"/>
|
||||
<input class="datepicker-here" id="dp-6"/>
|
||||
<script type="text/javascript">
|
||||
$('#dp-6').datepicker({
|
||||
minDate: new Date(),
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user