Refactor of user-story buttons

app/coffee/modules/common/lightboxes.coffee

@@ -127,16 +127,29 @@ module.directive("lightbox", ["lightboxService", LightboxDirective])
 
 # Issue/Userstory blocking message lightbox directive.
 
-BlockLightboxDirective = (lightboxService) ->
+BlockLightboxDirective = ($rootscope, $tgrepo, $confirm, lightboxService) ->
     link = ($scope, $el, $attrs, $model) ->
         $el.find("h2.title").text($attrs.title)
 
         $scope.$on "block", ->
+            $el.find(".reason").val($model.$modelValue.blocked_note)
             lightboxService.open($el)
 
         $scope.$on "unblock", ->
-            $model.$modelValue.is_blocked = false
+            item = $model.$modelValue.clone()
-            $model.$modelValue.blocked_note_html = ""
+            item.is_blocked = false
+            item.blocked_note = ""
+            $model.$setViewValue(item)
+
+            promise = $tgrepo.save($model.$modelValue)
+            promise.then ->
+                $confirm.notify("success")
+                $rootscope.$broadcast("history:reload")
+
+            promise.then null, ->
+                $confirm.notify("error")
+                item.revert()
+                $model.$setViewValue(item)
 
         $scope.$on "$destroy", ->
             $el.off()
@@ -144,19 +157,30 @@ BlockLightboxDirective = (lightboxService) ->
         $el.on "click", ".button-green", (event) ->
             event.preventDefault()
 
-            $scope.$apply ->
+            item = $model.$modelValue.clone()
-                $model.$modelValue.is_blocked = true
+            item.is_blocked = true
-                $model.$modelValue.blocked_note = $el.find(".reason").val()
+            item.blocked_note = $el.find(".reason").val()
+            $model.$setViewValue(item)
+
+            promise = $tgrepo.save($model.$modelValue)
+            promise.then ->
+                $confirm.notify("success")
+                $rootscope.$broadcast("history:reload")
+
+            promise.then null, ->
+                $confirm.notify("error")
+                item.revert()
+                $model.$setViewValue(item)
 
             lightboxService.close($el)
 
     return {
         templateUrl: "/partials/views/modules/lightbox-block.html"
-        link:link,
+        link: link
-        require:"ngModel"
+        require: "ngModel"
     }
 
-module.directive("tgLbBlock", ["lightboxService", BlockLightboxDirective])
+module.directive("tgLbBlock", ["$rootScope", "$tgRepo", "$tgConfirm", "lightboxService", BlockLightboxDirective])
 
 
 #############################################################################

app/coffee/modules/userstories/detail.coffee

@@ -133,32 +133,6 @@ class UserStoryDetailController extends mixOf(taiga.Controller, taiga.PageMixin)
                       .then(=> @q.all([@.loadUs(),
                                        @.loadTasks()]))
 
-    block: ->
-        @rootscope.$broadcast("block", @scope.us)
-
-    unblock: ->
-        @rootscope.$broadcast("unblock", @scope.us)
-
-    delete: ->
-        #TODO: i18n
-        title = "Delete User Story"
-        message = @scope.us.subject
-
-        @confirm.askOnDelete(title, message).then (finish) =>
-            promise = @.repo.remove(@scope.us)
-            promise.then =>
-                finish()
-
-                if @scope.us.milestone
-                    @location.path(@navUrls.resolve("project-taskboard", {project: @scope.project.slug, sprint: @scope.sprint.slug}))
-                else if @scope.project.is_backlog_activated
-                    @location.path(@navUrls.resolve("project-backlog", {project: @scope.project.slug}))
-                else
-                    @location.path(@navUrls.resolve("project-kanban", {project: @scope.project.slug}))
-            promise.then null, =>
-                finish(false)
-                $confirm.notify("error")
-
 module.controller("UserStoryDetailController", UserStoryDetailController)
 
 #############################################################################
@@ -507,3 +481,94 @@ UsEstimationDirective = ($log) ->
     }
 
 module.directive("tgUsEstimation", UsEstimationDirective)
