improve item color picker logic and UX
parent
3c2417b479
commit
2ef397a483
|
@ -207,15 +207,36 @@ define([
|
|||
}
|
||||
});
|
||||
},
|
||||
colorClick: function (el) {
|
||||
colorClick: function (el, type) {
|
||||
if (framework.isReadOnly() || framework.isLocked()) { return; }
|
||||
verbose("in color click");
|
||||
var board = $(el.parentNode).attr("data-id");
|
||||
var boardJSON = kanban.getBoardJSON(board);
|
||||
verbose("on color click");
|
||||
var boardJSON;
|
||||
var board;
|
||||
if (type === "board") {
|
||||
verbose("board color click");
|
||||
board = $(el.parentNode).attr("data-id");
|
||||
boardJSON = kanban.getBoardJSON(board);
|
||||
} else {
|
||||
verbose("item color click");
|
||||
board = $(el.parentNode.parentNode).attr("data-id");
|
||||
var pos = kanban.findElementPosition(el);
|
||||
boardJSON = kanban.getBoardJSON(board).item[pos];
|
||||
}
|
||||
var onchange = function (colorL) {
|
||||
var elL = el;
|
||||
var boardL = $(elL.parentNode).attr("data-id");
|
||||
var boardJSONL = kanban.getBoardJSON(boardL);
|
||||
var typeL = type;
|
||||
var boardJSONL;
|
||||
var boardL;
|
||||
if (typeL === "board") {
|
||||
verbose("board color change");
|
||||
boardL = $(elL.parentNode).attr("data-id");
|
||||
boardJSONL = kanban.getBoardJSON(boardL);
|
||||
} else {
|
||||
verbose("item color change");
|
||||
boardL = $(elL.parentNode.parentNode).attr("data-id");
|
||||
var pos = kanban.findElementPosition(elL);
|
||||
boardJSONL = kanban.getBoardJSON(boardL).item[pos];
|
||||
}
|
||||
var currentColor = boardJSONL.color;
|
||||
verbose("Current color " + currentColor);
|
||||
if (currentColor !== colorL.toString()) {
|
||||
|
@ -226,12 +247,16 @@ define([
|
|||
};
|
||||
var jscolorL;
|
||||
el._jscLinkedInstance = undefined;
|
||||
jscolorL = new jscolor(el,{onFineChange: onchange, valueElement:undefined});
|
||||
jscolorL = new window.jscolor(el,{onFineChange: onchange, valueElement:undefined});
|
||||
jscolorL.show();
|
||||
var currentColor = boardJSON.color;
|
||||
if (currentColor == undefined) {
|
||||
currentColor = ''
|
||||
}
|
||||
jscolorL.fromString(currentColor);
|
||||
},
|
||||
buttonClick: function (el, boardId) {
|
||||
e.stopPropagation();
|
||||
if (framework.isReadOnly() || framework.isLocked()) { return; }
|
||||
UI.confirm(Messages.kanban_deleteBoard, function (yes) {
|
||||
if (!yes) { return; }
|
||||
|
|
|
@ -68,7 +68,7 @@
|
|||
click: function (el) {},
|
||||
boardTitleclick: function (el, boardId) {},
|
||||
buttonClick: function (el, boardId) {},
|
||||
colorClick: function (el, boardId) {},
|
||||
colorClick: function (el, type) {},
|
||||
addItemClick: function (el, boardId) {},
|
||||
onChange: function () {}
|
||||
};
|
||||
|
@ -345,7 +345,7 @@
|
|||
titleBoard.clickfn = board.boardTitleClick;
|
||||
__onboardTitleClickHandler(titleBoard);
|
||||
headerBoard.appendChild(titleBoard);
|
||||
__onColorClickHandler(headerBoard);
|
||||
__onColorClickHandler(headerBoard, "board");
|
||||
|
||||
// if add button is true, add button to the board
|
||||
if (addButton) {
|
||||
|
@ -378,25 +378,7 @@
|
|||
nodeItemText.dropfn = itemKanban.drop;
|
||||
//add click handler of item
|
||||
__onclickHandler(nodeItemText);
|
||||
|
||||
var onchange = function (colorL) {
|
||||
var currentColor = itemKanban.color;
|
||||
if (currentColor !== colorL.toString()) {
|
||||
itemKanban.color = colorL.toString();
|
||||
self.onChange();
|
||||
}
|
||||
};
|
||||
|
||||
var jscolorL;
|
||||
nodeItem._jscLinkedInstance = undefined;
|
||||
jscolorL = new jscolor(nodeItem,{onFineChange: onchange, valueElement:undefined});
|
||||
var currentColor = itemKanban.color;
|
||||
// If not defined dont have it undefined
|
||||
if (currentColor == undefined) {
|
||||
currentColor = ''
|
||||
}
|
||||
console.log(currentColor);
|
||||
jscolorL.fromString(currentColor);
|
||||
__onColorClickHandler(nodeItem, "item");
|
||||
|
||||
contentBoard.appendChild(nodeItem);
|
||||
}
|
||||
|
@ -545,12 +527,10 @@
|
|||
});
|
||||
}
|
||||
|
||||
function __onColorClickHandler(nodeItem, clickfn) {
|
||||
function __onColorClickHandler(nodeItem, type) {
|
||||
nodeItem.addEventListener('click', function (e) {
|
||||
e.preventDefault;
|
||||
self.options.colorClick(this);
|
||||
if (typeof (this.clickfn) === 'function')
|
||||
this.clickfn(this);
|
||||
self.options.colorClick(this, type);
|
||||
});
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue