From 631af8d3a589d5581e9c2174d38184fba9cf110b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jes=C3=BAs=20Espino?= Date: Thu, 16 Oct 2014 19:44:43 +0200 Subject: [PATCH] Add spinner on change status/type/priority/severity selectors --- app/coffee/modules/issues/detail.coffee | 37 +++++++++++++++----- app/coffee/modules/tasks/detail.coffee | 11 ++++-- app/coffee/modules/userstories/detail.coffee | 11 ++++-- app/styles/layout/us-detail.scss | 4 +++ 4 files changed, 51 insertions(+), 12 deletions(-) diff --git a/app/coffee/modules/issues/detail.coffee b/app/coffee/modules/issues/detail.coffee index e04bddd1..6388eda7 100644 --- a/app/coffee/modules/issues/detail.coffee +++ b/app/coffee/modules/issues/detail.coffee @@ -186,7 +186,7 @@ module.directive("tgIssueStatusDisplay", IssueStatusDisplayDirective) ## Issue status button directive ############################################################################# -IssueStatusButtonDirective = ($rootScope, $repo, $confirm) -> +IssueStatusButtonDirective = ($rootScope, $repo, $confirm, $loading) -> # Display the status of Issue and you can edit it. # # Example: @@ -247,13 +247,19 @@ IssueStatusButtonDirective = ($rootScope, $repo, $confirm) -> issue.status = target.data("status-id") $model.$setViewValue(issue) + $scope.$apply() + onSuccess = -> $confirm.notify("success") $rootScope.$broadcast("history:reload") + $loading.finish($el.find(".level-name")) onError = -> $confirm.notify("error") issue.revert() $model.$setViewValue(issue) + $loading.finish($el.find(".level-name")) + + $loading.start($el.find(".level-name")) $repo.save($model.$modelValue).then(onSuccess, onError) $scope.$watch $attrs.ngModel, (issue) -> @@ -268,13 +274,13 @@ IssueStatusButtonDirective = ($rootScope, $repo, $confirm) -> require: "ngModel" } -module.directive("tgIssueStatusButton", ["$rootScope", "$tgRepo", "$tgConfirm", IssueStatusButtonDirective]) +module.directive("tgIssueStatusButton", ["$rootScope", "$tgRepo", "$tgConfirm", "$tgLoading", IssueStatusButtonDirective]) ############################################################################# ## Issue type button directive ############################################################################# -IssueTypeButtonDirective = ($rootScope, $repo, $confirm) -> +IssueTypeButtonDirective = ($rootScope, $repo, $confirm, $loading) -> # Display the type of Issue and you can edit it. # # Example: @@ -335,13 +341,18 @@ IssueTypeButtonDirective = ($rootScope, $repo, $confirm) -> issue.type = target.data("type-id") $model.$setViewValue(issue) + $scope.$apply() + onSuccess = -> $confirm.notify("success") $rootScope.$broadcast("history:reload") + $loading.finish($el.find(".level-name")) onError = -> $confirm.notify("error") issue.revert() $model.$setViewValue(issue) + $loading.finish($el.find(".level-name")) + $loading.start($el.find(".level-name")) $repo.save($model.$modelValue).then(onSuccess, onError) $scope.$watch $attrs.ngModel, (issue) -> @@ -356,14 +367,14 @@ IssueTypeButtonDirective = ($rootScope, $repo, $confirm) -> require: "ngModel" } -module.directive("tgIssueTypeButton", ["$rootScope", "$tgRepo", "$tgConfirm", IssueTypeButtonDirective]) +module.directive("tgIssueTypeButton", ["$rootScope", "$tgRepo", "$tgConfirm", "$tgLoading", IssueTypeButtonDirective]) ############################################################################# ## Issue severity button directive ############################################################################# -IssueSeverityButtonDirective = ($rootScope, $repo, $confirm) -> +IssueSeverityButtonDirective = ($rootScope, $repo, $confirm, $loading) -> # Display the severity of Issue and you can edit it. # # Example: @@ -424,13 +435,18 @@ IssueSeverityButtonDirective = ($rootScope, $repo, $confirm) -> issue.severity = target.data("severity-id") $model.$setViewValue(issue) + $scope.$apply() + onSuccess = -> $confirm.notify("success") $rootScope.$broadcast("history:reload") + $loading.finish($el.find(".level-name")) onError = -> $confirm.notify("error") issue.revert() $model.$setViewValue(issue) + $loading.finish($el.find(".level-name")) + $loading.start($el.find(".level-name")) $repo.save($model.$modelValue).then(onSuccess, onError) $scope.$watch $attrs.ngModel, (issue) -> @@ -445,14 +461,14 @@ IssueSeverityButtonDirective = ($rootScope, $repo, $confirm) -> require: "ngModel" } -module.directive("tgIssueSeverityButton", ["$rootScope", "$tgRepo", "$tgConfirm", IssueSeverityButtonDirective]) +module.directive("tgIssueSeverityButton", ["$rootScope", "$tgRepo", "$tgConfirm", "$tgLoading", IssueSeverityButtonDirective]) ############################################################################# ## Issue priority button directive ############################################################################# -IssuePriorityButtonDirective = ($rootScope, $repo, $confirm) -> +IssuePriorityButtonDirective = ($rootScope, $repo, $confirm, $loading) -> # Display the priority of Issue and you can edit it. # # Example: @@ -513,13 +529,18 @@ IssuePriorityButtonDirective = ($rootScope, $repo, $confirm) -> issue.priority = target.data("priority-id") $model.$setViewValue(issue) + $scope.$apply() + onSuccess = -> $confirm.notify("success") $rootScope.$broadcast("history:reload") + $loading.finish($el.find(".level-name")) onError = -> $confirm.notify("error") issue.revert() $model.$setViewValue(issue) + $loading.finish($el.find(".level-name")) + $loading.start($el.find(".level-name")) $repo.save($model.$modelValue).then(onSuccess, onError) $scope.$watch $attrs.ngModel, (issue) -> @@ -534,7 +555,7 @@ IssuePriorityButtonDirective = ($rootScope, $repo, $confirm) -> require: "ngModel" } -module.directive("tgIssuePriorityButton", ["$rootScope", "$tgRepo", "$tgConfirm", IssuePriorityButtonDirective]) +module.directive("tgIssuePriorityButton", ["$rootScope", "$tgRepo", "$tgConfirm", "$tgLoading", IssuePriorityButtonDirective]) ############################################################################# diff --git a/app/coffee/modules/tasks/detail.coffee b/app/coffee/modules/tasks/detail.coffee index 59c06167..3d119131 100644 --- a/app/coffee/modules/tasks/detail.coffee +++ b/app/coffee/modules/tasks/detail.coffee @@ -177,7 +177,7 @@ module.directive("tgTaskStatusDisplay", TaskStatusDisplayDirective) ## Task status button directive ############################################################################# -TaskStatusButtonDirective = ($rootScope, $repo, $confirm) -> +TaskStatusButtonDirective = ($rootScope, $repo, $confirm, $loading) -> # Display the status of Task and you can edit it. # # Example: @@ -238,13 +238,20 @@ TaskStatusButtonDirective = ($rootScope, $repo, $confirm) -> task.status = target.data("status-id") $model.$setViewValue(task) + $scope.$apply() + onSuccess = -> $confirm.notify("success") $rootScope.$broadcast("history:reload") + $loading.finish($el.find(".level-name")) + onError = -> $confirm.notify("error") task.revert() $model.$setViewValue(task) + $loading.finish($el.find(".level-name")) + + $loading.start($el.find(".level-name")) $repo.save($model.$modelValue).then(onSuccess, onError) $scope.$watch $attrs.ngModel, (task) -> @@ -259,7 +266,7 @@ TaskStatusButtonDirective = ($rootScope, $repo, $confirm) -> require: "ngModel" } -module.directive("tgTaskStatusButton", ["$rootScope", "$tgRepo", "$tgConfirm", TaskStatusButtonDirective]) +module.directive("tgTaskStatusButton", ["$rootScope", "$tgRepo", "$tgConfirm", "$tgLoading", TaskStatusButtonDirective]) TaskIsIocaineButtonDirective = ($rootscope, $tgrepo, $confirm, $loading) -> diff --git a/app/coffee/modules/userstories/detail.coffee b/app/coffee/modules/userstories/detail.coffee index 6a82c711..99d18f21 100644 --- a/app/coffee/modules/userstories/detail.coffee +++ b/app/coffee/modules/userstories/detail.coffee @@ -398,7 +398,7 @@ module.directive("tgUsEstimation", ["$rootScope", "$tgRepo", "$tgConfirm", UsEst ## User story status button directive ############################################################################# -UsStatusButtonDirective = ($rootScope, $repo, $confirm) -> +UsStatusButtonDirective = ($rootScope, $repo, $confirm, $loading) -> # Display the status of a US and you can edit it. # # Example: @@ -460,13 +460,20 @@ UsStatusButtonDirective = ($rootScope, $repo, $confirm) -> us.status = target.data("status-id") $model.$setViewValue(us) + $scope.$apply() + onSuccess = -> $confirm.notify("success") $rootScope.$broadcast("history:reload") + $loading.finish($el.find(".level-name")) + onError = -> $confirm.notify("error") us.revert() $model.$setViewValue(us) + $loading.finish($el.find(".level-name")) + + $loading.start($el.find(".level-name")) $repo.save($model.$modelValue).then(onSuccess, onError) $scope.$watch $attrs.ngModel, (us) -> @@ -481,7 +488,7 @@ UsStatusButtonDirective = ($rootScope, $repo, $confirm) -> require: "ngModel" } -module.directive("tgUsStatusButton", ["$rootScope", "$tgRepo", "$tgConfirm", UsStatusButtonDirective]) +module.directive("tgUsStatusButton", ["$rootScope", "$tgRepo", "$tgConfirm", "$tgLoading", UsStatusButtonDirective]) ############################################################################# diff --git a/app/styles/layout/us-detail.scss b/app/styles/layout/us-detail.scss index 8086cc9a..7cf18691 100644 --- a/app/styles/layout/us-detail.scss +++ b/app/styles/layout/us-detail.scss @@ -259,6 +259,10 @@ .level-name { color: darken($whitish, 20%); float: right; + &.loading span { + @include animation (loading .5s linear); + @include animation (spin 1s linear infinite); + } } }