diff options
Diffstat (limited to 'app/assets/javascripts/labels/labels.js')
-rw-r--r-- | app/assets/javascripts/labels/labels.js | 12 |
1 files changed, 11 insertions, 1 deletions
diff --git a/app/assets/javascripts/labels/labels.js b/app/assets/javascripts/labels/labels.js index cd8cf0d354c..acb29e1a1f0 100644 --- a/app/assets/javascripts/labels/labels.js +++ b/app/assets/javascripts/labels/labels.js @@ -7,29 +7,39 @@ export default class Labels { this.cleanBinding(); this.addBinding(); this.updateColorPreview(); + this.updateColorPickerPreview(); } addBinding() { $(document).on('click', '.suggest-colors a', this.setSuggestedColor); + $(document).on('input', '.label-color-preview', this.updateColorPickerPreview); return $(document).on('input', 'input#label_color', this.updateColorPreview); } // eslint-disable-next-line class-methods-use-this cleanBinding() { $(document).off('click', '.suggest-colors a'); + $(document).off('input', '.label-color-preview'); return $(document).off('input', 'input#label_color'); } // eslint-disable-next-line class-methods-use-this updateColorPreview() { const previewColor = $('input#label_color').val(); - return $('div.label-color-preview').css('background-color', previewColor); + return $('.label-color-preview').val(previewColor); // Updates the preview color with the hex-color input } + // eslint-disable-next-line class-methods-use-this + updateColorPickerPreview() { + const previewColor = $('.label-color-preview').val(); + return $('input#label_color').val(previewColor); + // Updates the input color with the hex-color from the picker + } // Updates the preview color with a click on a suggested color setSuggestedColor(e) { const color = $(e.currentTarget).data('color'); $('input#label_color').val(color); this.updateColorPreview(); + this.updateColorPickerPreview(); // Notify the form, that color has changed $('.label-form').trigger('keyup'); return e.preventDefault(); |