+
+UsButtonsDirective = ($rootscope, $tgrepo, $confirm, $navurls, $location) ->
+    template = _.template("""
+      <fieldset>
+        <label for="client-requirement" class="button button-gray client-requirement">Client requirement</label>
+        <input type="checkbox" id="client-requirement" name="client-requirement"/>
+      </fieldset>
+      <fieldset>
+        <label for="team-requirement" class="button button-gray team-requirement">Team requirement</label>
+        <input type="checkbox" id="team-requirement" name="team-requirement"/>
+      </fieldset>
+      <a class="button button-gray us-block">Block</a>
+      <a class="button button-red us-unblock">Unblock</a>
+      <% if (deletePerm) { %>
+        <a href="" class="button button-red us-delete">Delete</a>
+      <% } %>
+    """)
+
+    link = ($scope, $el, $attrs, $model) ->
+        render = _.once (us) ->
+            deletePerm = $scope.project.my_permissions.indexOf("delete_us") != -1
+            html = template({deletePerm: deletePerm})
+            $el.html(html)
+
+        refresh = (us) ->
+            if us?.is_blocked
+                $el.find('.us-block').hide()
+                $el.find('.us-unblock').show()
+            else
+                $el.find('.us-block').show()
+                $el.find('.us-unblock').hide()
+
+            if us?.client_requirement
+                $el.find('.client-requirement').addClass('active')
+            else
+                $el.find('.client-requirement').removeClass('active')
+
+            if us?.team_requirement
+                $el.find('.team-requirement').addClass('active')
+            else
+                $el.find('.team-requirement').removeClass('active')
+
+        $scope.$watch $attrs.ngModel, (us) ->
+            return if not us
+            render(us)
+            refresh(us)
+
+        $scope.$on "$destroy", ->
+            $el.off()
+
+        $el.on "click", ".client-requirement", (event) ->
+            us = $model.$modelValue.clone()
+            us.client_requirement = not us.client_requirement
+            $model.$setViewValue(us)
+            $tgrepo.save($model.$modelValue).then ->
+                $rootscope.$broadcast("history:reload")
+
+        $el.on "click", ".team-requirement", (event) ->
+            us = $model.$modelValue.clone()
+            us.team_requirement = not us.team_requirement
+            $model.$setViewValue(us)
+            $tgrepo.save($model.$modelValue).then ->
+                $rootscope.$broadcast("history:reload")
+
+        $el.on "click", ".us-block", (event) ->
+            $rootscope.$broadcast("block", $model.$modelValue)
+
+        $el.on "click", ".us-unblock", (event) ->
+            $rootscope.$broadcast("unblock", $model.$modelValue)
+
+        $el.on "click", ".us-delete", (event) ->
+            #TODO: i18n
+            title = "Delete User Story"
+            subtitle = $model.$modelValue.subject
+
+            $confirm.ask(title, subtitle).then (finish) =>
+                promise = $tgrepo.remove($model.$modelValue)
+                promise.then =>
+                    finish()
+                    $location.path($navurls.resolve("project-backlog", {project: $scope.project.slug}))
+                promise.then null, =>
+                    finish(false)
+                    $confirm.notify("error")
+
+    return {
+        link: link
+        restrict: "EA"
+        require: "ngModel"
+    }
+
+module.directive("tgUsButtons", ["$rootScope", "$tgRepo", "$tgConfirm", "$tgNavUrls", "$tgLocation", UsButtonsDirective])

app/partials/us-detail.jade

@@ -54,12 +54,8 @@ block content
             section.us-assigned-to(tg-assigned-to, ng-model="us")
             section.us-created-by(tg-created-by, ng-model="us")
             section.watchers(tg-watchers, ng-model="us")
+            section.us-detail-settings(tg-us-buttons, ng-model="us")
 
-            section.us-detail-settings
+        div.lightbox.lightbox_block.hidden(tg-lb-block, title="Blocking issue", ng-model="us")
-                span.button.button-gray(href="", title="Client requirement",
-                                        ng-class="{'active': us.client_requirement}") Client requirement
-                span.button.button-gray(href="", title="Team requirement",
-                                        ng-class="{'active': us.team_requirement}") Team requirement
-
         div.lightbox.lightbox-select-user.hidden(tg-lb-assignedto)
         div.lightbox.lightbox-select-user.hidden(tg-lb-watchers)