div.taskboard-table(tg-taskboard-squish-column, tg-taskboard-sortable)
    div.taskboard-table-header
        div.taskboard-table-inner
            h2.task-colum-name(translate="TASKBOARD.TABLE.COLUMN")
            h2.task-colum-name(ng-repeat="s in taskStatusList track by s.id", ng-style="{'border-top-color':s.color}", ng-class="{'column-fold':statusesFolded[s.id]}", class="squish-status-{{s.id}}", tg-bo-title="s.name")
                span(tg-bo-bind="s.name")

                tg-svg.hfold.fold-action(
                    svg-icon="icon-fold-row",
                    ng-click='foldStatus(s)',
                    title="{{'TASKBOARD.TABLE.TITLE_ACTION_FOLD' | translate}}"
                    ng-class='{hidden:statusesFolded[s.id]}'
                )

                tg-svg.hunfold.fold-action(
                    svg-icon="icon-unfold-row",
                    ng-click='foldStatus(s)',
                    title="{{'TASKBOARD.TABLE.TITLE_ACTION_UNFOLD' | translate}}"
                    ng-class='{hidden:!statusesFolded[s.id]}'
                )

    div.taskboard-table-body(tg-taskboard-table-height-fixer)
        div.taskboard-table-inner
            div.task-row(ng-repeat="us in userstories track by us.id", ng-class="{blocked: us.is_blocked, 'row-fold':usFolded[us.id]}")
                div.taskboard-userstory-box.task-column(tg-bo-title="us.blocked_note")
                    tg-svg.vfold.fold-action(
                        svg-icon="icon-fold-row",
                        ng-click='foldUs(us)'
                        title="{{'TASKBOARD.TABLE.TITLE_ACTION_FOLD_ROW' | translate}}"
                        ng-class='{hidden:usFolded[us.id]}'
                    )

                    tg-svg.vunfold.fold-action(
                        svg-icon="icon-unfold-row",
                        ng-click='foldUs(us)'
                        title="{{'TASKBOARD.TABLE.TITLE_ACTION_UNFOLD_ROW' | translate}}"
                        ng-class='{hidden:!usFolded[us.id]}'
                    )

                    h3.us-title
                        a(href="",
                          tg-nav="project-userstories-detail:project=project.slug,ref=us.ref",
                          tg-nav-get-params="{\"milestone\": {{us.milestone}}}",
                          tg-bo-title="'#' + us.ref + ' ' + us.subject")
                            span.us-ref(tg-bo-ref="us.ref")
                            span(ng-bind="us.subject")
                    p.points-value
                        span(ng-bind="us.total_points")
                        span(translate="TASKBOARD.TABLE.FIELD_POINTS")
                    include ../components/addnewtask

                div.taskboard-tasks-box.task-column(ng-repeat="st in taskStatusList track by st.id", class="squish-status-{{st.id}}", ng-class="{'column-fold':statusesFolded[st.id]}", tg-bind-scope)
                    div.taskboard-task(
                        ng-repeat="task in usTasks[us.id][st.id] track by task.id"
                        tg-bind-scope
                        tg-class-permission="{'readonly': '!modify_task'}"
                        ng-class="{'card-placeholder': task.isPlaceholder}"
                    )
                        div(ng-if="!task.isPlaceholder", tg-taskboard-task)
                            include ../components/taskboard-task

                        div(ng-if="task.isPlaceholder")
                            - var card = 'task'
                            include ../../common/components/taskboard-placeholder

            div.task-row(ng-init="us = null", ng-class="{'row-fold':usFolded[null]}")
                div.taskboard-userstory-box.task-column
                    a.vfold(
                        href=""
                        title="{{'TASKBOARD.TABLE.TITLE_ACTION_FOLD_ROW' | translate}}"
                        ng-click='foldUs()'
                        ng-class="{hidden:usFolded[null]}"
                    )
                        tg-svg.fold-action(svg-icon="icon-fold-row")
                    a.vunfold(
                        href=""
                        title="{{'TASKBOARD.TABLE.TITLE_ACTION_UNFOLD_ROW' | translate}}"
                        ng-click='foldUs()'
                        ng-class="{hidden:!usFolded[null]}"
                    )
                        tg-svg.fold-action(svg-icon="icon-unfold-row")
                    h3.us-title
                        span(translate="TASKBOARD.TABLE.ROW_UNASSIGED_TASKS_TITLE")
                    include ../components/addnewtask.jade
                div.taskboard-tasks-box.task-column(ng-repeat="st in taskStatusList track by st.id", class="squish-status-{{st.id}}", ng-class="{'column-fold':statusesFolded[st.id]}", tg-bind-scope)
                    div.taskboard-task(
                        ng-repeat="task in usTasks[null][st.id] track by task.id"
                        tg-bind-scope
                        tg-class-permission="{'readonly': '!modify_task'}"
                        ng-class="{'card-placeholder': task.isPlaceholder}"
                    )
                        div(ng-if="!task.isPlaceholder", tg-taskboard-task)
                            include ../components/taskboard-task

                        div(ng-if="task.isPlaceholder")
                            include ../../common/components/taskboard-placeholder