import $ from 'jquery'; import { config } from 'grav-config'; import '../../utils/bootstrap-datetimepicker'; export default class DateTimeField { get defaults() { return { showTodayButton: true, showClear: true, locale: config.language || 'en', icons: { time: 'fa fa-clock-o', date: 'fa fa-calendar-o', up: 'fa fa-chevron-up', down: 'fa fa-chevron-down', previous: 'fa fa-chevron-left', next: 'fa fa-chevron-right', today: 'fa fa-bullseye', clear: 'fa fa-trash-o', close: 'fa fa-remove' } }; } constructor(options) { this.items = $(); this.options = Object.assign({}, this.defaults, options); $('[data-grav-datetime]').each((index, field) => this.addItem(field)); $('body').on('mutation._grav', this._onAddedNodes.bind(this)); } addItem(list) { list = $(list); this.items = this.items.add(list); if (list.data('DateTimePicker')) { return; } let options = Object.assign({}, this.options, list.data('grav-datetime') || {}); list.datetimepicker(options).on('dp.show dp.update', this._disableDecades); list.siblings('.field-icons').on('click', () => list.mousedown().focus()); } _onAddedNodes(event, target/* , record, instance */) { let fields = $(target).find('[data-grav-datetime]'); if (!fields.length) { return; } fields.each((index, field) => { field = $(field); if (!~this.items.index(field)) { this.addItem(field); } }); } _disableDecades() { $('.datepicker-years .picker-switch').removeAttr('title').on('click', (e) => e.stopPropagation()); } } export let Instance = new DateTimeField();