Commit 713052c7 authored by Phil Hughes's avatar Phil Hughes

Merge branch '38869-labels' into 'master'

Export logo and labels select as ES6 modules

See merge request gitlab-org/gitlab-ce!15091
parents b6e69673 1fc4e2b6
/* eslint-disable comma-dangle, space-before-function-paren, no-new */ /* eslint-disable comma-dangle, space-before-function-paren, no-new */
/* global MilestoneSelect */ /* global MilestoneSelect */
/* global LabelsSelect */
/* global Sidebar */ /* global Sidebar */
import Vue from 'vue'; import Vue from 'vue';
...@@ -11,6 +10,7 @@ import Assignees from '../../sidebar/components/assignees/assignees'; ...@@ -11,6 +10,7 @@ import Assignees from '../../sidebar/components/assignees/assignees';
import DueDateSelectors from '../../due_date_select'; import DueDateSelectors from '../../due_date_select';
import './sidebar/remove_issue'; import './sidebar/remove_issue';
import IssuableContext from '../../issuable_context'; import IssuableContext from '../../issuable_context';
import LabelsSelect from '../../labels_select';
const Store = gl.issueBoards.BoardsStore; const Store = gl.issueBoards.BoardsStore;
......
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
import IssuableIndex from './issuable_index'; import IssuableIndex from './issuable_index';
/* global Milestone */ /* global Milestone */
import IssuableForm from './issuable_form'; import IssuableForm from './issuable_form';
/* global LabelsSelect */ import LabelsSelect from './labels_select';
/* global MilestoneSelect */ /* global MilestoneSelect */
/* global NewBranchForm */ /* global NewBranchForm */
/* global NotificationsForm */ /* global NotificationsForm */
......
/* eslint-disable no-new */ /* eslint-disable no-new */
/* global MilestoneSelect */ /* global MilestoneSelect */
/* global LabelsSelect */ import LabelsSelect from './labels_select';
import IssuableContext from './issuable_context'; import IssuableContext from './issuable_context';
/* global Sidebar */ /* global Sidebar */
......
/* eslint-disable no-new */ /* eslint-disable no-new */
/* global LabelsSelect */ import LabelsSelect from './labels_select';
/* global MilestoneSelect */ /* global MilestoneSelect */
/* global SubscriptionSelect */ /* global SubscriptionSelect */
......
/* eslint-disable class-methods-use-this, no-new */ /* eslint-disable class-methods-use-this, no-new */
/* global LabelsSelect */
/* global MilestoneSelect */ /* global MilestoneSelect */
/* global SubscriptionSelect */ /* global SubscriptionSelect */
...@@ -7,7 +6,7 @@ import IssuableBulkUpdateActions from './issuable_bulk_update_actions'; ...@@ -7,7 +6,7 @@ import IssuableBulkUpdateActions from './issuable_bulk_update_actions';
import './milestone_select'; import './milestone_select';
import issueStatusSelect from './issue_status_select'; import issueStatusSelect from './issue_status_select';
import './subscription_select'; import './subscription_select';
import './labels_select'; import LabelsSelect from './labels_select';
const HIDDEN_CLASS = 'hidden'; const HIDDEN_CLASS = 'hidden';
const DISABLED_CONTENT_CLASS = 'disabled-content'; const DISABLED_CONTENT_CLASS = 'disabled-content';
......
...@@ -6,474 +6,470 @@ import IssuableBulkUpdateActions from './issuable_bulk_update_actions'; ...@@ -6,474 +6,470 @@ import IssuableBulkUpdateActions from './issuable_bulk_update_actions';
import DropdownUtils from './filtered_search/dropdown_utils'; import DropdownUtils from './filtered_search/dropdown_utils';
import CreateLabelDropdown from './create_label'; import CreateLabelDropdown from './create_label';
(function() { export default class LabelsSelect {
this.LabelsSelect = (function() { constructor(els) {
function LabelsSelect(els) { var _this, $els;
var _this, $els; _this = this;
_this = this;
$els = $(els); $els = $(els);
if (!els) { if (!els) {
$els = $('.js-label-select'); $els = $('.js-label-select');
} }
$els.each(function(i, dropdown) { $els.each(function(i, dropdown) {
var $block, $colorPreview, $dropdown, $form, $loading, $selectbox, $sidebarCollapsedValue, $value, abilityName, defaultLabel, enableLabelCreateButton, issueURLSplit, issueUpdateURL, labelHTMLTemplate, labelNoneHTMLTemplate, labelUrl, namespacePath, projectPath, saveLabelData, selectedLabel, showAny, showNo, $sidebarLabelTooltip, initialSelected, $toggleText, fieldName, useId, propertyName, showMenuAbove, $container, $dropdownContainer; var $block, $colorPreview, $dropdown, $form, $loading, $selectbox, $sidebarCollapsedValue, $value, abilityName, defaultLabel, enableLabelCreateButton, issueURLSplit, issueUpdateURL, labelHTMLTemplate, labelNoneHTMLTemplate, labelUrl, namespacePath, projectPath, saveLabelData, selectedLabel, showAny, showNo, $sidebarLabelTooltip, initialSelected, $toggleText, fieldName, useId, propertyName, showMenuAbove, $container, $dropdownContainer;
$dropdown = $(dropdown); $dropdown = $(dropdown);
$dropdownContainer = $dropdown.closest('.labels-filter'); $dropdownContainer = $dropdown.closest('.labels-filter');
$toggleText = $dropdown.find('.dropdown-toggle-text'); $toggleText = $dropdown.find('.dropdown-toggle-text');
namespacePath = $dropdown.data('namespace-path'); namespacePath = $dropdown.data('namespace-path');
projectPath = $dropdown.data('project-path'); projectPath = $dropdown.data('project-path');
labelUrl = $dropdown.data('labels'); labelUrl = $dropdown.data('labels');
issueUpdateURL = $dropdown.data('issueUpdate'); issueUpdateURL = $dropdown.data('issueUpdate');
selectedLabel = $dropdown.data('selected'); selectedLabel = $dropdown.data('selected');
if ((selectedLabel != null) && !$dropdown.hasClass('js-multiselect')) { if ((selectedLabel != null) && !$dropdown.hasClass('js-multiselect')) {
selectedLabel = selectedLabel.split(','); selectedLabel = selectedLabel.split(',');
} }
showNo = $dropdown.data('show-no'); showNo = $dropdown.data('show-no');
showAny = $dropdown.data('show-any'); showAny = $dropdown.data('show-any');
showMenuAbove = $dropdown.data('showMenuAbove'); showMenuAbove = $dropdown.data('showMenuAbove');
defaultLabel = $dropdown.data('default-label'); defaultLabel = $dropdown.data('default-label');
abilityName = $dropdown.data('ability-name'); abilityName = $dropdown.data('ability-name');
$selectbox = $dropdown.closest('.selectbox'); $selectbox = $dropdown.closest('.selectbox');
$block = $selectbox.closest('.block'); $block = $selectbox.closest('.block');
$form = $dropdown.closest('form, .js-issuable-update'); $form = $dropdown.closest('form, .js-issuable-update');
$sidebarCollapsedValue = $block.find('.sidebar-collapsed-icon span'); $sidebarCollapsedValue = $block.find('.sidebar-collapsed-icon span');
$sidebarLabelTooltip = $block.find('.js-sidebar-labels-tooltip'); $sidebarLabelTooltip = $block.find('.js-sidebar-labels-tooltip');
$value = $block.find('.value'); $value = $block.find('.value');
$loading = $block.find('.block-loading').fadeOut(); $loading = $block.find('.block-loading').fadeOut();
fieldName = $dropdown.data('field-name'); fieldName = $dropdown.data('field-name');
useId = $dropdown.is('.js-issuable-form-dropdown, .js-filter-bulk-update, .js-label-sidebar-dropdown'); useId = $dropdown.is('.js-issuable-form-dropdown, .js-filter-bulk-update, .js-label-sidebar-dropdown');
propertyName = useId ? 'id' : 'title'; propertyName = useId ? 'id' : 'title';
initialSelected = $selectbox initialSelected = $selectbox
.find('input[name="' + $dropdown.data('field-name') + '"]') .find('input[name="' + $dropdown.data('field-name') + '"]')
.map(function () { .map(function () {
return this.value; return this.value;
}).get(); }).get();
if (issueUpdateURL != null) { if (issueUpdateURL != null) {
issueURLSplit = issueUpdateURL.split('/'); issueURLSplit = issueUpdateURL.split('/');
} }
if (issueUpdateURL) { if (issueUpdateURL) {
labelHTMLTemplate = _.template('<% _.each(labels, function(label){ %> <a href="<%- ["",issueURLSplit[1], issueURLSplit[2],""].join("/") %>issues?label_name[]=<%- encodeURIComponent(label.title) %>"> <span class="label has-tooltip color-label" title="<%- label.description %>" style="background-color: <%- label.color %>; color: <%- label.text_color %>;"> <%- label.title %> </span> </a> <% }); %>'); labelHTMLTemplate = _.template('<% _.each(labels, function(label){ %> <a href="<%- ["",issueURLSplit[1], issueURLSplit[2],""].join("/") %>issues?label_name[]=<%- encodeURIComponent(label.title) %>"> <span class="label has-tooltip color-label" title="<%- label.description %>" style="background-color: <%- label.color %>; color: <%- label.text_color %>;"> <%- label.title %> </span> </a> <% }); %>');
labelNoneHTMLTemplate = '<span class="no-value">None</span>'; labelNoneHTMLTemplate = '<span class="no-value">None</span>';
} }
$sidebarLabelTooltip.tooltip(); $sidebarLabelTooltip.tooltip();
if ($dropdown.closest('.dropdown').find('.dropdown-new-label').length) { if ($dropdown.closest('.dropdown').find('.dropdown-new-label').length) {
new CreateLabelDropdown($dropdown.closest('.dropdown').find('.dropdown-new-label'), namespacePath, projectPath); new CreateLabelDropdown($dropdown.closest('.dropdown').find('.dropdown-new-label'), namespacePath, projectPath);
} }
saveLabelData = function() { saveLabelData = function() {
var data, selected; var data, selected;
selected = $dropdown.closest('.selectbox').find("input[name='" + fieldName + "']").map(function() { selected = $dropdown.closest('.selectbox').find("input[name='" + fieldName + "']").map(function() {
return this.value; return this.value;
}).get(); }).get();
if (_.isEqual(initialSelected, selected)) return; if (_.isEqual(initialSelected, selected)) return;
initialSelected = selected; initialSelected = selected;
data = {}; data = {};
data[abilityName] = {}; data[abilityName] = {};
data[abilityName].label_ids = selected; data[abilityName].label_ids = selected;
if (!selected.length) { if (!selected.length) {
data[abilityName].label_ids = ['']; data[abilityName].label_ids = [''];
}
$loading.removeClass('hidden').fadeIn();
$dropdown.trigger('loading.gl.dropdown');
return $.ajax({
type: 'PUT',
url: issueUpdateURL,
dataType: 'JSON',
data: data
}).done(function(data) {
var labelCount, template, labelTooltipTitle, labelTitles;
$loading.fadeOut();
$dropdown.trigger('loaded.gl.dropdown');
$selectbox.hide();
data.issueURLSplit = issueURLSplit;
labelCount = 0;
if (data.labels.length) {
template = labelHTMLTemplate(data);
labelCount = data.labels.length;
} }
$loading.removeClass('hidden').fadeIn(); else {
$dropdown.trigger('loading.gl.dropdown'); template = labelNoneHTMLTemplate;
return $.ajax({ }
type: 'PUT', $value.removeAttr('style').html(template);
url: issueUpdateURL, $sidebarCollapsedValue.text(labelCount);
dataType: 'JSON',
data: data
}).done(function(data) {
var labelCount, template, labelTooltipTitle, labelTitles;
$loading.fadeOut();
$dropdown.trigger('loaded.gl.dropdown');
$selectbox.hide();
data.issueURLSplit = issueURLSplit;
labelCount = 0;
if (data.labels.length) {
template = labelHTMLTemplate(data);
labelCount = data.labels.length;
}
else {
template = labelNoneHTMLTemplate;
}
$value.removeAttr('style').html(template);
$sidebarCollapsedValue.text(labelCount);
if (data.labels.length) {
labelTitles = data.labels.map(function(label) {
return label.title;
});
if (labelTitles.length > 5) { if (data.labels.length) {
labelTitles = labelTitles.slice(0, 5); labelTitles = data.labels.map(function(label) {
labelTitles.push('and ' + (data.labels.length - 5) + ' more'); return label.title;
} });
labelTooltipTitle = labelTitles.join(', '); if (labelTitles.length > 5) {
} labelTitles = labelTitles.slice(0, 5);
else { labelTitles.push('and ' + (data.labels.length - 5) + ' more');
labelTooltipTitle = '';
$sidebarLabelTooltip.tooltip('destroy');
} }
$sidebarLabelTooltip labelTooltipTitle = labelTitles.join(', ');
.attr('title', labelTooltipTitle) }
.tooltip('fixTitle'); else {
labelTooltipTitle = '';
$sidebarLabelTooltip.tooltip('destroy');
}
$('.has-tooltip', $value).tooltip({ $sidebarLabelTooltip
container: 'body' .attr('title', labelTooltipTitle)
}); .tooltip('fixTitle');
$('.has-tooltip', $value).tooltip({
container: 'body'
}); });
}; });
$dropdown.glDropdown({ };
showMenuAbove: showMenuAbove, $dropdown.glDropdown({
data: function(term, callback) { showMenuAbove: showMenuAbove,
return $.ajax({ data: function(term, callback) {
url: labelUrl return $.ajax({
}).done(function(data) { url: labelUrl
data = _.chain(data).groupBy(function(label) { }).done(function(data) {
return label.title; data = _.chain(data).groupBy(function(label) {
}).map(function(label) { return label.title;
var color; }).map(function(label) {
color = _.map(label, function(dup) { var color;
return dup.color; color = _.map(label, function(dup) {
return dup.color;
});
return {
id: label[0].id,
title: label[0].title,
color: color,
duplicate: color.length > 1
};
}).value();
if ($dropdown.hasClass('js-extra-options')) {
var extraData = [];
if (showNo) {
extraData.unshift({
id: 0,
title: 'No Label'
}); });
return {
id: label[0].id,
title: label[0].title,
color: color,
duplicate: color.length > 1
};
}).value();
if ($dropdown.hasClass('js-extra-options')) {
var extraData = [];
if (showNo) {
extraData.unshift({
id: 0,
title: 'No Label'
});
}
if (showAny) {
extraData.unshift({
isAny: true,
title: 'Any Label'
});
}
if (extraData.length) {
extraData.push('divider');
data = extraData.concat(data);
}
}
callback(data);
if (showMenuAbove) {
$dropdown.data('glDropdown').positionMenuAbove();
}
});
},
renderRow: function(label, instance) {
var $a, $li, color, colorEl, indeterminate, removesAll, selectedClass, spacing, i, marked, dropdownName, dropdownValue;
$li = $('<li>');
$a = $('<a href="#">');
selectedClass = [];
removesAll = label.id <= 0 || (label.id == null);
if ($dropdown.hasClass('js-filter-bulk-update')) {
indeterminate = $dropdown.data('indeterminate') || [];
marked = $dropdown.data('marked') || [];
if (indeterminate.indexOf(label.id) !== -1) {
selectedClass.push('is-indeterminate');
} }
if (showAny) {
if (marked.indexOf(label.id) !== -1) { extraData.unshift({
// Remove is-indeterminate class if the item will be marked as active isAny: true,
i = selectedClass.indexOf('is-indeterminate'); title: 'Any Label'
if (i !== -1) { });
selectedClass.splice(i, 1);
}
selectedClass.push('is-active');
} }
} else { if (extraData.length) {
if (this.id(label)) { extraData.push('divider');
dropdownName = $dropdown.data('fieldName'); data = extraData.concat(data);
dropdownValue = this.id(label).toString().replace(/'/g, '\\\'');
if ($form.find("input[type='hidden'][name='" + dropdownName + "'][value='" + dropdownValue + "']").length) {
selectedClass.push('is-active');
}
} }
}
if ($dropdown.hasClass('js-multiselect') && removesAll) { callback(data);
selectedClass.push('dropdown-clear-active'); if (showMenuAbove) {
} $dropdown.data('glDropdown').positionMenuAbove();
} }
if (label.duplicate) { });
color = gl.DropdownUtils.duplicateLabelColor(label.color); },
renderRow: function(label, instance) {
var $a, $li, color, colorEl, indeterminate, removesAll, selectedClass, spacing, i, marked, dropdownName, dropdownValue;
$li = $('<li>');
$a = $('<a href="#">');
selectedClass = [];
removesAll = label.id <= 0 || (label.id == null);
if ($dropdown.hasClass('js-filter-bulk-update')) {
indeterminate = $dropdown.data('indeterminate') || [];
marked = $dropdown.data('marked') || [];
if (indeterminate.indexOf(label.id) !== -1) {
selectedClass.push('is-indeterminate');
} }
else {
if (label.color != null) { if (marked.indexOf(label.id) !== -1) {
color = label.color[0]; // Remove is-indeterminate class if the item will be marked as active
i = selectedClass.indexOf('is-indeterminate');
if (i !== -1) {
selectedClass.splice(i, 1);
} }
selectedClass.push('is-active');
} }
if (color) { } else {
colorEl = "<span class='dropdown-label-box' style='background: " + color + "'></span>"; if (this.id(label)) {
} dropdownName = $dropdown.data('fieldName');
else { dropdownValue = this.id(label).toString().replace(/'/g, '\\\'');
colorEl = '';
} if ($form.find("input[type='hidden'][name='" + dropdownName + "'][value='" + dropdownValue + "']").length) {
// We need to identify which items are actually labels selectedClass.push('is-active');
if (label.id) { }
selectedClass.push('label-item');
$a.attr('data-label-id', label.id);
}
$a.addClass(selectedClass.join(' ')).html(colorEl + " " + label.title);
// Return generated html
return $li.html($a).prop('outerHTML');
},
search: {
fields: ['title']
},
selectable: true,
filterable: true,
selected: $dropdown.data('selected') || [],
toggleLabel: function(selected, el) {
var isSelected = el !== null ? el.hasClass('is-active') : false;
var title = selected.title;
var selectedLabels = this.selected;
if (selected.id === 0) {
this.selected = [];
return 'No Label';
} }
else if (isSelected) {
this.selected.push(title); if ($dropdown.hasClass('js-multiselect') && removesAll) {
selectedClass.push('dropdown-clear-active');
} }
else { }
var index = this.selected.indexOf(title); if (label.duplicate) {
this.selected.splice(index, 1); color = gl.DropdownUtils.duplicateLabelColor(label.color);
}
else {
if (label.color != null) {
color = label.color[0];
} }
}
if (color) {
colorEl = "<span class='dropdown-label-box' style='background: " + color + "'></span>";
}
else {
colorEl = '';
}
// We need to identify which items are actually labels
if (label.id) {
selectedClass.push('label-item');
$a.attr('data-label-id', label.id);
}
$a.addClass(selectedClass.join(' ')).html(colorEl + " " + label.title);
// Return generated html
return $li.html($a).prop('outerHTML');
},
search: {
fields: ['title']
},
selectable: true,
filterable: true,
selected: $dropdown.data('selected') || [],
toggleLabel: function(selected, el) {
var isSelected = el !== null ? el.hasClass('is-active') : false;
var title = selected.title;
var selectedLabels = this.selected;
if (selected.id === 0) {
this.selected = [];
return 'No Label';
}
else if (isSelected) {
this.selected.push(title);
}
else {
var index = this.selected.indexOf(title);
this.selected.splice(index, 1);
}
if (selectedLabels.length === 1) {
return selectedLabels;
}
else if (selectedLabels.length) {
return selectedLabels[0] + " +" + (selectedLabels.length - 1) + " more";
}
else {
return defaultLabel;
}
},
fieldName: $dropdown.data('field-name'),
id: function(label) {
if (label.id <= 0) return label.title;
if ($dropdown.hasClass('js-issuable-form-dropdown')) {
return label.id;
}
if (selectedLabels.length === 1) { if ($dropdown.hasClass("js-filter-submit") && (label.isAny == null)) {
return selectedLabels; return label.title;
}
else {
return label.id;
}
},
hidden: function() {
var isIssueIndex, isMRIndex, page, selectedLabels;
page = $('body').attr('data-page');
isIssueIndex = page === 'projects:issues:index';
isMRIndex = page === 'projects:merge_requests:index';
$selectbox.hide();
// display:block overrides the hide-collapse rule
$value.removeAttr('style');
if ($dropdown.hasClass('js-issuable-form-dropdown')) {
return;
}
if ($('html').hasClass('issue-boards-page')) {
return;
}
if ($dropdown.hasClass('js-multiselect')) {
if ($dropdown.hasClass('js-filter-submit') && (isIssueIndex || isMRIndex)) {
selectedLabels = $dropdown.closest('form').find("input:hidden[name='" + ($dropdown.data('fieldName')) + "']");
Issuable.filterResults($dropdown.closest('form'));
} }
else if (selectedLabels.length) { else if ($dropdown.hasClass('js-filter-submit')) {
return selectedLabels[0] + " +" + (selectedLabels.length - 1) + " more"; $dropdown.closest('form').submit();
} }
else { else {
return defaultLabel; if (!$dropdown.hasClass('js-filter-bulk-update')) {
saveLabelData();
}
} }
}, }
fieldName: $dropdown.data('field-name'), },
id: function(label) { multiSelect: $dropdown.hasClass('js-multiselect'),
if (label.id <= 0) return label.title; vue: $dropdown.hasClass('js-issue-board-sidebar'),
clicked: function(options) {
const { $el, e, isMarking } = options;
const label = options.selectedObj;
var isIssueIndex, isMRIndex, page, boardsModel;
var fadeOutLoader = () => {
$loading.fadeOut();
};
if ($dropdown.hasClass('js-issuable-form-dropdown')) { page = $('body').attr('data-page');
return label.id; isIssueIndex = page === 'projects:issues:index';
} isMRIndex = page === 'projects:merge_requests:index';
if ($dropdown.hasClass("js-filter-submit") && (label.isAny == null)) { if ($dropdown.parent().find('.is-active:not(.dropdown-clear-active)').length) {
return label.title; $dropdown.parent()
} .find('.dropdown-clear-active')
else { .removeClass('is-active');
return label.id; }
}
},
hidden: function() {
var isIssueIndex, isMRIndex, page, selectedLabels;
page = $('body').attr('data-page');
isIssueIndex = page === 'projects:issues:index';
isMRIndex = page === 'projects:merge_requests:index';
$selectbox.hide();
// display:block overrides the hide-collapse rule
$value.removeAttr('style');
if ($dropdown.hasClass('js-issuable-form-dropdown')) {
return;
}
if ($('html').hasClass('issue-boards-page')) { if ($dropdown.hasClass('js-issuable-form-dropdown')) {
return; return;
} }
if ($dropdown.hasClass('js-multiselect')) {
if ($dropdown.hasClass('js-filter-submit') && (isIssueIndex || isMRIndex)) {
selectedLabels = $dropdown.closest('form').find("input:hidden[name='" + ($dropdown.data('fieldName')) + "']");
Issuable.filterResults($dropdown.closest('form'));
}
else if ($dropdown.hasClass('js-filter-submit')) {
$dropdown.closest('form').submit();
}
else {
if (!$dropdown.hasClass('js-filter-bulk-update')) {
saveLabelData();
}
}
}
},
multiSelect: $dropdown.hasClass('js-multiselect'),
vue: $dropdown.hasClass('js-issue-board-sidebar'),
clicked: function(options) {
const { $el, e, isMarking } = options;
const label = options.selectedObj;
var isIssueIndex, isMRIndex, page, boardsModel;
var fadeOutLoader = () => {
$loading.fadeOut();
};
page = $('body').attr('data-page');
isIssueIndex = page === 'projects:issues:index';
isMRIndex = page === 'projects:merge_requests:index';
if ($dropdown.parent().find('.is-active:not(.dropdown-clear-active)').length) {
$dropdown.parent()
.find('.dropdown-clear-active')
.removeClass('is-active');
}
if ($dropdown.hasClass('js-issuable-form-dropdown')) { if ($dropdown.hasClass('js-filter-bulk-update')) {
return; _this.enableBulkLabelDropdown();
} _this.setDropdownData($dropdown, isMarking, label.id);
return;
}
if ($dropdown.hasClass('js-filter-bulk-update')) { if ($dropdown.closest('.add-issues-modal').length) {
_this.enableBulkLabelDropdown(); boardsModel = gl.issueBoards.ModalStore.store.filter;
_this.setDropdownData($dropdown, isMarking, label.id); }
return;
}
if ($dropdown.closest('.add-issues-modal').length) { if (boardsModel) {
boardsModel = gl.issueBoards.ModalStore.store.filter; if (label.isAny) {
boardsModel['label_name'] = [];
} else if ($el.hasClass('is-active')) {
boardsModel['label_name'].push(label.title);
} }
if (boardsModel) { e.preventDefault();
if (label.isAny) { return;
boardsModel['label_name'] = []; }
} else if ($el.hasClass('is-active')) { else if ($dropdown.hasClass('js-filter-submit') && (isIssueIndex || isMRIndex)) {
boardsModel['label_name'].push(label.title); if (!$dropdown.hasClass('js-multiselect')) {
} selectedLabel = label.title;
return Issuable.filterResults($dropdown.closest('form'));
e.preventDefault();
return;
} }
else if ($dropdown.hasClass('js-filter-submit') && (isIssueIndex || isMRIndex)) { }
if (!$dropdown.hasClass('js-multiselect')) { else if ($dropdown.hasClass('js-filter-submit')) {
selectedLabel = label.title; return $dropdown.closest('form').submit();
return Issuable.filterResults($dropdown.closest('form')); }
} else if ($dropdown.hasClass('js-issue-board-sidebar')) {
if ($el.hasClass('is-active')) {
gl.issueBoards.BoardsStore.detail.issue.labels.push(new ListLabel({
id: label.id,
title: label.title,
color: label.color[0],
textColor: '#fff'
}));
} }
else if ($dropdown.hasClass('js-filter-submit')) { else {
return $dropdown.closest('form').submit(); var labels = gl.issueBoards.BoardsStore.detail.issue.labels;
labels = labels.filter(function (selectedLabel) {
return selectedLabel.id !== label.id;
});
gl.issueBoards.BoardsStore.detail.issue.labels = labels;
} }
else if ($dropdown.hasClass('js-issue-board-sidebar')) {
if ($el.hasClass('is-active')) {
gl.issueBoards.BoardsStore.detail.issue.labels.push(new ListLabel({
id: label.id,
title: label.title,
color: label.color[0],
textColor: '#fff'
}));
}
else {
var labels = gl.issueBoards.BoardsStore.detail.issue.labels;
labels = labels.filter(function (selectedLabel) {
return selectedLabel.id !== label.id;
});
gl.issueBoards.BoardsStore.detail.issue.labels = labels;
}
$loading.fadeIn(); $loading.fadeIn();
gl.issueBoards.BoardsStore.detail.issue.update($dropdown.attr('data-issue-update'))
.then(fadeOutLoader)
.catch(fadeOutLoader);
}
else {
if ($dropdown.hasClass('js-multiselect')) {
gl.issueBoards.BoardsStore.detail.issue.update($dropdown.attr('data-issue-update'))
.then(fadeOutLoader)
.catch(fadeOutLoader);
} }
else { else {
if ($dropdown.hasClass('js-multiselect')) { return saveLabelData();
}
else {
return saveLabelData();
}
} }
}, }
}); },
// Set dropdown data
_this.setOriginalDropdownData($dropdownContainer, $dropdown);
}); });
this.bindEvents();
}
LabelsSelect.prototype.bindEvents = function() { // Set dropdown data
return $('body').on('change', '.selected_issue', this.onSelectCheckboxIssue); _this.setOriginalDropdownData($dropdownContainer, $dropdown);
}; });
this.bindEvents();
LabelsSelect.prototype.onSelectCheckboxIssue = function() { }
if ($('.selected_issue:checked').length) {
return; bindEvents() {
return $('body').on('change', '.selected_issue', this.onSelectCheckboxIssue);
}
// eslint-disable-next-line class-methods-use-this
onSelectCheckboxIssue() {
if ($('.selected_issue:checked').length) {
return;
}
return $('.issues-bulk-update .labels-filter .dropdown-toggle-text').text('Label');
}
// eslint-disable-next-line class-methods-use-this
enableBulkLabelDropdown() {
IssuableBulkUpdateActions.willUpdateLabels = true;
}
// eslint-disable-next-line class-methods-use-this
setDropdownData($dropdown, isMarking, value) {
var i, markedIds, unmarkedIds, indeterminateIds;
markedIds = $dropdown.data('marked') || [];
unmarkedIds = $dropdown.data('unmarked') || [];
indeterminateIds = $dropdown.data('indeterminate') || [];
if (isMarking) {
markedIds.push(value);
i = indeterminateIds.indexOf(value);
if (i > -1) {
indeterminateIds.splice(i, 1);
} }
return $('.issues-bulk-update .labels-filter .dropdown-toggle-text').text('Label');
};
LabelsSelect.prototype.enableBulkLabelDropdown = function() { i = unmarkedIds.indexOf(value);
IssuableBulkUpdateActions.willUpdateLabels = true; if (i > -1) {
}; unmarkedIds.splice(i, 1);
}
LabelsSelect.prototype.setDropdownData = function($dropdown, isMarking, value) { } else {
var i, markedIds, unmarkedIds, indeterminateIds; // If marked item (not common) is unmarked
i = markedIds.indexOf(value);
markedIds = $dropdown.data('marked') || []; if (i > -1) {
unmarkedIds = $dropdown.data('unmarked') || []; markedIds.splice(i, 1);
indeterminateIds = $dropdown.data('indeterminate') || [];
if (isMarking) {
markedIds.push(value);
i = indeterminateIds.indexOf(value);
if (i > -1) {
indeterminateIds.splice(i, 1);
}
i = unmarkedIds.indexOf(value);
if (i > -1) {
unmarkedIds.splice(i, 1);
}
} else {
// If marked item (not common) is unmarked
i = markedIds.indexOf(value);
if (i > -1) {
markedIds.splice(i, 1);
}
// If an indeterminate item is being unmarked
if (IssuableBulkUpdateActions.getOriginalIndeterminateIds().indexOf(value) > -1) {
unmarkedIds.push(value);
}
// If a marked item is being unmarked
// (a marked item could also be a label that is present in all selection)
if (IssuableBulkUpdateActions.getOriginalCommonIds().indexOf(value) > -1) {
unmarkedIds.push(value);
}
} }
$dropdown.data('marked', markedIds); // If an indeterminate item is being unmarked
$dropdown.data('unmarked', unmarkedIds); if (IssuableBulkUpdateActions.getOriginalIndeterminateIds().indexOf(value) > -1) {
$dropdown.data('indeterminate', indeterminateIds); unmarkedIds.push(value);
}; }
LabelsSelect.prototype.setOriginalDropdownData = function($container, $dropdown) { // If a marked item is being unmarked
var labels = []; // (a marked item could also be a label that is present in all selection)
$container.find('[name="label_name[]"]').map(function() { if (IssuableBulkUpdateActions.getOriginalCommonIds().indexOf(value) > -1) {
return labels.push(this.value); unmarkedIds.push(value);
}); }
$dropdown.data('marked', labels); }
};
return LabelsSelect; $dropdown.data('marked', markedIds);
})(); $dropdown.data('unmarked', unmarkedIds);
}).call(window); $dropdown.data('indeterminate', indeterminateIds);
}
// eslint-disable-next-line class-methods-use-this
setOriginalDropdownData($container, $dropdown) {
const labels = [];
$container.find('[name="label_name[]"]').map(function() {
return labels.push(this.value);
});
$dropdown.data('marked', labels);
}
}
/* eslint-disable func-names, space-before-function-paren, prefer-arrow-callback */ export default function initLogoAnimation() {
window.addEventListener('beforeunload', () => {
(function() {
window.addEventListener('beforeunload', function() {
$('.tanuki-logo').addClass('animate'); $('.tanuki-logo').addClass('animate');
}); });
}).call(window); }
...@@ -55,11 +55,10 @@ import './gl_field_errors'; ...@@ -55,11 +55,10 @@ import './gl_field_errors';
import './gl_form'; import './gl_form';
import initTodoToggle from './header'; import initTodoToggle from './header';
import initImporterStatus from './importer_status'; import initImporterStatus from './importer_status';
import './labels_select';
import './layout_nav'; import './layout_nav';
import LazyLoader from './lazy_loader'; import LazyLoader from './lazy_loader';
import './line_highlighter'; import './line_highlighter';
import './logo'; import initLogoAnimation from './logo';
import './merge_request'; import './merge_request';
import './merge_request_tabs'; import './merge_request_tabs';
import './milestone'; import './milestone';
...@@ -134,6 +133,7 @@ $(function () { ...@@ -134,6 +133,7 @@ $(function () {
initBreadcrumbs(); initBreadcrumbs();
initImporterStatus(); initImporterStatus();
initTodoToggle(); initTodoToggle();
initLogoAnimation();
// Set the default path for all cookies to GitLab's root directory // Set the default path for all cookies to GitLab's root directory
Cookies.defaults.path = gon.relative_url_root || '/'; Cookies.defaults.path = gon.relative_url_root || '/';
......
/* eslint-disable no-new */ /* eslint-disable no-new */
import IssuableContext from '~/issuable_context'; import IssuableContext from '~/issuable_context';
/* global LabelsSelect */ import LabelsSelect from '~/labels_select';
import '~/gl_dropdown'; import '~/gl_dropdown';
import 'select2'; import 'select2';
import '~/api'; import '~/api';
import '~/create_label'; import '~/create_label';
import '~/users_select'; import '~/users_select';
import '~/labels_select';
(() => { (() => {
let saveLabelCount = 0; let saveLabelCount = 0;
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment