Expose tags to the user interface (first prototype)

This commit is contained in:
Frederic Guillot 2016-06-24 15:43:34 -04:00
parent b2e92480c2
commit 18cb7ad0a4
No known key found for this signature in database
GPG Key ID: 92D77191BA7FBC99
26 changed files with 296 additions and 167 deletions

View File

@ -98,6 +98,7 @@ class TaskModificationController extends BaseController
'values' => $values,
'errors' => $errors,
'task' => $task,
'tags' => $this->taskTagModel->getList($task['id']),
'users_list' => $this->projectUserRoleModel->getAssignableUsersList($task['project_id']),
'colors_list' => $this->colorModel->getList(),
'categories_list' => $this->categoryModel->getList($task['project_id']),

View File

@ -45,6 +45,7 @@ class TaskViewController extends BaseController
'task' => $task,
'columns_list' => $this->columnModel->getList($task['project_id']),
'colors_list' => $this->colorModel->getList(),
'tags' => $this->taskTagModel->getList($task['id']),
'title' => $task['title'],
'no_layout' => true,
'auto_refresh' => true,
@ -82,6 +83,7 @@ class TaskViewController extends BaseController
'internal_links' => $this->taskLinkModel->getAllGroupedByLabel($task['id']),
'external_links' => $this->taskExternalLinkModel->getAll($task['id']),
'link_label_list' => $this->linkModel->getList(0, false),
'tags' => $this->taskTagModel->getList($task['id']),
)));
}

View File

@ -40,6 +40,34 @@ class TaskHelper extends Base
return $this->taskModel->getRecurrenceBasedateList();
}
public function selectTitle(array $values, array $errors)
{
$html = $this->helper->form->label(t('Title'), 'title');
$html .= $this->helper->form->text('title', $values, $errors, array('autofocus', 'required', 'maxlength="200"', 'tabindex="1"'), 'form-input-large');
return $html;
}
public function selectTags(array $project, array $tags = array())
{
$options = $this->tagModel->getAssignableList($project['id']);
$html = $this->helper->form->label(t('Tags'), 'tags[]');
$html .= '<select name="tags[]" id="form-tags" class="tag-autocomplete" multiple>';
foreach ($options as $tag) {
$html .= sprintf(
'<option value="%s" %s>%s</option>',
$this->helper->text->e($tag),
in_array($tag, $tags) ? 'selected="selected"' : '',
$this->helper->text->e($tag)
);
}
$html .= '</select>';
return $html;
}
public function selectAssignee(array $users, array $values, array $errors = array(), array $attributes = array())
{
$attributes = array_merge(array('tabindex="3"'), $attributes);

View File

@ -42,6 +42,24 @@ class TagModel extends Base
return $this->db->table(self::TABLE)->eq('project_id', $project_id)->asc('name')->findAll();
}
/**
* Get assignable tags for a project
*
* @access public
* @param integer $project_id
* @return array
*/
public function getAssignableList($project_id)
{
return $this->db->hashtable(self::TABLE)
->beginOr()
->eq('project_id', $project_id)
->eq('project_id', 0)
->closeOr()
->asc('name')
->getAll('id', 'name');
}
/**
* Get one tag
*

View File

@ -22,11 +22,13 @@ class TaskCreationModel extends Base
*/
public function create(array $values)
{
if (! $this->projectModel->exists($values['project_id'])) {
return 0;
}
$position = empty($values['position']) ? 0 : $values['position'];
$tags = array();
if (isset($values['tags'])) {
$tags = $values['tags'];
unset($values['tags']);
}
$this->prepare($values);
$task_id = $this->db->table(TaskModel::TABLE)->persist($values);
@ -36,6 +38,10 @@ class TaskCreationModel extends Base
$this->taskPositionModel->movePosition($values['project_id'], $task_id, $values['column_id'], $position, $values['swimlane_id'], false);
}
if (! empty($tags)) {
$this->taskTagModel->save($values['project_id'], $task_id, $tags);
}
$this->fireEvents($task_id, $values);
}

View File

