Add the possibility to set/unset max column height (scrolling)

This commit is contained in:
Frederic Guillot 2015-09-26 18:10:00 -04:00
parent 1fca5e721a
commit 53f4b41008
30 changed files with 117 additions and 29 deletions

View File

@ -18,6 +18,7 @@ Core functionalities moved to plugins:
Improvements:
* Add the possibility to set/unset max column height (column scrolling)
* Show "Open this task" in dropdown menu for closed tasks
* Show assignee on card only when someone is assigned (hide nobody text)
* Highlight selected item in dropdown menus

View File

@ -1016,4 +1016,6 @@ return array(
// 'Version' => '',
// 'Plugins' => '',
// 'There is no plugin loaded.' => '',
// 'Set maximum column height' => '',
// 'Remove maximum column height' => '',
);

View File

@ -1016,4 +1016,6 @@ return array(
// 'Version' => '',
// 'Plugins' => '',
// 'There is no plugin loaded.' => '',
// 'Set maximum column height' => '',
// 'Remove maximum column height' => '',
);

View File

@ -1016,4 +1016,6 @@ return array(
// 'Version' => '',
// 'Plugins' => '',
// 'There is no plugin loaded.' => '',
// 'Set maximum column height' => '',
// 'Remove maximum column height' => '',
);

View File

@ -1016,4 +1016,6 @@ return array(
// 'Version' => '',
// 'Plugins' => '',
// 'There is no plugin loaded.' => '',
// 'Set maximum column height' => '',
// 'Remove maximum column height' => '',
);

View File

@ -1016,4 +1016,6 @@ return array(
// 'Version' => '',
// 'Plugins' => '',
// 'There is no plugin loaded.' => '',
// 'Set maximum column height' => '',
// 'Remove maximum column height' => '',
);

View File

@ -1018,4 +1018,6 @@ return array(
'Version' => 'Version',
'Plugins' => 'Extensions',
'There is no plugin loaded.' => 'Il n\'y a aucune extension chargée.',
'Set maximum column height' => 'Définir la hauteur max. des colonnes',
'Remove maximum column height' => 'Enlever la hauteur max. des colonnes',
);

View File

@ -1016,4 +1016,6 @@ return array(
// 'Version' => '',
// 'Plugins' => '',
// 'There is no plugin loaded.' => '',
// 'Set maximum column height' => '',
// 'Remove maximum column height' => '',
);

View File

@ -1016,4 +1016,6 @@ return array(
// 'Version' => '',
// 'Plugins' => '',
// 'There is no plugin loaded.' => '',
// 'Set maximum column height' => '',
// 'Remove maximum column height' => '',
);

View File

@ -1016,4 +1016,6 @@ return array(
// 'Version' => '',
// 'Plugins' => '',
// 'There is no plugin loaded.' => '',
// 'Set maximum column height' => '',
// 'Remove maximum column height' => '',
);

View File

@ -1016,4 +1016,6 @@ return array(
// 'Version' => '',
// 'Plugins' => '',
// 'There is no plugin loaded.' => '',
// 'Set maximum column height' => '',
// 'Remove maximum column height' => '',
);

View File

@ -1016,4 +1016,6 @@ return array(
// 'Version' => '',
// 'Plugins' => '',
// 'There is no plugin loaded.' => '',
// 'Set maximum column height' => '',
// 'Remove maximum column height' => '',
);

View File

@ -1016,4 +1016,6 @@ return array(
// 'Version' => '',
// 'Plugins' => '',
// 'There is no plugin loaded.' => '',
// 'Set maximum column height' => '',
// 'Remove maximum column height' => '',
);

View File

@ -1016,4 +1016,6 @@ return array(
// 'Version' => '',
// 'Plugins' => '',
// 'There is no plugin loaded.' => '',
// 'Set maximum column height' => '',
// 'Remove maximum column height' => '',
);

View File

@ -1016,4 +1016,6 @@ return array(
// 'Version' => '',
// 'Plugins' => '',
// 'There is no plugin loaded.' => '',
// 'Set maximum column height' => '',
// 'Remove maximum column height' => '',
);

View File

