-
-
Notifications
You must be signed in to change notification settings - Fork 4.4k
/
minute-display.ts
74 lines (65 loc) · 2.31 KB
/
minute-display.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
import { Unit } from '../../datetime';
import Namespace from '../../utilities/namespace';
import Validation from '../../validation';
import { serviceLocator } from '../../utilities/service-locator';
import { Paint } from '../index';
import ActionTypes from '../../utilities/action-types';
import { OptionsStore } from '../../utilities/optionsStore';
/**
* Creates and updates the grid for `minutes`
*/
export default class MinuteDisplay {
private optionsStore: OptionsStore;
private validation: Validation;
constructor() {
this.optionsStore = serviceLocator.locate(OptionsStore);
this.validation = serviceLocator.locate(Validation);
}
/**
* Build the container html for the display
* @private
*/
getPicker(): HTMLElement {
const container = document.createElement('div');
container.classList.add(Namespace.css.minuteContainer);
const step =
this.optionsStore.options.stepping === 1
? 5
: this.optionsStore.options.stepping;
for (let i = 0; i < 60 / step; i++) {
const div = document.createElement('div');
div.setAttribute('data-action', ActionTypes.selectMinute);
container.appendChild(div);
}
return container;
}
/**
* Populates the grid and updates enabled states
* @private
*/
_update(widget: HTMLElement, paint: Paint): void {
const container = widget.getElementsByClassName(
Namespace.css.minuteContainer
)[0];
const innerDate = this.optionsStore.viewDate.clone.startOf(Unit.hours);
const step =
this.optionsStore.options.stepping === 1
? 5
: this.optionsStore.options.stepping;
container
.querySelectorAll(`[data-action="${ActionTypes.selectMinute}"]`)
.forEach((containerClone: HTMLElement) => {
const classes = [];
classes.push(Namespace.css.minute);
if (!this.validation.isValid(innerDate, Unit.minutes)) {
classes.push(Namespace.css.disabled);
}
paint(Unit.minutes, innerDate, classes, containerClone);
containerClone.classList.remove(...containerClone.classList);
containerClone.classList.add(...classes);
containerClone.setAttribute('data-value', `${innerDate.minutes}`);
containerClone.innerText = innerDate.minutesFormatted;
innerDate.manipulate(step, Unit.minutes);
});
}
}