reivilibre/TaskBoard
Archived
1
0
Fork 0
Code Issues 1 Pull Requests Projects Releases 2 Wiki Activity

Dev (#284)

Browse Source 
* Added a default color for each board category to be used over the def…

* board.js fix for previous commit

* Feature for integration with Issue Tracking systems loosely based on TortoiseSVN Bugtraq.
This commit is contained in:
ZM-git 2016-05-16 15:51:58 +02:00 committed by Matthew Ross
parent ef90f2a780
commit fedd17af59
13 changed files with 269 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
api/boardRoutes.php
View File

@ -77,6 +77,7 @@ $app->post('/boards/remove', function() use($app, $jsonResponse) {
R::trashAll($board->xownLane);
R::trashAll($board->xownCategory);
R::trashAll($board->xownAutoaction);
R::trashAll($board->xownTracker);
R::trash($board);
R::exec('DELETE from board_user WHERE board_id = ?', array($data->boardId));
$jsonResponse->addAlert('success', 'Removed board ' . $board->name . '.');

17
api/helpers.php
View File

@ -216,6 +216,7 @@ function loadBoardData($board, $data) {
foreach($data->categories as $item) {
$category = R::load('category', $item->id);
$category->name = $item->name;
$category->color = $item->color;
// New category, add it to the board.
if (!$category->id) {
@ -224,6 +225,22 @@ function loadBoardData($board, $data) {
R::store($category);
}
$removeIds = getIdsToRemove($board->xownTracker, $data->trackers);
foreach($removeIds as $id) {
unset($board->xownTracker[$id]);
}
foreach($data->trackers as $item) {
$tracker = R::load('tracker', $item->id);
$tracker->name = $item->name;
$tracker->bugexpr = $item->bugexpr;
// New issue tracker, add it to the board.
if (!$tracker->id) {
$board->xownTracker[] = $tracker;
}
R::store($tracker);
}
// Add or remove users as selected.
for($i = 1; $i < count($data->users); $i++) {
$user = R::load('user', $i);

1
index.html
View File

@ -53,6 +53,7 @@
<script src="lib/angular-route.js"></script>
<script src="lib/angular-sanitize.js"></script>
<script src="lib/ng-context-menu.min.js"></script>
<script src="lib/hyperlink.js"></script>
<script src="lib/marked.min.js"></script>
<script src="lib/prefixfree.min.js"></script>
<script src="lib/spectrum.js"></script>

11
js/controllers/boards.js
View File

@ -23,7 +23,7 @@ function ($scope, $routeParams, $location, $interval, $window,
$scope.alerts = AlertService;
$scope.marked = function(text) {
if (text) {
return $window.marked(text);
return $window.marked(hyperlink(text, $scope.trackers));
} else {
return '';
}
@ -111,6 +111,7 @@ function ($scope, $routeParams, $location, $interval, $window,
$scope.userNames = [];
$scope.laneNames = [];
$scope.categories = [];
$scope.trackers = [];
$scope.currentBoard = {
loading: true,
name: 'Kanban Board App'
@ -189,12 +190,18 @@ function ($scope, $routeParams, $location, $interval, $window,
});
if (board.ownCategory) {
board.ownCategory.unshift({ id: 0, name: 'Uncategorized' });
board.ownCategory.unshift({ id: 0, name: 'Uncategorized', color: '#ffffe0' });
board.ownCategory.forEach(function(category) {
$scope.categories[category.id] = category.name;
});
}
if (board.ownTracker) {
board.ownTracker.forEach(function(tracker) {
$scope.trackers[tracker.id] = [tracker.name, tracker.bugexpr];
});
}
$scope.currentBoard = board;
$scope.boardNames.current = board.id;
boardFound = true;

12
js/controllers/boardsItemView.js
View File

@ -44,6 +44,18 @@ function ($scope, $window, BoardService) {
convertDates($scope.viewItem.ownActivity);
};
$scope.setColor = function(item) {
var color = item.color;
if (item.color != $scope.currentBoard.ownCategory[0].color)
return item.color;
$scope.currentBoard.ownCategory.forEach(function(cat) {
if(cat.id == item.category) {
color = cat.color;
}
});
return color;
}
$scope.openItem = function(item, openModal) {
if (undefined === openModal) {
openModal = true;

5
js/controllers/settingsAutoActions.js
View File

@ -1,11 +1,12 @@
taskBoardControllers.controller('AutomaticActionsCtrl',
['$scope', '$interval', 'BoardService',
function ($scope, $interval, BoardService) {
var defaultColor = '#ffffe0';
$scope.loadingActions = true;
$scope.actions = [];
$scope.secondarySelection = [];
$scope.boardCategories = [{ id: 0, name: 'Uncategorized' }];
$scope.boardCategories = [{ id: 0, name: 'Uncategorized', color: defaultColor }];
$scope.userList = [{ id: 0, name: 'Unassigned', username: 'Unassigned' }];
$scope.actionData = {
@ -79,7 +80,7 @@ function ($scope, $interval, BoardService) {
},
getCategories = function(boardData) {
var categories = [{ id: '0', name: 'Uncategorized' }];
var categories = [{ id: '0', name: 'Uncategorized', color: defaultColor }];
if (boardData && boardData.ownCategory) {
boardData.ownCategory.forEach(function(category) {

131
js/controllers/settingsBoardForm.js
View File

@ -1,6 +1,8 @@
taskBoardControllers.controller('BoardFormSettingsCtrl',
['$scope', 'BoardService',
function ($scope, BoardService) {
var defaultColor = '#ffffe0';
$scope.boardFormData = {
setFocus: false,
boardId: 0,
@ -10,10 +12,15 @@ function ($scope, BoardService) {
laneName: '',
categories: [],
categoryName: '',
color: defaultColor,
users: [],
nameError: false,
lanesError: false,
categoriesError: false,
trackers: [],
trackerName: '',
bugexpr: '',
trackersError: false,
isSaving: false,
updateLanesSorting: function() {
var that = this;
@ -52,7 +59,17 @@ function ($scope, BoardService) {
board.ownCategory.forEach(function(cat) {
that.categories.push({
id: cat.id,
name: cat.name
name: cat.name,
color: cat.color
});
});
}
if (undefined !== board.ownTracker) {
board.ownTracker.forEach(function(trac) {
that.trackers.push({
id: trac.id,
name: trac.name,
bugexpr: trac.bugexpr
});
});
}
@ -67,14 +84,14 @@ function ($scope, BoardService) {
addLane: function() {
this.lanesError = false;
if (this.laneName === '') {
this.setAlert(false, true, false, 'Column name cannot be empty.');
this.setAlert(false, true, false, false, 'Column name cannot be empty.');
return;
}
var that = this;
this.lanes.forEach(function(lane) {
if (that.laneName == lane.name) {
that.setAlert(false, true, false, 'That column name has already been added.');
that.setAlert(false, true, false, false, 'That column name has already been added.');
that.lanesError = true;
}
});
@ -103,14 +120,14 @@ function ($scope, BoardService) {
addCategory: function() {
this.categoriesError = false;
if (this.categoryName === '') {
this.setAlert(false, false, true, 'Category name cannot be empty.');
this.setAlert(false, false, true, false, 'Category name cannot be empty.');
return;
}
var that = this;
this.categories.forEach(function(category) {
if (that.categoryName == category) {
this.setAlert(false, false, true, 'That category name has already been added.');
this.setAlert(false, false, true, false, 'That category name has already been added.');
}
});
@ -118,7 +135,8 @@ function ($scope, BoardService) {
if (!this.categoriesError) {
this.categories.push({
id: 0,
name: this.categoryName
name: this.categoryName,
color: this.color
});
}
this.categoryName = '';
@ -127,16 +145,50 @@ function ($scope, BoardService) {
if (this.isSaving) { return; }
this.categories.splice(this.categories.indexOf(category), 1);
},
addTracker: function() {
this.trackersError = false;
if (this.trackerName === '') {
this.setAlert(false, false, false, true, 'Issue Tracker URL cannot be empty.');
return;
}
if (this.bugexpr === '') {
this.setAlert(false, false, false, true, 'Bug ID regular expression cannot be empty.');
return;
}
var that = this;
this.trackers.forEach(function(tracker) {
if (that.trackerName == tracker) {
this.setAlert(false, false, false, true, 'That Issue Tracker URL has already been added.');
}
});
// Add the new issue tracker (if no error) and reset the input.
if (!this.trackersError) {
this.trackers.push({
id: 0,
name: this.trackerName,
bugexpr: this.bugexpr
});
}
this.trackerName = '';
this.bugexpr = '';
},
removeTracker: function(tracker) {
if (this.isSaving) { return; }
this.trackers.splice(this.trackers.indexOf(tracker), 1);
},
setForSaving: function() {
this.nameError = false;
this.lanesError = false;
this.categoriesError = false;
this.trackersError = false;
this.isSaving = true;
},
setAlert: function(name, lane, cat, message) {
setAlert: function(name, lane, cat, trac, message) {
this.nameError = name;
this.lanesError = lane;
this.categoriesError = cat;
this.trackersError = trac;
this.isSaving = false;
$scope.alerts.showAlert({ 'type': 'error', 'text': message });
},
@ -149,15 +201,24 @@ function ($scope, BoardService) {
this.laneName = '';
this.categories = [];
this.categoryName = '';
this.color = defaultColor;
$('#spectrum').spectrum('enable');
$scope.spectrum(defaultColor);
this.users = [];
this.nameError = false;
this.lanesError = false;
this.categoriesError = false;
this.trackers = [];
this.trackerName = '';
this.bugexpr = '';
this.trackersError = false;
this.isSaving = false;
},
// Uses jQuery to close modal and reset form data.
cancel: function() {
$('.boardModal').modal('hide');
$('#spectrum').spectrum('hide');
$('#spectrum').spectrum('enable');
var that = this;
$('.boardModal').on('hidden.bs.modal', function (e) {
that.reset();
@ -166,8 +227,24 @@ function ($scope, BoardService) {
};
$scope.$parent.boardFormData = $scope.boardFormData;
$scope.spectrum = function(color) {
color = color || defaultColor;
$('#spectrum').spectrum({
color: color,
allowEmpty: false,
localStorageKey: 'taskboard.colorPalette',
showPalette: true,
palette: [ ['#fff', '#ececec', '#ffffe0', '#ffe0fa', '#bee7f4', '#c3f4b5', '#debee8', '#ffdea9', '#ffbaba'] ],
showSelectionPalette: true,
showButtons: false,
showInput: true,
preferredFormat: 'hex3',
});
};
$scope.addBoard = function(boardFormData) {
boardFormData.setForSaving();
$('#spectrum').spectrum('disable');
if (!checkFormInputs(boardFormData)) {
return;
}
@ -186,6 +263,8 @@ function ($scope, BoardService) {
$scope.editBoard = function(boardFormData) {
boardFormData.setForSaving();
$('#spectrum').spectrum('disable');
if (!checkFormInputs(boardFormData)) {
return;
}
@ -202,14 +281,48 @@ function ($scope, BoardService) {
});
};
$scope.editedCategory = {};
$scope.editColor = function(category) {
if ($scope.editedCategory.id === undefined)
{
$scope.editedCategory.id = category.id;
$scope.editedCategory.name = category.name;
$scope.editedCategory.color = $scope.boardFormData.color;
$scope.spectrum(category.color);
}
else if (($scope.editedCategory.id != category.id) &&
($scope.editedCategory.name != category.name))
{
$scope.spectrum()
$scope.editedCategory = {};
}
};
$scope.storeColor = function(e) {
if (e.which === 13) { // Enter key
$scope.boardFormData.categories.forEach(function(cat){
if ((cat.id == $scope.editedCategory.id) &&
(cat.name == $scope.editedCategory.name))
cat.color = $scope.boardFormData.color;
});
$scope.spectrum();
$scope.editedCategory = {};
}
else if (e.which === 27) { // Escape key
$scope.spectrum();
$scope.editedCategory = {};
}
};
var checkFormInputs = function(boardFormData) {
if ('' === boardFormData.name) {
boardFormData.setAlert(true, false, false, 'Board name cannot be empty.');
boardFormData.setAlert(true, false, false, false, 'Board name cannot be empty.');
return false;
}
if (0 === boardFormData.lanes.length) {
boardFormData.setAlert(false, true, false, 'At least one lane is required.');
boardFormData.setAlert(false, true, false, false, 'At least one lane is required.');
return false;
}

2
js/services/board.js
View File

@ -17,6 +17,7 @@ function($http) {
name: boardData.name,
lanes: boardData.lanes,
categories: boardData.categories,
trackers: boardData.trackers,
users: boardData.users
});
},
@ -27,6 +28,7 @@ function($http) {
name: boardData.name,
lanes: boardData.lanes,
categories: boardData.categories,
trackers: boardData.trackers,
users: boardData.users
});
},

33
lib/hyperlink.js Normal file
View File

@ -0,0 +1,33 @@
hyperlink = function(item, trackers) {
var s = item;
var bugId = /%BUGID(?:\\(\d))?%/g;
if (trackers === undefined) return s;
for (i in trackers)
{
var tracker = trackers[i][0];
var bug = trackers[i][1];
if ((tracker == "") || (bug == "")) continue;
var bGroups = bugId.exec(tracker);
var bugEx = new RegExp(bug);
var regEx = new RegExp("(^|\\s|[^\\\\\\?\\/\\-\\[])(" + bug + ")(?=\\W|$)", "mg");
//s = s.replace(regEx, "\$1[\$2]("+tracker.replace(bugId,"\$2")+")");
s = s.replace(regEx, function(match,g1,g2,offset, text){
var m = bugEx.exec(g2);
var r = tracker.replace(bugId, function(match ,p1, offset, text) {
var idx = 0;
if (p1 !== undefined) idx = parseInt(p1);
return m[idx];
});
return g1+"["+g2+"]("+r+")";
});
}
return s;
}

4
partials/board.html
View File

@ -56,11 +56,11 @@
data-ng-class="{'filtered': item.filtered, 'hidden': item.filtered && filter.hide}"
data-ng-repeat="item in lane.ownItem | orderBy:'position':false"
data-ng-dblclick="openItem(item)"
style="background-color: {{ item.color }}"
data-ng-style="{'background-color': setColor(item)}"
data-item-id="{{ item.id }}"
data-context-menu="onContextMenu(lane.id, item)" data-target="itemMenu">
<div class="itemHeader">
<h4>{{ item.title }}</h4>
<h4><span data-ng-bind-html="marked(item.title)"></span></h4>
<span class="badge" title="Points">{{ item.points }}</span>
</div>
<div class="description" data-ng-bind-html="marked(item.description)"></div>

3
partials/boardItemViewModal.html
View File

@ -8,7 +8,8 @@
<span aria-hidden="true" class="fa fa-times"></span>
<span class="sr-only">Close</span>
</button>
<h3 class="modal-title" id="itemViewLabel">{{ viewItem.title }}
<h3 class="modal-title" id="itemViewLabel">
<span data-ng-bind-html="marked(viewItem.title)"></span>
<span data-ng-if="viewItem.points"> - {{ viewItem.points }}</span>
</h3>
</div>

66
partials/settingsBoardModal.html
View File

@ -44,23 +44,85 @@
<h5>Categories</h5>
<ul class="list-group editable">
<li class="list-group-item small" data-ng-class="{ disabled: boardFormData.isSaving }"
data-ng-repeat="category in boardFormData.categories | orderBy:'category':false">
data-ng-repeat="category in boardFormData.categories | orderBy:'category':false"
style="background-color: {{ category.color }}">
<span class="item-text">{{ category.name }}</span>
<span class="links">
<a class="fa fa-trash-o pull-right" title="Remove"
data-ng-click="boardFormData.removeCategory(category)"></a>
<span data-click-to-edit="category.name"
data-ng-click="editColor(category)"
data-ng-keydown="storeColor($event)"
data-ng-disabled="boardFormData.isSaving"></span>
</span>
</li>
</ul>
<input class="form-control wide" type="text" placeholder="Category Name"
<input class="form-control half-width" style="width: 85%;" type="text" placeholder="Category Name"
data-ng-model="boardFormData.categoryName" data-ng-disabled="boardFormData.isSaving">
<input class="form-control half-width" type="text" id="spectrum" data-ng-model="boardFormData.color"
data-on-load-callback="spectrum">
<button type="submit" id="modalAddCategory" class="btn btn-default fa fa-plus"
data-ng-disabled="boardFormData.isSaving"></button>
</form>
</div>
<div class="clearfix"></div>
<div class="form-group short-top" data-ng-class="{ 'has-error': boardFormData.trackersError }">
<form role="form" class="form form-inline" data-ng-submit="boardFormData.addTracker()">
<h5>Issue Trackers</h5>
<p class="small clearfix short-top" data-ng-if="!boardFormData.trackers.length">
<em>
Idea based on <a href="https://tortoisesvn.net/docs/release/TortoiseSVN_en/tsvn-dug-bugtracker.html">TortoiseSVN bugtracker</a>.<br/>
The %BUGID% can have a format of %BUGID\[1-9]% to further specify which group from Bug-ID regular expression is used (whole match is used as a default).<br/><br/>
Example URL: https://github.com/kiswa/TaskBoard/issues/%BUGID\1%<br/>
Example Bug-ID: (?:Issue)?#(\d+)<br/>
Replaces all Bug-ID matched strings within all board's items with hyperlinks to the Issue Tracker's issue.<br/>
#1 -> <a href="https://github.com/kiswa/TaskBoard/issues/1">#1</a> (link to https://github.com/kiswa/TaskBoard/issues/1)<br/>
Issue#2 -> <a href="https://github.com/kiswa/TaskBoard/issues/2">Issue#2</a> (link to https://github.com/kiswa/TaskBoard/issues/2)
</em>
</p>
<ul class="list-group editable">
<li class="list-group-item small" data-ng-class="{ disabled: boardFormData.isSaving }"
data-ng-repeat="tracker in boardFormData.trackers | orderBy:'tracker':false">
<table style="width: 100%;table-layout:fixed;">
<tr>
<td style="width:70%;padding:0px 15px 0px 15px;">
<span class="item-text">{{ tracker.name }}</span>
<span class="links">
<span data-click-to-edit="tracker.name"
data-ng-disabled="boardFormData.isSaving"></span>
</span>
</td>
<td style="padding:0px 15px 0px 15px;border-left: 1px solid lightgray;">
<span class="item-text">{{ tracker.bugexpr }}</span>
<span class="links">
<span data-click-to-edit="tracker.bugexpr"
data-ng-disabled="boardFormData.isSaving"></span>
</span>
</td>
<td style="width:25px;padding:0px 5px 0px 5px;border-left: 1px solid lightgray;">
<span class="links">
<a class="fa fa-trash-o pull-right" title="Remove"
data-ng-click="boardFormData.removeTracker(tracker)"></a>
</span>
</td>
</tr>
</table>
</li>
</ul>
<input class="form-control half-width" style="width: 70%;" type="text" placeholder="Issue Tracker URL. Use %BUGID% as placeholder"
title="Idea based on [https://tortoisesvn.net/docs/release/TortoiseSVN_en/tsvn-dug-bugtracker.html].
The %BUGID% can have a format of %BUGID\[1-9]% to specify which group from BUG-ID regular expression is used (whole match is used as a default).
Example: https://github.com/kiswa/TaskBoard/issues/%BUGID\1%."
data-ng-model="boardFormData.trackerName" data-ng-disabled="boardFormData.isSaving">
<input class="form-control wide" style="width: 25%;" type="text" placeholder="Bug-ID expression"
title="Regular expression to be replaced by Issue Tracker url within the item text.
Example: (?:Issue)?#(\d+)"
data-ng-model="boardFormData.bugexpr" data-ng-disabled="boardFormData.isSaving">
<button type="submit" id="modalAddTracker" class="btn btn-default fa fa-plus"
data-ng-disabled="boardFormData.isSaving"></button>
</form>
</div>
<div class="clearfix"></div>
<div class="form-group short-top">
<h5>Select Users</h5>
<div class="half-width" data-ng-repeat="user in users">

2
partials/settingsBoardTable.html
View File

@ -43,7 +43,7 @@
</td>
<td>
<ul class="list-group">
<li class="list-group-item" data-ng-repeat="category in board.ownCategory | orderBy:'name':false">{{ category.name }}</li>
<li class="list-group-item" data-ng-repeat="category in board.ownCategory | orderBy:'name':false" style="background-color:{{ category.color }}">{{ category.name }}</li>
</ul>
</td>
<td>