Change swimlane layout to save space on the screen

8 files changed, 123 insertions, 106 deletions

diff --git a/app/Controller/Board.php b/app/Controller/Board.php
index a552b9cf..0de6f297 100644
--- a/app/Controller/Board.php
+++ b/app/Controller/Board.php
@@ -27,7 +27,7 @@ class Board extends Base
         }
 
         // Display the board with a specific layout
-        $this->response->html($this->template->layout('board/public_view', array(
+        $this->response->html($this->template->layout('board/view_public', array(
             'project' => $project,
             'swimlanes' => $this->board->getBoard($project['id']),
             'title' => $project['name'],
@@ -49,7 +49,7 @@ class Board extends Base
     {
         $params = $this->getProjectFilters('board', 'show');
 
-        $this->response->html($this->template->layout('board/private_view', array(
+        $this->response->html($this->template->layout('board/view_private', array(
             'categories_list' => $this->category->getList($params['project']['id'], false),
             'users_list' => $this->projectPermission->getMemberList($params['project']['id'], false),
             'swimlanes' => $this->taskFilter->search($params['filters']['search'])->getBoard($params['project']['id']),
diff --git a/app/Template/board/table_column.php b/app/Template/board/table_column.php
new file mode 100644
index 00000000..bfb18a26
--- /dev/null
+++ b/app/Template/board/table_column.php
@@ -0,0 +1,51 @@
+<!-- column titles -->
+<?php  ?>
+<tr>
+    <?php foreach ($swimlane['columns'] as $column): ?>
+    <th class="board-column-header board-column-header-<?= $column['id'] ?>" data-column-id="<?= $column['id'] ?>">
+
+        <!-- column in collapsed mode -->
+        <div class="board-column-collapsed">
+            <span title="<?= t('Task count') ?>" class="board-column-header-task-count" title="<?= t('Show this column') ?>">
+                <span id="task-number-column-<?= $column['id'] ?>"><?= $column['nb_tasks'] ?></span>
+            </span>
+        </div>
+
+        <!-- column in expanded mode -->
+        <div class="board-column-expanded">
+            <?php if (! $not_editable): ?>
+                <div class="board-add-icon">
+                    <?= $this->url->link('+', 'taskcreation', 'create', array('project_id' => $column['project_id'], 'column_id' => $column['id'], 'swimlane_id' => $swimlane['id']), false, 'popover', t('Add a new task')) ?>
+                </div>
+            <?php endif ?>
+
+            <span class="board-column-title" data-column-id="<?= $column['id'] ?>" title="<?= t('Hide this column') ?>">
+                <?= $this->e($column['title']) ?>
+            </span>
+
+            <?php if (! $not_editable && ! empty($column['description'])): ?>
+                <span class="tooltip pull-right" title='<?= $this->e($this->text->markdown($column['description'])) ?>'>
+                    <i class="fa fa-info-circle"></i>
+                </span>
+            <?php endif ?>
+
+            <?php if (! empty($column['score'])): ?>
+                <span class="pull-right" title="<?= t('Score') ?>">
+                    <?= $column['score'] ?>&nbsp;
+                </span>
+            <?php endif ?>
+
+            <?php if ($column['task_limit']): ?>
+                <span title="<?= t('Task limit') ?>">
+                    (<span id="task-number-column-<?= $column['id'] ?>"><?= $column['nb_tasks'] ?></span>/<?= $this->e($column['task_limit']) ?>)
+                </span>
+            <?php else: ?>
+                <span title="<?= t('Task count') ?>" class="board-column-header-task-count">
+                    (<span id="task-number-column-<?= $column['id'] ?>"><?= $column['nb_tasks'] ?></span>)
+                </span>
+            <?php endif ?>
+        </div>
+
+    </th>
+    <?php endforeach ?>
+</tr>
diff --git a/app/Template/board/table_container.php b/app/Template/board/table_container.php
index 98b40eb4..b20426a6 100644
--- a/app/Template/board/table_container.php
+++ b/app/Template/board/table_container.php
@@ -13,18 +13,34 @@
         >
     <?php endif ?>
 
-    <?php foreach ($swimlanes as $swimlane): ?>
+    <?php $nb_swimlanes = count($swimlanes) ?>
+    <?php foreach ($swimlanes as $index => $swimlane): ?>
         <?php if (empty($swimlane['columns'])): ?>
             <p class="alert alert-error"><?= t('There is no column in your project!') ?></p>
             <?php break ?>
         <?php else: ?>
-            <?= $this->render('board/table_swimlane', array(
+            <?php if ($index === 0): ?>
+                <?= $this->render('board/table_column', array(
+                    'swimlane' => $swimlane,
+                    'not_editable' => isset($not_editable),
+                )) ?>
+            <?php endif ?>
+
+            <?php if ($nb_swimlanes > 1): ?>
+                <?= $this->render('board/table_swimlane', array(
+                    'project' => $project,
+                    'swimlane' => $swimlane,
+                    'not_editable' => isset($not_editable),
+                )) ?>
+            <?php endif ?>
+
+            <?= $this->render('board/table_tasks', array(
                 'project' => $project,
                 'swimlane' => $swimlane,
-                'board_highlight_period' => $board_highlight_period,
-                'hide_swimlane' => count($swimlanes) === 1,
                 'not_editable' => isset($not_editable),
+                'board_highlight_period' => $board_highlight_period,
             )) ?>
+
         <?php endif ?>
     <?php endforeach ?>
     </table>
diff --git a/app/Template/board/table_swimlane.php b/app/Template/board/table_swimlane.php
index af74cbbe..dd38fc97 100644
--- a/app/Template/board/table_swimlane.php
+++ b/app/Template/board/table_swimlane.php
@@ -1,104 +1,26 @@
+<!-- swimlane -->
 <tr id="swimlane-<?= $swimlane['id'] ?>">
-    <!-- swimlane toggle -->
-    <?php if (! $hide_swimlane): ?>
-       <th class="board-swimlane-header">
-           <?php if (! $not_editable): ?>
-                <a href="#" class="board-swimlane-toggle" data-swimlane-id="<?= $swimlane['id'] ?>">
-                    <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'])): ?>
-                    <span
-                        title="<?= t('Description') ?>"
-                        class="tooltip"
-                        data-href="<?= $this->url->href('board', 'swimlane', array('swimlane_id' => $swimlane['id'], 'project_id' => $project['id'])) ?>">
-                        <i class="fa fa-info-circle"></i>
-                    </span>
-                <?php endif ?>
-
-                <span title="<?= t('Task count') ?>" class="board-column-header-task-count swimlane-task-count-<?= $swimlane['id'] ?>">
-                    (<?= $swimlane['nb_tasks'] ?>)
-                </span>
-
-                <span class="board-swimlane-toggle-title show-icon-swimlane-<?= $swimlane['id'] ?>"><?= $this->e($swimlane['name']) ?></span>
-           <?php endif ?>
-        </th>
-    <?php endif ?>
-
-    <!-- column header title -->
-    <?php foreach ($swimlane['columns'] as $column): ?>
-    <th class="board-column-header board-column-header-<?= $column['id'] ?>" data-column-id="<?= $column['id'] ?>">
-        <div class="board-column-collapsed">
-            <span title="<?= t('Task count') ?>" class="board-column-header-task-count" title="<?= t('Show this column') ?>">
-                <span id="task-number-column-<?= $column['id'] ?>"><?= $column['nb_tasks'] ?></span>
-            </span>
-        </div>
-        <div class="board-column-expanded">
-            <?php if (! $not_editable): ?>
-                <div class="board-add-icon">
-                    <?= $this->url->link('+', 'taskcreation', 'create', array('project_id' => $column['project_id'], 'column_id' => $column['id'], 'swimlane_id' => $swimlane['id']), false, 'popover', t('Add a new task')) ?>
-                </div>
-            <?php endif ?>
-
-            <span class="board-column-title" data-column-id="<?= $column['id'] ?>" title="<?= t('Hide this column') ?>">
-                <?= $this->e($column['title']) ?>
+   <th class="board-swimlane-header" colspan="<?= $swimlane['nb_columns'] ?>">
+        <?php if (! $not_editable): ?>
+            <a href="#" class="board-swimlane-toggle" data-swimlane-id="<?= $swimlane['id'] ?>">
+                <i class="fa fa-chevron-circle-up hide-icon-swimlane-<?= $swimlane['id'] ?>" title="<?= t('Collapse swimlane') ?>"></i>
+                <i class="fa fa-chevron-circle-down show-icon-swimlane-<?= $swimlane['id'] ?>" title="<?= t('Expand swimlane') ?>" style="display: none"></i>
+            </a>
+        <?php endif ?>
+
+        <?= $this->e($swimlane['name']) ?>
+
+        <?php if (! $not_editable && ! empty($swimlane['description'])): ?>
+            <span
+                title="<?= t('Description') ?>"
+                class="tooltip"
+                data-href="<?= $this->url->href('board', 'swimlane', array('swimlane_id' => $swimlane['id'], 'project_id' => $project['id'])) ?>">
+                <i class="fa fa-info-circle"></i>
             </span>
+        <?php endif ?>
 
-            <?php if (! $not_editable && ! empty($column['description'])): ?>
-                <span class="tooltip pull-right" title='<?= $this->e($this->text->markdown($column['description'])) ?>'>
-                    <i class="fa fa-info-circle"></i>
-                </span>
-            <?php endif ?>
-
-            <?php if (! empty($column['score'])): ?>
-                <span class="pull-right" title="<?= t('Score') ?>">
-                    <?= $column['score'] ?>&nbsp;
-                </span>
-            <?php endif ?>
-
-            <?php if ($column['task_limit']): ?>
-                <span title="<?= t('Task limit') ?>">
-                    (<span id="task-number-column-<?= $column['id'] ?>"><?= $column['nb_tasks'] ?></span>/<?= $this->e($column['task_limit']) ?>)
-                </span>
-            <?php else: ?>
-                <span title="<?= t('Task count') ?>" class="board-column-header-task-count">
-                    (<span id="task-number-column-<?= $column['id'] ?>"><?= $column['nb_tasks'] ?></span>)
-                </span>
-            <?php endif ?>
-        </div>
+        <span title="<?= t('Task count') ?>" class="board-column-header-task-count swimlane-task-count-<?= $swimlane['id'] ?>">
+            (<?= $swimlane['nb_tasks'] ?>)
+        </span>
     </th>
-    <?php endforeach ?>
 </tr>
-<tr class="board-swimlane swimlane-row-<?= $swimlane['id'] ?>">
-
-    <!-- swimlane title -->
-    <?php if (! $hide_swimlane): ?>
-        <th class="board-swimlane-title">
-            <?= $this->e($swimlane['name']) ?>
-        </th>
-    <?php endif ?>
-
-    <!-- task list -->
-    <?php foreach ($swimlane['columns'] as $column): ?>
-        <td class="board-column-<?= $column['id'] ?> <?= $column['task_limit'] && $column['nb_tasks'] > $column['task_limit'] ? 'board-task-list-limit' : '' ?>">
-            <div class="board-task-list board-column-expanded" data-column-id="<?= $column['id'] ?>" data-swimlane-id="<?= $swimlane['id'] ?>" data-task-limit="<?= $column['task_limit'] ?>">
-                <?php foreach ($column['tasks'] as $task): ?>
-                    <?= $this->render($not_editable ? 'board/task_public' : 'board/task_private', array(
-                        'project' => $project,
-                        'task' => $task,
-                        'board_highlight_period' => $board_highlight_period,
-                        'not_editable' => $not_editable,
-                    )) ?>
-                <?php endforeach ?>
-            </div>
-            <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') ?>">
-                        <i class="fa fa-chevron-circle-up tooltip" title="<?= $this->e($column['title']) ?>"></i> <?= $this->e($column['title']) ?>
-                    </div>
-                </div>
-            </div>
-        </td>
-    <?php endforeach ?>
-</tr>
\ No newline at end of file
diff --git a/app/Template/board/table_tasks.php b/app/Template/board/table_tasks.php
new file mode 100644
index 00000000..f17e1132
--- /dev/null
+++ b/app/Template/board/table_tasks.php
@@ -0,0 +1,28 @@
+<!-- task row -->
+<tr class="board-swimlane swimlane-row-<?= $swimlane['id'] ?>">
+    <?php foreach ($swimlane['columns'] as $column): ?>
+        <td class="board-column-<?= $column['id'] ?> <?= $column['task_limit'] && $column['nb_tasks'] > $column['task_limit'] ? 'board-task-list-limit' : '' ?>">
+
+            <!-- tasks list -->
+            <div class="board-task-list board-column-expanded" data-column-id="<?= $column['id'] ?>" data-swimlane-id="<?= $swimlane['id'] ?>" data-task-limit="<?= $column['task_limit'] ?>">
+                <?php foreach ($column['tasks'] as $task): ?>
+                    <?= $this->render($not_editable ? 'board/task_public' : 'board/task_private', array(
+                        'project' => $project,
+                        'task' => $task,
+                        'board_highlight_period' => $board_highlight_period,
+                        'not_editable' => $not_editable,
+                    )) ?>
+                <?php endforeach ?>
+            </div>
+
+            <!-- column in collapsed mode (rotated text) -->
+            <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') ?>">
+                        <i class="fa fa-chevron-circle-up tooltip" title="<?= $this->e($column['title']) ?>"></i> <?= $this->e($column['title']) ?>
+                    </div>
+                </div>
+            </div>
+        </td>
+    <?php endforeach ?>
+</tr>
diff --git a/app/Template/board/task_private.php b/app/Template/board/task_private.php
index a2fe890b..4e34a393 100644
--- a/app/Template/board/task_private.php
+++ b/app/Template/board/task_private.php
@@ -11,7 +11,7 @@
     <div class="task-board-sort-handle" style="display: none;"><i class="fa fa-arrows-alt"></i></div>
     <?= $this->render('board/task_menu', array('task' => $task)) ?>
 
-    <?php if ($this->board->isCollapsed($project['id'])): ?>
+    <?php if ($this->board->isCollapsed($task['project_id'])): ?>
         <div class="task-board-collapsed">
             <?php if (! empty($task['assignee_username'])): ?>
                 <span title="<?= $this->e($task['assignee_name'] ?: $task['assignee_username']) ?>">
diff --git a/app/Template/board/private_view.php b/app/Template/board/view_private.php
index d4c2c651..d4c2c651 100644
--- a/app/Template/board/private_view.php
+++ b/app/Template/board/view_private.php
diff --git a/app/Template/board/public_view.php b/app/Template/board/view_public.php
index aea72031..aea72031 100644
--- a/app/Template/board/public_view.php
+++ b/app/Template/board/view_public.php