| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078 |
- import { Injectable, forwardRef, EventEmitter, Component, ChangeDetectionStrategy, ViewEncapsulation, ChangeDetectorRef, Input, Output, NgModule } from '@angular/core';
- import { NG_VALUE_ACCESSOR } from '@angular/forms';
- import { BehaviorSubject } from 'rxjs';
- import { MiniStore, MiniState } from 'ngx-bootstrap/mini-ngrx';
- import { CommonModule } from '@angular/common';
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- class TimepickerActions {
- /**
- * @param {?} value
- * @return {?}
- */
- writeValue(value) {
- return {
- type: TimepickerActions.WRITE_VALUE,
- payload: value
- };
- }
- /**
- * @param {?} event
- * @return {?}
- */
- changeHours(event) {
- return {
- type: TimepickerActions.CHANGE_HOURS,
- payload: event
- };
- }
- /**
- * @param {?} event
- * @return {?}
- */
- changeMinutes(event) {
- return {
- type: TimepickerActions.CHANGE_MINUTES,
- payload: event
- };
- }
- /**
- * @param {?} event
- * @return {?}
- */
- changeSeconds(event) {
- return {
- type: TimepickerActions.CHANGE_SECONDS,
- payload: event
- };
- }
- /**
- * @param {?} value
- * @return {?}
- */
- setTime(value) {
- return {
- type: TimepickerActions.SET_TIME_UNIT,
- payload: value
- };
- }
- /**
- * @param {?} value
- * @return {?}
- */
- updateControls(value) {
- return {
- type: TimepickerActions.UPDATE_CONTROLS,
- payload: value
- };
- }
- }
- TimepickerActions.WRITE_VALUE = '[timepicker] write value from ng model';
- TimepickerActions.CHANGE_HOURS = '[timepicker] change hours';
- TimepickerActions.CHANGE_MINUTES = '[timepicker] change minutes';
- TimepickerActions.CHANGE_SECONDS = '[timepicker] change seconds';
- TimepickerActions.SET_TIME_UNIT = '[timepicker] set time unit';
- TimepickerActions.UPDATE_CONTROLS = '[timepicker] update controls';
- TimepickerActions.decorators = [
- { type: Injectable }
- ];
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- /** @type {?} */
- const dex = 10;
- /** @type {?} */
- const hoursPerDay = 24;
- /** @type {?} */
- const hoursPerDayHalf = 12;
- /** @type {?} */
- const minutesPerHour = 60;
- /** @type {?} */
- const secondsPerMinute = 60;
- /**
- * @param {?=} value
- * @return {?}
- */
- function isValidDate(value) {
- if (!value) {
- return false;
- }
- if (value instanceof Date && isNaN(value.getHours())) {
- return false;
- }
- if (typeof value === 'string') {
- return isValidDate(new Date(value));
- }
- return true;
- }
- /**
- * @param {?} controls
- * @param {?} newDate
- * @return {?}
- */
- function isValidLimit(controls, newDate) {
- if (controls.min && newDate < controls.min) {
- return false;
- }
- if (controls.max && newDate > controls.max) {
- return false;
- }
- return true;
- }
- /**
- * @param {?} value
- * @return {?}
- */
- function toNumber(value) {
- if (typeof value === 'number') {
- return value;
- }
- return parseInt(value, dex);
- }
- /**
- * @param {?} value
- * @param {?=} isPM
- * @return {?}
- */
- function parseHours(value, isPM = false) {
- /** @type {?} */
- const hour = toNumber(value);
- if (isNaN(hour) ||
- hour < 0 ||
- hour > (isPM ? hoursPerDayHalf : hoursPerDay)) {
- return NaN;
- }
- return hour;
- }
- /**
- * @param {?} value
- * @return {?}
- */
- function parseMinutes(value) {
- /** @type {?} */
- const minute = toNumber(value);
- if (isNaN(minute) || minute < 0 || minute > minutesPerHour) {
- return NaN;
- }
- return minute;
- }
- /**
- * @param {?} value
- * @return {?}
- */
- function parseSeconds(value) {
- /** @type {?} */
- const seconds = toNumber(value);
- if (isNaN(seconds) || seconds < 0 || seconds > secondsPerMinute) {
- return NaN;
- }
- return seconds;
- }
- /**
- * @param {?} value
- * @return {?}
- */
- function parseTime(value) {
- if (typeof value === 'string') {
- return new Date(value);
- }
- return value;
- }
- /**
- * @param {?} value
- * @param {?} diff
- * @return {?}
- */
- function changeTime(value, diff) {
- if (!value) {
- return changeTime(createDate(new Date(), 0, 0, 0), diff);
- }
- /** @type {?} */
- let hour = value.getHours();
- /** @type {?} */
- let minutes = value.getMinutes();
- /** @type {?} */
- let seconds = value.getSeconds();
- if (diff.hour) {
- hour = (hour + toNumber(diff.hour)) % hoursPerDay;
- if (hour < 0) {
- hour += hoursPerDay;
- }
- }
- if (diff.minute) {
- minutes = minutes + toNumber(diff.minute);
- }
- if (diff.seconds) {
- seconds = seconds + toNumber(diff.seconds);
- }
- return createDate(value, hour, minutes, seconds);
- }
- /**
- * @param {?} value
- * @param {?} opts
- * @return {?}
- */
- function setTime(value, opts) {
- /** @type {?} */
- let hour = parseHours(opts.hour);
- /** @type {?} */
- const minute = parseMinutes(opts.minute);
- /** @type {?} */
- const seconds = parseSeconds(opts.seconds) || 0;
- if (opts.isPM && hour !== 12) {
- hour += hoursPerDayHalf;
- }
- if (!value) {
- if (!isNaN(hour) && !isNaN(minute)) {
- return createDate(new Date(), hour, minute, seconds);
- }
- return value;
- }
- if (isNaN(hour) || isNaN(minute)) {
- return value;
- }
- return createDate(value, hour, minute, seconds);
- }
- /**
- * @param {?} value
- * @param {?} hours
- * @param {?} minutes
- * @param {?} seconds
- * @return {?}
- */
- function createDate(value, hours, minutes, seconds) {
- return new Date(value.getFullYear(), value.getMonth(), value.getDate(), hours, minutes, seconds, value.getMilliseconds());
- }
- /**
- * @param {?} value
- * @return {?}
- */
- function padNumber(value) {
- /** @type {?} */
- const _value = value.toString();
- if (_value.length > 1) {
- return _value;
- }
- return `0${_value}`;
- }
- /**
- * @param {?} hours
- * @param {?} isPM
- * @return {?}
- */
- function isHourInputValid(hours, isPM) {
- return !isNaN(parseHours(hours, isPM));
- }
- /**
- * @param {?} minutes
- * @return {?}
- */
- function isMinuteInputValid(minutes) {
- return !isNaN(parseMinutes(minutes));
- }
- /**
- * @param {?} seconds
- * @return {?}
- */
- function isSecondInputValid(seconds) {
- return !isNaN(parseSeconds(seconds));
- }
- /**
- * @param {?} diff
- * @param {?} max
- * @param {?} min
- * @return {?}
- */
- function isInputLimitValid(diff, max, min) {
- /** @type {?} */
- const newDate = setTime(new Date(), diff);
- if (max && newDate > max) {
- return false;
- }
- if (min && newDate < min) {
- return false;
- }
- return true;
- }
- /**
- * @param {?} hours
- * @param {?=} minutes
- * @param {?=} seconds
- * @param {?=} isPM
- * @return {?}
- */
- function isInputValid(hours, minutes = '0', seconds = '0', isPM) {
- return isHourInputValid(hours, isPM)
- && isMinuteInputValid(minutes)
- && isSecondInputValid(seconds);
- }
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- /**
- * @param {?} state
- * @param {?=} event
- * @return {?}
- */
- function canChangeValue(state, event) {
- if (state.readonlyInput || state.disabled) {
- return false;
- }
- if (event) {
- if (event.source === 'wheel' && !state.mousewheel) {
- return false;
- }
- if (event.source === 'key' && !state.arrowkeys) {
- return false;
- }
- }
- return true;
- }
- /**
- * @param {?} event
- * @param {?} controls
- * @return {?}
- */
- function canChangeHours(event, controls) {
- if (!event.step) {
- return false;
- }
- if (event.step > 0 && !controls.canIncrementHours) {
- return false;
- }
- if (event.step < 0 && !controls.canDecrementHours) {
- return false;
- }
- return true;
- }
- /**
- * @param {?} event
- * @param {?} controls
- * @return {?}
- */
- function canChangeMinutes(event, controls) {
- if (!event.step) {
- return false;
- }
- if (event.step > 0 && !controls.canIncrementMinutes) {
- return false;
- }
- if (event.step < 0 && !controls.canDecrementMinutes) {
- return false;
- }
- return true;
- }
- /**
- * @param {?} event
- * @param {?} controls
- * @return {?}
- */
- function canChangeSeconds(event, controls) {
- if (!event.step) {
- return false;
- }
- if (event.step > 0 && !controls.canIncrementSeconds) {
- return false;
- }
- if (event.step < 0 && !controls.canDecrementSeconds) {
- return false;
- }
- return true;
- }
- /**
- * @param {?} state
- * @return {?}
- */
- function getControlsValue(state) {
- const { hourStep, minuteStep, secondsStep, readonlyInput, disabled, mousewheel, arrowkeys, showSpinners, showMeridian, showSeconds, meridians, min, max } = state;
- return {
- hourStep,
- minuteStep,
- secondsStep,
- readonlyInput,
- disabled,
- mousewheel,
- arrowkeys,
- showSpinners,
- showMeridian,
- showSeconds,
- meridians,
- min,
- max
- };
- }
- /**
- * @param {?} value
- * @param {?} state
- * @return {?}
- */
- function timepickerControls(value, state) {
- /** @type {?} */
- const hoursPerDayHalf = 12;
- const { min, max, hourStep, minuteStep, secondsStep, showSeconds } = state;
- /** @type {?} */
- const res = {
- canIncrementHours: true,
- canIncrementMinutes: true,
- canIncrementSeconds: true,
- canDecrementHours: true,
- canDecrementMinutes: true,
- canDecrementSeconds: true,
- canToggleMeridian: true
- };
- if (!value) {
- return res;
- }
- // compare dates
- if (max) {
- /** @type {?} */
- const _newHour = changeTime(value, { hour: hourStep });
- res.canIncrementHours = max > _newHour;
- if (!res.canIncrementHours) {
- /** @type {?} */
- const _newMinutes = changeTime(value, { minute: minuteStep });
- res.canIncrementMinutes = showSeconds
- ? max > _newMinutes
- : max >= _newMinutes;
- }
- if (!res.canIncrementMinutes) {
- /** @type {?} */
- const _newSeconds = changeTime(value, { seconds: secondsStep });
- res.canIncrementSeconds = max >= _newSeconds;
- }
- if (value.getHours() < hoursPerDayHalf) {
- res.canToggleMeridian = changeTime(value, { hour: hoursPerDayHalf }) < max;
- }
- }
- if (min) {
- /** @type {?} */
- const _newHour = changeTime(value, { hour: -hourStep });
- res.canDecrementHours = min < _newHour;
- if (!res.canDecrementHours) {
- /** @type {?} */
- const _newMinutes = changeTime(value, { minute: -minuteStep });
- res.canDecrementMinutes = showSeconds
- ? min < _newMinutes
- : min <= _newMinutes;
- }
- if (!res.canDecrementMinutes) {
- /** @type {?} */
- const _newSeconds = changeTime(value, { seconds: -secondsStep });
- res.canDecrementSeconds = min <= _newSeconds;
- }
- if (value.getHours() >= hoursPerDayHalf) {
- res.canToggleMeridian = changeTime(value, { hour: -hoursPerDayHalf }) > min;
- }
- }
- return res;
- }
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- /**
- * Provides default configuration values for timepicker
- */
- class TimepickerConfig {
- constructor() {
- /**
- * hours change step
- */
- this.hourStep = 1;
- /**
- * hours change step
- */
- this.minuteStep = 5;
- /**
- * seconds changes step
- */
- this.secondsStep = 10;
- /**
- * if true works in 12H mode and displays AM/PM. If false works in 24H mode and hides AM/PM
- */
- this.showMeridian = true;
- /**
- * meridian labels based on locale
- */
- this.meridians = ['AM', 'PM'];
- /**
- * if true hours and minutes fields will be readonly
- */
- this.readonlyInput = false;
- /**
- * if true hours and minutes fields will be disabled
- */
- this.disabled = false;
- /**
- * if true scroll inside hours and minutes inputs will change time
- */
- this.mousewheel = true;
- /**
- * if true the values of hours and minutes can be changed using the up/down arrow keys on the keyboard
- */
- this.arrowkeys = true;
- /**
- * if true spinner arrows above and below the inputs will be shown
- */
- this.showSpinners = true;
- /**
- * show seconds in timepicker
- */
- this.showSeconds = false;
- /**
- * show minutes in timepicker
- */
- this.showMinutes = true;
- /**
- * placeholder for hours field in timepicker
- */
- this.hoursPlaceholder = 'HH';
- /**
- * placeholder for minutes field in timepicker
- */
- this.minutesPlaceholder = 'MM';
- /**
- * placeholder for seconds field in timepicker
- */
- this.secondsPlaceholder = 'SS';
- }
- }
- TimepickerConfig.decorators = [
- { type: Injectable }
- ];
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- /** @type {?} */
- const initialState = {
- value: null,
- config: new TimepickerConfig(),
- controls: {
- canIncrementHours: true,
- canIncrementMinutes: true,
- canIncrementSeconds: true,
- canDecrementHours: true,
- canDecrementMinutes: true,
- canDecrementSeconds: true,
- canToggleMeridian: true
- }
- };
- // tslint:disable-next-line:cyclomatic-complexity
- /**
- * @param {?=} state
- * @param {?=} action
- * @return {?}
- */
- function timepickerReducer(state = initialState, action) {
- switch (action.type) {
- case TimepickerActions.WRITE_VALUE: {
- return Object.assign({}, state, { value: action.payload });
- }
- case TimepickerActions.CHANGE_HOURS: {
- if (!canChangeValue(state.config, action.payload) ||
- !canChangeHours(action.payload, state.controls)) {
- return state;
- }
- /** @type {?} */
- const _newTime = changeTime(state.value, { hour: action.payload.step });
- if ((state.config.max || state.config.min) && !isValidLimit(state.config, _newTime)) {
- return state;
- }
- return Object.assign({}, state, { value: _newTime });
- }
- case TimepickerActions.CHANGE_MINUTES: {
- if (!canChangeValue(state.config, action.payload) ||
- !canChangeMinutes(action.payload, state.controls)) {
- return state;
- }
- /** @type {?} */
- const _newTime = changeTime(state.value, { minute: action.payload.step });
- if ((state.config.max || state.config.min) && !isValidLimit(state.config, _newTime)) {
- return state;
- }
- return Object.assign({}, state, { value: _newTime });
- }
- case TimepickerActions.CHANGE_SECONDS: {
- if (!canChangeValue(state.config, action.payload) ||
- !canChangeSeconds(action.payload, state.controls)) {
- return state;
- }
- /** @type {?} */
- const _newTime = changeTime(state.value, {
- seconds: action.payload.step
- });
- if ((state.config.max || state.config.min) && !isValidLimit(state.config, _newTime)) {
- return state;
- }
- return Object.assign({}, state, { value: _newTime });
- }
- case TimepickerActions.SET_TIME_UNIT: {
- if (!canChangeValue(state.config)) {
- return state;
- }
- /** @type {?} */
- const _newTime = setTime(state.value, action.payload);
- return Object.assign({}, state, { value: _newTime });
- }
- case TimepickerActions.UPDATE_CONTROLS: {
- /** @type {?} */
- const _newControlsState = timepickerControls(state.value, action.payload);
- /** @type {?} */
- const _newState = {
- value: state.value,
- config: action.payload,
- controls: _newControlsState
- };
- if (state.config.showMeridian !== _newState.config.showMeridian) {
- if (state.value) {
- _newState.value = new Date(state.value);
- }
- }
- return Object.assign({}, state, _newState);
- }
- default:
- return state;
- }
- }
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- class TimepickerStore extends MiniStore {
- constructor() {
- /** @type {?} */
- const _dispatcher = new BehaviorSubject({
- type: '[mini-ngrx] dispatcher init'
- });
- /** @type {?} */
- const state = new MiniState(initialState, _dispatcher, timepickerReducer);
- super(_dispatcher, timepickerReducer, state);
- }
- }
- TimepickerStore.decorators = [
- { type: Injectable }
- ];
- /** @nocollapse */
- TimepickerStore.ctorParameters = () => [];
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- /** @type {?} */
- const TIMEPICKER_CONTROL_VALUE_ACCESSOR = {
- provide: NG_VALUE_ACCESSOR,
- /* tslint:disable-next-line: no-use-before-declare */
- useExisting: forwardRef((/**
- * @return {?}
- */
- () => TimepickerComponent)),
- multi: true
- };
- class TimepickerComponent {
- /**
- * @param {?} _config
- * @param {?} _cd
- * @param {?} _store
- * @param {?} _timepickerActions
- */
- constructor(_config, _cd, _store, _timepickerActions) {
- this._cd = _cd;
- this._store = _store;
- this._timepickerActions = _timepickerActions;
- /**
- * emits true if value is a valid date
- */
- this.isValid = new EventEmitter();
- // min\max validation for input fields
- this.invalidHours = false;
- this.invalidMinutes = false;
- this.invalidSeconds = false;
- // control value accessor methods
- // tslint:disable-next-line:no-any
- this.onChange = Function.prototype;
- // tslint:disable-next-line:no-any
- this.onTouched = Function.prototype;
- Object.assign(this, _config);
- this.timepickerSub = _store
- .select((/**
- * @param {?} state
- * @return {?}
- */
- state => state.value))
- .subscribe((/**
- * @param {?} value
- * @return {?}
- */
- (value) => {
- // update UI values if date changed
- this._renderTime(value);
- this.onChange(value);
- this._store.dispatch(this._timepickerActions.updateControls(getControlsValue(this)));
- }));
- _store
- .select((/**
- * @param {?} state
- * @return {?}
- */
- state => state.controls))
- .subscribe((/**
- * @param {?} controlsState
- * @return {?}
- */
- (controlsState) => {
- this.isValid.emit(isInputValid(this.hours, this.minutes, this.seconds, this.isPM()));
- Object.assign(this, controlsState);
- _cd.markForCheck();
- }));
- }
- /**
- * @deprecated - please use `isEditable` instead
- * @return {?}
- */
- get isSpinnersVisible() {
- return this.showSpinners && !this.readonlyInput;
- }
- /**
- * @return {?}
- */
- get isEditable() {
- return !(this.readonlyInput || this.disabled);
- }
- /**
- * @return {?}
- */
- resetValidation() {
- this.invalidHours = false;
- this.invalidMinutes = false;
- this.invalidSeconds = false;
- }
- /**
- * @return {?}
- */
- isPM() {
- return this.showMeridian && this.meridian === this.meridians[1];
- }
- /**
- * @param {?} $event
- * @return {?}
- */
- prevDef($event) {
- $event.preventDefault();
- }
- /**
- * @param {?} $event
- * @return {?}
- */
- wheelSign($event) {
- return Math.sign($event.deltaY) * -1;
- }
- /**
- * @param {?} changes
- * @return {?}
- */
- ngOnChanges(changes) {
- this._store.dispatch(this._timepickerActions.updateControls(getControlsValue(this)));
- }
- /**
- * @param {?} step
- * @param {?=} source
- * @return {?}
- */
- changeHours(step, source = '') {
- this.resetValidation();
- this._store.dispatch(this._timepickerActions.changeHours({ step, source }));
- }
- /**
- * @param {?} step
- * @param {?=} source
- * @return {?}
- */
- changeMinutes(step, source = '') {
- this.resetValidation();
- this._store.dispatch(this._timepickerActions.changeMinutes({ step, source }));
- }
- /**
- * @param {?} step
- * @param {?=} source
- * @return {?}
- */
- changeSeconds(step, source = '') {
- this.resetValidation();
- this._store.dispatch(this._timepickerActions.changeSeconds({ step, source }));
- }
- /**
- * @param {?} hours
- * @return {?}
- */
- updateHours(hours) {
- this.resetValidation();
- this.hours = hours;
- /** @type {?} */
- const isValid = isHourInputValid(this.hours, this.isPM()) && this.isValidLimit();
- if (!isValid) {
- this.invalidHours = true;
- this.isValid.emit(false);
- this.onChange(null);
- return;
- }
- this._updateTime();
- }
- /**
- * @param {?} minutes
- * @return {?}
- */
- updateMinutes(minutes) {
- this.resetValidation();
- this.minutes = minutes;
- /** @type {?} */
- const isValid = isMinuteInputValid(this.minutes) && this.isValidLimit();
- if (!isValid) {
- this.invalidMinutes = true;
- this.isValid.emit(false);
- this.onChange(null);
- return;
- }
- this._updateTime();
- }
- /**
- * @param {?} seconds
- * @return {?}
- */
- updateSeconds(seconds) {
- this.resetValidation();
- this.seconds = seconds;
- /** @type {?} */
- const isValid = isSecondInputValid(this.seconds) && this.isValidLimit();
- if (!isValid) {
- this.invalidSeconds = true;
- this.isValid.emit(false);
- this.onChange(null);
- return;
- }
- this._updateTime();
- }
- /**
- * @return {?}
- */
- isValidLimit() {
- return isInputLimitValid({
- hour: this.hours,
- minute: this.minutes,
- seconds: this.seconds,
- isPM: this.isPM()
- }, this.max, this.min);
- }
- /**
- * @return {?}
- */
- _updateTime() {
- /** @type {?} */
- const _seconds = this.showSeconds ? this.seconds : void 0;
- /** @type {?} */
- const _minutes = this.showMinutes ? this.minutes : void 0;
- if (!isInputValid(this.hours, _minutes, _seconds, this.isPM())) {
- this.isValid.emit(false);
- this.onChange(null);
- return;
- }
- this._store.dispatch(this._timepickerActions.setTime({
- hour: this.hours,
- minute: this.minutes,
- seconds: this.seconds,
- isPM: this.isPM()
- }));
- }
- /**
- * @return {?}
- */
- toggleMeridian() {
- if (!this.showMeridian || !this.isEditable) {
- return;
- }
- /** @type {?} */
- const _hoursPerDayHalf = 12;
- this._store.dispatch(this._timepickerActions.changeHours({
- step: _hoursPerDayHalf,
- source: ''
- }));
- }
- /**
- * Write a new value to the element.
- * @param {?} obj
- * @return {?}
- */
- writeValue(obj) {
- if (isValidDate(obj)) {
- this._store.dispatch(this._timepickerActions.writeValue(parseTime(obj)));
- }
- else if (obj == null) {
- this._store.dispatch(this._timepickerActions.writeValue(null));
- }
- }
- /**
- * Set the function to be called when the control receives a change event.
- * @param {?} fn
- * @return {?}
- */
- // tslint:disable-next-line:no-any
- registerOnChange(fn) {
- this.onChange = fn;
- }
- /**
- * Set the function to be called when the control receives a touch event.
- * @param {?} fn
- * @return {?}
- */
- registerOnTouched(fn) {
- this.onTouched = fn;
- }
- /**
- * This function is called when the control status changes to or from "disabled".
- * Depending on the value, it will enable or disable the appropriate DOM element.
- *
- * @param {?} isDisabled
- * @return {?}
- */
- setDisabledState(isDisabled) {
- this.disabled = isDisabled;
- this._cd.markForCheck();
- }
- /**
- * @return {?}
- */
- ngOnDestroy() {
- this.timepickerSub.unsubscribe();
- }
- /**
- * @private
- * @param {?} value
- * @return {?}
- */
- _renderTime(value) {
- if (!isValidDate(value)) {
- this.hours = '';
- this.minutes = '';
- this.seconds = '';
- this.meridian = this.meridians[0];
- return;
- }
- /** @type {?} */
- const _value = parseTime(value);
- /** @type {?} */
- const _hoursPerDayHalf = 12;
- /** @type {?} */
- let _hours = _value.getHours();
- if (this.showMeridian) {
- this.meridian = this.meridians[_hours >= _hoursPerDayHalf ? 1 : 0];
- _hours = _hours % _hoursPerDayHalf;
- // should be 12 PM, not 00 PM
- if (_hours === 0) {
- _hours = _hoursPerDayHalf;
- }
- }
- this.hours = padNumber(_hours);
- this.minutes = padNumber(_value.getMinutes());
- this.seconds = padNumber(_value.getUTCSeconds());
- }
- }
- TimepickerComponent.decorators = [
- { type: Component, args: [{
- selector: 'timepicker',
- changeDetection: ChangeDetectionStrategy.OnPush,
- providers: [TIMEPICKER_CONTROL_VALUE_ACCESSOR, TimepickerStore],
- template: "<table>\n <tbody>\n <tr class=\"text-center\" [hidden]=\"!showSpinners\">\n <!-- increment hours button-->\n <td>\n <a class=\"btn btn-link\" [class.disabled]=\"!canIncrementHours || !isEditable\"\n (click)=\"changeHours(hourStep)\"\n ><span class=\"bs-chevron bs-chevron-up\"></span></a>\n </td>\n <!-- divider -->\n <td *ngIf=\"showMinutes\"> </td>\n <!-- increment minutes button -->\n <td *ngIf=\"showMinutes\">\n <a class=\"btn btn-link\" [class.disabled]=\"!canIncrementMinutes || !isEditable\"\n (click)=\"changeMinutes(minuteStep)\"\n ><span class=\"bs-chevron bs-chevron-up\"></span></a>\n </td>\n <!-- divider -->\n <td *ngIf=\"showSeconds\"> </td>\n <!-- increment seconds button -->\n <td *ngIf=\"showSeconds\">\n <a class=\"btn btn-link\" [class.disabled]=\"!canIncrementSeconds || !isEditable\"\n (click)=\"changeSeconds(secondsStep)\">\n <span class=\"bs-chevron bs-chevron-up\"></span>\n </a>\n </td>\n <!-- space between -->\n <td *ngIf=\"showMeridian\"> </td>\n <!-- meridian placeholder-->\n <td *ngIf=\"showMeridian\"></td>\n </tr>\n <tr>\n <!-- hours -->\n <td class=\"form-group\" [class.has-error]=\"invalidHours\">\n <input type=\"text\" [class.is-invalid]=\"invalidHours\"\n class=\"form-control text-center bs-timepicker-field\"\n [placeholder]=\"hoursPlaceholder\"\n maxlength=\"2\"\n [readonly]=\"readonlyInput\"\n [disabled]=\"disabled\"\n [value]=\"hours\"\n (wheel)=\"prevDef($event);changeHours(hourStep * wheelSign($event), 'wheel')\"\n (keydown.ArrowUp)=\"changeHours(hourStep, 'key')\"\n (keydown.ArrowDown)=\"changeHours(-hourStep, 'key')\"\n (change)=\"updateHours($event.target.value)\"></td>\n <!-- divider -->\n <td *ngIf=\"showMinutes\"> : </td>\n <!-- minutes -->\n <td class=\"form-group\" *ngIf=\"showMinutes\" [class.has-error]=\"invalidMinutes\">\n <input type=\"text\" [class.is-invalid]=\"invalidMinutes\"\n class=\"form-control text-center bs-timepicker-field\"\n [placeholder]=\"minutesPlaceholder\"\n maxlength=\"2\"\n [readonly]=\"readonlyInput\"\n [disabled]=\"disabled\"\n [value]=\"minutes\"\n (wheel)=\"prevDef($event);changeMinutes(minuteStep * wheelSign($event), 'wheel')\"\n (keydown.ArrowUp)=\"changeMinutes(minuteStep, 'key')\"\n (keydown.ArrowDown)=\"changeMinutes(-minuteStep, 'key')\"\n (change)=\"updateMinutes($event.target.value)\">\n </td>\n <!-- divider -->\n <td *ngIf=\"showSeconds\"> : </td>\n <!-- seconds -->\n <td class=\"form-group\" *ngIf=\"showSeconds\" [class.has-error]=\"invalidSeconds\">\n <input type=\"text\" [class.is-invalid]=\"invalidSeconds\"\n class=\"form-control text-center bs-timepicker-field\"\n [placeholder]=\"secondsPlaceholder\"\n maxlength=\"2\"\n [readonly]=\"readonlyInput\"\n [disabled]=\"disabled\"\n [value]=\"seconds\"\n (wheel)=\"prevDef($event);changeSeconds(secondsStep * wheelSign($event), 'wheel')\"\n (keydown.ArrowUp)=\"changeSeconds(secondsStep, 'key')\"\n (keydown.ArrowDown)=\"changeSeconds(-secondsStep, 'key')\"\n (change)=\"updateSeconds($event.target.value)\">\n </td>\n <!-- space between -->\n <td *ngIf=\"showMeridian\"> </td>\n <!-- meridian -->\n <td *ngIf=\"showMeridian\">\n <button type=\"button\" class=\"btn btn-default text-center\"\n [disabled]=\"!isEditable || !canToggleMeridian\"\n [class.disabled]=\"!isEditable || !canToggleMeridian\"\n (click)=\"toggleMeridian()\"\n >{{ meridian }}\n </button>\n </td>\n </tr>\n <tr class=\"text-center\" [hidden]=\"!showSpinners\">\n <!-- decrement hours button-->\n <td>\n <a class=\"btn btn-link\" [class.disabled]=\"!canDecrementHours || !isEditable\"\n (click)=\"changeHours(-hourStep)\">\n <span class=\"bs-chevron bs-chevron-down\"></span>\n </a>\n </td>\n <!-- divider -->\n <td *ngIf=\"showMinutes\"> </td>\n <!-- decrement minutes button-->\n <td *ngIf=\"showMinutes\">\n <a class=\"btn btn-link\" [class.disabled]=\"!canDecrementMinutes || !isEditable\"\n (click)=\"changeMinutes(-minuteStep)\">\n <span class=\"bs-chevron bs-chevron-down\"></span>\n </a>\n </td>\n <!-- divider -->\n <td *ngIf=\"showSeconds\"> </td>\n <!-- decrement seconds button-->\n <td *ngIf=\"showSeconds\">\n <a class=\"btn btn-link\" [class.disabled]=\"!canDecrementSeconds || !isEditable\"\n (click)=\"changeSeconds(-secondsStep)\">\n <span class=\"bs-chevron bs-chevron-down\"></span>\n </a>\n </td>\n <!-- space between -->\n <td *ngIf=\"showMeridian\"> </td>\n <!-- meridian placeholder-->\n <td *ngIf=\"showMeridian\"></td>\n </tr>\n </tbody>\n</table>\n",
- encapsulation: ViewEncapsulation.None,
- styles: [`
- .bs-chevron {
- border-style: solid;
- display: block;
- width: 9px;
- height: 9px;
- position: relative;
- border-width: 3px 0px 0 3px;
- }
- .bs-chevron-up {
- -webkit-transform: rotate(45deg);
- transform: rotate(45deg);
- top: 2px;
- }
- .bs-chevron-down {
- -webkit-transform: rotate(-135deg);
- transform: rotate(-135deg);
- top: -2px;
- }
- .bs-timepicker-field {
- width: 50px;
- padding: .375rem .55rem;
- }
- `]
- }] }
- ];
- /** @nocollapse */
- TimepickerComponent.ctorParameters = () => [
- { type: TimepickerConfig },
- { type: ChangeDetectorRef },
- { type: TimepickerStore },
- { type: TimepickerActions }
- ];
- TimepickerComponent.propDecorators = {
- hourStep: [{ type: Input }],
- minuteStep: [{ type: Input }],
- secondsStep: [{ type: Input }],
- readonlyInput: [{ type: Input }],
- disabled: [{ type: Input }],
- mousewheel: [{ type: Input }],
- arrowkeys: [{ type: Input }],
- showSpinners: [{ type: Input }],
- showMeridian: [{ type: Input }],
- showMinutes: [{ type: Input }],
- showSeconds: [{ type: Input }],
- meridians: [{ type: Input }],
- min: [{ type: Input }],
- max: [{ type: Input }],
- hoursPlaceholder: [{ type: Input }],
- minutesPlaceholder: [{ type: Input }],
- secondsPlaceholder: [{ type: Input }],
- isValid: [{ type: Output }]
- };
- /**
- * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
- class TimepickerModule {
- /**
- * @return {?}
- */
- static forRoot() {
- return {
- ngModule: TimepickerModule,
- providers: [TimepickerConfig, TimepickerActions, TimepickerStore]
- };
- }
- }
- TimepickerModule.decorators = [
- { type: NgModule, args: [{
- imports: [CommonModule],
- declarations: [TimepickerComponent],
- exports: [TimepickerComponent]
- },] }
- ];
- export { TimepickerActions, TimepickerComponent, TimepickerConfig, TimepickerModule, TimepickerStore, TIMEPICKER_CONTROL_VALUE_ACCESSOR as ɵa };
- //# sourceMappingURL=ngx-bootstrap-timepicker.js.map
|