opendev/storyboard-webclient
Code Issues Proposed changes

Show a modal when editing worklists in a board

Browse Source 
This allows the existing lanes of a board to be made automatic!

Change-Id: I9e28b8c01b2b15d999fc416939abdd4da556ea3e
This commit is contained in:
Adam Coldrick 2016-04-15 10:40:54 +00:00
parent 8aa490ae6c
commit 3c16be0dbb
5 changed files with 152 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
src/app/boards/controller/board_detail_controller.js
View File

@ -235,19 +235,24 @@ angular.module('sb.board').controller('BoardDetailController',
* create a worklist to represent the lane if one doesn't exist
* already.
*/
$scope.toggleEditLane = function(lane) {
if (lane.worklist.editing) {
if (lane.worklist.id === null) {
lane.worklist.$create().then(function(list) {
lane.list_id = list.id;
$scope.board.$update();
});
} else {
Worklist.update({id: lane.worklist.id},
lane.worklist);
$scope.editWorklist = function(worklist) {
var modalInstance = $modal.open({
size: 'lg',
templateUrl: 'app/worklists/template/new.html',
controller: 'WorklistEditController',
resolve: {
worklist: function() {
return worklist;
},
board: function() {
return $scope.board;
}
}
}
lane.worklist.editing = !lane.worklist.editing;
});
modalInstance.result.finally(function() {
loadBoard();
});
};
/**

18
src/app/boards/template/detail.html
View File

@ -334,22 +334,17 @@
<div as-sortable-item-handle>
<span ng-if="!lane.worklist.editing">
<a ng-class="{'kanban-lane-title': !!lane.worklist.title}"
ng-click="toggleEditLane(lane)">
href="/#!/worklist/{{lane.worklist.id}}">
{{ lane.worklist.title }}
<i class="fa fa-pencil" ng-if="!lane.worklist.title"></i>
</a>
<a href ng-click="editWorklist(lane.worklist)">
<i class="fa fa-pencil"></i>
</a>
<button type="button" class="close" title="Remove"
ng-click="removeLane(lane)">
&times;
</button>
</span>
<input class="form-control"
type="text"
ng-model="lane.worklist.title"
placeholder="Lane Title"
focus
ng-if="lane.worklist.editing"
ng-blur="toggleEditLane(lane)" />
</div>
<div ng-if="lane.worklist.automatic"
ng-include src="'app/boards/template/board_contents/kanban_lane_contents_static.html'">
@ -371,7 +366,10 @@
<div class="kanban-lane" ng-repeat="lane in board.lanes"
ng-if="!lane.worklist.archived"
ng-class="{'kanban-lane-automatic': lane.worklist.automatic}">
<span class="kanban-lane-title">{{ lane.worklist.title }}</span>
<a class="kanban-lane-title"
href="/#!/worklist/{{lane.worklist.id}}">
{{ lane.worklist.title }}
</a>
<div ng-include src="'app/boards/template/board_contents/kanban_lane_contents.html'"
ng-if="(permissions.moveCards || permissions.editBoard) && !lane.worklist.automatic">
</div>

1
src/app/worklists/controller/add_worklist_controller.js
View File

@ -119,4 +119,5 @@ angular.module('sb.worklist').controller('AddWorklistController',
$scope.resourceTypes = ['Story'];
$scope.showAddFilter = true;
$scope.newFilter = angular.copy(blankFilter);
$scope.modalTitle = 'New Worklist';
});

125
src/app/worklists/controller/worklist_edit_controller.js Normal file
View File

@ -0,0 +1,125 @@
/*
* Copyright (c) 2015-2016 Codethink Limited
*
* Licensed under the Apache License, Version 2.0 (the "License"); you may
* not use this file except in compliance with the License. You may obtain
* a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations
* under the License.
*/
/**
* Controller for the "new worklist" modal popup.
*/
angular.module('sb.worklist').controller('WorklistEditController',
function ($scope, $modalInstance, $state, worklist, board, Worklist) {
'use strict';
var blankFilter = {
type: 'Story',
filter_criteria: [{
negative: false,
field: null,
value: null,
title: null
}]
};
/**
* Saves the worklist.
*/
$scope.save = function () {
$scope.isSaving = true;
Worklist.update($scope.worklist, function () {
$scope.isSaving = false;
$modalInstance.dismiss('success');
});
};
/**
* Close this modal without saving.
*/
$scope.close = function () {
$modalInstance.dismiss('cancel');
};
$scope.setType = function(type) {
$scope.newFilter.type = type;
$scope.resourceTypes = [type];
$scope.$broadcast('refresh-types');
};
$scope.setCriterion = function(criterion, tag) {
criterion.field = tag.type;
criterion.value = tag.value.toString();
criterion.title = tag.title;
};
$scope.addCriterion = function(filter) {
filter.filter_criteria.push({
negative: false,
field: null,
value: null,
title: null
});
};
$scope.removeTag = function(criterion) {
if ($scope.newFilter.filter_criteria.length > 1) {
var idx = $scope.newFilter.filter_criteria.indexOf(criterion);
$scope.newFilter.filter_criteria.splice(idx, 1);
} else {
criterion.field = null;
criterion.value = null;
criterion.title = null;
}
};
$scope.checkNewFilter = function() {
var valid = true;
angular.forEach(
$scope.newFilter.filter_criteria,
function(criterion) {
if (criterion.field == null ||
criterion.value == null ||
criterion.title == null) {
valid = false;
}
}
);
return valid;
};
$scope.remove = function(filter) {
var idx = $scope.worklist.filters.indexOf(filter);
Worklist.Filters.delete({
id: $scope.worklist.id,
filter_id: filter.id
});
$scope.worklist.filters.splice(idx, 1);
};
$scope.saveNewFilter = function() {
var added = angular.copy($scope.newFilter);
Worklist.Filters.create(
{id: $scope.worklist.id}, added, function(result) {
$scope.worklist.filters.push(result);
}
);
$scope.showAddFilter = false;
$scope.newFilter = angular.copy(blankFilter);
};
$scope.isSaving = false;
$scope.worklist = worklist;
$scope.resourceTypes = ['Story'];
$scope.showAddFilter = false;
$scope.newFilter = angular.copy(blankFilter);
$scope.modalTitle = 'Edit Worklist';
});

2
src/app/worklists/template/new.html
View File

@ -17,7 +17,7 @@
<div class="panel-heading">
<button type="button" class="close" aria-hidden="true"
ng-click="close()">&times;</button>
<h3 class="panel-title">New Worklist</h3>
<h3 class="panel-title">{{ modalTitle }}</h3>
</div>
<div class="panel-body">
<div class="row">