Refactored edit subject directive

stable
Jesús Espino 2014-10-20 19:07:34 +02:00 committed by David Barragán Merino
parent 5b681cf82f
commit d1df910817
1 changed files with 27 additions and 34 deletions

View File

@ -438,55 +438,44 @@ module.directive("tgDeleteButton", ["$tgRepo", "$tgConfirm", "$tgNavUrls", "$tgL
############################################################################# #############################################################################
EditableSubjectDirective = ($rootscope, $repo, $confirm, $loading) -> EditableSubjectDirective = ($rootscope, $repo, $confirm, $loading) ->
viewTemplate = _.template(""" template = """
<%- item.subject %> <div class="view-subject">
<% if (canEdit) { %> {{ item.subject }}
<a class="edit icon icon-edit" href="" title="Edit" /> <a class="edit icon icon-edit" href="" title="Edit" />
<% } %> </div>
""") <div class="edit-subject">
<input type="text" ng-model="item.subject" data-required="true" data-maxlength="500"/>
editTemplate = _.template("""
<input type="text" value="<%- item.subject %>" data-required="true" data-maxlength="500"/>
<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) ->
editing = false
scope = $scope.$new()
render = ->
if editing
$el.html(editTemplate({item: scope.item}))
else
canEdit = $scope.project.my_permissions.indexOf($attrs.requiredPerm) != -1
$el.html(viewTemplate({item: $model.$modelValue, canEdit: canEdit}))
save = -> save = ->
$model.$modelValue.subject = $el.find('input').val() $model.$modelValue.subject = $scope.item.subject
$loading.start($el.find('.save-container')) $loading.start($el.find('.save-container'))
promise = $repo.save($model.$modelValue) promise = $repo.save($model.$modelValue)
promise.then -> promise.then ->
$confirm.notify("success") $confirm.notify("success")
$rootscope.$broadcast("history:reload") $rootscope.$broadcast("history:reload")
editing = false $el.find('div.edit-subject').hide()
$loading.finish($el.find('.save-container')) $el.find('div.view-subject').show()
render()
promise.then null, -> promise.then null, ->
$confirm.notify("error") $confirm.notify("error")
promise.finally ->
$loading.finish($el.find('.save-container')) $loading.finish($el.find('.save-container'))
$scope.$watch $attrs.ngModel, (item) -> $scope.$watch $attrs.ngModel, (value) ->
return if not item return if not value
render() $scope.item = value
if $scope.project.my_permissions.indexOf($attrs.requiredPerm) != -1
$el.find('div.view-subject span.edit').show()
$scope.$on "$destroy", -> $scope.$on "$destroy", ->
$el.off() $el.off()
$el.click -> $el.click ->
if not editing and $scope.project.my_permissions.indexOf($attrs.requiredPerm) != -1 $el.find('div.edit-subject').show()
editing = true $el.find('div.view-subject').hide()
scope.item = {subject: $model.$modelValue.subject}
render()
$el.find('input').focus() $el.find('input').focus()
$el.on "click", ".save", -> $el.on "click", ".save", ->
@ -496,14 +485,18 @@ EditableSubjectDirective = ($rootscope, $repo, $confirm, $loading) ->
if event.keyCode == 13 if event.keyCode == 13
save() save()
else if event.keyCode == 27 else if event.keyCode == 27
editing = false
$model.$modelValue.revert() $model.$modelValue.revert()
render() $el.find('div.edit-subject').hide()
$el.find('div.view-subject').show()
$el.find('div.edit-subject').hide()
$el.find('div.view-subject span.edit').hide()
return { return {
link: link link: link
restrict: "EA" restrict: "EA"
require: "ngModel" require: "ngModel"
template: template
} }
module.directive("tgEditableSubject", ["$rootScope", "$tgRepo", "$tgConfirm", "$tgLoading", module.directive("tgEditableSubject", ["$rootScope", "$tgRepo", "$tgConfirm", "$tgLoading",