web/cryptpad
2
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

improve item color picker logic and UX

Browse Source
This commit is contained in:
MTRNord
2018-09-13 16:08:27 +02:00
parent 3c2417b479
commit 2ef397a483
2 changed files with 37 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
www/kanban/inner.js
View File

@@ -207,15 +207,36 @@ define([
} }
}); });
}, },
colorClick: function (el) { colorClick: function (el, type) {
if (framework.isReadOnly() || framework.isLocked()) { return; } if (framework.isReadOnly() || framework.isLocked()) { return; }
verbose("in color click"); verbose("on color click");
var board = $(el.parentNode).attr("data-id"); var boardJSON;
var boardJSON = kanban.getBoardJSON(board); 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 onchange = function (colorL) {
var elL = el; var elL = el;
var boardL = $(elL.parentNode).attr("data-id"); var typeL = type;
var boardJSONL = kanban.getBoardJSON(boardL); 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; var currentColor = boardJSONL.color;
verbose("Current color " + currentColor); verbose("Current color " + currentColor);
if (currentColor !== colorL.toString()) { if (currentColor !== colorL.toString()) {
@@ -226,12 +247,16 @@ define([
}; };
var jscolorL; var jscolorL;
el._jscLinkedInstance = undefined; el._jscLinkedInstance = undefined;
jscolorL = new jscolor(el,{onFineChange: onchange, valueElement:undefined}); jscolorL = new window.jscolor(el,{onFineChange: onchange, valueElement:undefined});
jscolorL.show(); jscolorL.show();
var currentColor = boardJSON.color; var currentColor = boardJSON.color;
if (currentColor == undefined) {
currentColor = ''
}
jscolorL.fromString(currentColor); jscolorL.fromString(currentColor);
}, },
buttonClick: function (el, boardId) { buttonClick: function (el, boardId) {
e.stopPropagation();
if (framework.isReadOnly() || framework.isLocked()) { return; } if (framework.isReadOnly() || framework.isLocked()) { return; }
UI.confirm(Messages.kanban_deleteBoard, function (yes) { UI.confirm(Messages.kanban_deleteBoard, function (yes) {
if (!yes) { return; } if (!yes) { return; }

30
www/kanban/jkanban.js
View File

@@ -68,7 +68,7 @@
click: function (el) {}, click: function (el) {},
boardTitleclick: function (el, boardId) {}, boardTitleclick: function (el, boardId) {},
buttonClick: function (el, boardId) {}, buttonClick: function (el, boardId) {},
colorClick: function (el, boardId) {}, colorClick: function (el, type) {},
addItemClick: function (el, boardId) {}, addItemClick: function (el, boardId) {},
onChange: function () {} onChange: function () {}
}; };
@@ -345,7 +345,7 @@
titleBoard.clickfn = board.boardTitleClick; titleBoard.clickfn = board.boardTitleClick;
__onboardTitleClickHandler(titleBoard); __onboardTitleClickHandler(titleBoard);
headerBoard.appendChild(titleBoard); headerBoard.appendChild(titleBoard);
__onColorClickHandler(headerBoard); __onColorClickHandler(headerBoard, "board");
// if add button is true, add button to the board // if add button is true, add button to the board
if (addButton) { if (addButton) {
@@ -378,25 +378,7 @@
nodeItemText.dropfn = itemKanban.drop; nodeItemText.dropfn = itemKanban.drop;
//add click handler of item //add click handler of item
__onclickHandler(nodeItemText); __onclickHandler(nodeItemText);
__onColorClickHandler(nodeItem, "item");
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);
contentBoard.appendChild(nodeItem); contentBoard.appendChild(nodeItem);
} }
@@ -545,12 +527,10 @@
}); });
} }
function __onColorClickHandler(nodeItem, clickfn) { function __onColorClickHandler(nodeItem, type) {
nodeItem.addEventListener('click', function (e) { nodeItem.addEventListener('click', function (e) {
e.preventDefault; e.preventDefault;
self.options.colorClick(this); self.options.colorClick(this, type);
if (typeof (this.clickfn) === 'function')
this.clickfn(this);
}); });
} }