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

Merge pull request #12 from taigaio/bugfix-taskboard-lightbox-form 

Lightbox improvements
stable
David Barragán Merino 2014-09-07 11:14:24 +02:00
parent c5958ba32d 7a960b844a
commit 9d7d1748e9
15 changed files with 153 additions and 108 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
app/coffee/modules/common/lightboxes.coffee
View File

@ -148,6 +148,46 @@ BlockLightboxDirective = (lightboxService) ->
module.directive("tgLbBlock", ["lightboxService", BlockLightboxDirective]) module.directive("tgLbBlock", ["lightboxService", BlockLightboxDirective])
#############################################################################
## Generic Lightbox Blocking-Message Input Directive
#############################################################################
BlockingMessageInputDirective = ($log) ->
template = _.template("""
<fieldset class="blocked-note hidden">
<textarea name="blocked_note"
placeholder="Why is this user story blocked?"
ng-model="<%- ngmodel %>">
</textarea>
</fieldset>
""")
link = ($scope, $el, $attrs, $model) ->
if not $attrs.watch
return $log.error "No watch attribute on tg-blocking-message-input directive"
$scope.$watch $attrs.watch, (value) ->
return if value is undefined
if value == true
$el.find(".blocked-note").show(400)
else
$el.find(".blocked-note").hide(400)
templateFn = ($el, $attrs) ->
return template({ngmodel: $attrs.ngModel})
return {
template: templateFn
link: link
require: "ngModel"
restrict: "EA"
}
module.directive("tgBlockingMessageInput", ["$log", BlockingMessageInputDirective])
############################################################################# #############################################################################
## Create/Edit Userstory Lightbox Directive ## Create/Edit Userstory Lightbox Directive
############################################################################# #############################################################################
@ -231,23 +271,6 @@ CreateEditUserstoryDirective = ($repo, $model, $rs, $rootScope, lightboxService,
if data._error_message if data._error_message
$confirm.notify("error", data._error_message) $confirm.notify("error", data._error_message)
$el.on "click", "label.blocked", (event) ->
event.preventDefault()
target = angular.element(event.currentTarget)
target.toggleClass("selected")
$scope.us.is_blocked = not $scope.us.is_blocked
$el.find(".blocked-note").toggle(400)
$el.on "click", "label.team-requirement", (event) ->
event.preventDefault()
angular.element(event.currentTarget).toggleClass("selected")
$scope.us.team_requirement = not $scope.us.team_requirement
$el.on "click", "label.client-requirement", (event) ->
event.preventDefault()
angular.element(event.currentTarget).toggleClass("selected")
$scope.us.client_requirement = not $scope.us.client_requirement
$scope.$on "$destroy", -> $scope.$on "$destroy", ->
$el.off() $el.off()

15
app/coffee/modules/kanban/main.coffee
View File

@ -135,11 +135,12 @@ class KanbanController extends mixOf(taiga.Controller, taiga.PageMixin, taiga.Fi
loadProject: -> loadProject: ->
return @rs.projects.get(@scope.projectId).then (project) => return @rs.projects.get(@scope.projectId).then (project) =>
@scope.project = project @scope.project = project
@scope.$emit('project:loaded', project)
@scope.points = _.sortBy(project.points, "order") @scope.points = _.sortBy(project.points, "order")
@scope.pointsById = groupBy(project.points, (x) -> x.id) @scope.pointsById = groupBy(project.points, (x) -> x.id)
@scope.usStatusById = groupBy(project.us_statuses, (x) -> x.id) @scope.usStatusById = groupBy(project.us_statuses, (x) -> x.id)
@scope.usStatusList = _.sortBy(project.us_statuses, "order") @scope.usStatusList = _.sortBy(project.us_statuses, "order")
@scope.$emit("project:loaded", project)
return project return project
loadInitialData: -> loadInitialData: ->
@ -245,12 +246,12 @@ module.directive("tgKanbanRowSizeFixer", KanbanRowSizeFixer)
KanbanUserstoryDirective = ($rootscope) -> KanbanUserstoryDirective = ($rootscope) ->
link = ($scope, $el, $attrs, $model) -> link = ($scope, $el, $attrs, $model) ->
$el.find(".icon-edit").on "click", (event) -> $el.find(".icon-edit").on "click", (event) ->
if $el.find('.icon-edit').hasClass('noclick') if $el.find(".icon-edit").hasClass("noclick")
return return
$scope.$apply -> $scope.$apply ->
$rootscope.$broadcast("usform:edit", $model.$modelValue) $rootscope.$broadcast("usform:edit", $model.$modelValue)
if $scope.us.is_blocked if $scope.us.is_blocked
$el.addClass('blocked') $el.addClass("blocked")
$el.disableSelection() $el.disableSelection()
return { return {
@ -272,9 +273,9 @@ KanbanWipLimitDirective = ->
$el.disableSelection() $el.disableSelection()
redrawWipLimit = -> redrawWipLimit = ->
$el.find('.kanban-wip-limit').remove() $el.find(".kanban-wip-limit").remove()
timeout 200, -> timeout 200, ->
element = $el.find('.kanban-task')[$scope.status.wip_limit] element = $el.find(".kanban-task")[$scope.status.wip_limit]
if element if element
angular.element(element).before("<div class='kanban-wip-limit'></div>") angular.element(element).before("<div class='kanban-wip-limit'></div>")
@ -326,7 +327,7 @@ KanbanUserDirective = ($log) ->
username_label = $el.parent().find("a.task-assigned") username_label = $el.parent().find("a.task-assigned")
username_label.html(ctx.name) username_label.html(ctx.name)
username_label.on "click", (event) -> username_label.on "click", (event) ->
if $el.find('a').hasClass('noclick') if $el.find("a").hasClass("noclick")
return return
us = $model.$modelValue us = $model.$modelValue
@ -337,7 +338,7 @@ KanbanUserDirective = ($log) ->
if project.my_permissions.indexOf("modify_us") > -1 if project.my_permissions.indexOf("modify_us") > -1
clickable = true clickable = true
$el.on "click", (event) => $el.on "click", (event) =>
if $el.find('a').hasClass('noclick') if $el.find("a").hasClass("noclick")
return return
us = $model.$modelValue us = $model.$modelValue

20
app/coffee/modules/taskboard/lightboxes.coffee
View File

@ -51,14 +51,6 @@ CreateEditTaskDirective = ($repo, $model, $rs, $rootscope, lightboxService) ->
$el.find(".title").html("Edit task ") #TODO: i18n $el.find(".title").html("Edit task ") #TODO: i18n
lightboxService.open($el) lightboxService.open($el)
# Update requirement info (team, client or blocked)
if task.is_blocked
$el.find(".blocked-note").show()
$el.find("label.blocked").addClass("selected")
if task.is_iocaine
$el.find("label.iocaine").addClass("selected")
$el.on "click", ".button-green", (event) -> $el.on "click", ".button-green", (event) ->
event.preventDefault() event.preventDefault()
@ -78,18 +70,6 @@ CreateEditTaskDirective = ($repo, $model, $rs, $rootscope, lightboxService) ->
lightboxService.close($el) lightboxService.close($el)
$rootscope.$broadcast(broadcastEvent, data) $rootscope.$broadcast(broadcastEvent, data)
$el.on "click", "label.blocked", (event) ->
event.preventDefault()
target = angular.element(event.currentTarget)
target.toggleClass("selected")
$scope.task.is_blocked = not $scope.task.is_blocked
$el.find(".blocked-note").toggle(400)
$el.on "click", "label.iocaine", (event) ->
event.preventDefault()
angular.element(event.currentTarget).toggleClass("selected")
$scope.task.is_iocaine = not $scope.task.is_iocaine
$scope.$on "$destroy", -> $scope.$on "$destroy", ->
$el.off() $el.off()

15
app/partials/backlog.jade
View File

@ -34,9 +34,12 @@ block content
a(href="", title+"Create a new US", ng-click="ctrl.addNewUs('standard')", tg-check-permission="tg-check-permission", permission="add_us") You may want to create a new user story a(href="", title+"Create a new US", ng-click="ctrl.addNewUs('standard')", tg-check-permission="tg-check-permission", permission="add_us") You may want to create a new user story
sidebar.menu-secondary.sidebar sidebar.menu-secondary.sidebar
include views/modules/sprints include views/modules/sprints
div.lightbox.lightbox_add-new-us(tg-lb-create-edit-userstory)
include views/modules/lightbox_add-new-us div.lightbox.lightbox-generic-form(tg-lb-create-edit-userstory)
div.lightbox.lightbox_add-bulk(tg-lb-create-bulk-userstories) include views/modules/lightbox-us-create-edit
include views/modules/lightbox_add-bulk
div.lightbox.lightbox_add-sprint(tg-lb-create-edit-sprint) div.lightbox.lightbox-generic-bulk(tg-lb-create-bulk-userstories)
include views/modules/lightbox_add-edit-sprint include views/modules/lightbox-us-bulk
div.lightbox.lightbox-sprint-add-edit(tg-lb-create-edit-sprint)
include views/modules/lightbox-sprint-add-edit

10
app/partials/issues.jade
View File

@ -18,10 +18,10 @@ block content
// Paginator is rended using js. // Paginator is rended using js.
div.paginator.issues-paginator div.paginator.issues-paginator
div.hidden.lightbox.lightbox_select_user(tg-lb-assignedto) div.lightbox.lightbox-select-user(tg-lb-assignedto)
div.hidden.lightbox.lightbox_add-issue(tg-lb-create-issue) div.lightbox.lightbox-create-issue(tg-lb-create-issue)
include views/modules/lightbox_add-issue include views/modules/lightbox-create-issue
div.hidden.lightbox.lightbox_add-bulk(tg-lb-create-bulk-issues) div.lightbox.lightbox-generic-bulk(tg-lb-create-bulk-issues)
include views/modules/lightbox_add-bulk include views/modules/lightbox-issue-bulk

10
app/partials/kanban.jade
View File

@ -22,10 +22,10 @@ block content
//-include views/modules/list-filters-kanban //-include views/modules/list-filters-kanban
include views/modules/kanban-table include views/modules/kanban-table
div.lightbox.lightbox_add-new-us.hidden(tg-lb-create-edit-userstory) div.lightbox.lightbox-generic-form(tg-lb-create-edit-userstory)
include views/modules/lightbox_add-new-us include views/modules/lightbox-us-create-edit
div.lightbox.lightbox_add-bulk.hidden(tg-lb-create-bulk-userstories) div.lightbox.lightbox-generic-bulk(tg-lb-create-bulk-userstories)
include views/modules/lightbox_add-bulk include views/modules/lightbox-us-bulk
div.lightbox.lightbox_select_user.hidden(tg-lb-assignedto) div.lightbox.lightbox-select-user.hidden(tg-lb-assignedto)

12
app/partials/taskboard.jade
View File

@ -19,9 +19,11 @@ block content
include views/modules/taskboard-table include views/modules/taskboard-table
div.lightbox.lightbox_add-new-us.hidden(tg-lb-create-edit-task) div.lightbox.lightbox-generic-form(tg-lb-create-edit-task)
include views/modules/lightbox_add-edit-task include views/modules/lightbox-task-create-edit
div.lightbox.lightbox_add-bulk.hidden(tg-lb-create-bulk-tasks)
include views/modules/lightbox_add-task-bulk div.lightbox.lightbox-generic-bulk.lightbox-task-bulk(tg-lb-create-bulk-tasks)
div.lightbox.lightbox_select_user.hidden(tg-lb-assignedto) include views/modules/lightbox-task-bulk
div.lightbox.lightbox-select-user(tg-lb-assignedto)
include views/modules/lightbox-assigned-to include views/modules/lightbox-assigned-to

0
app/partials/views/modules/lightbox_add-issue.jade → app/partials/views/modules/lightbox-create-issue.jade
View File

0
app/partials/views/modules/lightbox_add-bulk.jade → app/partials/views/modules/lightbox-issue-bulk.jade
View File

0
app/partials/views/modules/lightbox_add-edit-sprint.jade → app/partials/views/modules/lightbox-sprint-add-edit.jade
View File

0
app/partials/views/modules/lightbox_add-task-bulk.jade → app/partials/views/modules/lightbox-task-bulk.jade
View File

24
app/partials/views/modules/lightbox_add-edit-task.jade → app/partials/views/modules/lightbox-task-create-edit.jade
View File

@ -5,28 +5,34 @@ form
fieldset fieldset
input(type="text", ng-model="task.subject", placeholder="A task subject", input(type="text", ng-model="task.subject", placeholder="A task subject",
data-required="true", data-maxlength="500") data-required="true", data-maxlength="500")
fieldset fieldset
select(ng-model="task.status", ng-options="s.id as s.name for s in taskStatusList", select(ng-model="task.status", ng-options="s.id as s.name for s in taskStatusList",
placeholder="Task status") placeholder="Task status")
fieldset fieldset
select(ng-model="task.assigned_to", ng-options="s.id as s.full_name_display for s in users", select(ng-model="task.assigned_to", ng-options="s.id as s.full_name_display for s in users",
placeholder="Assigned to") placeholder="Assigned to")
option(value="") Unassigned option(value="") Unassigned
fieldset fieldset
input(type="text", placeholder="Tags", tg-tags, ng-model="task.tags") input(type="text", placeholder="Tags", tg-tags, ng-model="task.tags")
fieldset fieldset
textarea.description(placeholder="Type a short description", ng-model="task.description") textarea.description(placeholder="Type a short description", ng-model="task.description")
div.new-us-settings
fieldset div.settings
label.iocaine fieldset.iocaine-flag
input(type="checkbox", ng-model="task.is_iocaine", name="iocaine-task", id="iocaine-task", ng-value="true")
label.iocaine(for="iocaine-task")
span.icon.icon-iocaine(for="iocaine-task icon-iocaine") span.icon.icon-iocaine(for="iocaine-task icon-iocaine")
span Iocaine span Iocaine
input(type="checkbox", ng-model="task.is_iocaine", name="iocaine-task", id="iocaine-task")
fieldset fieldset.blocking-flag
label.blocked(for="blocked-task") Blocked input(type="checkbox", ng-model="task.is_blocked", name="blocked-task", id="blocked-task", ng-value="true")
input(type="checkbox", ng-model="task.is_blocked", name="blocked-task", id="blocked-task") label.blocked(for="blocked-task", tg-i18n="common.blocked")
fieldset.blocked-note.hidden
textarea(placeholder="Why is this task blocked?", ng-model="task.blocked_note") tg-blocking-message-input(watch="task.is_blocked", ng-model="task.blocked_note")
a.button.button-green(href="", title="Save") a.button.button-green(href="", title="Save")
span Create span Create

8
app/partials/views/modules/lightbox-us-bulk.jade Normal file
View File

@ -0,0 +1,8 @@
a.close(href="", title="close")
span.icon.icon-delete
form
h2.title(tg-i18n="common.new-bulk")
fieldset
textarea(cols="200", wrap="off", tg-limit-line-length, tg-i18n="placeholder:common.one-item-line", ng-model="new.bulk", data-required="true", data-linewidth="200")
a.button.button-green(href="", tg-i18n="title:common.save")
span(tg-i18n="common.save")

28
app/partials/views/modules/lightbox_add-new-us.jade → app/partials/views/modules/lightbox-us-create-edit.jade
View File

@ -10,24 +10,26 @@ form
tg-i18n="placeholder:common.status") tg-i18n="placeholder:common.status")
fieldset fieldset
input(type="text", name="tags", placeholder="Tags", tg-tags, ng-model="us.tags") input(type="text", name="tags", placeholder="Tags", tg-tags, ng-model="us.tags")
fieldset fieldset
textarea.description(name="description", ng-model="us.description", textarea.description(name="description", ng-model="us.description",
placeholder="Please add descriptive text to help others better understand this US") placeholder="Please add descriptive text to help others better understand this US")
div.new-us-settings div.settings
fieldset fieldset.team-requirement
label.requirement.team-requirement(for="team-requirement", tg-i18n="us.team-requirement")
input(type="checkbox", name="team_requirement", ng-model="us.team_requirement", input(type="checkbox", name="team_requirement", ng-model="us.team_requirement",
id="team-requirement") id="team-requirement", ng-value="true")
fieldset label.requirement(for="team-requirement", tg-i18n="us.team-requirement")
label.requirement.client-requirement(for="client-requirement", tg-i18n="us.client-requirement")
input(type="checkbox", name="client_requirement", ng-model="us.client_requirement",
id="client-requirement")
fieldset
label.blocked(for="blocked-us", tg-i18n="common.blocked")
input(type="checkbox", name="is_blocked", ng-model="us.is_blocked", id="blocked-us")
fieldset.blocked-note.hidden fieldset.client-requirement
textarea(name="blocked_note", placeholder="Why is this user story blocked?", ng-model="us.blocked_note") input(type="checkbox", name="client_requirement", ng-model="us.client_requirement",
id="client-requirement", ng-value="true")
label.requirement(for="client-requirement", tg-i18n="us.client-requirement")
fieldset.blocking-flag
input(type="checkbox", name="is_blocked", ng-model="us.is_blocked", id="blocked-us" ng-value="true")
label.blocked(for="blocked-us", tg-i18n="common.blocked")
tg-blocking-message-input(watch="us.is_blocked", ng-model="us.blocked_note")
a.button.button-green(href="", title="Save") a.button.button-green(href="", title="Save")
span Create span Create

58
app/styles/modules/common/lightbox.scss
View File

@ -59,18 +59,21 @@
} }
} }
.lightbox_add-new-us { .lightbox-generic-form {
form { form {
@include table-flex-child(0, 600px, 0, 600px); @include table-flex-child(0, 600px, 0, 600px);
} }
fieldset { fieldset {
position: relative; position: relative;
} }
textarea { textarea {
margin-bottom: 1rem; margin-bottom: 1rem;
max-height: 9rem; max-height: 9rem;
min-height: 7rem; min-height: 7rem;
} }
label { label {
@extend %button; @extend %button;
@include transition(all .2s ease-in); @include transition(all .2s ease-in);
@ -89,7 +92,8 @@
vertical-align: middle; vertical-align: middle;
} }
} }
.new-us-settings {
.settings {
align-content: flex-start; align-content: flex-start;
align-items: stretch; align-items: stretch;
display: flex; display: flex;
@ -97,6 +101,7 @@
flex-wrap: wrap; flex-wrap: wrap;
justify-content: flex-start; justify-content: flex-start;
margin-bottom: 1rem; margin-bottom: 1rem;
fieldset { fieldset {
flex-basis: 30%; flex-basis: 30%;
flex-grow: 1; flex-grow: 1;
@ -107,6 +112,7 @@
margin: 0; margin: 0;
} }
} }
.requirement, .requirement,
.iocaine { .iocaine {
&:hover { &:hover {
@ -116,15 +122,8 @@
color: $white; color: $white;
} }
&.selected {
@include transition(all .2s ease-in);
background: $fresh-taiga;
border: 1px solid $green-taiga;
span {
color: $white;
}
}
} }
.blocked { .blocked {
padding: 8px 30px; padding: 8px 30px;
&:hover { &:hover {
@ -133,20 +132,40 @@
border: 1px solid $red-light; border: 1px solid $red-light;
color: $white; color: $white;
} }
&.selected { }
@include transition(all .2s ease-in);
background: $red;
border: 1px solid $red; .client-requirement,
.team-requirement,
.iocaine-flag {
input {
&:checked {
+label {
background: $fresh-taiga;
color: $white; color: $white;
} }
} }
}
}
.blocking-flag {
input {
&:checked {
+label {
background: $red;
color: $white;
}
}
}
}
input[type="checkbox"] { input[type="checkbox"] {
display: none; display: none;
} }
} }
} }
.lightbox_add-bulk { .lightbox-generic-bulk {
form { form {
@include table-flex-child(0, 600px, 0, 600px); @include table-flex-child(0, 600px, 0, 600px);
} }
@ -208,7 +227,7 @@
} }
} }
.lightbox_add-sprint { .lightbox-sprint-add-edit {
form { form {
@include table-flex-child(0, 600px, 0, 600px); @include table-flex-child(0, 600px, 0, 600px);
} }
@ -409,10 +428,11 @@
} }
} }
.lightbox_add-issue { .lightbox-create-issue {
form { form {
@include table-flex-child(0, 600px, 0, 600px); @include table-flex-child(0, 600px, 0, 600px);
} }
.fieldset-row { .fieldset-row {
@include table-flex(); @include table-flex();
fieldset { fieldset {
@ -423,12 +443,12 @@
} }
} }
} }
textarea { textarea {
margin-bottom: 1rem; margin-bottom: 1rem;
max-height: 12rem; max-height: 12rem;
min-height: 8rem; min-height: 8rem;
} }
} }
.lightbox_block { .lightbox_block {
@ -442,7 +462,7 @@
} }
} }
.lightbox_select_user { .lightbox-select-user {
.form { .form {
@include table-flex-child(0, 600px, 0, 600px); @include table-flex-child(0, 600px, 0, 600px);
} }