diff options
Diffstat (limited to 'app/assets/javascripts/pipeline_schedules/components/timezone_dropdown.js')
-rw-r--r-- | app/assets/javascripts/pipeline_schedules/components/timezone_dropdown.js | 56 |
1 files changed, 56 insertions, 0 deletions
diff --git a/app/assets/javascripts/pipeline_schedules/components/timezone_dropdown.js b/app/assets/javascripts/pipeline_schedules/components/timezone_dropdown.js new file mode 100644 index 00000000000..c70e0502cf8 --- /dev/null +++ b/app/assets/javascripts/pipeline_schedules/components/timezone_dropdown.js @@ -0,0 +1,56 @@ +/* eslint-disable class-methods-use-this */ + +export default class TimezoneDropdown { + constructor() { + this.$dropdown = $('.js-timezone-dropdown'); + this.$dropdownToggle = this.$dropdown.find('.dropdown-toggle-text'); + this.$input = $('#schedule_cron_timezone'); + this.timezoneData = this.$dropdown.data('data'); + this.initialValue = this.$input.val(); + this.initDropdown(); + } + + initDropdown() { + this.$dropdown.glDropdown({ + data: this.timezoneData, + filterable: true, + selectable: true, + toggleLabel: item => item.name, + search: { + fields: ['name'], + }, + clicked: cfg => this.updateInputValue(cfg), + text: item => this.formatTimezone(item), + }); + + this.setDropdownToggle(); + } + + formatUtcOffset(offset) { + let prefix = ''; + + if (offset > 0) { + prefix = '+'; + } else if (offset < 0) { + prefix = '-'; + } + + return `${prefix} ${Math.abs(offset / 3600)}`; + } + + formatTimezone(item) { + return `[UTC ${this.formatUtcOffset(item.offset)}] ${item.name}`; + } + + setDropdownToggle() { + if (this.initialValue) { + this.$dropdownToggle.text(this.initialValue); + } + } + + updateInputValue({ selectedObj, e }) { + e.preventDefault(); + this.$input.val(selectedObj.identifier); + gl.pipelineScheduleFieldErrors.updateFormValidityState(); + } +} |