mirror of
https://github.com/google/blockly.git
synced 2026-01-10 18:37:09 +01:00
Use goog.math.Coordinate instead of separate X and Y properties.
This commit is contained in:
@@ -853,8 +853,8 @@ Blockly.BlockSvg.prototype.onMouseMove_ = function(e) {
|
||||
// Drag all the nested bubbles.
|
||||
for (var i = 0; i < this.draggedBubbles_.length; i++) {
|
||||
var commentData = this.draggedBubbles_[i];
|
||||
commentData.bubble.setIconLocation(commentData.x + dx,
|
||||
commentData.y + dy);
|
||||
commentData.bubble.setIconLocation(
|
||||
new goog.math.Coordinate(commentData.x + dx, commentData.y + dy));
|
||||
}
|
||||
|
||||
// Check to see if any of this block's connections are within range of
|
||||
|
||||
@@ -34,18 +34,17 @@ goog.require('goog.userAgent');
|
||||
|
||||
/**
|
||||
* Class for UI bubble.
|
||||
* @param {!Blockly.Workspace} workspace The workspace on which to draw the
|
||||
* @param {!Blockly.WorkspaceSvg} workspace The workspace on which to draw the
|
||||
* bubble.
|
||||
* @param {!Element} content SVG content for the bubble.
|
||||
* @param {Element} shape SVG element to avoid eclipsing.
|
||||
* @param {number} anchorX Absolute horizontal position of bubbles anchor point.
|
||||
* @param {number} anchorY Absolute vertical position of bubbles anchor point.
|
||||
* @param {!goog.math.Coodinate} anchorXY Absolute position of bubble's anchor
|
||||
* point.
|
||||
* @param {?number} bubbleWidth Width of bubble, or null if not resizable.
|
||||
* @param {?number} bubbleHeight Height of bubble, or null if not resizable.
|
||||
* @constructor
|
||||
*/
|
||||
Blockly.Bubble = function(workspace, content, shape,
|
||||
anchorX, anchorY,
|
||||
Blockly.Bubble = function(workspace, content, shape, anchorXY,
|
||||
bubbleWidth, bubbleHeight) {
|
||||
this.workspace_ = workspace;
|
||||
this.content_ = content;
|
||||
@@ -60,7 +59,7 @@ Blockly.Bubble = function(workspace, content, shape,
|
||||
var canvas = workspace.getBubbleCanvas();
|
||||
canvas.appendChild(this.createDom_(content, !!(bubbleWidth && bubbleHeight)));
|
||||
|
||||
this.setAnchorLocation(anchorX, anchorY);
|
||||
this.setAnchorLocation(anchorXY);
|
||||
if (!bubbleWidth || !bubbleHeight) {
|
||||
var bBox = /** @type {SVGLocatable} */ (this.content_).getBBox();
|
||||
bubbleWidth = bBox.width + 2 * Blockly.Bubble.BORDER_WIDTH;
|
||||
@@ -145,16 +144,11 @@ Blockly.Bubble.unbindDragEvents_ = function() {
|
||||
Blockly.Bubble.prototype.rendered_ = false;
|
||||
|
||||
/**
|
||||
* Absolute X coordinate of anchor point.
|
||||
* Absolute coordinate of anchor point.
|
||||
* @type {goog.math.Coordinate}
|
||||
* @private
|
||||
*/
|
||||
Blockly.Bubble.prototype.anchorX_ = 0;
|
||||
|
||||
/**
|
||||
* Absolute Y coordinate of anchor point.
|
||||
* @private
|
||||
*/
|
||||
Blockly.Bubble.prototype.anchorY_ = 0;
|
||||
Blockly.Bubble.prototype.anchorXY_ = null;
|
||||
|
||||
/**
|
||||
* Relative X coordinate of bubble with respect to the anchor's centre.
|
||||
@@ -360,12 +354,10 @@ Blockly.Bubble.prototype.promote_ = function() {
|
||||
/**
|
||||
* Notification that the anchor has moved.
|
||||
* Update the arrow and bubble accordingly.
|
||||
* @param {number} x Absolute horizontal location.
|
||||
* @param {number} y Absolute vertical location.
|
||||
* @param {!goog.math.Coordinate} xy Absolute location.
|
||||
*/
|
||||
Blockly.Bubble.prototype.setAnchorLocation = function(x, y) {
|
||||
this.anchorX_ = x;
|
||||
this.anchorY_ = y;
|
||||
Blockly.Bubble.prototype.setAnchorLocation = function(xy) {
|
||||
this.anchorXY_ = xy;
|
||||
if (this.rendered_) {
|
||||
this.positionBubble_();
|
||||
}
|
||||
@@ -383,31 +375,32 @@ Blockly.Bubble.prototype.layoutBubble_ = function() {
|
||||
var metrics = this.workspace_.getMetrics();
|
||||
metrics.viewWidth /= this.workspace_.scale;
|
||||
metrics.viewLeft /= this.workspace_.scale;
|
||||
var anchorX = this.anchorXY_.x;
|
||||
if (this.workspace_.RTL) {
|
||||
if (this.anchorX_ - metrics.viewLeft - relativeLeft - this.width_ <
|
||||
if (anchorX - metrics.viewLeft - relativeLeft - this.width_ <
|
||||
Blockly.Scrollbar.scrollbarThickness) {
|
||||
// Slide the bubble right until it is onscreen.
|
||||
relativeLeft = this.anchorX_ - metrics.viewLeft - this.width_ -
|
||||
relativeLeft = anchorX - metrics.viewLeft - this.width_ -
|
||||
Blockly.Scrollbar.scrollbarThickness;
|
||||
} else if (this.anchorX_ - metrics.viewLeft - relativeLeft >
|
||||
} else if (anchorX - metrics.viewLeft - relativeLeft >
|
||||
metrics.viewWidth) {
|
||||
// Slide the bubble left until it is onscreen.
|
||||
relativeLeft = this.anchorX_ - metrics.viewLeft - metrics.viewWidth;
|
||||
relativeLeft = anchorX - metrics.viewLeft - metrics.viewWidth;
|
||||
}
|
||||
} else {
|
||||
if (this.anchorX_ + relativeLeft < metrics.viewLeft) {
|
||||
if (anchorX + relativeLeft < metrics.viewLeft) {
|
||||
// Slide the bubble right until it is onscreen.
|
||||
relativeLeft = metrics.viewLeft - this.anchorX_;
|
||||
relativeLeft = metrics.viewLeft - anchorX;
|
||||
} else if (metrics.viewLeft + metrics.viewWidth <
|
||||
this.anchorX_ + relativeLeft + this.width_ +
|
||||
anchorX + relativeLeft + this.width_ +
|
||||
Blockly.BlockSvg.SEP_SPACE_X +
|
||||
Blockly.Scrollbar.scrollbarThickness) {
|
||||
// Slide the bubble left until it is onscreen.
|
||||
relativeLeft = metrics.viewLeft + metrics.viewWidth - this.anchorX_ -
|
||||
relativeLeft = metrics.viewLeft + metrics.viewWidth - anchorX -
|
||||
this.width_ - Blockly.Scrollbar.scrollbarThickness;
|
||||
}
|
||||
}
|
||||
if (this.anchorY_ + relativeTop < metrics.viewTop) {
|
||||
if (this.anchorXY_.y + relativeTop < metrics.viewTop) {
|
||||
// Slide the bubble below the block.
|
||||
var bBox = /** @type {SVGLocatable} */ (this.shape_).getBBox();
|
||||
relativeTop = bBox.height;
|
||||
@@ -421,13 +414,13 @@ Blockly.Bubble.prototype.layoutBubble_ = function() {
|
||||
* @private
|
||||
*/
|
||||
Blockly.Bubble.prototype.positionBubble_ = function() {
|
||||
var left;
|
||||
var left = this.anchorXY_.x;
|
||||
if (this.workspace_.RTL) {
|
||||
left = this.anchorX_ - this.relativeLeft_ - this.width_;
|
||||
left -= this.relativeLeft_ + this.width_;
|
||||
} else {
|
||||
left = this.anchorX_ + this.relativeLeft_;
|
||||
left += this.relativeLeft_;
|
||||
}
|
||||
var top = this.relativeTop_ + this.anchorY_;
|
||||
var top = this.relativeTop_ + this.anchorXY_.y;
|
||||
this.bubbleGroup_.setAttribute('transform',
|
||||
'translate(' + left + ',' + top + ')');
|
||||
};
|
||||
|
||||
@@ -180,10 +180,9 @@ Blockly.Comment.prototype.setVisible = function(visible) {
|
||||
if (visible) {
|
||||
// Create the bubble.
|
||||
this.bubble_ = new Blockly.Bubble(
|
||||
/** @type {!Blockly.Workspace} */ (this.block_.workspace),
|
||||
/** @type {!Blockly.WorkspaceSvg} */ (this.block_.workspace),
|
||||
this.createEditor_(), this.block_.svgPath_,
|
||||
this.iconX_, this.iconY_,
|
||||
this.width_, this.height_);
|
||||
this.iconXY_, this.width_, this.height_);
|
||||
this.bubble_.registerResizeEvent(this, this.resizeBubble_);
|
||||
this.updateColour();
|
||||
} else {
|
||||
|
||||
35
core/icon.js
35
core/icon.js
@@ -27,6 +27,7 @@
|
||||
goog.provide('Blockly.Icon');
|
||||
|
||||
goog.require('goog.dom');
|
||||
goog.require('goog.math.Coordinate');
|
||||
|
||||
|
||||
/**
|
||||
@@ -56,16 +57,11 @@ Blockly.Icon.prototype.SIZE = 17;
|
||||
Blockly.Icon.prototype.bubble_ = null;
|
||||
|
||||
/**
|
||||
* Absolute X coordinate of icon's center.
|
||||
* Absolute coordinate of icon's center.
|
||||
* @type {goog.math.Coordinate}
|
||||
* @private
|
||||
*/
|
||||
Blockly.Icon.prototype.iconX_ = 0;
|
||||
|
||||
/**
|
||||
* Absolute Y coordinate of icon's centre.
|
||||
* @private
|
||||
*/
|
||||
Blockly.Icon.prototype.iconY_ = 0;
|
||||
Blockly.Icon.prototype.iconXY_ = null;
|
||||
|
||||
/**
|
||||
* Create the icon on the block.
|
||||
@@ -176,14 +172,12 @@ Blockly.Icon.prototype.renderIcon = function(cursorX) {
|
||||
|
||||
/**
|
||||
* Notification that the icon has moved. Update the arrow accordingly.
|
||||
* @param {number} x Absolute horizontal location.
|
||||
* @param {number} y Absolute vertical location.
|
||||
* @param {!goog.math.Coordinate} xy Absolute location.
|
||||
*/
|
||||
Blockly.Icon.prototype.setIconLocation = function(x, y) {
|
||||
this.iconX_ = x;
|
||||
this.iconY_ = y;
|
||||
Blockly.Icon.prototype.setIconLocation = function(xy) {
|
||||
this.iconXY_ = xy;
|
||||
if (this.isVisible()) {
|
||||
this.bubble_.setAnchorLocation(x, y);
|
||||
this.bubble_.setAnchorLocation(xy);
|
||||
}
|
||||
};
|
||||
|
||||
@@ -195,17 +189,18 @@ Blockly.Icon.prototype.computeIconLocation = function() {
|
||||
// Find coordinates for the centre of the icon and update the arrow.
|
||||
var blockXY = this.block_.getRelativeToSurfaceXY();
|
||||
var iconXY = Blockly.getRelativeXY_(this.iconGroup_);
|
||||
var newX = blockXY.x + iconXY.x + this.SIZE / 2;
|
||||
var newY = blockXY.y + iconXY.y + this.SIZE / 2;
|
||||
if (newX !== this.iconX_ || newY !== this.iconY_) {
|
||||
this.setIconLocation(newX, newY);
|
||||
var newXY = new goog.math.Coordinate(
|
||||
blockXY.x + iconXY.x + this.SIZE / 2,
|
||||
blockXY.y + iconXY.y + this.SIZE / 2);
|
||||
if (!goog.math.Coordinate.equals(this.getIconLocation(), newXY)) {
|
||||
this.setIconLocation(newXY);
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Returns the center of the block's icon relative to the surface.
|
||||
* @return {!Object} Object with x and y properties.
|
||||
* @return {!goog.math.Coordinate} Object with x and y properties.
|
||||
*/
|
||||
Blockly.Icon.prototype.getIconLocation = function() {
|
||||
return {x: this.iconX_, y: this.iconY_};
|
||||
return this.iconXY_;
|
||||
};
|
||||
|
||||
@@ -202,9 +202,9 @@ Blockly.Mutator.prototype.setVisible = function(visible) {
|
||||
new Blockly.Events.Ui(this.block_, 'mutatorOpen', !visible, visible));
|
||||
if (visible) {
|
||||
// Create the bubble.
|
||||
this.bubble_ = new Blockly.Bubble(this.block_.workspace,
|
||||
this.createEditor_(), this.block_.svgPath_,
|
||||
this.iconX_, this.iconY_, null, null);
|
||||
this.bubble_ = new Blockly.Bubble(
|
||||
/** @type {!Blockly.WorkspaceSvg} */ (this.block_.workspace),
|
||||
this.createEditor_(), this.block_.svgPath_, this.iconXY_, null, null);
|
||||
var tree = this.workspace_.options.languageTree;
|
||||
if (tree) {
|
||||
this.workspace_.flyout_.init(this.workspace_);
|
||||
|
||||
@@ -111,9 +111,8 @@ Blockly.Warning.prototype.setVisible = function(visible) {
|
||||
// Create the bubble to display all warnings.
|
||||
var paragraph = Blockly.Warning.textToDom_(this.getText());
|
||||
this.bubble_ = new Blockly.Bubble(
|
||||
/** @type {!Blockly.Workspace} */ (this.block_.workspace),
|
||||
paragraph, this.block_.svgPath_,
|
||||
this.iconX_, this.iconY_, null, null);
|
||||
/** @type {!Blockly.WorkspaceSvg} */ (this.block_.workspace),
|
||||
paragraph, this.block_.svgPath_, this.iconXY_, null, null);
|
||||
if (this.block_.RTL) {
|
||||
// Right-align the paragraph.
|
||||
// This cannot be done until the bubble is rendered on screen.
|
||||
|
||||
Reference in New Issue
Block a user