@ -1016,4 +1016,6 @@ return array(
// 'Version' => '',
// 'Plugins' => '',
// 'There is no plugin loaded.' => '',
// 'Set maximum column height' => '',
// 'Remove maximum column height' => '',
);

View File

@ -1016,4 +1016,6 @@ return array(
// 'Version' => '',
// 'Plugins' => '',
// 'There is no plugin loaded.' => '',
// 'Set maximum column height' => '',
// 'Remove maximum column height' => '',
);

View File

@ -1016,4 +1016,6 @@ return array(
// 'Version' => '',
// 'Plugins' => '',
// 'There is no plugin loaded.' => '',
// 'Set maximum column height' => '',
// 'Remove maximum column height' => '',
);

View File

@ -1016,4 +1016,6 @@ return array(
// 'Version' => '',
// 'Plugins' => '',
// 'There is no plugin loaded.' => '',
// 'Set maximum column height' => '',
// 'Remove maximum column height' => '',
);

View File

@ -1016,4 +1016,6 @@ return array(
// 'Version' => '',
// 'Plugins' => '',
// 'There is no plugin loaded.' => '',
// 'Set maximum column height' => '',
// 'Remove maximum column height' => '',
);

View File

@ -1016,4 +1016,6 @@ return array(
// 'Version' => '',
// 'Plugins' => '',
// 'There is no plugin loaded.' => '',
// 'Set maximum column height' => '',
// 'Remove maximum column height' => '',
);

View File

@ -1016,4 +1016,6 @@ return array(
// 'Version' => '',
// 'Plugins' => '',
// 'There is no plugin loaded.' => '',
// 'Set maximum column height' => '',
// 'Remove maximum column height' => '',
);

View File

@ -4,8 +4,8 @@
<th class="board-swimlane-header">
<?php if (! $not_editable): ?>
<a href="#" class="board-swimlane-toggle" data-swimlane-id="<?= $swimlane['id'] ?>">
<i class="fa fa-minus-circle hide-icon-swimlane-<?= $swimlane['id'] ?>"></i>
<i class="fa fa-plus-circle show-icon-swimlane-<?= $swimlane['id'] ?>" style="display: none"></i>
<i class="fa fa-chevron-circle-up hide-icon-swimlane-<?= $swimlane['id'] ?>"></i>
<i class="fa fa-chevron-circle-down show-icon-swimlane-<?= $swimlane['id'] ?>" style="display: none"></i>
</a>
<?php if (! empty($swimlane['description'])): ?>
@ -95,7 +95,7 @@
<div class="board-column-collapsed">
<div class="board-rotation-wrapper">
<div class="board-column-title board-rotation" data-column-id="<?= $column['id'] ?>" title="<?= t('Show this column') ?>">
<?= $this->e($column['title']) ?>
<i class="fa fa-chevron-circle-up tooltip" title="<?= $this->e($column['title']) ?>"></i> <?= $this->e($column['title']) ?>
</div>
</div>
</div>

View File

@ -21,6 +21,14 @@
<i class="fa fa-arrows-h fa-fw"></i> <a href="#" class="filter-toggle-scrolling" title="<?= t('Keyboard shortcut: "%s"', 'c') ?>"><?= t('Horizontal scrolling') ?></a>
</span>
</li>
<li>
<span class="filter-max-height" style="display: none">
<i class="fa fa-arrows-v fa-fw"></i> <a href="#" class="filter-toggle-height"><?= t('Set maximum column height') ?></a>
</span>
<span class="filter-min-height">
<i class="fa fa-arrows-v fa-fw"></i> <a href="#" class="filter-toggle-height"><?= t('Remove maximum column height') ?></a>
</span>
</li>
<?php endif ?>
<?= $this->render('project/dropdown', array('project' => $project)) ?>
</ul>

View File

