Now custom color selection flow is coherent

stable
Jesús Espino 2017-03-21 17:58:56 +01:00 committed by Juanfran
parent 97453a927c
commit 3851d1fdb4
3 changed files with 13 additions and 11 deletions

View File

@ -40,7 +40,8 @@ class ColorSelectorController
@.colorList = _.dropRight(@.colorList) @.colorList = _.dropRight(@.colorList)
setColor: (color) -> setColor: (color) ->
@.color = @.initColor @.color = color
@.customColor = color
resetColor: () -> resetColor: () ->
if @.isColorRequired and not @.color if @.isColorRequired and not @.color
@ -48,6 +49,7 @@ class ColorSelectorController
toggleColorList: () -> toggleColorList: () ->
@.displayColorList = !@.displayColorList @.displayColorList = !@.displayColorList
@.setColor(@.initColor)
@.resetColor() @.resetColor()
onSelectDropdownColor: (color) -> onSelectDropdownColor: (color) ->
@ -57,8 +59,8 @@ class ColorSelectorController
onKeyDown: (event) -> onKeyDown: (event) ->
if event.which == 13 # ENTER if event.which == 13 # ENTER
if @.color or not @.isColorRequired if @.customColor or not @.isColorRequired
@.onSelectDropdownColor(@.color) @.onSelectDropdownColor(@.customColor)
event.preventDefault() event.preventDefault()

View File

@ -73,11 +73,11 @@ describe "ColorSelector", ->
colorSelectorCtrl.onSelectDropdownColor = sinon.stub() colorSelectorCtrl.onSelectDropdownColor = sinon.stub()
event = {which: 13, preventDefault: sinon.stub()} event = {which: 13, preventDefault: sinon.stub()}
color = "#fabada" customColor = "#fabada"
colorSelectorCtrl.color = color colorSelectorCtrl.customColor = customColor
colorSelectorCtrl.onKeyDown(event) colorSelectorCtrl.onKeyDown(event)
expect(event.preventDefault).have.been.called expect(event.preventDefault).have.been.called
expect(colorSelectorCtrl.onSelectDropdownColor).have.been.called expect(colorSelectorCtrl.onSelectDropdownColor).have.been.called
expect(colorSelectorCtrl.onSelectDropdownColor).have.been.calledWith(color) expect(colorSelectorCtrl.onSelectDropdownColor).have.been.calledWith(customColor)

View File

@ -26,18 +26,18 @@
) )
.custom-color-selector .custom-color-selector
.display-custom-color.empty-color( .display-custom-color.empty-color(
ng-if="!vm.color" ng-if="!vm.customColor"
) )
.display-custom-color-wrapper .display-custom-color-wrapper
.display-custom-color( .display-custom-color(
ng-if="vm.color" ng-if="vm.customColor"
ng-style="{'background': vm.color}" ng-style="{'background': vm.customColor}"
ng-click="vm.onSelectDropdownColor(vm.color)" ng-click="vm.onSelectDropdownColor(vm.customColor)"
) )
input.custom-color-input( input.custom-color-input(
type="text" type="text"
maxlength="7" maxlength="7"
placeholder="Type hex code" placeholder="Type hex code"
ng-model="vm.color" ng-model="vm.customColor"
ng-keydown="vm.onKeyDown($event)" ng-keydown="vm.onKeyDown($event)"
) )