Basic fixes for FieldColour (#482)

* Fix field_colour's borderRect_ problem

* Use actual width and height instead of NBSPs

* Get corner radius from BlockSvg

* Improve colour picker CSS to not have borders
This commit is contained in:
Tim Mickel 2016-07-06 20:38:05 -04:00 committed by GitHub
parent 13d730cc14
commit 179b75da59
2 changed files with 21 additions and 12 deletions

View file

@ -677,7 +677,6 @@ Blockly.Css.CONTENT = [
'}',
'.blocklyWidgetDiv .goog-palette-table {',
'border: 1px solid #666;',
'border-collapse: collapse;',
'}',
@ -688,7 +687,6 @@ Blockly.Css.CONTENT = [
'border: 0;',
'text-align: center;',
'vertical-align: middle;',
'border-right: 1px solid #666;',
'font-size: 1px;',
'}',
@ -696,15 +694,16 @@ Blockly.Css.CONTENT = [
'position: relative;',
'height: 13px;',
'width: 15px;',
'border: 1px solid #666;',
'}',
'.blocklyWidgetDiv .goog-palette-cell-hover .goog-palette-colorswatch {',
'border: 1px solid #FFF;',
'box-sizing: border-box;',
'}',
'.blocklyWidgetDiv .goog-palette-cell-selected .goog-palette-colorswatch {',
'border: 1px solid #000;',
'box-sizing: border-box;',
'color: #fff;',
'}',

View file

@ -46,7 +46,6 @@ goog.require('goog.ui.ColorPicker');
*/
Blockly.FieldColour = function(colour, opt_validator) {
Blockly.FieldColour.superClass_.constructor.call(this, colour, opt_validator);
this.setText(Blockly.Field.NBSP + Blockly.Field.NBSP + Blockly.Field.NBSP);
};
goog.inherits(Blockly.FieldColour, Blockly.Field);
@ -70,12 +69,15 @@ Blockly.FieldColour.prototype.columns_ = 0;
*/
Blockly.FieldColour.prototype.init = function(block) {
Blockly.FieldColour.superClass_.init.call(this, block);
// TODO(#163): borderRect_ has been removed from the field.
// When fixing field_colour, we should re-color the shadow block instead,
// or re-implement a rectangle in the field.
if (this.borderRect_) {
this.borderRect_.style['fillOpacity'] = 1;
}
this.colourRect_ = Blockly.createSvgElement('rect',
{'rx': Blockly.BlockSvg.CORNER_RADIUS,
'ry': Blockly.BlockSvg.CORNER_RADIUS,
'x': 0,
'y': 0,
'width': Blockly.BlockSvg.FIELD_WIDTH,
'height': Blockly.BlockSvg.FIELD_HEIGHT
}, this.fieldGroup_, this.sourceBlock_.workspace);
this.colourRect_.style['fillOpacity'] = 1;
this.setValue(this.getValue());
};
@ -111,8 +113,8 @@ Blockly.FieldColour.prototype.setValue = function(colour) {
this.sourceBlock_, 'field', this.name, this.colour_, colour));
}
this.colour_ = colour;
if (this.borderRect_) {
this.borderRect_.style.fill = colour;
if (this.colourRect_) {
this.colourRect_.style.fill = colour;
}
};
@ -130,6 +132,14 @@ Blockly.FieldColour.prototype.getText = function() {
return colour;
};
/**
* Returns the fixed height and width.
* @return {!goog.math.Size} Height and width.
*/
Blockly.FieldColour.prototype.getSize = function() {
return new goog.math.Size(Blockly.BlockSvg.FIELD_WIDTH, Blockly.BlockSvg.FIELD_HEIGHT);
};
/**
* An array of colour strings for the palette.
* See bottom of this page for the default: