diff options
author | Kushal Pandya <kushal@gitlab.com> | 2017-03-21 21:21:56 +0530 |
---|---|---|
committer | Kushal Pandya <kushal@gitlab.com> | 2017-03-21 21:21:56 +0530 |
commit | 97a02fca6bf24a2e6e5feb4b164a9265511903c2 (patch) | |
tree | a2ca2d979774c5e8d79fd8118995267c4f8f22fd /app/assets/javascripts/protected_tags | |
parent | d20c5427af94c7043c3cc7c04288a056921b812c (diff) | |
download | gitlab-ce-97a02fca6bf24a2e6e5feb4b164a9265511903c2.tar.gz |
Protected Tags Classes
Diffstat (limited to 'app/assets/javascripts/protected_tags')
3 files changed, 153 insertions, 0 deletions
diff --git a/app/assets/javascripts/protected_tags/protected_tag_access_dropdown.js b/app/assets/javascripts/protected_tags/protected_tag_access_dropdown.js new file mode 100644 index 00000000000..b85c2991dd9 --- /dev/null +++ b/app/assets/javascripts/protected_tags/protected_tag_access_dropdown.js @@ -0,0 +1,29 @@ +/* eslint-disable arrow-parens, no-param-reassign, object-shorthand, no-else-return, comma-dangle, max-len */ + +(global => { + global.gl = global.gl || {}; + + gl.ProtectedTagAccessDropdown = class { + constructor(options) { + const { $dropdown, data, onSelect } = options; + + $dropdown.glDropdown({ + data: data, + selectable: true, + inputId: $dropdown.data('input-id'), + fieldName: $dropdown.data('field-name'), + toggleLabel(item, el) { + if (el.is('.is-active')) { + return item.text; + } else { + return 'Select'; + } + }, + clicked(item, $el, e) { + e.preventDefault(); + onSelect(); + } + }); + } + }; +})(window); diff --git a/app/assets/javascripts/protected_tags/protected_tag_create.js b/app/assets/javascripts/protected_tags/protected_tag_create.js new file mode 100644 index 00000000000..4c652e7747f --- /dev/null +++ b/app/assets/javascripts/protected_tags/protected_tag_create.js @@ -0,0 +1,45 @@ +/* eslint-disable no-new, arrow-parens, no-param-reassign, comma-dangle, max-len */ +/* global ProtectedTagDropdown */ + +(global => { + global.gl = global.gl || {}; + + gl.ProtectedTagCreate = class { + constructor() { + this.$wrap = this.$form = $('.new_protected_tag'); + this.buildDropdowns(); + } + + buildDropdowns() { + const $allowedToPushDropdown = this.$wrap.find('.js-allowed-to-push'); + + // Cache callback + this.onSelectCallback = this.onSelect.bind(this); + + // Allowed to Push dropdown + new gl.ProtectedTagAccessDropdown({ + $dropdown: $allowedToPushDropdown, + data: gon.push_access_levels, + onSelect: this.onSelectCallback + }); + + // Select default + $allowedToPushDropdown.data('glDropdown').selectRowAtIndex(0); + + // Protected tag dropdown + new ProtectedTagDropdown({ + $dropdown: this.$wrap.find('.js-protected-tag-select'), + onSelect: this.onSelectCallback + }); + } + + // This will run after clicked callback + onSelect() { + // Enable submit button + const $tagInput = this.$wrap.find('input[name="protected_tag[name]"]'); + const $allowedToPushInput = this.$wrap.find('input[name="protected_tag[push_access_levels_attributes][0][access_level]"]'); + + this.$form.find('input[type="submit"]').attr('disabled', !($tagInput.val() && $allowedToPushInput.length)); + } + }; +})(window); diff --git a/app/assets/javascripts/protected_tags/protected_tag_dropdown.js b/app/assets/javascripts/protected_tags/protected_tag_dropdown.js new file mode 100644 index 00000000000..5a0356f502c --- /dev/null +++ b/app/assets/javascripts/protected_tags/protected_tag_dropdown.js @@ -0,0 +1,79 @@ +/* eslint-disable comma-dangle, no-unused-vars */ + +class ProtectedTagDropdown { + constructor(options) { + this.onSelect = options.onSelect; + this.$dropdown = options.$dropdown; + this.$dropdownContainer = this.$dropdown.parent(); + this.$dropdownFooter = this.$dropdownContainer.find('.dropdown-footer'); + this.$protectedTag = this.$dropdownContainer.find('.create-new-protected-tag'); + + this.buildDropdown(); + this.bindEvents(); + + // Hide footer + this.$dropdownFooter.addClass('hidden'); + } + + buildDropdown() { + this.$dropdown.glDropdown({ + data: this.getProtectedTags.bind(this), + filterable: true, + remote: false, + search: { + fields: ['title'] + }, + selectable: true, + toggleLabel(selected) { + return (selected && 'id' in selected) ? selected.title : 'Protected Tag'; + }, + fieldName: 'protected_tag[name]', + text(protectedTag) { + return _.escape(protectedTag.title); + }, + id(protectedTag) { + return _.escape(protectedTag.id); + }, + onFilter: this.toggleCreateNewButton.bind(this), + clicked: (item, $el, e) => { + e.preventDefault(); + this.onSelect(); + } + }); + } + + bindEvents() { + this.$protectedTag.on('click', this.onClickCreateWildcard.bind(this)); + } + + onClickCreateWildcard() { + this.$dropdown.data('glDropdown').remote.execute(); + this.$dropdown.data('glDropdown').selectRowAtIndex(); + } + + getProtectedTags(term, callback) { + if (this.selectedTag) { + callback(gon.open_branches.concat(this.selectedTag)); + } else { + callback(gon.open_branches); + } + } + + toggleCreateNewButton(tagName) { + this.selectedTag = { + title: tagName, + id: tagName, + text: tagName + }; + + if (tagName) { + this.$dropdownContainer + .find('.create-new-protected-tag code') + .text(tagName); + } + + this.$dropdownFooter.toggleClass('hidden', !tagName); + } +} + +window.ProtectedTagDropdown = ProtectedTagDropdown; |