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

ChangeLog

@@ -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

app/Locale/cs_CZ/translations.php

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

app/Locale/da_DK/translations.php

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

app/Locale/de_DE/translations.php

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

app/Locale/es_ES/translations.php

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

app/Locale/fi_FI/translations.php

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

app/Locale/fr_FR/translations.php

@@ -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',
 );

app/Locale/hu_HU/translations.php

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

app/Locale/id_ID/translations.php

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

app/Locale/it_IT/translations.php

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

app/Locale/ja_JP/translations.php

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

app/Locale/nb_NO/translations.php

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

app/Locale/nl_NL/translations.php

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

app/Locale/pl_PL/translations.php

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

app/Locale/pt_BR/translations.php

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

app/Locale/pt_PT/translations.php

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

app/Locale/ru_RU/translations.php

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

app/Locale/sr_Latn_RS/translations.php

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

app/Locale/sv_SE/translations.php

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

app/Locale/th_TH/translations.php

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

app/Locale/tr_TR/translations.php

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

app/Locale/zh_CN/translations.php

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

app/Template/board/table_swimlane.php

@@ -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-chevron-circle-up 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-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>

app/Template/project/filters.php

@@ -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>

app/Template/swimlane/index.php

@@ -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) ?>
 

assets/css/src/board.css

@@ -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 {

assets/js/src/Board.js

@@ -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());
     });