lightbox refactor

stable
Juanfran 2014-08-05 14:53:17 +02:00
parent c3e96c16c8
commit e5d0428373
9 changed files with 95 additions and 101 deletions

View File

@ -56,16 +56,11 @@ CreateMembersDirective = ($rs, $rootScope, $confirm) ->
$scope.$on "membersform:new", ->
resetForm()
$el.removeClass("hidden")
lightboxService.open($el)
$scope.$on "$destroy", ->
$el.off()
# Dom Event Handlers
$el.on "click", ".close", (event) ->
event.preventDefault()
$el.addClass("hidden")
$el.on "click", ".delete-fieldset", (event) ->
event.preventDefault()
target = angular.element(event.currentTarget)
@ -97,12 +92,12 @@ CreateMembersDirective = ($rs, $rootScope, $confirm) ->
event.preventDefault()
onSuccess = (data) ->
$el.addClass("hidden")
lightboxService.close($el)
$confirm.notify("success")
$rootScope.$broadcast("membersform:new:success")
onError = (data) ->
$el.addClass("hidden")
lightboxService.close($el)
$confirm.notify("error")
$rootScope.$broadcast("membersform:new:error")
@ -123,5 +118,5 @@ CreateMembersDirective = ($rs, $rootScope, $confirm) ->
return {link: link}
module.directive("tgLbCreateMembers", ["$tgResources", "$rootScope", "$tgConfirm",
module.directive("tgLbCreateMembers", ["$tgResources", "$rootScope", "$tgConfirm", "lightboxService",
CreateMembersDirective])

View File

@ -28,7 +28,7 @@ module = angular.module("taigaBacklog")
## Creare/Edit Sprint Lightbox Directive
#############################################################################
CreateEditSprint = ($repo, $confirm, $rs, $rootscope) ->
CreateEditSprint = ($repo, $confirm, $rs, $rootscope, lightboxService) ->
link = ($scope, $el, attrs) ->
createSprint = true
@ -46,7 +46,7 @@ CreateEditSprint = ($repo, $confirm, $rs, $rootscope) ->
promise.then (data) ->
$scope.sprintsCounter += 1 if createSprint
$el.addClass("hidden")
lightboxService.close($el)
$rootscope.$broadcast("sprintform:create:success", data)
promise.then null, (data) ->
@ -60,7 +60,7 @@ CreateEditSprint = ($repo, $confirm, $rs, $rootscope) ->
$confirm.ask(title, subtitle).then =>
$repo.remove($scope.sprint).then ->
$scope.milestonesCounter -= 1
$el.addClass("hidden")
lightboxService.close($el)
$rootscope.$broadcast("sprintform:remove:success")
$scope.$on "sprintform:create", ->
@ -80,7 +80,7 @@ CreateEditSprint = ($repo, $confirm, $rs, $rootscope) ->
$el.find(".delete-sprint").hide()
$el.find(".title").text("New sprint") #TODO i18n
$el.find(".button-green").text("Create") #TODO i18n
$el.removeClass("hidden")
lightboxService.open($el)
$scope.$on "sprintform:edit", (ctx, sprint) ->
createSprint = false
@ -90,11 +90,7 @@ CreateEditSprint = ($repo, $confirm, $rs, $rootscope) ->
$el.find(".delete-sprint").show()
$el.find(".title").text("Edit sprint") #TODO i18n
$el.find(".button-green").text("Save") #TODO i18n
$el.removeClass("hidden")
$el.on "click", ".close", (event) ->
event.preventDefault()
$el.addClass("hidden")
lightboxService.close($el)
$el.on "click", ".button-green", (event) ->
event.preventDefault()
@ -115,5 +111,6 @@ module.directive("tgLbCreateEditSprint", [
"$tgConfirm",
"$tgResources",
"$rootScope",
"lightboxService"
CreateEditSprint
])

View File

@ -23,16 +23,39 @@ module = angular.module("taigaCommon")
bindOnce = @.taiga.bindOnce
class LightboxService extends taiga.Service
open: (lightbox) ->
lightbox.addClass('open')
close: (lightbox) ->
lightbox.removeClass('open')
module.service("lightboxService", LightboxService)
LightboxDirective = (lightboxService) ->
link = ($scope, $el, $attrs) ->
$el.on "click", ".close", (event) ->
event.preventDefault()
lightboxService.close($el)
return {
restrict: "C",
link: link
}
module.directive("lightbox", ["lightboxService", LightboxDirective])
#############################################################################
## Block Lightbox Directive
#############################################################################
BlockLightboxDirective = ->
BlockLightboxDirective = (lightboxService) ->
link = ($scope, $el, $attrs, $model) ->
title = $attrs.title
$el.find("h2.title").text(title)
$scope.$on "block", ->
$el.removeClass("hidden")
lightboxService.close($el)
$scope.$on "unblock", ->
$model.$modelValue.is_blocked = false
@ -41,10 +64,6 @@ BlockLightboxDirective = ->
$scope.$on "$destroy", ->
$el.off()
$el.on "click", ".close", (event) ->
event.preventDefault()
$el.addClass("hidden")
$el.on "click", ".button-green", (event) ->
event.preventDefault()
target = angular.element(event.currentTarget)
@ -53,7 +72,7 @@ BlockLightboxDirective = ->
$model.$modelValue.is_blocked = true
$model.$modelValue.blocked_note = $el.find(".reason").val()
$el.addClass("hidden")
lightboxService.close($el)
return {
templateUrl: "/partials/views/modules/lightbox_block.html"
@ -61,14 +80,14 @@ BlockLightboxDirective = ->
require:"ngModel"
}
module.directive("tgLbBlock", BlockLightboxDirective)
module.directive("tgLbBlock", ["lightboxService", BlockLightboxDirective])
#############################################################################
## Create/Edit Userstory Lightbox Directive
#############################################################################
CreateEditUserstoryDirective = ($repo, $model, $rs, $rootScope) ->
CreateEditUserstoryDirective = ($repo, $model, $rs, $rootScope, lightboxService) ->
link = ($scope, $el, attrs) ->
isNew = true
@ -82,7 +101,7 @@ CreateEditUserstoryDirective = ($repo, $model, $rs, $rootScope) ->
# Update texts for creation
$el.find(".button-green span").html("Create") #TODO: i18n
$el.find(".title").html("New user story ") #TODO: i18n
$el.removeClass("hidden")
lightboxService.open($el)
$scope.$on "usform:edit", (ctx, us) ->
$scope.us = us
@ -90,7 +109,7 @@ CreateEditUserstoryDirective = ($repo, $model, $rs, $rootScope) ->
# Update texts for edition
$el.find(".button-green span").html("Save") #TODO: i18n
$el.find(".title").html("Edit user story ") #TODO: i18n
$el.removeClass("hidden")
lightboxService.open($el)
# Update requirement info (team, client or blocked)
if us.is_blocked
@ -105,12 +124,6 @@ CreateEditUserstoryDirective = ($repo, $model, $rs, $rootScope) ->
$scope.$on "$destroy", ->
$el.off()
# Dom Event Handlers
$el.on "click", ".close", (event) ->
event.preventDefault()
$el.addClass("hidden")
$el.on "click", ".button-green", (event) ->
event.preventDefault()
form = $el.find("form").checksley()
@ -125,7 +138,7 @@ CreateEditUserstoryDirective = ($repo, $model, $rs, $rootScope) ->
broadcastEvent = "usform:edit:success"
promise.then (data) ->
$el.addClass("hidden")
lightboxService.close($el)
$rootScope.$broadcast(broadcastEvent, data)
$el.on "click", "label.blocked", (event) ->
@ -155,6 +168,7 @@ module.directive("tgLbCreateEditUserstory", [
"$tgModel",
"$tgResources",
"$rootScope",
"lightboxService",
CreateEditUserstoryDirective
])
@ -163,7 +177,7 @@ module.directive("tgLbCreateEditUserstory", [
## Creare Bulk Userstories Lightbox Directive
#############################################################################
CreateBulkUserstoriesDirective = ($repo, $rs, $rootscope) ->
CreateBulkUserstoriesDirective = ($repo, $rs, $rootscope, lightboxService) ->
link = ($scope, $el, attrs) ->
$scope.$on "usform:bulk", (ctx, projectId, status) ->
$scope.new = {
@ -171,11 +185,7 @@ CreateBulkUserstoriesDirective = ($repo, $rs, $rootscope) ->
statusId: status
bulk: ""
}
$el.removeClass("hidden")
$el.on "click", ".close", (event) ->
event.preventDefault()
$el.addClass("hidden")
lightboxService.close($el)
$el.on "click", ".button-green", (event) ->
event.preventDefault()
@ -186,7 +196,7 @@ CreateBulkUserstoriesDirective = ($repo, $rs, $rootscope) ->
$rs.userstories.bulkCreate($scope.new.projectId, $scope.new.statusId, $scope.new.bulk).then (result) ->
$rootscope.$broadcast("usform:bulk:success", result)
$el.addClass("hidden")
lightboxService.close($el)
$scope.$on "$destroy", ->
$el.off()
@ -197,6 +207,7 @@ module.directive("tgLbCreateBulkUserstories", [
"$tgRepo",
"$tgResources",
"$rootScope",
"lightboxService",
CreateBulkUserstoriesDirective
])
@ -240,7 +251,7 @@ usersTemplate = _.template("""
<% } %>
""")
AssignedToLightboxDirective = ->
AssignedToLightboxDirective = (lightboxService) ->
link = ($scope, $el, $attrs) ->
selectedUser = null
selectedItem = null
@ -272,7 +283,7 @@ AssignedToLightboxDirective = ->
selectedUser = $scope.usersById[assignedToId]
render(selectedUser)
$el.removeClass("hidden")
lightboxService.open($el)
$scope.$watch "usersSearch", (searchingText) ->
render(selectedUser, searchingText) if searchingText?
@ -281,7 +292,8 @@ AssignedToLightboxDirective = ->
event.preventDefault()
target = angular.element(event.currentTarget)
$el.addClass("hidden")
lightboxService.close($el)
$scope.$apply ->
$scope.$broadcast("assigned-to:added", target.data("user-id"), selectedItem)
$scope.usersSearch = null
@ -290,14 +302,17 @@ AssignedToLightboxDirective = ->
event.preventDefault()
event.stopPropagation()
$el.addClass("hidden")
lightboxService.close($el)
$scope.$apply ->
$scope.usersSearch = null
$scope.$broadcast("assigned-to:added", null, selectedItem)
$el.on "click", ".close", (event) ->
event.preventDefault()
$el.addClass("hidden")
lightboxService.close($el)
$scope.$apply ->
$scope.usersSearch = null
@ -310,14 +325,14 @@ AssignedToLightboxDirective = ->
}
module.directive("tgLbAssignedto", AssignedToLightboxDirective)
module.directive("tgLbAssignedto", ["lightboxService", AssignedToLightboxDirective])
#############################################################################
## Watchers Lightbox directive
#############################################################################
WatchersLightboxDirective = ($repo) ->
WatchersLightboxDirective = ($repo, lightboxService) ->
link = ($scope, $el, $attrs) ->
selectedItem = null
@ -354,7 +369,7 @@ WatchersLightboxDirective = ($repo) ->
users = getFilteredUsers()
render(users)
$el.removeClass("hidden")
lightboxService.open($el)
$scope.$watch "usersSearch", (searchingText) ->
if not searchingText?
@ -364,7 +379,7 @@ WatchersLightboxDirective = ($repo) ->
render(users)
$el.on "click", ".watcher-single", (event) ->
$el.addClass("hidden")
lightboxService.close($el)
event.preventDefault()
target = angular.element(event.currentTarget)
@ -375,7 +390,7 @@ WatchersLightboxDirective = ($repo) ->
$el.on "click", ".close", (event) ->
event.preventDefault()
$el.addClass("hidden")
lightboxService.close($el)
$scope.$apply ->
$scope.usersSearch = null
@ -387,4 +402,4 @@ WatchersLightboxDirective = ($repo) ->
link:link
}
module.directive("tgLbWatchers", ["$tgRepo", WatchersLightboxDirective])
module.directive("tgLbWatchers", ["$tgRepo", "lightboxService", WatchersLightboxDirective])

View File

@ -28,13 +28,13 @@ module = angular.module("taigaIssues")
## Issue Create Lightbox Directive
#############################################################################
CreateIssueDirective = ($repo, $model, $rs, $rootscope) ->
CreateIssueDirective = ($repo, $model, $rs, $rootscope, lightboxService) ->
link = ($scope, $el, $attrs) ->
form = $el.find("form").checksley()
$scope.issue = {}
$scope.$on "issueform:new", (ctx, project)->
$el.removeClass("hidden")
lightboxService.open($el)
$scope.issue = {
project: project.id
@ -57,7 +57,7 @@ CreateIssueDirective = ($repo, $model, $rs, $rootscope) ->
promise = $repo.create("issues", $scope.issue)
promise.then (data) ->
$el.addClass("hidden")
lightboxService.close($el)
console.log "succcess", data
$rootscope.$broadcast("issueform:new:success", data)
@ -65,10 +65,6 @@ CreateIssueDirective = ($repo, $model, $rs, $rootscope) ->
promise.then null, ->
console.log "FAIL"
$el.on "click", ".close", (event) ->
event.preventDefault()
$el.addClass("hidden")
$el.on "click", ".button-green", (event) ->
event.preventDefault()
submit()
@ -80,19 +76,15 @@ CreateIssueDirective = ($repo, $model, $rs, $rootscope) ->
return {link:link}
CreateBulkIssuesDirective = ($repo, $rs, $rootscope) ->
CreateBulkIssuesDirective = ($repo, $rs, $rootscope, lightboxService) ->
link = ($scope, $el, attrs) ->
$scope.$on "issueform:bulk", (ctx, projectId, status)->
$el.removeClass("hidden")
lightboxService.open($el)
$scope.new = {
projectId: projectId
bulk: ""
}
$el.on "click", ".close", (event) ->
event.preventDefault()
$el.addClass("hidden")
$el.on "click", ".button-green", (event) ->
event.preventDefault()
@ -106,7 +98,7 @@ CreateBulkIssuesDirective = ($repo, $rs, $rootscope) ->
promise = $rs.issues.bulkCreate(projectId, data)
promise.then (result) ->
$rootscope.$broadcast("issueform:new:success", result)
$el.addClass("hidden")
lightboxService.close($el)
# TODO: error handling
promise.then null, ->
@ -122,6 +114,7 @@ module.directive("tgLbCreateIssue", [
"$tgModel",
"$tgResources",
"$rootScope",
"lightboxService",
CreateIssueDirective
])
@ -129,6 +122,7 @@ module.directive("tgLbCreateBulkIssues", [
"$tgRepo",
"$tgResources",
"$rootScope",
"lightboxService",
CreateBulkIssuesDirective
])

View File

@ -3,14 +3,14 @@ bindOnce = @.taiga.bindOnce
module = angular.module("taigaProject")
CreateProject = ($repo, $confirm, $location, $navurls, $rs) ->
CreateProject = ($repo, $confirm, $location, $navurls, $rs, lightboxService) ->
link = ($scope, $el, attrs) ->
$scope.data = {}
$scope.templates = []
form = $el.find("form").checksley()
onSuccessSubmit = (response) ->
$el.addClass("hidden")
lightboxService.close($el)
$confirm.notify("success", "Success") #TODO: i18n
@ -38,11 +38,7 @@ CreateProject = ($repo, $confirm, $location, $navurls, $rs) ->
.then (result) =>
$scope.templates = _.map(result, (item) -> {"id": item.id, "name": item.name})
$el.removeClass("hidden")
$el.on "click", ".close", (event) ->
event.preventDefault()
$el.addClass("hidden")
lightboxService.open($el)
$el.on "click", "a.button-green", (event) ->
event.preventDefault()
@ -56,5 +52,6 @@ module.directive("tgLbCreateProject", [
"$location",
"$tgNavUrls",
"$tgResources",
"lightboxService",
CreateProject
])

View File

@ -22,7 +22,7 @@
taiga = @.taiga
bindOnce = @.taiga.bindOnce
CreateEditTaskDirective = ($repo, $model, $rs, $rootscope) ->
CreateEditTaskDirective = ($repo, $model, $rs, $rootscope, lightboxService) ->
link = ($scope, $el, attrs) ->
isNew = true
@ -40,7 +40,7 @@ CreateEditTaskDirective = ($repo, $model, $rs, $rootscope) ->
# Update texts for creation
$el.find(".button-green span").html("Create") #TODO: i18n
$el.find(".title").html("New task ") #TODO: i18n
$el.removeClass("hidden")
lightboxService.open($el)
$scope.$on "taskform:edit", (ctx, task) ->
$scope.task = task
@ -49,7 +49,7 @@ CreateEditTaskDirective = ($repo, $model, $rs, $rootscope) ->
# Update texts for edition
$el.find(".button-green span").html("Save") #TODO: i18n
$el.find(".title").html("Edit task ") #TODO: i18n
$el.removeClass("hidden")
lightboxService.open($el)
# Update requirement info (team, client or blocked)
if task.is_blocked
@ -59,12 +59,6 @@ CreateEditTaskDirective = ($repo, $model, $rs, $rootscope) ->
if task.is_iocaine
$el.find("label.iocaine").addClass("selected")
# Dom Event Handlers
$el.on "click", ".close", (event) ->
event.preventDefault()
$el.addClass("hidden")
$el.on "click", ".button-green", (event) ->
event.preventDefault()
@ -81,7 +75,7 @@ CreateEditTaskDirective = ($repo, $model, $rs, $rootscope) ->
# FIXME: error handling?
promise.then (data) ->
$el.addClass("hidden")
lightboxService.close($el)
$rootscope.$broadcast(broadcastEvent, data)
$el.on "click", "label.blocked", (event) ->
@ -102,17 +96,17 @@ CreateEditTaskDirective = ($repo, $model, $rs, $rootscope) ->
return {link: link}
CreateBulkTasksDirective = ($repo, $rs, $rootscope) ->
CreateBulkTasksDirective = ($repo, $rs, $rootscope, lightboxService) ->
link = ($scope, $el, attrs) ->
$scope.form = {data: "", usId: null}
$scope.$on "taskform:bulk", (ctx, sprintId, usId)->
$el.removeClass("hidden")
lightboxService.open($el)
$scope.form = {data: "", sprintId: sprintId, usId: usId}
$el.on "click", ".close", (event) ->
event.preventDefault()
$el.addClass("hidden")
lightboxService.close($el)
$el.on "click", ".button-green", (event) ->
event.preventDefault()
@ -129,7 +123,7 @@ CreateBulkTasksDirective = ($repo, $rs, $rootscope) ->
promise = $rs.tasks.bulkCreate(projectId, sprintId, usId, data)
promise.then (result) ->
$rootscope.$broadcast("taskform:bulk:success", result)
$el.addClass("hidden")
lightboxService.close($el)
# TODO: error handling
promise.then null, ->
@ -148,6 +142,7 @@ module.directive("tgLbCreateEditTask", [
"$tgModel",
"$tgResources",
"$rootScope",
"lightboxService",
CreateEditTaskDirective
])
@ -155,5 +150,6 @@ module.directive("tgLbCreateBulkTasks", [
"$tgRepo",
"$tgResources",
"$rootScope",
"lightboxService",
CreateBulkTasksDirective
])

View File

@ -28,10 +28,10 @@ module = angular.module("taigaUserSettings")
## Delete User Lightbox Directive
#############################################################################
DeleteUserDirective = ($repo, $rootscope, $auth, $location) ->
DeleteUserDirective = ($repo, $rootscope, $auth, $location, lightboxService) ->
link = ($scope, $el, $attrs) ->
$scope.$on "deletelightbox:new", (ctx, user)->
$el.removeClass("hidden")
lightboxService.open($el)
$scope.$on "$destroy", ->
$el.off()
@ -40,7 +40,7 @@ DeleteUserDirective = ($repo, $rootscope, $auth, $location) ->
promise = $repo.remove($scope.user)
promise.then (data) ->
$el.addClass("hidden")
lightboxService.close($el)
$auth.logout()
$location.path("/login")
@ -48,13 +48,9 @@ DeleteUserDirective = ($repo, $rootscope, $auth, $location) ->
promise.then null, ->
console.log "FAIL"
$el.on "click", ".close", (event) ->
event.preventDefault()
$el.addClass("hidden")
$el.on "click", ".button-red", (event) ->
event.preventDefault()
$el.addClass("hidden")
lightboxService.close($el)
$el.on "click", ".button-green", (event) ->
event.preventDefault()
@ -63,4 +59,4 @@ DeleteUserDirective = ($repo, $rootscope, $auth, $location) ->
return {link:link}
module.directive("tgLbDeleteUser", ["$tgRepo", "$rootScope", "$tgAuth", "$location", DeleteUserDirective])
module.directive("tgLbDeleteUser", ["$tgRepo", "$rootScope", "$tgAuth", "$location", "lightboxService", DeleteUserDirective])

View File

@ -29,9 +29,9 @@ block content
include views/modules/backlog-table
sidebar.menu-secondary.sidebar
include views/modules/sprints
div.lightbox.lightbox_add-new-us.hidden(tg-lb-create-edit-userstory)
div.lightbox.lightbox_add-new-us(tg-lb-create-edit-userstory)
include views/modules/lightbox_add-new-us
div.lightbox.lightbox_add-bulk.hidden(tg-lb-create-bulk-userstories)
div.lightbox.lightbox_add-bulk(tg-lb-create-bulk-userstories)
include views/modules/lightbox_add-bulk
div.lightbox.lightbox_add-sprint.hidden(tg-lb-create-edit-sprint)
div.lightbox.lightbox_add-sprint(tg-lb-create-edit-sprint)
include views/modules/lightbox_add-edit-sprint

View File

@ -2,6 +2,7 @@
@include background-opacity($white, .95);
@include table-flex(center, center, flex, row, wrap, center);
bottom: 0;
display: none;
left: 0;
position: fixed;
right: 0;
@ -29,6 +30,9 @@
padding: 12px;
text-align: center;
}
&.open {
display: flex;
}
}
.markdown-preview {