CodingPirates/blockly
1
0
Fork 0
mirror of https://github.com/google/blockly.git synced 2026-01-11 19:07:08 +01:00
Code Issues Packages Projects Releases Wiki Activity

Use dropdown div for colour field

Browse Source
This commit is contained in:
Rachel Fenichel
2019-02-08 15:40:48 -08:00
parent 91408a3238
commit 763a06a7ac
4 changed files with 51 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
core/blockly.js
View File

@@ -333,6 +333,7 @@ Blockly.onContextMenu_ = function(e) {
Blockly.hideChaff = function(opt_allowToolbox) {
Blockly.Tooltip.hide();
Blockly.WidgetDiv.hide();
Blockly.DropDownDiv.hideWithoutAnimation();
// For now the trashcan flyout always autocloses because it overlays the
// trashcan UI (no trashcan to click to close it)
var workspace = Blockly.getMainWorkspace();

14
core/css.js
View File

@@ -225,6 +225,20 @@ Blockly.Css.CONTENT = [
'cursor: pointer;',
'}',
'.arrowTop {',
'border-top: 1px solid;',
'border-left: 1px solid;',
'border-top-left-radius: 4px;',
'border-color: inherit;',
'}',
'.arrowBottom {',
'border-bottom: 1px solid;',
'border-right: 1px solid;',
'border-bottom-right-radius: 4px;',
'border-color: inherit;',
'}',
'.blocklyResizeSE {',
'cursor: se-resize;',
'fill: #aaa;',

8
core/dropdowndiv.js
View File

@@ -236,6 +236,9 @@ Blockly.DropDownDiv.showPositionedByField = function(owner,
var bBox = {width: owner.size_.width, height: owner.size_.height};
bBox.width *= scale;
bBox.height *= scale;
// bbox.width * scale is not the same as position.right - position.left.
// What's up with that?
var position = owner.fieldGroup_.getBoundingClientRect();
// If we can fit it, render below the block.
var primaryX = position.left + bBox.width / 2;
@@ -455,6 +458,11 @@ Blockly.DropDownDiv.hideWithoutAnimation = function() {
* @private
*/
Blockly.DropDownDiv.positionInternal_ = function(initialX, initialY, finalX, finalY) {
initialX = initialX == null ? initialX : Math.floor(initialX);
initialY = initialY == null ? initialY : Math.floor(initialY);
finalX = finalX == null ? finalX : Math.floor(finalX);
finalY = finalY == null ? finalY : Math.floor(finalY);
var div = Blockly.DropDownDiv.DIV_;
// First apply initial translation.
div.style.left = initialX != null ? initialX + 'px' : '';

39
core/field_colour.js
View File

@@ -217,25 +217,42 @@ Blockly.FieldColour.prototype.setColumns = function(columns) {
* @private
*/
Blockly.FieldColour.prototype.showEditor_ = function() {
Blockly.WidgetDiv.show(this, this.sourceBlock_.RTL,
Blockly.FieldColour.widgetDispose_);
// Record viewport dimensions before adding the widget.
var viewportBBox = Blockly.utils.getViewportBBox();
var anchorBBox = this.getScaledBBox_();
Blockly.DropDownDiv.hideWithoutAnimation();
Blockly.DropDownDiv.clearContent();
// Create and add the colour picker, then record the size.
var picker = this.createWidget_();
Blockly.WidgetDiv.DIV.appendChild(picker);
var paletteSize = goog.style.getSize(picker);
Blockly.DropDownDiv.getContentDiv().appendChild(picker);
Blockly.DropDownDiv.setColour('#ffffff', '#dddddd');
// Position the picker to line up with the field.
Blockly.WidgetDiv.positionWithAnchor(viewportBBox, anchorBBox, paletteSize,
this.sourceBlock_.RTL);
Blockly.DropDownDiv.showPositionedByField(this);
// Configure event handler on the table to listen for any event in a cell.
Blockly.FieldColour.onUpWrapper_ = Blockly.bindEvent_(picker,
'mouseup', this, this.onClick_);
// Old code is below here
//
//
// Blockly.WidgetDiv.show(this, this.sourceBlock_.RTL,
// Blockly.FieldColour.widgetDispose_);
// // Record viewport dimensions before adding the widget.
// var viewportBBox = Blockly.utils.getViewportBBox();
// var anchorBBox = this.getScaledBBox_();
// // Create and add the colour picker, then record the size.
// var picker = this.createWidget_();
// Blockly.WidgetDiv.DIV.appendChild(picker);
// var paletteSize = goog.style.getSize(picker);
// // Position the picker to line up with the field.
// Blockly.WidgetDiv.positionWithAnchor(viewportBBox, anchorBBox, paletteSize,
// this.sourceBlock_.RTL);
// // Configure event handler on the table to listen for any event in a cell.
// Blockly.FieldColour.onUpWrapper_ = Blockly.bindEvent_(picker,
// 'mouseup', this, this.onClick_);
};
/**