notebookbar: unify color control in all components

Keep in sync colors in sidebar and notebookbar when
we change one of them.

Followup for
commit 13ef21aa1ecff764ed7c5b24bee83e25297ca21e
notebookbar: unify color control with core

Signed-off-by: Szymon Kłos <szymon.klos@collabora.com>
Change-Id: Ia8af727c6ba6b5b32a644ff070954c9ada584a24

1 files changed, 16 insertions, 5 deletions

diff --git a/browser/src/control/Control.JSDialogBuilder.js b/browser/src/control/Control.JSDialogBuilder.js
index 1ef89a4183..5d6d96c19a 100644
--- a/browser/src/control/Control.JSDialogBuilder.js
+++ b/browser/src/control/Control.JSDialogBuilder.js
@@ -40,6 +40,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
 	_menuItemHandlers: null,
 	_menus: null,
 	_colorPickers: null,
+	_colorLastSelection: {},
 
 	_currentDepth: 0,
 
@@ -2857,21 +2858,31 @@ L.Control.JSDialogBuilder = L.Control.extend({
 			var selectedColor;
 
 			var updateFunction = function (color) {
-				selectedColor = builder._getCurrentColor(data, builder);
+				if (builder._colorLastSelection[data.command] !== undefined)
+					selectedColor = builder._colorLastSelection[data.command];
+				else
+					selectedColor = builder._getCurrentColor(data, builder);
+
 				valueNode.style.backgroundColor = color ? color : selectedColor;
-				selectedColor = color ? color : selectedColor;
+				builder._colorLastSelection[data.command] = color ? color : selectedColor;
 				builder.setPickerOutline(valueNode);
 			};
 
 			updateFunction();
 
+			builder.map.on('commandstatechanged', function(e) {
+				if (e.commandName === data.command)
+					updateFunction();
+			}, this);
+
 			var noColorControl = (data.command !== '.uno:FontColor' && data.command !== '.uno:Color');
 
 			var applyFunction = function() {
-				if (!selectedColor || selectedColor === '#')
+				var colorToApply = builder._colorLastSelection[data.command];
+				if (!colorToApply || colorToApply === '#')
 					return;
 
-				var color = selectedColor.indexOf('#') === 0 ? selectedColor.substr(1) : selectedColor;
+				var color = colorToApply.indexOf('#') === 0 ? colorToApply.substr(1) : colorToApply;
 				builder._sendColorCommand(builder, data, color);
 			};
 
@@ -2880,7 +2891,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
 
 			$(arrowbackground).click(function() {
 				if (!$(div).hasClass('disabled')) {
-					$(div).w2color({ color: selectedColor, transparent: noColorControl }, function (color) {
+					$(div).w2color({ color: builder._colorLastSelection[data.command], transparent: noColorControl }, function (color) {
 						if (color != null) {
 							if (color) {
 								updateFunction('#' + color);