@ -50,7 +50,7 @@
<?= $this->form->hidden('id', $default_swimlane) ?>
<?= $this->form->label(t('Rename'), 'default_swimlane') ?>
<?= $this->form->text('default_swimlane', $default_swimlane, array(), array('autofocus', 'required', 'maxlength="50"')) ?><br/>
<?= $this->form->text('default_swimlane', $default_swimlane, array(), array('required', 'maxlength="50"')) ?><br/>
<?= $this->form->checkbox('show_default_swimlane', t('Show default swimlane'), 1, isset($default_swimlane['show_default_swimlane']) && $default_swimlane['show_default_swimlane'] == 1) ?>

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -61,10 +61,12 @@ td.board-column-task-collapsed {
.board-rotation-wrapper {
position: relative;
padding: 8px 4px;
min-height: 150px;
overflow: auto;
}
.board-rotation {
min-width: 250px;
white-space: nowrap;
-webkit-backface-visibility: hidden;
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
@ -77,6 +79,10 @@ td.board-column-task-collapsed {
}
/* column header */
.board-column-title {
cursor: pointer;
}
.board-add-icon {
float: left;
padding: 0 5px;
@ -125,6 +131,7 @@ a.board-swimlane-toggle {
/* board task list */
.board-task-list {
overflow: auto;
min-height: 60px;
}
.board-task-list-limit {

File diff suppressed because one or more lines are too long

View File

@ -8,13 +8,13 @@ Board.prototype.execute = function() {
this.app.swimlane.listen();
this.restoreColumnViewMode();
this.compactView();
this.columnScrolling();
this.poll();
this.keyboardShortcuts();
this.resizeColumnHeight();
this.listen();
this.dragAndDrop();
$(window).resize(this.resizeColumnHeight);
$(window).resize(this.columnScrolling);
};
Board.prototype.poll = function() {
@ -85,7 +85,7 @@ Board.prototype.refresh = function(data) {
this.app.refresh();
this.app.swimlane.refresh();
this.app.swimlane.listen();
this.resizeColumnHeight();
this.columnScrolling();
this.app.hideLoadingIcon();
this.listen();
this.dragAndDrop();
@ -93,22 +93,6 @@ Board.prototype.refresh = function(data) {
this.restoreColumnViewMode();
};
Board.prototype.resizeColumnHeight = function() {
if ($(".board-swimlane").length > 1) {
$(".board-task-list").each(function() {
if ($(this).height() > 500) {
$(this).height(500);
}
else {
$(this).css("min-height", 320); // Min height is the height of the menu dropdown
}
});
}
else {
$(".board-task-list").height($(window).height() - 145);
}
};
Board.prototype.dragAndDrop = function() {
var self = this;
var params = {
@ -155,11 +139,58 @@ Board.prototype.listen = function() {
self.toggleCompactView();
});
$(document).on('click', ".filter-toggle-height", function(e) {
e.preventDefault();
self.toggleColumnScrolling();
});
$(document).on("click", ".board-column-title", function() {
self.toggleColumnViewMode($(this).data("column-id"));
});
};
Board.prototype.toggleColumnScrolling = function() {
var scrolling = localStorage.getItem("column_scroll") || 1;
localStorage.setItem("column_scroll", scrolling == 0 ? 1 : 0);
this.columnScrolling();
};
Board.prototype.columnScrolling = function() {
if (localStorage.getItem("column_scroll") == 0) {
$(".filter-max-height").show();
$(".filter-min-height").hide();
$(".board-task-list").each(function() {
$(this).css("min-height", 80);
$(this).css("height", '');
$(".board-rotation-wrapper").css("min-height", '');
});
}
else {
$(".filter-max-height").hide();
$(".filter-min-height").show();
if ($(".board-swimlane").length > 1) {
$(".board-task-list").each(function() {
if ($(this).height() > 500) {
$(this).css("height", 500);
}
else {
$(this).css("min-height", 320); // Height of the dropdown menu
$(".board-rotation-wrapper").css("min-height", 320);
}
});
}
else {
var height = $(window).height() - 145;
$(".board-task-list").css("height", height);
$(".board-rotation-wrapper").css("min-height", height);
}
}
};
Board.prototype.toggleCompactView = function() {
var scrolling = localStorage.getItem("horizontal_scroll") || 1;
localStorage.setItem("horizontal_scroll", scrolling == 0 ? 1 : 0);
@ -233,7 +264,6 @@ Board.prototype.hideColumn = function(columnId) {
});
$(".board-column-" + columnId + " .board-rotation").each(function() {
var position = $(".board-swimlane").position();
$(this).css("width", $(".board-column-" + columnId + "").height());
});