Create epics lightbox

stable
David Barragán Merino 2016-08-29 12:58:17 +02:00
parent c5f9cd54eb
commit 7070f181ac
12 changed files with 88 additions and 56 deletions

View File

@ -239,6 +239,17 @@ patch = (oldImmutable, newImmutable) ->
return pathObj
DEFAULT_COLOR_LIST = [
'#fce94f', '#edd400', '#c4a000', '#8ae234', '#73d216', '#4e9a06', '#d3d7cf',
'#fcaf3e', '#f57900', '#ce5c00', '#729fcf', '#3465a4', '#204a87', '#888a85',
'#ad7fa8', '#75507b', '#5c3566', '#ef2929', '#cc0000', '#a40000'
]
getRandomDefaultColor = () ->
return _.sample(DEFAULT_COLOR_LIST)
getDefaulColorList = () ->
return _.clone(DEFAULT_COLOR_LIST)
taiga = @.taiga
taiga.addClass = addClass
@ -267,3 +278,5 @@ taiga.defineImmutableProperty = defineImmutableProperty
taiga.isImage = isImage
taiga.isPdf = isPdf
taiga.patch = patch
taiga.getRandomDefaultColor = getRandomDefaultColor
taiga.getDefaulColorList = getDefaulColorList

View File

@ -17,41 +17,35 @@
# File: color-selector.controller.coffee
###
module = angular.module('taigaCommon')
taiga = @.taiga
getDefaulColorList = taiga.getDefaulColorList
class ColorSelectorController
constructor: () ->
@.colorList = [
'#fce94f',
'#edd400',
'#c4a000',
'#8ae234',
'#73d216',
'#4e9a06',
'#d3d7cf',
'#fcaf3e',
'#f57900',
'#ce5c00',
'#729fcf',
'#3465a4',
'#204a87',
'#888a85',
'#ad7fa8',
'#75507b',
'#5c3566',
'#ef2929',
'#cc0000',
'#a40000'
]
@.colorList = getDefaulColorList()
if @.initColor
@.color = @.initColor
@.displaycolorList = false
toggleColorList: () ->
@.displaycolorList = !@.displaycolorList
if @.isRequired and not @.color
@.color = @.initColor
onSelectDropdownColor: (color) ->
@.color = color
@.onSelectColor({color: color})
@.toggleColorList()
onKeyDown: (event) ->
if event.which == 13 # ENTER
event.stopPropagation()
if @.color or not @.isRequired
@.onSelectDropdownColor(@.color)
module.controller("ColorSelectorCtrl", ColorSelectorController)
angular.module('taigaComponents').controller("ColorSelectorCtrl", ColorSelectorController)

View File

@ -29,7 +29,7 @@ describe "ColorSelector", ->
return null
beforeEach ->
module "taigaCommon"
module "taigaComponents"
_mocks()

View File

@ -17,21 +17,20 @@
# File: color-selector.directive.coffee
###
module = angular.module('taigaCommon')
ColorSelectorDirective = ($timeout) ->
link = (scope, el) ->
timeout = null
link = (scope, el, attrs, ctrl) ->
# Animation
_timeout = null
cancel = () ->
$timeout.cancel(timeout)
timeout = null
$timeout.cancel(_timeout)
_timeout = null
close = () ->
return if timeout
return if _timeout
timeout = $timeout (() ->
scope.vm.displaycolorList = false
_timeout = $timeout (() ->
scope.vm.toggleColorList()
), 400
el.find('.color-selector')
@ -45,17 +44,19 @@ ColorSelectorDirective = ($timeout) ->
return {
link: link,
scope:{
isRequired: "="
onSelectColor: "&",
color: "="
initColor: "="
},
templateUrl:"components/tags/color-selector/color-selector.html",
templateUrl:"components/color-selector/color-selector.html",
controller: "ColorSelectorCtrl",
controllerAs: "vm",
bindToController: true
}
ColorSelectorDirective.$inject = [
"$timeout"
]
module.directive("tgColorSelector", ColorSelectorDirective)
angular.module('taigaComponents').directive("tgColorSelector", ColorSelectorDirective)

View File

@ -12,19 +12,23 @@
ng-title="color"
ng-click="vm.onSelectDropdownColor(color)"
)
li.empty-color(ng-click="vm.onSelectDropdownColor(null)")
li.empty-color(
ng-if="!vm.isRequired"
ng-click="vm.onSelectDropdownColor(null)"
)
.custom-color-selector
.display-custom-color.empty-color(
ng-if="!customColor.color || customColor.color.length < 7"
ng-if="!vm.color"
)
.display-custom-color(
ng-if="customColor.color.length === 7"
ng-style="{'background': customColor.color}"
ng-click="vm.onSelectDropdownColor(customColor.color)"
ng-if="vm.color"
ng-style="{'background': vm.color}"
ng-click="vm.onSelectDropdownColor(vm.color)"
)
input.custom-color-input(
type="text"
maxlength="7"
placeholder="#000000"
ng-model="customColor.color"
placeholder="Type hex code"
ng-model="vm.color"
ng-keydown="vm.onKeyDown($event)"
)

