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

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