summaryrefslogtreecommitdiffstats
path: root/client/components/rules/actions
diff options
context:
space:
mode:
authorBenjamin Tissoires <benjamin.tissoires@redhat.com>2019-01-22 23:36:43 +0100
committerBenjamin Tissoires <benjamin.tissoires@redhat.com>2019-01-24 16:51:06 +0100
commit5769d438a05d01bd5f35cd5830b7ad3c03a21ed2 (patch)
treeedbdfab8090e9dceb1d757b27eb573193ade70f5 /client/components/rules/actions
parent8a48ff96efc29687c8a8c58d02d6741b50c83424 (diff)
downloadwekan-5769d438a05d01bd5f35cd5830b7ad3c03a21ed2.tar.gz
wekan-5769d438a05d01bd5f35cd5830b7ad3c03a21ed2.tar.bz2
wekan-5769d438a05d01bd5f35cd5830b7ad3c03a21ed2.zip
rules: set card color: use the color picker
Diffstat (limited to 'client/components/rules/actions')
-rw-r--r--client/components/rules/actions/cardActions.jade37
-rw-r--r--client/components/rules/actions/cardActions.js50
2 files changed, 59 insertions, 28 deletions
diff --git a/client/components/rules/actions/cardActions.jade b/client/components/rules/actions/cardActions.jade
index dd92d8fe..1fee5231 100644
--- a/client/components/rules/actions/cardActions.jade
+++ b/client/components/rules/actions/cardActions.jade
@@ -39,32 +39,15 @@ template(name="cardActions")
div.trigger-content
div.trigger-text
| {{{_'r-set-color'}}}
- div.trigger-dropdown
- select(id="color-action")
- option(value="white") {{{_'color-white'}}}
- option(value="green") {{{_'color-green'}}}
- option(value="yellow") {{{_'color-yellow'}}}
- option(value="orange") {{{_'color-orange'}}}
- option(value="red") {{{_'color-red'}}}
- option(value="purple") {{{_'color-purple'}}}
- option(value="blue") {{{_'color-blue'}}}
- option(value="sky") {{{_'color-sky'}}}
- option(value="lime") {{{_'color-lime'}}}
- option(value="pink") {{{_'color-pink'}}}
- option(value="black") {{{_'color-black'}}}
- option(value="silver") {{{_'color-silver'}}}
- option(value="peachpuff") {{{_'color-peachpuff'}}}
- option(value="crimson") {{{_'color-crimson'}}}
- option(value="plum") {{{_'color-plum'}}}
- option(value="darkgreen") {{{_'color-darkgreen'}}}
- option(value="slateblue") {{{_'color-slateblue'}}}
- option(value="magenta") {{{_'color-magenta'}}}
- option(value="gold") {{{_'color-gold'}}}
- option(value="navy") {{{_'color-navy'}}}
- option(value="gray") {{{_'color-gray'}}}
- option(value="saddlebrown") {{{_'color-saddlebrown'}}}
- option(value="paleturquoise") {{{_'color-paleturquoise'}}}
- option(value="mistyrose") {{{_'color-mistyrose'}}}
- option(value="indigo") {{{_'color-indigo'}}}
+ button.trigger-button.trigger-button-color.card-details-green.js-show-color-palette(id="color-action")
+ | {{{_'color-green'}}}
div.trigger-button.js-set-color-action.js-goto-rules
i.fa.fa-plus
+
+template(name="setCardActionsColorPopup")
+ form.edit-label
+ .palette-colors: each colors
+ span.card-label.palette-color.js-palette-color(class="card-details-{{color}}")
+ if(isSelected color)
+ i.fa.fa-check
+ button.primary.confirm.js-submit {{_ 'save'}}
diff --git a/client/components/rules/actions/cardActions.js b/client/components/rules/actions/cardActions.js
index b66556b4..6c858358 100644
--- a/client/components/rules/actions/cardActions.js
+++ b/client/components/rules/actions/cardActions.js
@@ -1,3 +1,8 @@
+let cardColors;
+Meteor.startup(() => {
+ cardColors = Cards.simpleSchema()._schema.color.allowedValues;
+});
+
BlazeComponent.extendComponent({
onCreated() {
this.subscribe('allRules');
@@ -112,10 +117,22 @@ BlazeComponent.extendComponent({
boardId,
});
},
+ 'click .js-show-color-palette'(event){
+ const funct = Popup.open('setCardActionsColor');
+ const colorButton = this.find('#color-action');
+ if (colorButton.value === '') {
+ colorButton.value = 'green';
+ }
+ funct.call(this, event);
+ },
'click .js-set-color-action' (event) {
const ruleName = this.data().ruleName.get();
const trigger = this.data().triggerVar.get();
- const selectedColor = this.find('#color-action').value;
+ const colorButton = this.find('#color-action');
+ if (colorButton.value === '') {
+ colorButton.value = 'green';
+ }
+ const selectedColor = colorButton.value;
const boardId = Session.get('currentBoard');
const desc = Utils.getTriggerActionDesc(event, this);
const triggerId = Triggers.insert(trigger);
@@ -136,3 +153,34 @@ BlazeComponent.extendComponent({
},
}).register('cardActions');
+
+BlazeComponent.extendComponent({
+ onCreated() {
+ this.currentAction = this.currentData();
+ this.colorButton = Popup.getOpenerComponent().find('#color-action');
+ this.currentColor = new ReactiveVar(this.colorButton.value);
+ },
+
+ colors() {
+ return cardColors.map((color) => ({ color, name: '' }));
+ },
+
+ isSelected(color) {
+ return this.currentColor.get() === color;
+ },
+
+ events() {
+ return [{
+ 'click .js-palette-color'() {
+ this.currentColor.set(this.currentData().color);
+ },
+ 'click .js-submit' () {
+ this.colorButton.classList.remove(`card-details-${ this.colorButton.value }`);
+ this.colorButton.value = this.currentColor.get();
+ this.colorButton.innerText = `${TAPi18n.__(`color-${ this.currentColor.get() }`)}`;
+ this.colorButton.classList.add(`card-details-${ this.colorButton.value }`);
+ Popup.close();
+ },
+ }];
+ },
+}).register('setCardActionsColorPopup');