taiga
/
taiga-front
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Adding loader to subject and description

stable
Jesús Espino 2014-10-17 08:30:26 +02:00 committed by David Barragán Merino
parent 0ff0d779a4
commit 77f9fce1ba
2 changed files with 42 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
app/coffee/modules/common/components.coffee
View File

@ -433,7 +433,7 @@ module.directive("tgDeleteButton", ["$tgRepo", "$tgConfirm", "$tgNavUrls", "$tgL
## Editable subject directive ## Editable subject directive
############################################################################# #############################################################################
EditableSubjectDirective = ($rootscope, $tgrepo, $confirm, $navurls, $location) -> EditableSubjectDirective = ($rootscope, $tgrepo, $confirm, $navurls, $location, $loading) ->
viewTemplate = _.template(""" viewTemplate = _.template("""
<%- item.subject %> <%- item.subject %>
<% if (canEdit) { %> <% if (canEdit) { %>
@ -443,6 +443,9 @@ EditableSubjectDirective = ($rootscope, $tgrepo, $confirm, $navurls, $location)
editTemplate = _.template(""" editTemplate = _.template("""
<input type="text" value="<%- item.subject %>" data-required="true" data-maxlength="500"/> <input type="text" value="<%- item.subject %>" data-required="true" data-maxlength="500"/>
<div class="save-container">
<a class="save icon icon-floppy" href="" title="Save" />
</div>
""") """)
link = ($scope, $el, $attrs, $model) -> link = ($scope, $el, $attrs, $model) ->
@ -456,6 +459,19 @@ EditableSubjectDirective = ($rootscope, $tgrepo, $confirm, $navurls, $location)
canEdit = $scope.project.my_permissions.indexOf($attrs.requiredPerm) != -1 canEdit = $scope.project.my_permissions.indexOf($attrs.requiredPerm) != -1
$el.html(viewTemplate({item: $model.$modelValue, canEdit: canEdit})) $el.html(viewTemplate({item: $model.$modelValue, canEdit: canEdit}))
save = ->
$model.$modelValue.subject = $el.find('input').val()
$loading.start($el.find('.save-container'))
promise = $tgrepo.save($model.$modelValue)
promise.then ->
$rootscope.$broadcast("history:reload")
editing = false
$loading.finish($el.find('.save-container'))
render()
promise.then null, ->
$confirm.notify("error")
$loading.finish($el.find('.save-container'))
$scope.$watch $attrs.ngModel, (item) -> $scope.$watch $attrs.ngModel, (item) ->
return if not item return if not item
render() render()
@ -470,16 +486,12 @@ EditableSubjectDirective = ($rootscope, $tgrepo, $confirm, $navurls, $location)
render() render()
$el.find('input').focus() $el.find('input').focus()
$el.on "click", ".save", ->
save()
$el.on "keyup", "input", -> $el.on "keyup", "input", ->
if event.keyCode == 13 if event.keyCode == 13
$model.$modelValue.subject = $el.find('input').val() save()
promise = $tgrepo.save($model.$modelValue)
promise.then ->
$rootscope.$broadcast("history:reload")
editing = false
render()
promise.then null, ->
$confirm.notify("error")
else if event.keyCode == 27 else if event.keyCode == 27
editing = false editing = false
$model.$modelValue.revert() $model.$modelValue.revert()
@ -491,13 +503,13 @@ EditableSubjectDirective = ($rootscope, $tgrepo, $confirm, $navurls, $location)
require: "ngModel" require: "ngModel"
} }
module.directive("tgEditableSubject", ["$rootScope", "$tgRepo", "$tgConfirm", "$tgNavUrls", "$tgLocation", EditableSubjectDirective]) module.directive("tgEditableSubject", ["$rootScope", "$tgRepo", "$tgConfirm", "$tgNavUrls", "$tgLocation", "$tgLoading", EditableSubjectDirective])
############################################################################# #############################################################################
## Editable subject directive ## Editable subject directive
############################################################################# #############################################################################
EditableDescriptionDirective = ($rootscope, $tgrepo, $confirm, $navurls, $location, $compile) -> EditableDescriptionDirective = ($rootscope, $tgrepo, $confirm, $navurls, $location, $compile, $loading) ->
viewTemplate = _.template(""" viewTemplate = _.template("""
<section class="us-content wysiwyg"><%= descriptionHtml %></section> <section class="us-content wysiwyg"><%= descriptionHtml %></section>
<% if (canEdit) { %> <% if (canEdit) { %>
@ -509,7 +521,9 @@ EditableDescriptionDirective = ($rootscope, $tgrepo, $confirm, $navurls, $locati
<textarea placeholder="Write a description of your user story" <textarea placeholder="Write a description of your user story"
ng-model="item.description" ng-model="item.description"
tg-markitup="tg-markitup"><%- item.description %></textarea> tg-markitup="tg-markitup"><%- item.description %></textarea>
<div class="save-container">
<a class="save icon icon-floppy" href="" title="Save" /> <a class="save icon icon-floppy" href="" title="Save" />
</div>
""") """)
link = ($scope, $el, $attrs, $model) -> link = ($scope, $el, $attrs, $model) ->
@ -539,13 +553,16 @@ EditableDescriptionDirective = ($rootscope, $tgrepo, $confirm, $navurls, $locati
$el.on "click", ".save", -> $el.on "click", ".save", ->
$model.$modelValue.description = scope.item.description $model.$modelValue.description = scope.item.description
$loading.start($el.find('.save-container'))
promise = $tgrepo.save($model.$modelValue) promise = $tgrepo.save($model.$modelValue)
promise.then -> promise.then ->
$rootscope.$broadcast("history:reload") $rootscope.$broadcast("history:reload")
editing = false editing = false
$loading.finish($el.find('.save-container'))
render() render()
promise.then null, -> promise.then null, ->
$confirm.notify("error") $confirm.notify("error")
$loading.finish($el.find('.save-container'))
$el.on "keyup", "textarea", -> $el.on "keyup", "textarea", ->
if event.keyCode == 27 if event.keyCode == 27
@ -559,7 +576,7 @@ EditableDescriptionDirective = ($rootscope, $tgrepo, $confirm, $navurls, $locati
require: "ngModel" require: "ngModel"
} }
module.directive("tgEditableDescription", ["$rootScope", "$tgRepo", "$tgConfirm", "$tgNavUrls", "$tgLocation", "$compile", EditableDescriptionDirective]) module.directive("tgEditableDescription", ["$rootScope", "$tgRepo", "$tgConfirm", "$tgNavUrls", "$tgLocation", "$compile", "$tgLoading", EditableDescriptionDirective])
############################################################################# #############################################################################
## Common list directives ## Common list directives

12
app/styles/layout/us-detail.scss
View File

@ -57,6 +57,12 @@
display: flex; display: flex;
margin-bottom: 0; margin-bottom: 0;
max-width: 94%; max-width: 94%;
.save-container {
&.loading span {
@include animation (loading .5s linear);
@include animation (spin 1s linear infinite);
}
}
} }
.us-number { .us-number {
@extend %xlarge; @extend %xlarge;
@ -139,6 +145,12 @@
height: 10rem; height: 10rem;
margin-bottom: 2rem; margin-bottom: 2rem;
} }
.save-container {
&.loading span {
@include animation (loading .5s linear);
@include animation (spin 1s linear infinite);
}
}
} }
.comment-list { .comment-list {