ng-pick-datetime
Version:
Angular Date Time Picker
327 lines (326 loc) • 14.3 kB
JavaScript
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata = (this && this.__metadata) || function (k, v) {
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
var __param = (this && this.__param) || function (paramIndex, decorator) {
return function (target, key) { decorator(target, key, paramIndex); }
};
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, EventEmitter, HostBinding, Input, NgZone, Optional, Output } from '@angular/core';
import { OwlDateTimeIntl } from './date-time-picker-intl.service';
import { DateTimeAdapter } from './adapter/date-time-adapter.class';
import { take } from 'rxjs/operators';
var OwlTimerComponent = (function () {
function OwlTimerComponent(ngZone, elmRef, pickerIntl, cdRef, dateTimeAdapter) {
this.ngZone = ngZone;
this.elmRef = elmRef;
this.pickerIntl = pickerIntl;
this.cdRef = cdRef;
this.dateTimeAdapter = dateTimeAdapter;
this.isPM = false;
this.stepHour = 1;
this.stepMinute = 1;
this.stepSecond = 1;
this.selectedChange = new EventEmitter();
}
Object.defineProperty(OwlTimerComponent.prototype, "pickerMoment", {
get: function () {
return this._pickerMoment;
},
set: function (value) {
value = this.dateTimeAdapter.deserialize(value);
this._pickerMoment = this.getValidDate(value) || this.dateTimeAdapter.now();
},
enumerable: true,
configurable: true
});
Object.defineProperty(OwlTimerComponent.prototype, "minDateTime", {
get: function () {
return this._minDateTime;
},
set: function (value) {
value = this.dateTimeAdapter.deserialize(value);
this._minDateTime = this.getValidDate(value);
},
enumerable: true,
configurable: true
});
Object.defineProperty(OwlTimerComponent.prototype, "maxDateTime", {
get: function () {
return this._maxDateTime;
},
set: function (value) {
value = this.dateTimeAdapter.deserialize(value);
this._maxDateTime = this.getValidDate(value);
},
enumerable: true,
configurable: true
});
Object.defineProperty(OwlTimerComponent.prototype, "hourValue", {
get: function () {
return this.dateTimeAdapter.getHours(this.pickerMoment);
},
enumerable: true,
configurable: true
});
Object.defineProperty(OwlTimerComponent.prototype, "hourBoxValue", {
get: function () {
var hours = this.hourValue;
if (!this.hour12Timer) {
return hours;
}
else {
if (hours === 0) {
hours = 12;
this.isPM = false;
}
else if (hours > 0 && hours < 12) {
this.isPM = false;
}
else if (hours === 12) {
this.isPM = true;
}
else if (hours > 12 && hours < 24) {
hours = hours - 12;
this.isPM = true;
}
return hours;
}
},
enumerable: true,
configurable: true
});
Object.defineProperty(OwlTimerComponent.prototype, "minuteValue", {
get: function () {
return this.dateTimeAdapter.getMinutes(this.pickerMoment);
},
enumerable: true,
configurable: true
});
Object.defineProperty(OwlTimerComponent.prototype, "secondValue", {
get: function () {
return this.dateTimeAdapter.getSeconds(this.pickerMoment);
},
enumerable: true,
configurable: true
});
Object.defineProperty(OwlTimerComponent.prototype, "upHourButtonLabel", {
get: function () {
return this.pickerIntl.upHourLabel;
},
enumerable: true,
configurable: true
});
Object.defineProperty(OwlTimerComponent.prototype, "downHourButtonLabel", {
get: function () {
return this.pickerIntl.downHourLabel;
},
enumerable: true,
configurable: true
});
Object.defineProperty(OwlTimerComponent.prototype, "upMinuteButtonLabel", {
get: function () {
return this.pickerIntl.upMinuteLabel;
},
enumerable: true,
configurable: true
});
Object.defineProperty(OwlTimerComponent.prototype, "downMinuteButtonLabel", {
get: function () {
return this.pickerIntl.downMinuteLabel;
},
enumerable: true,
configurable: true
});
Object.defineProperty(OwlTimerComponent.prototype, "upSecondButtonLabel", {
get: function () {
return this.pickerIntl.upSecondLabel;
},
enumerable: true,
configurable: true
});
Object.defineProperty(OwlTimerComponent.prototype, "downSecondButtonLabel", {
get: function () {
return this.pickerIntl.downSecondLabel;
},
enumerable: true,
configurable: true
});
Object.defineProperty(OwlTimerComponent.prototype, "hour12ButtonLabel", {
get: function () {
return this.isPM ? this.pickerIntl.hour12PMLabel : this.pickerIntl.hour12AMLabel;
},
enumerable: true,
configurable: true
});
Object.defineProperty(OwlTimerComponent.prototype, "owlDTTimerClass", {
get: function () {
return true;
},
enumerable: true,
configurable: true
});
Object.defineProperty(OwlTimerComponent.prototype, "owlDTTimeTabIndex", {
get: function () {
return -1;
},
enumerable: true,
configurable: true
});
OwlTimerComponent.prototype.ngOnInit = function () {
};
OwlTimerComponent.prototype.focus = function () {
var _this = this;
this.ngZone.runOutsideAngular(function () {
_this.ngZone.onStable.asObservable().pipe(take(1)).subscribe(function () {
_this.elmRef.nativeElement.focus();
});
});
};
OwlTimerComponent.prototype.setHourValueViaInput = function (hours) {
if (this.hour12Timer && this.isPM && hours >= 1 && hours <= 11) {
hours = hours + 12;
}
else if (this.hour12Timer && !this.isPM && hours === 12) {
hours = 0;
}
this.setHourValue(hours);
};
OwlTimerComponent.prototype.setHourValue = function (hours) {
var m = this.dateTimeAdapter.setHours(this.pickerMoment, hours);
this.selectedChange.emit(m);
this.cdRef.markForCheck();
};
OwlTimerComponent.prototype.setMinuteValue = function (minutes) {
var m = this.dateTimeAdapter.setMinutes(this.pickerMoment, minutes);
this.selectedChange.emit(m);
this.cdRef.markForCheck();
};
OwlTimerComponent.prototype.setSecondValue = function (seconds) {
var m = this.dateTimeAdapter.setSeconds(this.pickerMoment, seconds);
this.selectedChange.emit(m);
this.cdRef.markForCheck();
};
OwlTimerComponent.prototype.setMeridiem = function (event) {
this.isPM = !this.isPM;
var hours = this.hourValue;
if (this.isPM) {
hours = hours + 12;
}
else {
hours = hours - 12;
}
if (hours >= 0 && hours <= 23) {
this.setHourValue(hours);
}
this.cdRef.markForCheck();
event.preventDefault();
};
OwlTimerComponent.prototype.upHourEnabled = function () {
return !this.maxDateTime || this.compareHours(this.stepHour, this.maxDateTime) < 1;
};
OwlTimerComponent.prototype.downHourEnabled = function () {
return !this.minDateTime || this.compareHours(-this.stepHour, this.minDateTime) > -1;
};
OwlTimerComponent.prototype.upMinuteEnabled = function () {
return !this.maxDateTime || this.compareMinutes(this.stepMinute, this.maxDateTime) < 1;
};
OwlTimerComponent.prototype.downMinuteEnabled = function () {
return !this.minDateTime || this.compareMinutes(-this.stepMinute, this.minDateTime) > -1;
};
OwlTimerComponent.prototype.upSecondEnabled = function () {
return !this.maxDateTime || this.compareSeconds(this.stepSecond, this.maxDateTime) < 1;
};
OwlTimerComponent.prototype.downSecondEnabled = function () {
return !this.minDateTime || this.compareSeconds(-this.stepSecond, this.minDateTime) > -1;
};
OwlTimerComponent.prototype.compareHours = function (amount, comparedDate) {
var hours = this.dateTimeAdapter.getHours(this.pickerMoment) + amount;
var result = this.dateTimeAdapter.setHours(this.pickerMoment, hours);
return this.dateTimeAdapter.compare(result, comparedDate);
};
OwlTimerComponent.prototype.compareMinutes = function (amount, comparedDate) {
var minutes = this.dateTimeAdapter.getMinutes(this.pickerMoment) + amount;
var result = this.dateTimeAdapter.setMinutes(this.pickerMoment, minutes);
return this.dateTimeAdapter.compare(result, comparedDate);
};
OwlTimerComponent.prototype.compareSeconds = function (amount, comparedDate) {
var seconds = this.dateTimeAdapter.getSeconds(this.pickerMoment) + amount;
var result = this.dateTimeAdapter.setSeconds(this.pickerMoment, seconds);
return this.dateTimeAdapter.compare(result, comparedDate);
};
OwlTimerComponent.prototype.getValidDate = function (obj) {
return (this.dateTimeAdapter.isDateInstance(obj) && this.dateTimeAdapter.isValid(obj)) ? obj : null;
};
__decorate([
Input(),
__metadata("design:type", Object),
__metadata("design:paramtypes", [Object])
], OwlTimerComponent.prototype, "pickerMoment", null);
__decorate([
Input(),
__metadata("design:type", Object),
__metadata("design:paramtypes", [Object])
], OwlTimerComponent.prototype, "minDateTime", null);
__decorate([
Input(),
__metadata("design:type", Object),
__metadata("design:paramtypes", [Object])
], OwlTimerComponent.prototype, "maxDateTime", null);
__decorate([
Input(),
__metadata("design:type", Boolean)
], OwlTimerComponent.prototype, "showSecondsTimer", void 0);
__decorate([
Input(),
__metadata("design:type", Boolean)
], OwlTimerComponent.prototype, "hour12Timer", void 0);
__decorate([
Input(),
__metadata("design:type", Object)
], OwlTimerComponent.prototype, "stepHour", void 0);
__decorate([
Input(),
__metadata("design:type", Object)
], OwlTimerComponent.prototype, "stepMinute", void 0);
__decorate([
Input(),
__metadata("design:type", Object)
], OwlTimerComponent.prototype, "stepSecond", void 0);
__decorate([
Output(),
__metadata("design:type", Object)
], OwlTimerComponent.prototype, "selectedChange", void 0);
__decorate([
HostBinding('class.owl-dt-timer'),
__metadata("design:type", Boolean),
__metadata("design:paramtypes", [])
], OwlTimerComponent.prototype, "owlDTTimerClass", null);
__decorate([
HostBinding('attr.tabindex'),
__metadata("design:type", Number),
__metadata("design:paramtypes", [])
], OwlTimerComponent.prototype, "owlDTTimeTabIndex", null);
OwlTimerComponent = __decorate([
Component({
exportAs: 'owlDateTimeTimer',
selector: 'owl-date-time-timer',
template: "<owl-date-time-timer-box [upBtnAriaLabel]=\"upHourButtonLabel\" [downBtnAriaLabel]=\"downHourButtonLabel\" [upBtnDisabled]=\"!upHourEnabled()\" [downBtnDisabled]=\"!downHourEnabled()\" [boxValue]=\"hourBoxValue\" [value]=\"hourValue\" [min]=\"0\" [max]=\"23\" [step]=\"stepHour\" [inputLabel]=\"'Hour'\" (inputChange)=\"setHourValueViaInput($event)\" (valueChange)=\"setHourValue($event)\"></owl-date-time-timer-box><owl-date-time-timer-box [showDivider]=\"true\" [upBtnAriaLabel]=\"upMinuteButtonLabel\" [downBtnAriaLabel]=\"downMinuteButtonLabel\" [upBtnDisabled]=\"!upMinuteEnabled()\" [downBtnDisabled]=\"!downMinuteEnabled()\" [value]=\"minuteValue\" [min]=\"0\" [max]=\"59\" [step]=\"stepMinute\" [inputLabel]=\"'Minute'\" (inputChange)=\"setMinuteValue($event)\" (valueChange)=\"setMinuteValue($event)\"></owl-date-time-timer-box><owl-date-time-timer-box *ngIf=\"showSecondsTimer\" [showDivider]=\"true\" [upBtnAriaLabel]=\"upSecondButtonLabel\" [downBtnAriaLabel]=\"downSecondButtonLabel\" [upBtnDisabled]=\"!upSecondEnabled()\" [downBtnDisabled]=\"!downSecondEnabled()\" [value]=\"secondValue\" [min]=\"0\" [max]=\"59\" [step]=\"stepSecond\" [inputLabel]=\"'Second'\" (inputChange)=\"setSecondValue($event)\" (valueChange)=\"setSecondValue($event)\"></owl-date-time-timer-box><div *ngIf=\"hour12Timer\" class=\"owl-dt-timer-hour12\"><button class=\"owl-dt-control-button owl-dt-timer-hour12-box\" type=\"button\" tabindex=\"0\" (click)=\"setMeridiem($event)\"><span class=\"owl-dt-control-button-content\" tabindex=\"-1\">{{hour12ButtonLabel}}</span></button></div>",
styles: [""],
preserveWhitespaces: false,
changeDetection: ChangeDetectionStrategy.OnPush,
}),
__param(4, Optional()),
__metadata("design:paramtypes", [NgZone,
ElementRef,
OwlDateTimeIntl,
ChangeDetectorRef,
DateTimeAdapter])
], OwlTimerComponent);
return OwlTimerComponent;
}());
export { OwlTimerComponent };