diff --git a/app/coffee/modules/issues/list.coffee b/app/coffee/modules/issues/list.coffee index 1b216501..28115e51 100644 --- a/app/coffee/modules/issues/list.coffee +++ b/app/coffee/modules/issues/list.coffee @@ -449,7 +449,7 @@ module.directive("tgIssues", ["$log", "$tgLocation", IssuesDirective]) ## Issues Filters Directive ############################################################################# -IssuesFiltersDirective = ($log, $location, $rs, $confirm) -> +IssuesFiltersDirective = ($log, $location, $rs, $confirm, $loading) -> template = _.template(""" <% _.each(filters, function(f) { %> <% if (!f.selected) { %> @@ -468,7 +468,9 @@ IssuesFiltersDirective = ($log, $location, $rs, $confirm) -> <% } %> <% }) %> - + + + """) templateSelected = _.template(""" @@ -646,13 +648,17 @@ IssuesFiltersDirective = ($log, $location, $rs, $confirm) -> $el.find('.my-filter-name').show() $el.find('.my-filter-name').focus() - $el.on "keyup", ".my-filter-name", (event) -> + $el.on "keyup", ".new .my-filter-name", (event) -> event.preventDefault() if event.keyCode == 13 target = angular.element(event.currentTarget) newFilter = target.val() - $ctrl.saveCurrentFiltersTo(newFilter).then -> - $ctrl.loadMyFilters().then (filters) -> + $loading.start($el.find(".new")) + promise = $ctrl.saveCurrentFiltersTo(newFilter) + promise.then -> + loadPromise = $ctrl.loadMyFilters() + loadPromise.then (filters) -> + $loading.finish($el.find(".new")) $scope.filters.myFilters = filters currentfilterstype = $el.find("h2 a.subfilter span.title").prop('data-type') @@ -661,6 +667,16 @@ IssuesFiltersDirective = ($log, $location, $rs, $confirm) -> $el.find('.my-filter-name').hide() $el.find('.save-filters').show() + + loadPromise.then null, -> + $loading.finish($el.find(".new")) + $confirm.notify("error", "Error loading custom filters") + + promise.then null, -> + $loading.finish($el.find(".new")) + $el.find(".my-filter-name").val(newFilter).focus().select() + $confirm.notify("error", "Filter not saved") + else if event.keyCode == 27 $el.find('.my-filter-name').val('') $el.find('.my-filter-name').hide() @@ -668,7 +684,7 @@ IssuesFiltersDirective = ($log, $location, $rs, $confirm) -> return {link:link} -module.directive("tgIssuesFilters", ["$log", "$tgLocation", "$tgResources", "$tgConfirm", +module.directive("tgIssuesFilters", ["$log", "$tgLocation", "$tgResources", "$tgConfirm", "$tgLoading", IssuesFiltersDirective]) diff --git a/app/coffee/modules/related-tasks.coffee b/app/coffee/modules/related-tasks.coffee index 1c98c6cb..9f594a76 100644 --- a/app/coffee/modules/related-tasks.coffee +++ b/app/coffee/modules/related-tasks.coffee @@ -25,7 +25,7 @@ debounce = @.taiga.debounce module = angular.module("taigaRelatedTasks", []) -RelatedTaskRowDirective = ($repo, $compile, $confirm, $rootscope) -> +RelatedTaskRowDirective = ($repo, $compile, $confirm, $rootscope, $loading) -> templateView = _.template("""
@@ -89,27 +89,34 @@ RelatedTaskRowDirective = ($repo, $compile, $confirm, $rootscope) -> link = ($scope, $el, $attrs, $model) -> saveTask = debounce 2000, (task) -> task.subject = $el.find('input').val() + + $loading.start($el.find('.task-name')) + promise = $repo.save(task) promise.then => + $loading.finish($el.find('.task-name')) $confirm.notify("success") $rootscope.$broadcast("related-tasks:update") promise.then null, => + $loading.finish($el.find('.task-name')) + $el.find('input').val(task.subject) $confirm.notify("error") + return promise renderEdit = (task) -> $el.html($compile(templateEdit({task: task}))($scope)) $el.on "keyup", "input", (event) -> if event.keyCode == 13 - saveTask($model.$modelValue) - renderView($model.$modelValue) + saveTask($model.$modelValue).then -> + renderView($model.$modelValue) else if event.keyCode == 27 renderView($model.$modelValue) $el.on "click", ".icon-floppy", (event) -> - saveTask($model.$modelValue) - renderView($model.$modelValue) + saveTask($model.$modelValue).then -> + renderView($model.$modelValue) $el.on "click", ".cancel-edit", (event) -> renderView($model.$modelValue) @@ -159,9 +166,9 @@ RelatedTaskRowDirective = ($repo, $compile, $confirm, $rootscope) -> return {link:link, require:"ngModel"} -module.directive("tgRelatedTaskRow", ["$tgRepo", "$compile", "$tgConfirm", "$rootScope", RelatedTaskRowDirective]) +module.directive("tgRelatedTaskRow", ["$tgRepo", "$compile", "$tgConfirm", "$rootScope", "$tgLoading", RelatedTaskRowDirective]) -RelatedTaskCreateFormDirective = ($repo, $compile, $confirm, $tgmodel) -> +RelatedTaskCreateFormDirective = ($repo, $compile, $confirm, $tgmodel, $loading) -> template = _.template("""
@@ -199,12 +206,16 @@ RelatedTaskCreateFormDirective = ($repo, $compile, $confirm, $tgmodel) -> $scope.newTask.status = $scope.project.default_task_status $scope.newTask.assigned_to = null + $loading.start($el.find('.task-name')) promise = $repo.create("tasks", task) promise.then -> + $loading.finish($el.find('.task-name')) $scope.$emit("related-tasks:add") $confirm.notify("success") promise.then null, -> + $el.find('input').val(task.subject) + $loading.finish($el.find('.task-name')) $confirm.notify("error") return promise @@ -245,7 +256,7 @@ RelatedTaskCreateFormDirective = ($repo, $compile, $confirm, $tgmodel) -> $el.off() return {link: link} -module.directive("tgRelatedTaskCreateForm", ["$tgRepo", "$compile", "$tgConfirm", "$tgModel", RelatedTaskCreateFormDirective]) +module.directive("tgRelatedTaskCreateForm", ["$tgRepo", "$compile", "$tgConfirm", "$tgModel", "$tgLoading", RelatedTaskCreateFormDirective]) RelatedTaskCreateButtonDirective = ($repo, $compile, $confirm, $tgmodel) -> template = _.template(""" diff --git a/app/coffee/modules/wiki/nav.coffee b/app/coffee/modules/wiki/nav.coffee index f2a26f0b..d1bfc4af 100644 --- a/app/coffee/modules/wiki/nav.coffee +++ b/app/coffee/modules/wiki/nav.coffee @@ -34,7 +34,7 @@ module = angular.module("taigaWiki") ## Wiki Main Directive ############################################################################# -WikiNavDirective = ($tgrepo, $log, $location, $confirm, $navUrls) -> +WikiNavDirective = ($tgrepo, $log, $location, $confirm, $navUrls, $loading) -> template = _.template("""

Links

@@ -128,13 +128,32 @@ WikiNavDirective = ($tgrepo, $log, $location, $confirm, $navUrls) -> target = angular.element(event.currentTarget) newLink = target.val() - $el.find(".new").addClass("hidden") - $el.find(".new input").val('') + $loading.start($el.find(".new")) - $tgrepo.create("wiki-links", {project: $scope.projectId, title: newLink, href: slugify(newLink)}).then -> - $ctrl.loadWikiLinks().then -> + promise = $tgrepo.create("wiki-links", {project: $scope.projectId, title: newLink, href: slugify(newLink)}) + promise.then -> + loadPromise = $ctrl.loadWikiLinks() + loadPromise.then -> + $loading.finish($el.find(".new")) + $el.find(".new").addClass("hidden") + $el.find(".new input").val('') + $el.find(".add-button").show() render($scope.wikiLinks) - $el.find(".add-button").show() + loadPromise.then null, -> + $loading.finish($el.find(".new")) + $el.find(".new").addClass("hidden") + $el.find(".new input").val('') + $el.find(".add-button").show() + $confirm.notify("error", "Error loading wiki links") + + promise.then null, (error) -> + $loading.finish($el.find(".new")) + $el.find(".new input").val(newLink) + $el.find(".new input").focus().select() + if error?.__all__?[0]? + $confirm.notify("error", "The link already exists") + else + $confirm.notify("error") else if event.keyCode == 27 target = angular.element(event.currentTarget) @@ -147,4 +166,4 @@ WikiNavDirective = ($tgrepo, $log, $location, $confirm, $navUrls) -> return {link:link} -module.directive("tgWikiNav", ["$tgRepo", "$log", "$tgLocation", "$tgConfirm", "$tgNavUrls", WikiNavDirective]) +module.directive("tgWikiNav", ["$tgRepo", "$log", "$tgLocation", "$tgConfirm", "$tgNavUrls", "$tgLoading", WikiNavDirective]) diff --git a/app/styles/modules/common/related-tasks.scss b/app/styles/modules/common/related-tasks.scss index 25407c88..b6ce9e04 100644 --- a/app/styles/modules/common/related-tasks.scss +++ b/app/styles/modules/common/related-tasks.scss @@ -97,6 +97,16 @@ padding: 3px; width: 85%; } + &.loading { + margin: 0; + padding: 8px; + text-align: center; + width: 100%; + span { + @include animation (loading .5s linear); + @include animation (spin 1s linear infinite); + } + } } .blocked, .blocked:hover { diff --git a/app/styles/modules/filters/filters.scss b/app/styles/modules/filters/filters.scss index 4bf75748..015df762 100644 --- a/app/styles/modules/filters/filters.scss +++ b/app/styles/modules/filters/filters.scss @@ -47,11 +47,30 @@ right: .7rem; top: .7rem; } + } .filters-inner { opacity: 0; @include transition (all .1s ease-in); + + .loading { + background: $grayer; + border: 1px solid #b8b8b8; + display: inline-block; + margin: 0; + padding: 8px; + text-align: center; + width: 100%; + .icon-spinner { + color: $whitish; + float: none; + } + span { + @include animation (loading .5s linear); + @include animation (spin 1s linear infinite); + } + } } .filters-applied { diff --git a/app/styles/modules/wiki/wiki-nav.scss b/app/styles/modules/wiki/wiki-nav.scss index a8e53663..ab827711 100644 --- a/app/styles/modules/wiki/wiki-nav.scss +++ b/app/styles/modules/wiki/wiki-nav.scss @@ -30,6 +30,22 @@ color: $gray-light; } } + &.loading { + background: $grayer; + border: 1px solid #b8b8b8; + margin: 0; + padding: 8px; + text-align: center; + width: 100%; + .icon-spinner { + color: $whitish; + float: none; + } + span { + @include animation (loading .5s linear); + @include animation (spin 1s linear infinite); + } + } } .button { color: $white;