View File

@ -21,7 +21,6 @@
tg-color-selector(
ng-if="!vm.disableColorSelection"
color="vm.newTag.color",
on-select-color="vm.selectColor(color)"
)

View File

@ -19,30 +19,40 @@
taiga = @.taiga
trim = taiga.trim
getRandomDefaultColor = taiga.getRandomDefaultColor
module = angular.module("taigaEpics")
class CreateEpicController
@.$inject = [
"tgResources"
"tgAttachmentsService"
"$q"
]
constructor: (@rs) ->
constructor: (@rs, @attachmentsService, @q) ->
@.newEpic = {
color: null
projecti: @.project.id
color: getRandomDefaultColor()
project: @.project.id
status: @.project.default_epic_status
tags: []
}
@.attachments = Immutable.List()
createEpic: () ->
return @rs.epics.post(@.newEpic).then () =>
@.onReloadEpics()
promise = @rs.epics.post(@.newEpic)
promise.then (response) =>
@._createAttachments(response.data)
promise.then (data) =>
@.onCreateEpic()
# Color selector
selectColor: (color) ->
@.newEpic.color = color
# Tags
addTag: (name, color) ->
name = trim(name.toLowerCase())
@ -52,5 +62,13 @@ class CreateEpicController
deleteTag: (tag) ->
_.remove @.newEpic.tags, (it) -> it[0] == tag[0]
# Attachments
addAttachment: (attachment) ->
@.attachments.push(attachment)
_createAttachments: (epic) ->
promises = _.map @.attachments.toJS(), (attachment) ->
return attachmentsService.upload(attachment.file, epic.id, epic.project, 'epic')
return @q.all(promises)
module.controller("CreateEpicCtrl", CreateEpicController)

View File

@ -28,7 +28,7 @@ CreateEpicDirective = () ->
bindToController: true,
scope: {
project: '=',
onReloadEpics: '&'
onCreateEpic: '&'
}
}

View File

@ -7,7 +7,8 @@ tg-lightbox-close
)
fieldset
tg-color-selector(
color="vm.newEpic.color",
is-required="true"
init-color="vm.newEpic.color"
on-select-color="vm.selectColor(color)"
)
input.e2e-create-epic-subject(
@ -46,6 +47,7 @@ tg-lightbox-close
fieldset
tg-attachments-simple(
attachments="vm.attachments"
on-add="vm.addAttachment(attachment)"
)
.settings
fieldset.team-requirement

View File

@ -55,10 +55,10 @@ class EpicsDashboardController
@lightboxFactory.create('tg-create-epic', {
"class": "lightbox lightbox-create-epic open"
"project": "project"
"on-reload-epics": "reloadEpics()"
"on-create-epic": "onCreateEpic()"
}, {
"project": @.project
"reloadEpics": @._onCreateEpic.bind(this)
"onCreateEpic": @._onCreateEpic.bind(this)
})
module.controller("EpicsDashboardCtrl", EpicsDashboardController)

View File

@ -20,7 +20,8 @@ div.wrapper(
.detail-header-container
tg-color-selector(
color="epic.color",
is-required="true"
init-color="epic.color"
on-select-color="ctrl.onSelectColor(color)"
)
tg-detail-header(