From db6920623106a73c755168bca36d9fb9cb223248 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jes=C3=BAs=20Espino?= <jesus.espino@kaleidos.net>
Date: Mon, 11 Aug 2014 14:40:39 +0200
Subject: [PATCH] Repainting tags on add us

---
 app/coffee/modules/backlog/main.coffee        | 25 +++++++++++--------
 app/coffee/modules/base/tags.coffee           | 25 +++++++++++++++----
 app/coffee/modules/resources/projects.coffee  |  3 +++
 .../views/components/backlog-row.jade         |  3 +--
 4 files changed, 39 insertions(+), 17 deletions(-)

diff --git a/app/coffee/modules/backlog/main.coffee b/app/coffee/modules/backlog/main.coffee
index f83ed9b0..0024d7b0 100644
--- a/app/coffee/modules/backlog/main.coffee
+++ b/app/coffee/modules/backlog/main.coffee
@@ -87,6 +87,10 @@ class BacklogController extends mixOf(taiga.Controller, taiga.PageMixin, taiga.F
             @scope.stats.completedPercentage = "#{completedPercentage}%"
             return stats
 
+    refreshTagsColors: ->
+        return @rs.projects.tagsColors(@scope.projectId).then (tags_colors) =>
+            @scope.project.tags_colors = tags_colors
+
     loadSprints: ->
         return @rs.sprints.list(@scope.projectId).then (sprints) =>
             @scope.sprints = sprints
@@ -103,19 +107,20 @@ class BacklogController extends mixOf(taiga.Controller, taiga.PageMixin, taiga.F
 
         @rs.userstories.storeQueryParams(@scope.projectId, @scope.httpParams)
 
-        return @rs.userstories.listUnassigned(@scope.projectId, @scope.httpParams).then (userstories) =>
-            @scope.userstories = userstories
+        @.refreshTagsColors().then =>
+            @rs.userstories.listUnassigned(@scope.projectId, @scope.httpParams).then (userstories) =>
+                @scope.userstories = userstories
 
-            @.generateFilters()
-            @.filterVisibleUserstories()
+                @.generateFilters()
+                @.filterVisibleUserstories()
 
-            @rootscope.$broadcast("filters:loaded", @scope.filters)
-            # The broadcast must be executed when the DOM has been fully reloaded.
-            # We can't assure when this exactly happens so we need a defer
-            scopeDefer @scope, =>
-                @scope.$broadcast("userstories:loaded")
+                @rootscope.$broadcast("filters:loaded", @scope.filters)
+                # The broadcast must be executed when the DOM has been fully reloaded.
+                # We can't assure when this exactly happens so we need a defer
+                scopeDefer @scope, =>
+                    @scope.$broadcast("userstories:loaded")
 
-            return userstories
+                return userstories
 
     loadBacklog: ->
         return @q.all([
diff --git a/app/coffee/modules/base/tags.coffee b/app/coffee/modules/base/tags.coffee
index 0bb34b9e..05c84b8c 100644
--- a/app/coffee/modules/base/tags.coffee
+++ b/app/coffee/modules/base/tags.coffee
@@ -61,12 +61,27 @@ ColorizeTagBackgroundDirective = ->
 module.directive("tgColorizeTagBackground", ColorizeTagBackgroundDirective)
 
 
-ColorizeTagBorderLeftDirective = ->
+ColorizeTagsBorderLeftDirective = ->
+    template = _.template("""
+        <% _.each(tags, function(tag) { %>
+            <span class="tag" style="border-left: 5px solid <%- tag.color %>"><%- tag.name %></span>
+        <% }) %>
+    """)
     link = ($scope, $el, $attrs, $ctrl) ->
-        text = $scope.$eval($attrs.tgColorizeTagBorderLeft)
-        color = $scope.project.tags_colors[text]
-        $el.css("border-left", "5px solid #{color}")
+        render = (srcTags) ->
+            tags = []
+            for tag in srcTags
+                color = $scope.project.tags_colors[tag]
+                tags.push({name: tag, color: color})
+            $el.html template({tags: tags})
+
+        $scope.$watch $attrs.tgColorizeTagsBorderLeft, ->
+            tags = $scope.$eval($attrs.tgColorizeTagsBorderLeft)
+            render(tags)
+
+        tags = $scope.$eval($attrs.tgColorizeTagsBorderLeft)
+        render(tags)
 
     return {link: link}
 
-module.directive("tgColorizeTagBorderLeft", ColorizeTagBorderLeftDirective)
+module.directive("tgColorizeTagsBorderLeft", ColorizeTagsBorderLeftDirective)
diff --git a/app/coffee/modules/resources/projects.coffee b/app/coffee/modules/resources/projects.coffee
index eb353307..f3e1ab51 100644
--- a/app/coffee/modules/resources/projects.coffee
+++ b/app/coffee/modules/resources/projects.coffee
@@ -45,6 +45,9 @@ resourceProvider = ($repo) ->
     service.stats = (projectId) ->
         return $repo.queryOneRaw("projects", "#{projectId}/stats")
 
+    service.tagsColors = (id) ->
+        return $repo.queryOne("projects", "#{id}/tags_colors")
+
     return (instance) ->
         instance.projects = service
 
diff --git a/app/partials/views/components/backlog-row.jade b/app/partials/views/components/backlog-row.jade
index a089f118..c3e9df72 100644
--- a/app/partials/views/components/backlog-row.jade
+++ b/app/partials/views/components/backlog-row.jade
@@ -1,7 +1,6 @@
 div.row.us-item-row(ng-repeat="us in visibleUserstories|orderBy:order track by us.id", tg-draggable, ng-class="{blocked: us.is_blocked}")
     div.user-stories
-        div.user-story-tags
-            span.tag(ng-repeat="tag in us.tags", tg-bind-html="tag", tg-colorize-tag-border-left="tag")
+        div.user-story-tags(tg-colorize-tags-border-left="us.tags")
         div.user-story-name
             input(tg-check-permission, permission="modify_us", type="checkbox", name="")
             a.clickable(tg-nav="project-userstories-detail:project=project.slug,ref=us.ref",