From 2a8e7d9ac8ba31ef9111ec2f576d678df485ddd9 Mon Sep 17 00:00:00 2001
From: Sam El-Husseini <sam.elhusseini@gmail.com>
Date: Fri, 22 Nov 2019 13:50:33 -0800
Subject: [PATCH] [zelos] Full field colour (#3461)

* Support showing the colour value on the entire block.
---
 core/block_svg.js                  |  4 ++--
 core/field_colour.js               | 24 +++++++++++++++++++++---
 core/renderers/common/constants.js |  7 +++++++
 core/renderers/zelos/constants.js  | 15 +++++++++++++++
 4 files changed, 45 insertions(+), 5 deletions(-)

diff --git a/core/block_svg.js b/core/block_svg.js
index 4d553876f..a21dc745b 100644
--- a/core/block_svg.js
+++ b/core/block_svg.js
@@ -969,8 +969,8 @@ Blockly.BlockSvg.prototype.dispose = function(healStack, animate) {
  * @package
  */
 Blockly.BlockSvg.prototype.applyColour = function() {
-  if (!this.isEnabled()) {
-    // Disabled blocks don't have colour.
+  if (!this.isEnabled() || !this.rendered) {
+    // Disabled blocks and non-rendered blocks don't have colour.
     return;
   }
 
diff --git a/core/field_colour.js b/core/field_colour.js
index 76701eeb5..10b4879a0 100644
--- a/core/field_colour.js
+++ b/core/field_colour.js
@@ -186,9 +186,24 @@ Blockly.FieldColour.prototype.initView = function() {
   this.size_ = new Blockly.utils.Size(
       this.constants_.FIELD_COLOUR_DEFAULT_WIDTH,
       this.constants_.FIELD_COLOUR_DEFAULT_HEIGHT);
-  this.createBorderRect_();
-  this.borderRect_.style['fillOpacity'] = '1';
-  this.borderRect_.style.fill = this.value_;
+  if (!this.constants_.FIELD_COLOUR_FULL_BLOCK) {
+    this.createBorderRect_();
+    this.borderRect_.style['fillOpacity'] = '1';
+  } else {
+    this.clickTarget_ = this.sourceBlock_.getSvgRoot();
+  }
+};
+
+/**
+ * @override
+ */
+Blockly.FieldColour.prototype.applyColour = function() {
+  if (!this.constants_.FIELD_COLOUR_FULL_BLOCK) {
+    this.borderRect_.style.fill = this.getValue();
+  } else {
+    this.sourceBlock_.pathObject.svgPath.setAttribute('fill', this.getValue());
+    this.sourceBlock_.pathObject.svgPath.setAttribute('stroke', '#fff');
+  }
 };
 
 /**
@@ -214,6 +229,9 @@ Blockly.FieldColour.prototype.doValueUpdate_ = function(newValue) {
   this.value_ = newValue;
   if (this.borderRect_) {
     this.borderRect_.style.fill = newValue;
+  } else if (this.sourceBlock_) {
+    this.sourceBlock_.pathObject.svgPath.setAttribute('fill', newValue);
+    this.sourceBlock_.pathObject.svgPath.setAttribute('stroke', '#fff');
   }
 };
 
diff --git a/core/renderers/common/constants.js b/core/renderers/common/constants.js
index 68caf6f31..97b76a7b4 100644
--- a/core/renderers/common/constants.js
+++ b/core/renderers/common/constants.js
@@ -232,6 +232,13 @@ Blockly.blockRendering.ConstantProvider = function() {
    */
   this.FIELD_DROPDOWN_SVG_ARROW = false;
 
+  /**
+   * Whether or not the colour field should display its colour value on the
+   * entire block.
+   * @type {boolean}
+   */
+  this.FIELD_COLOUR_FULL_BLOCK = false;
+
   /**
    * A colour field's default width.
    * @type {number}
diff --git a/core/renderers/zelos/constants.js b/core/renderers/zelos/constants.js
index 14465031a..c6e2a415a 100644
--- a/core/renderers/zelos/constants.js
+++ b/core/renderers/zelos/constants.js
@@ -214,6 +214,21 @@ Blockly.zelos.ConstantProvider = function() {
     'AuNTYtLjU2LDkuMzEtMC41Niw5Ljg3LDBhMS40NCwxLjQ0LDAsMCwxLDAsMkw3LjM3LDcuMz' +
     'dBMS40MywxLjQzLDAsMCwxLDYuMzYsNy43OVoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=';
 
+  /**
+   * @override
+   */
+  this.FIELD_COLOUR_FULL_BLOCK = true;
+
+  /**
+   * @override
+   */
+  this.FIELD_COLOUR_DEFAULT_WIDTH = 2 * this.GRID_UNIT;
+
+  /**
+   * @override
+   */
+  this.FIELD_COLOUR_DEFAULT_HEIGHT = 4 * this.GRID_UNIT;
+
   /**
    * The ID of the highlight glow filter, or the empty string if no filter is
    * set.