@ -85,6 +85,11 @@ class TaskModificationModel extends Base
*/
public function prepare(array &$values)
{
if (isset($values['tags'])) {
$this->taskTagModel->save($values['project_id'], $values['id'], $values['tags']);
unset($values['tags']);
}
$values = $this->dateParser->convert($values, array('date_due'));
$values = $this->dateParser->convert($values, array('date_started'), true);

View File

@ -18,6 +18,16 @@
</div>
<?php endif ?>
<?php if (! empty($task['tags'])): ?>
<div class="task-tags">
<ul>
<?php foreach ($task['tags'] as $tag): ?>
<li><?= $this->text->e($tag['name']) ?></li>
<?php endforeach ?>
</ul>
</div>
<?php endif ?>
<div class="task-board-icons">
<?php if ($task['score']): ?>
<span class="task-score" title="<?= t('Complexity') ?>">

View File

@ -4,146 +4,157 @@
<?= $this->hook->render('template:task:details:top', array('task' => $task)) ?>
<div class="task-summary-container color-<?= $task['color_id'] ?>">
<div class="task-summary-column">
<ul class="no-bullet">
<li>
<strong><?= t('Status:') ?></strong>
<span>
<?php if ($task['is_active'] == 1): ?>
<?= t('open') ?>
<?php else: ?>
<?= t('closed') ?>
<div class="task-summary-columns">
<div class="task-summary-column">
<ul class="no-bullet">
<li>
<strong><?= t('Status:') ?></strong>
<span>
<?php if ($task['is_active'] == 1): ?>
<?= t('open') ?>
<?php else: ?>
<?= t('closed') ?>
<?php endif ?>
</span>
</li>
<li>
<strong><?= t('Priority:') ?></strong> <span><?= $task['priority'] ?></span>
</li>
<?php if (! empty($task['reference'])): ?>
<li>
<strong><?= t('Reference:') ?></strong> <span><?= $this->text->e($task['reference']) ?></span>
</li>
<?php endif ?>
</span>
</li>
<li>
<strong><?= t('Priority:') ?></strong> <span><?= $task['priority'] ?></span>
</li>
<?php if (! empty($task['reference'])): ?>
<li>
<strong><?= t('Reference:') ?></strong> <span><?= $this->text->e($task['reference']) ?></span>
</li>
<?php endif ?>
<?php if (! empty($task['score'])): ?>
<li>
<strong><?= t('Complexity:') ?></strong> <span><?= $this->text->e($task['score']) ?></span>
</li>
<?php endif ?>
<?php if ($project['is_public']): ?>
<li class="smaller">
<i class="fa fa-external-link fa-fw"></i>
<?= $this->url->link(t('Public link'), 'TaskViewController', 'readonly', array('task_id' => $task['id'], 'token' => $project['token']), false, '', '', true) ?>
</li>
<?php endif ?>
<?php if ($project['is_public'] && !$editable): ?>
<li class="smaller">
<i class="fa fa-th fa-fw"></i>
<?= $this->url->link(t('Back to the board'), 'BoardViewController', 'readonly', array('token' => $project['token'])) ?>
</li>
<?php endif ?>
<li class="smaller">
<?= $this->hook->render('template:task:details:first-column', array('task' => $task)) ?>
</ul>
</div>
<div class="task-summary-column">
<ul class="no-bullet">
<?php if (! empty($task['category_name'])): ?>
<li>
<strong><?= t('Category:') ?></strong>
<span><?= $this->text->e($task['category_name']) ?></span>
</li>
<?php endif ?>
<?php if (! empty($task['swimlane_name'])): ?>
<li>
<strong><?= t('Swimlane:') ?></strong>
<span><?= $this->text->e($task['swimlane_name']) ?></span>
</li>
<?php endif ?>
<li>
<strong><?= t('Column:') ?></strong>
<span><?= $this->text->e($task['column_title']) ?></span>
</li>
<li>
<strong><?= t('Position:') ?></strong>
<span><?= $task['position'] ?></span>
</li>
<?= $this->hook->render('template:task:details:second-column', array('task' => $task)) ?>
</ul>
</div>
<div class="task-summary-column">
<ul class="no-bullet">
<li>
<strong><?= t('Assignee:') ?></strong>
<span>
<?php if ($task['assignee_username']): ?>
<?= $this->text->e($task['assignee_name'] ?: $task['assignee_username']) ?>
<?php else: ?>
<?= t('not assigned') ?>
<?php if (! empty($task['score'])): ?>
<li>
<strong><?= t('Complexity:') ?></strong> <span><?= $this->text->e($task['score']) ?></span>
</li>
<?php endif ?>
</span>
</li>
<?php if ($task['creator_username']): ?>
<li>
<strong><?= t('Creator:') ?></strong>
<span><?= $this->text->e($task['creator_name'] ?: $task['creator_username']) ?></span>
<?php if ($project['is_public']): ?>
<li class="smaller">
<i class="fa fa-external-link fa-fw"></i>
<?= $this->url->link(t('Public link'), 'TaskViewController', 'readonly', array('task_id' => $task['id'], 'token' => $project['token']), false, '', '', true) ?>
</li>
<?php endif ?>
<?php if ($task['date_due']): ?>
<li>
<strong><?= t('Due date:') ?></strong>
<span><?= $this->dt->date($task['date_due']) ?></span>
</li>
<?php endif ?>
<?php if ($task['time_estimated']): ?>
<li>
<strong><?= t('Time estimated:') ?></strong>
<span><?= t('%s hours', $task['time_estimated']) ?></span>
</li>
<?php endif ?>
<?php if ($task['time_spent']): ?>
<li>
<strong><?= t('Time spent:') ?></strong>
<span><?= t('%s hours', $task['time_spent']) ?></span>
</li>
<?php endif ?>
<?php endif ?>
<?php if ($project['is_public'] && !$editable): ?>
<li class="smaller">
<i class="fa fa-th fa-fw"></i>
<?= $this->url->link(t('Back to the board'), 'BoardViewController', 'readonly', array('token' => $project['token'])) ?>
</li>
<?php endif ?>
<li class="smaller">
<?= $this->hook->render('template:task:details:third-column', array('task' => $task)) ?>
</ul>
</div>
<div class="task-summary-column">
<ul class="no-bullet">
<li>
<strong><?= t('Created:') ?></strong>
<span><?= $this->dt->datetime($task['date_creation']) ?></span>
</li>
<li>
<strong><?= t('Modified:') ?></strong>
<span><?= $this->dt->datetime($task['date_modification']) ?></span>
</li>
<?php if ($task['date_completed']): ?>
<li>
<strong><?= t('Completed:') ?></strong>
<span><?= $this->dt->datetime($task['date_completed']) ?></span>
</li>
<?php endif ?>
<?php if ($task['date_started']): ?>
<li>
<strong><?= t('Started:') ?></strong>
<span><?= $this->dt->datetime($task['date_started']) ?></span>
</li>
<?php endif ?>
<?php if ($task['date_moved']): ?>
<li>
<strong><?= t('Moved:') ?></strong>
<span><?= $this->dt->datetime($task['date_moved']) ?></span>
</li>
<?php endif ?>
<?= $this->hook->render('template:task:details:first-column', array('task' => $task)) ?>
</ul>
</div>
<div class="task-summary-column">
<ul class="no-bullet">
<?php if (! empty($task['category_name'])): ?>
<li>
<strong><?= t('Category:') ?></strong>
<span><?= $this->text->e($task['category_name']) ?></span>
</li>
<?php endif ?>
<?php if (! empty($task['swimlane_name'])): ?>
<li>
<strong><?= t('Swimlane:') ?></strong>
<span><?= $this->text->e($task['swimlane_name']) ?></span>
</li>
<?php endif ?>
<li>
<strong><?= t('Column:') ?></strong>
<span><?= $this->text->e($task['column_title']) ?></span>
</li>
<li>
<strong><?= t('Position:') ?></strong>
<span><?= $task['position'] ?></span>
</li>
<?= $this->hook->render('template:task:details:fourth-column', array('task' => $task)) ?>
</ul>
<?= $this->hook->render('template:task:details:second-column', array('task' => $task)) ?>
</ul>
</div>
<div class="task-summary-column">
<ul class="no-bullet">
<li>
<strong><?= t('Assignee:') ?></strong>
<span>
<?php if ($task['assignee_username']): ?>
<?= $this->text->e($task['assignee_name'] ?: $task['assignee_username']) ?>
<?php else: ?>
<?= t('not assigned') ?>
<?php endif ?>
</span>
</li>
<?php if ($task['creator_username']): ?>
<li>
<strong><?= t('Creator:') ?></strong>
<span><?= $this->text->e($task['creator_name'] ?: $task['creator_username']) ?></span>
</li>
<?php endif ?>
<?php if ($task['date_due']): ?>
<li>
<strong><?= t('Due date:') ?></strong>
<span><?= $this->dt->date($task['date_due']) ?></span>
</li>
<?php endif ?>
<?php if ($task['time_estimated']): ?>
<li>
<strong><?= t('Time estimated:') ?></strong>
<span><?= t('%s hours', $task['time_estimated']) ?></span>
</li>
<?php endif ?>
<?php if ($task['time_spent']): ?>
<li>
<strong><?= t('Time spent:') ?></strong>
<span><?= t('%s hours', $task['time_spent']) ?></span>
</li>
<?php endif ?>
<?= $this->hook->render('template:task:details:third-column', array('task' => $task)) ?>
</ul>
</div>
<div class="task-summary-column">
<ul class="no-bullet">
<li>
<strong><?= t('Created:') ?></strong>
<span><?= $this->dt->datetime($task['date_creation']) ?></span>
</li>
<li>
<strong><?= t('Modified:') ?></strong>
<span><?= $this->dt->datetime($task['date_modification']) ?></span>
</li>
<?php if ($task['date_completed']): ?>
<li>
<strong><?= t('Completed:') ?></strong>
<span><?= $this->dt->datetime($task['date_completed']) ?></span>
</li>
<?php endif ?>
<?php if ($task['date_started']): ?>
<li>
<strong><?= t('Started:') ?></strong>
<span><?= $this->dt->datetime($task['date_started']) ?></span>
</li>
<?php endif ?>
<?php if ($task['date_moved']): ?>
<li>
<strong><?= t('Moved:') ?></strong>
<span><?= $this->dt->datetime($task['date_moved']) ?></span>
</li>
<?php endif ?>
<?= $this->hook->render('template:task:details:fourth-column', array('task' => $task)) ?>
</ul>
</div>
</div>
<?php if (! empty($tags)): ?>
<div class="task-tags">
<ul>
<?php foreach ($tags as $tag): ?>
<li><?= $this->text->e($tag) ?></li>
<?php endforeach ?>
</ul>
</div>
<?php endif ?>
</div>
<?php if ($editable && empty($task['date_started'])): ?>

View File

@ -1,5 +1,10 @@
<section id="main" class="public-task">
<?= $this->render('task/details', array('task' => $task, 'project' => $project, 'editable' => false)) ?>
<?= $this->render('task/details', array(
'task' => $task,
'tags' => $tags,
'project' => $project,
'editable' => false,
)) ?>
<?= $this->render('task/description', array(
'task' => $task,

View File

@ -2,6 +2,7 @@
<?= $this->render('task/details', array(
'task' => $task,
'tags' => $tags,
'project' => $project,
'editable' => $this->user->hasProjectAccess('TaskModificationController', 'edit', $project['id']),
)) ?>

View File

@ -7,8 +7,7 @@
<?= $this->form->csrf() ?>
<div class="form-column">
<?= $this->form->label(t('Title'), 'title') ?>
<?= $this->form->text('title', $values, $errors, array('autofocus', 'required', 'maxlength="200"', 'tabindex="1"'), 'form-input-large') ?>
<?= $this->task->selectTitle($values, $errors) ?>
<?= $this->form->label(t('Description'), 'description') ?>
<?= $this->form->textarea(
@ -23,6 +22,7 @@
'markdown-editor'
) ?>
<?= $this->task->selectTags($project) ?>
<?= $this->render('task/color_picker', array('colors_list' => $colors_list, 'values' => $values)) ?>
<?php if (! isset($duplicate)): ?>

View File

@ -8,12 +8,11 @@
<?= $this->form->hidden('position', $values) ?>
<div class="form-column">
<?= $this->form->label(t('Title'), 'title') ?>
<?= $this->form->text('title', $values, $errors, array('autofocus', 'required', 'maxlength="200"', 'tabindex="1"'), 'form-input-large') ?>
<?= $this->task->selectTitle($values, $errors) ?>
<?= $this->form->label(t('Description'), 'description') ?>
<?= $this->form->textarea('description', $values, $errors, array('placeholder="'.t('Leave a description').'"', 'tabindex="2"'), 'markdown-editor') ?>
<?= $this->task->selectTags($project) ?>
<?= $this->render('task/color_picker', array('colors_list' => $colors_list, 'values' => $values)) ?>
</div>

View File

@ -7,8 +7,8 @@
<?= $this->form->hidden('project_id', $values) ?>
<div class="form-column">
<?= $this->form->label(t('Title'), 'title') ?>
<?= $this->form->text('title', $values, $errors, array('autofocus', 'required', 'maxlength="200"', 'tabindex="1"')) ?>
<?= $this->task->selectTitle($values, $errors) ?>
<?= $this->task->selectTags($project, $tags) ?>
<?= $this->task->selectAssignee($users_list, $values, $errors) ?>
<?= $this->task->selectCategory($categories_list, $values, $errors) ?>
<?= $this->task->selectPriority($project, $values) ?>

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -157,16 +157,3 @@ div.draggable-item-selected {
float: left;
padding-right: 5px;
}
/* board saving state */
.task-board-saving-state {
opacity: 0.3;
}
.task-board-saving-icon {
position: absolute;
margin: auto;
width: 100%;
text-align: center;
color: #000;
}

View File

@ -61,6 +61,15 @@ select:focus {
outline: 0;
}
.tag-autocomplete {
width: 400px;
}
span.select2-container {
margin-top: 3px;
margin-bottom: 10px;
}
::-webkit-input-placeholder {
color: #ddd;
padding-top: 2px;
@ -169,7 +178,6 @@ input.form-input-large {
margin-top: 8%;
}
.form-column li,
.form-login li {
margin-left: 25px;
line-height: 25px;

View File

@ -53,6 +53,19 @@ div.task-board-status-closed {
text-overflow: ellipsis;
}
/* board saving state */
.task-board-saving-state {
opacity: 0.3;
}
.task-board-saving-icon {
position: absolute;
margin: auto;
width: 100%;
text-align: center;
color: #000;
}
/* title one the card */
.task-board-title {
font-size: 1.15em;
@ -83,6 +96,21 @@ div.task-board-status-closed {
opacity: 0.6;
}
/* tags list */
.task-tags li {
display: inline;
margin: 0;
margin-right: 4px;
padding: 2px;
color: #666;
border: 1px solid #666;
border-radius: 2px;
}
.task-summary-container .task-tags {
margin-top: 10px;
}
/* avatars on the card */
.task-board-avatars {
text-align: right;
@ -181,6 +209,9 @@ span.task-board-age-column {
border: 2px solid #000;
border-radius: 8px;
padding: 15px;
}
.task-summary-columns {
display: -webkit-flex;
display: flex;
-webkit-flex-direction: row;

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -35,6 +35,7 @@ Kanboard.App.prototype.execute = function() {
this.keyboardShortcuts();
this.datePicker();
this.autoComplete();
this.tagAutoComplete();
};
Kanboard.App.prototype.keyboardShortcuts = function() {
@ -131,6 +132,12 @@ Kanboard.App.prototype.datePicker = function() {
});
};
Kanboard.App.prototype.tagAutoComplete = function() {
$(".tag-autocomplete").select2({
tags: true
})
};
Kanboard.App.prototype.autoComplete = function() {
$(".autocomplete").each(function() {
var input = $(this);

View File

@ -147,4 +147,5 @@ Kanboard.Popover.prototype.afterOpen = function() {
this.app.datePicker();
this.app.autoComplete();
this.app.tagAutoComplete();
};

File diff suppressed because one or more lines are too long

View File

@ -19,6 +19,7 @@
"simplemde": "^1.10.1",
"font-awesome": "fontawesome#^4.6.3",
"d3": "~3.5.0",
"isMobile": "0.4.0"
"isMobile": "0.4.0",
"select2": "^4.0.3"
}
}

View File

@ -63,6 +63,7 @@ var vendor = {
'bower_components/jquery-ui/themes/base/jquery-ui.min.css',
'bower_components/jqueryui-timepicker-addon/dist/jquery-ui-timepicker-addon.min.css',
'bower_components/chosen/chosen.css',
'bower_components/select2/dist/css/select2.min.css',
'bower_components/fullcalendar/dist/fullcalendar.min.css',
'bower_components/simplemde/dist/simplemde.min.css',
'bower_components/font-awesome/css/font-awesome.min.css',
@ -84,6 +85,7 @@ var vendor = {
'bower_components/jqueryui-timepicker-addon/dist/i18n/jquery-ui-timepicker-addon-i18n.min.js',
'bower_components/jqueryui-touch-punch/jquery.ui.touch-punch.min.js',
'bower_components/chosen/chosen.jquery.js',
'bower_components/select2/dist/js/select2.min.js',
'bower_components/moment/min/moment-with-locales.min.js',
'bower_components/fullcalendar/dist/fullcalendar.min.js',
'bower_components/fullcalendar/dist/lang-all.js',

View File

@ -4,6 +4,7 @@ use Kanboard\Filter\TaskTagFilter;
use Kanboard\Model\ProjectModel;
use Kanboard\Model\TaskCreationModel;
use Kanboard\Model\TaskFinderModel;
use Kanboard\Model\TaskModel;
use Kanboard\Model\TaskTagModel;
require_once __DIR__.'/../Base.php';
@ -32,7 +33,7 @@ class TaskTagFilterTest extends Base
$filter->withValue('my tag 3');
$filter->apply();
$tasks = $query->findAll();
$tasks = $query->asc(TaskModel::TABLE.'.title')->findAll();
$this->assertCount(2, $tasks);
$this->assertEquals('test1', $tasks[0]['title']);
$this->assertEquals('test2', $tasks[1]['title']);
@ -113,7 +114,7 @@ class TaskTagFilterTest extends Base
$filter->withValue('my tag');
$filter->apply();
$tasks = $query->findAll();
$tasks = $query->asc(TaskModel::TABLE.'.title')->findAll();
$this->assertCount(2, $tasks);
$this->assertEquals('test1', $tasks[0]['title']);
$this->assertEquals('test2', $tasks[1]['title']);