diff --git a/CHANGELOG.md b/CHANGELOG.md index 1f1b6e58..159fcbae 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -6,6 +6,7 @@ ### Features - Ability to create single-line or multi-line custom fields. (thanks to [@artlepool](https://github.com/artlepool)) - Add custom videoconference system. +- Make burndown chart collapsible at the backlog panel. ### Misc - Improve performance: Show cropped images in timelines. diff --git a/app/coffee/modules/backlog/main.coffee b/app/coffee/modules/backlog/main.coffee index 3dac4387..86fe61b5 100644 --- a/app/coffee/modules/backlog/main.coffee +++ b/app/coffee/modules/backlog/main.coffee @@ -28,6 +28,7 @@ bindOnce = @.taiga.bindOnce groupBy = @.taiga.groupBy timeout = @.taiga.timeout bindMethods = @.taiga.bindMethods +generateHash = @.taiga.generateHash module = angular.module("taigaBacklog") @@ -644,7 +645,7 @@ BacklogDirective = ($repo, $rootscope, $translate) -> _.map elements, (elm) -> input = $(elm).find("input:checkbox") - input.prop('checked', true); + input.prop('checked', true) checkSelected(input) target = angular.element(event.currentTarget) @@ -724,7 +725,6 @@ BacklogDirective = ($repo, $rootscope, $translate) -> $el.find(".backlog-table-body").disableSelection() filters = $ctrl.getUrlFilters() - if filters.statuses || filters.tags || filters.q @@ -903,6 +903,39 @@ UsPointsDirective = ($tgEstimationsService, $repo, $tgTemplate) -> module.directive("tgBacklogUsPoints", ["$tgEstimationsService", "$tgRepo", "$tgTemplate", UsPointsDirective]) +############################################################################# +## Burndown graph directive +############################################################################# +ToggleBurndownVisibility = ($storage) -> + link = ($scope, $el, $attrs) -> + hash = generateHash(["is-burndown-grpahs-collapsed"]) + toggleGraph = -> + if $scope.isBurndownGraphCollapsed + $(".js-toggle-burndown-visibility-button").removeClass("active") + $(".js-burndown-graph").removeClass("open") + else + $(".js-toggle-burndown-visibility-button").addClass("active") + $(".js-burndown-graph").addClass("open") + + $scope.isBurndownGraphCollapsed = $storage.get(hash) or false + toggleGraph() + + $el.on "click", ".js-toggle-burndown-visibility-button", -> + $scope.isBurndownGraphCollapsed = !$scope.isBurndownGraphCollapsed + $storage.set(hash, $scope.isBurndownGraphCollapsed) + toggleGraph() + + $scope.$on "$destroy", -> + $el.off() + + return { + scope: {} + link: link + } + +module.directive("tgToggleBurndownVisibility", ["$tgStorage", ToggleBurndownVisibility]) + + ############################################################################# ## Burndown graph directive ############################################################################# diff --git a/app/locales/locale-en.json b/app/locales/locale-en.json index e9a008c2..2a06e9de 100644 --- a/app/locales/locale-en.json +++ b/app/locales/locale-en.json @@ -919,7 +919,8 @@ "OPEN_TASKS": "open
tasks", "CLOSED_TASKS": "closed
tasks", "IOCAINE_DOSES": "iocaine
doses", - "SHOW_STATISTICS_TITLE": "Show statistics" + "SHOW_STATISTICS_TITLE": "Show statistics", + "TOGGLE_BAKLOG_GRAPH": "Show/Hide burndown graph" }, "SUMMARY": { "PROJECT_POINTS": "project
points", diff --git a/app/partials/backlog/backlog.jade b/app/partials/backlog/backlog.jade index 8741c465..a4862387 100644 --- a/app/partials/backlog/backlog.jade +++ b/app/partials/backlog/backlog.jade @@ -7,17 +7,19 @@ div.wrapper(tg-backlog, ng-controller="BacklogController as ctrl", include ../includes/modules/backlog-filters section.main.backlog include ../includes/components/mainTitle - include ../includes/components/summary - div.graphics-container.burndown-container - div.burndown(tg-burndown-backlog-graph) - include ../includes/modules/burndown + div.backlog-summary(tg-toggle-burndown-visibility) + include ../includes/components/summary + + div.graphics-container.burndown-container.js-burndown-graph + div.burndown(tg-burndown-backlog-graph) + include ../includes/modules/burndown div.backlog-menu div.backlog-table-options a.trans-button.move-to-current-sprint(href="", - title="{{'BACKLOG.MOVE_US_TO_CURRENT_SPRINT' | translate}}", - id="move-to-current-sprint") + title="{{'BACKLOG.MOVE_US_TO_CURRENT_SPRINT' | translate}}", + id="move-to-current-sprint") span.icon.icon-move span.text(translate="BACKLOG.MOVE_US_TO_CURRENT_SPRINT") a.trans-button(href="", diff --git a/app/partials/includes/components/summary.jade b/app/partials/includes/components/summary.jade index 1b29810d..849ec856 100644 --- a/app/partials/includes/components/summary.jade +++ b/app/partials/includes/components/summary.jade @@ -16,3 +16,7 @@ div.summary div.summary-stats span.number(ng-bind="stats.speed | number:0") -- span.description(translate="BACKLOG.SUMMARY.POINTS_PER_SPRINT") + + a.icon.icon-stats.js-toggle-burndown-visibility-button(href="", + title="{{'BACKLOG.SPRINT_SUMMARY.TOGGLE_BAKLOG_GRAPH' | translate}}") + diff --git a/app/styles/components/summary.scss b/app/styles/components/summary.scss index ded4538b..d2120143 100644 --- a/app/styles/components/summary.scss +++ b/app/styles/components/summary.scss @@ -17,7 +17,24 @@ } } .icon { - @extend %large; + font-size: 1.4rem; + margin-right: .4rem; + &.icon-stats { + color: $gray; + float: right; + transition: color .3s linear; + &:hover { + color: $fresh-taiga; + transition: color .3s linear; + } + &.active { + color: $fresh-taiga; + } + &.active:hover { + color: $gray; + transition: color .3s linear; + } + } } .number { @extend %xlarge; @@ -88,24 +105,4 @@ .summary-stats-divider { margin-right: 2rem; } - .icon { - font-size: 1.4rem; - margin-right: .4rem; - &.icon-stats { - color: $gray; - float: right; - transition: color .3s linear; - &:hover { - color: $fresh-taiga; - transition: color .3s linear; - } - &.active { - color: $fresh-taiga; - } - &.active:hover { - color: $gray; - transition: color .3s linear; - } - } - } }