nodeskini 1.0.1 → 1.0.2

package/blocklySkini/blockly/core/renderers/geras/path_object.js

@@ -0,0 +1,177 @@
+/**
+ * @license
+ * Copyright 2019 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * @fileoverview An object that owns a block's rendering SVG elements.
+ * @author fenichel@google.com (Rachel Fenichel)
+ */
+
+'use strict';
+
+goog.provide('Blockly.geras.PathObject');
+
+goog.require('Blockly.blockRendering.PathObject');
+goog.require('Blockly.geras.ConstantProvider');
+goog.require('Blockly.Theme');
+goog.require('Blockly.utils.dom');
+goog.require('Blockly.utils.object');
+goog.require('Blockly.utils.Svg');
+
+
+/**
+ * An object that handles creating and setting each of the SVG elements
+ * used by the renderer.
+ * @param {!SVGElement} root The root SVG element.
+ * @param {!Blockly.Theme.BlockStyle} style The style object to use for
+ *     colouring.
+ * @param {!Blockly.geras.ConstantProvider} constants The renderer's constants.
+ * @constructor
+ * @extends {Blockly.blockRendering.PathObject}
+ * @package
+ */
+Blockly.geras.PathObject = function(root, style, constants) {
+  /**
+   * The renderer's constant provider.
+   * @type {!Blockly.geras.ConstantProvider}
+   */
+  this.constants = constants;
+
+  this.svgRoot = root;
+
+  // The order of creation for these next three matters, because that
+  // effectively sets their z-indices.
+
+  /**
+   * The dark path of the block.
+   * @type {SVGElement}
+   * @package
+   */
+  this.svgPathDark = Blockly.utils.dom.createSvgElement(
+      Blockly.utils.Svg.PATH,
+      {'class': 'blocklyPathDark', 'transform': 'translate(1,1)'},
+      this.svgRoot);
+
+  /**
+   * The primary path of the block.
+   * @type {!SVGElement}
+   * @package
+   */
+  this.svgPath = Blockly.utils.dom.createSvgElement(
+      Blockly.utils.Svg.PATH,
+      {'class': 'blocklyPath'}, this.svgRoot);
+
+  /**
+   * The light path of the block.
+   * @type {SVGElement}
+   * @package
+   */
+  this.svgPathLight = Blockly.utils.dom.createSvgElement(
+      Blockly.utils.Svg.PATH,
+      {'class': 'blocklyPathLight'}, this.svgRoot);
+
+  /**
+   * The colour of the dark path on the block in '#RRGGBB' format.
+   * @type {string}
+   * @package
+   */
+  this.colourDark = '#000000';
+
+  /**
+   * The style object to use when colouring block paths.
+   * @type {!Blockly.Theme.BlockStyle}
+   * @package
+   */
+  this.style = style;
+};
+Blockly.utils.object.inherits(Blockly.geras.PathObject,
+    Blockly.blockRendering.PathObject);
+
+/**
+ * @override
+ */
+Blockly.geras.PathObject.prototype.setPath = function(mainPath) {
+  this.svgPath.setAttribute('d', mainPath);
+  this.svgPathDark.setAttribute('d', mainPath);
+};
+
+/**
+ * Set the highlight path generated by the renderer onto the SVG element.
+ * @param {string} highlightPath The highlight path.
+ * @package
+ */
+Blockly.geras.PathObject.prototype.setHighlightPath = function(highlightPath) {
+  this.svgPathLight.setAttribute('d', highlightPath);
+};
+
+/**
+ * @override
+ */
+Blockly.geras.PathObject.prototype.flipRTL = function() {
+  // Mirror the block's path.
+  this.svgPath.setAttribute('transform', 'scale(-1 1)');
+  this.svgPathLight.setAttribute('transform', 'scale(-1 1)');
+  this.svgPathDark.setAttribute('transform', 'translate(1,1) scale(-1 1)');
+};
+
+/**
+ * @override
+ */
+Blockly.geras.PathObject.prototype.applyColour = function(block) {
+  this.svgPathLight.style.display = '';
+  this.svgPathDark.style.display = '';
+  this.svgPathLight.setAttribute('stroke', this.style.colourTertiary);
+  this.svgPathDark.setAttribute('fill', this.colourDark);
+
+  Blockly.geras.PathObject.superClass_.applyColour.call(this, block);
+
+  this.svgPath.setAttribute('stroke', 'none');
+};
+
+/**
+ * @override
+ */
+Blockly.geras.PathObject.prototype.setStyle = function(blockStyle) {
+  this.style = blockStyle;
+  this.colourDark =
+      Blockly.utils.colour.blend('#000', this.style.colourPrimary, 0.2) ||
+      this.colourDark;
+};
+
+/**
+ * @override
+ */
+Blockly.geras.PathObject.prototype.updateHighlighted = function(highlighted) {
+  if (highlighted) {
+    this.svgPath.setAttribute('filter',
+        'url(#' + this.constants.embossFilterId + ')');
+    this.svgPathLight.style.display = 'none';
+  } else {
+    this.svgPath.setAttribute('filter', 'none');
+    this.svgPathLight.style.display = 'inline';
+  }
+};
+
+/**
+ * @override
+ */
+Blockly.geras.PathObject.prototype.updateShadow_ = function(shadow) {
+  if (shadow) {
+    this.svgPathLight.style.display = 'none';
+    this.svgPathDark.setAttribute('fill', this.style.colourSecondary);
+    this.svgPath.setAttribute('stroke', 'none');
+    this.svgPath.setAttribute('fill', this.style.colourSecondary);
+  }
+};
+
+/**
+ * @override
+ */
+Blockly.geras.PathObject.prototype.updateDisabled_ = function(disabled) {
+  Blockly.geras.PathObject.superClass_.updateDisabled_.call(this, disabled);
+  if (disabled) {
+    this.svgPath.setAttribute('stroke', 'none');
+  }
+};

package/blocklySkini/blockly/core/renderers/geras/renderer.js

@@ -0,0 +1,138 @@
+/**
+ * @license
+ * Copyright 2019 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * @fileoverview Geras renderer.
+ * @author fenichel@google.com (Rachel Fenichel)
+ */
+'use strict';
+
+goog.provide('Blockly.geras.Renderer');
+
+goog.require('Blockly.blockRendering');
+goog.require('Blockly.blockRendering.Renderer');
+goog.require('Blockly.geras.ConstantProvider');
+goog.require('Blockly.geras.Drawer');
+goog.require('Blockly.geras.HighlightConstantProvider');
+goog.require('Blockly.geras.PathObject');
+goog.require('Blockly.geras.RenderInfo');
+goog.require('Blockly.utils.object');
+
+
+/**
+ * The geras renderer.
+ * @param {string} name The renderer name.
+ * @package
+ * @constructor
+ * @extends {Blockly.blockRendering.Renderer}
+ */
+Blockly.geras.Renderer = function(name) {
+  Blockly.geras.Renderer.superClass_.constructor.call(this, name);
+
+  /**
+   * The renderer's highlight constant provider.
+   * @type {Blockly.geras.HighlightConstantProvider}
+   * @private
+   */
+  this.highlightConstants_ = null;
+};
+Blockly.utils.object.inherits(Blockly.geras.Renderer,
+    Blockly.blockRendering.Renderer);
+
+/**
+ * Initialize the renderer.  Geras has a highlight provider in addition to
+ * the normal constant provider.
+ * @package
+ * @override
+ */
+Blockly.geras.Renderer.prototype.init = function(theme,
+    opt_rendererOverrides) {
+  Blockly.geras.Renderer.superClass_.init.call(this, theme,
+      opt_rendererOverrides);
+  this.highlightConstants_ = this.makeHighlightConstants_();
+  this.highlightConstants_.init();
+};
+
+/**
+ * @override
+ */
+Blockly.geras.Renderer.prototype.refreshDom = function(svg, theme) {
+  Blockly.geras.Renderer.superClass_.refreshDom.call(this, svg, theme);
+  this.getHighlightConstants().init();
+};
+
+/**
+ * @override
+ */
+Blockly.geras.Renderer.prototype.makeConstants_ = function() {
+  return new Blockly.geras.ConstantProvider();
+};
+
+/**
+ * Create a new instance of the renderer's render info object.
+ * @param {!Blockly.BlockSvg} block The block to measure.
+ * @return {!Blockly.geras.RenderInfo} The render info object.
+ * @protected
+ * @override
+ */
+Blockly.geras.Renderer.prototype.makeRenderInfo_ = function(block) {
+  return new Blockly.geras.RenderInfo(this, block);
+};
+
+/**
+ * Create a new instance of the renderer's drawer.
+ * @param {!Blockly.BlockSvg} block The block to render.
+ * @param {!Blockly.blockRendering.RenderInfo} info An object containing all
+ *   information needed to render this block.
+ * @return {!Blockly.geras.Drawer} The drawer.
+ * @protected
+ * @override
+ */
+Blockly.geras.Renderer.prototype.makeDrawer_ = function(block, info) {
+  return new Blockly.geras.Drawer(block,
+      /** @type {!Blockly.geras.RenderInfo} */ (info));
+};
+
+/**
+ * Create a new instance of a renderer path object.
+ * @param {!SVGElement} root The root SVG element.
+ * @param {!Blockly.Theme.BlockStyle} style The style object to use for
+ *     colouring.
+ * @return {!Blockly.geras.PathObject} The renderer path object.
+ * @package
+ * @override
+ */
+Blockly.geras.Renderer.prototype.makePathObject = function(root, style) {
+  return new Blockly.geras.PathObject(root, style,
+      /** @type {!Blockly.geras.ConstantProvider} */ (this.getConstants()));
+};
+
+/**
+ * Create a new instance of the renderer's highlight constant provider.
+ * @return {!Blockly.geras.HighlightConstantProvider} The highlight constant
+ *     provider.
+ * @protected
+ */
+Blockly.geras.Renderer.prototype.makeHighlightConstants_ = function() {
+  return new Blockly.geras.HighlightConstantProvider(
+      /** @type {!Blockly.blockRendering.ConstantProvider} */
+      (this.getConstants()));
+};
+
+/**
+ * Get the renderer's highlight constant provider.  We assume that when this is
+ * called, the renderer has already been initialized.
+ * @return {!Blockly.geras.HighlightConstantProvider} The highlight constant
+ *     provider.
+ * @package
+ */
+Blockly.geras.Renderer.prototype.getHighlightConstants = function() {
+  return (
+    /** @type {!Blockly.geras.HighlightConstantProvider} */
+    (this.highlightConstants_));
+};
+
+Blockly.blockRendering.register('geras', Blockly.geras.Renderer);

package/blocklySkini/blockly/core/renderers/measurables/base.js

@@ -0,0 +1,44 @@
+/**
+ * @license
+ * Copyright 2019 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * @fileoverview Methods for graphically rendering a block as SVG.
+ * @author fenichel@google.com (Rachel Fenichel)
+ */
+
+'use strict';
+
+goog.provide('Blockly.blockRendering.Measurable');
+
+goog.require('Blockly.blockRendering.Types');
+
+
+/**
+ * The base class to represent a part of a block that takes up space during
+ * rendering.  The constructor for each non-spacer Measurable records the size
+ * of the block element (e.g. field, statement input).
+ * @param {!Blockly.blockRendering.ConstantProvider} constants The rendering
+ *   constants provider.
+ * @package
+ * @constructor
+ */
+Blockly.blockRendering.Measurable = function(constants) {
+  this.width = 0;
+  this.height = 0;
+  this.type = Blockly.blockRendering.Types.NONE;
+
+  this.xPos = 0;
+  this.centerline = 0;
+
+  /**
+   * The renderer's constant provider.
+   * @type {!Blockly.blockRendering.ConstantProvider}
+   * @protected
+   */
+  this.constants_ = constants;
+
+  this.notchOffset = this.constants_.NOTCH_OFFSET_LEFT;
+};

package/blocklySkini/blockly/core/renderers/measurables/connections.js

@@ -0,0 +1,114 @@
+/**
+ * @license
+ * Copyright 2019 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * @fileoverview Objects representing connections on rendered blocks.
+ * @author fenichel@google.com (Rachel Fenichel)
+ */
+
+goog.provide('Blockly.blockRendering.Connection');
+goog.provide('Blockly.blockRendering.NextConnection');
+goog.provide('Blockly.blockRendering.OutputConnection');
+goog.provide('Blockly.blockRendering.PreviousConnection');
+
+goog.require('Blockly.blockRendering.Measurable');
+goog.require('Blockly.blockRendering.Types');
+goog.require('Blockly.utils.object');
+
+
+
+/**
+ * The base class to represent a connection and the space that it takes up on
+ * the block.
+ * @param {!Blockly.blockRendering.ConstantProvider} constants The rendering
+ *   constants provider.
+ * @param {!Blockly.RenderedConnection} connectionModel The connection object on
+ *     the block that this represents.
+ * @package
+ * @constructor
+ * @extends {Blockly.blockRendering.Measurable}
+ */
+Blockly.blockRendering.Connection = function(constants, connectionModel) {
+  Blockly.blockRendering.Connection.superClass_.constructor.call(this,
+      constants);
+  this.connectionModel = connectionModel;
+  this.shape = this.constants_.shapeFor(connectionModel);
+  this.isDynamicShape = !!this.shape['isDynamic'];
+  this.type |= Blockly.blockRendering.Types.CONNECTION;
+};
+Blockly.utils.object.inherits(Blockly.blockRendering.Connection,
+    Blockly.blockRendering.Measurable);
+
+/**
+ * An object containing information about the space an output connection takes
+ * up during rendering.
+ * @param {!Blockly.blockRendering.ConstantProvider} constants The rendering
+ *   constants provider.
+ * @param {Blockly.RenderedConnection} connectionModel The connection object on
+ *     the block that this represents.
+ * @package
+ * @constructor
+ * @extends {Blockly.blockRendering.Connection}
+ */
+Blockly.blockRendering.OutputConnection = function(constants, connectionModel) {
+  Blockly.blockRendering.OutputConnection.superClass_.constructor.call(this,
+      constants, connectionModel);
+  this.type |= Blockly.blockRendering.Types.OUTPUT_CONNECTION;
+
+  this.height = !this.isDynamicShape ? this.shape.height : 0;
+  this.width = !this.isDynamicShape ? this.shape.width : 0;
+  this.startX = this.width;
+
+  this.connectionOffsetY = this.constants_.TAB_OFFSET_FROM_TOP;
+  this.connectionOffsetX = 0;
+};
+Blockly.utils.object.inherits(Blockly.blockRendering.OutputConnection,
+    Blockly.blockRendering.Connection);
+
+
+/**
+ * An object containing information about the space a previous connection takes
+ * up during rendering.
+ * @param {!Blockly.blockRendering.ConstantProvider} constants The rendering
+ *   constants provider.
+ * @param {Blockly.RenderedConnection} connectionModel The connection object on
+ *     the block that this represents.
+ * @package
+ * @constructor
+ * @extends {Blockly.blockRendering.Connection}
+ */
+Blockly.blockRendering.PreviousConnection = function(
+    constants, connectionModel) {
+  Blockly.blockRendering.PreviousConnection.superClass_.constructor.call(this,
+      constants, connectionModel);
+  this.type |= Blockly.blockRendering.Types.PREVIOUS_CONNECTION;
+  this.height = this.shape.height;
+  this.width = this.shape.width;
+
+};
+Blockly.utils.object.inherits(Blockly.blockRendering.PreviousConnection,
+    Blockly.blockRendering.Connection);
+
+/**
+ * An object containing information about the space a next connection takes
+ * up during rendering.
+ * @param {!Blockly.blockRendering.ConstantProvider} constants The rendering
+ *   constants provider.
+ * @param {Blockly.RenderedConnection} connectionModel The connection object on
+ *     the block that this represents.
+ * @package
+ * @constructor
+ * @extends {Blockly.blockRendering.Connection}
+ */
+Blockly.blockRendering.NextConnection = function(constants, connectionModel) {
+  Blockly.blockRendering.NextConnection.superClass_.constructor.call(this,
+      constants, connectionModel);
+  this.type |= Blockly.blockRendering.Types.NEXT_CONNECTION;
+  this.height = this.shape.height;
+  this.width = this.shape.width;
+};
+Blockly.utils.object.inherits(Blockly.blockRendering.NextConnection,
+    Blockly.blockRendering.Connection);

package/blocklySkini/blockly/core/renderers/measurables/inputs.js

@@ -0,0 +1,160 @@
+/**
+ * @license
+ * Copyright 2019 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * @fileoverview Objects representing inputs with connections on a rendered
+ * block.
+ * @author fenichel@google.com (Rachel Fenichel)
+ */
+
+goog.provide('Blockly.blockRendering.ExternalValueInput');
+goog.provide('Blockly.blockRendering.InlineInput');
+goog.provide('Blockly.blockRendering.InputConnection');
+goog.provide('Blockly.blockRendering.StatementInput');
+
+goog.require('Blockly.blockRendering.Connection');
+goog.require('Blockly.blockRendering.Measurable');
+goog.require('Blockly.blockRendering.Types');
+goog.require('Blockly.utils.object');
+
+
+/**
+ * The base class to represent an input that takes up space on a block
+ * during rendering
+ * @param {!Blockly.blockRendering.ConstantProvider} constants The rendering
+ *   constants provider.
+ * @param {!Blockly.Input} input The input to measure and store information for.
+ * @package
+ * @constructor
+ * @extends {Blockly.blockRendering.Connection}
+ */
+Blockly.blockRendering.InputConnection = function(constants, input) {
+  Blockly.blockRendering.InputConnection.superClass_.constructor.call(this,
+      constants, input.connection);
+
+  this.type |= Blockly.blockRendering.Types.INPUT;
+  this.input = input;
+  this.align = input.align;
+  this.connectedBlock = input.connection && input.connection.targetBlock() ?
+      input.connection.targetBlock() : null;
+
+  if (this.connectedBlock) {
+    var bBox = this.connectedBlock.getHeightWidth();
+    this.connectedBlockWidth = bBox.width;
+    this.connectedBlockHeight = bBox.height;
+  } else {
+    this.connectedBlockWidth = 0;
+    this.connectedBlockHeight = 0;
+  }
+
+  this.connectionOffsetX = 0;
+  this.connectionOffsetY = 0;
+};
+Blockly.utils.object.inherits(Blockly.blockRendering.InputConnection,
+    Blockly.blockRendering.Connection);
+
+/**
+ * An object containing information about the space an inline input takes up
+ * during rendering
+ * @param {!Blockly.blockRendering.ConstantProvider} constants The rendering
+ *   constants provider.
+ * @param {!Blockly.Input} input The inline input to measure and store
+ *     information for.
+ * @package
+ * @constructor
+ * @extends {Blockly.blockRendering.InputConnection}
+ */
+Blockly.blockRendering.InlineInput = function(constants, input) {
+  Blockly.blockRendering.InlineInput.superClass_.constructor.call(this,
+      constants, input);
+  this.type |= Blockly.blockRendering.Types.INLINE_INPUT;
+
+  if (!this.connectedBlock) {
+    this.height = this.constants_.EMPTY_INLINE_INPUT_HEIGHT;
+    this.width = this.constants_.EMPTY_INLINE_INPUT_PADDING;
+  } else {
+    // We allow the dark path to show on the parent block so that the child
+    // block looks embossed.  This takes up an extra pixel in both x and y.
+    this.width = this.connectedBlockWidth;
+    this.height = this.connectedBlockHeight;
+  }
+
+  this.connectionHeight = !this.isDynamicShape ? this.shape.height :
+      this.shape.height(this.height);
+  this.connectionWidth = !this.isDynamicShape ? this.shape.width :
+      this.shape.width(this.height);
+  if (!this.connectedBlock) {
+    this.width += this.connectionWidth * (this.isDynamicShape ? 2 : 1);
+  }
+  this.connectionOffsetY = this.isDynamicShape ?
+      this.shape.connectionOffsetY(this.connectionHeight) :
+      this.constants_.TAB_OFFSET_FROM_TOP;
+  this.connectionOffsetX = this.isDynamicShape ?
+      this.shape.connectionOffsetX(this.connectionWidth) : 0;
+};
+Blockly.utils.object.inherits(Blockly.blockRendering.InlineInput,
+    Blockly.blockRendering.InputConnection);
+
+/**
+ * An object containing information about the space a statement input takes up
+ * during rendering
+ * @param {!Blockly.blockRendering.ConstantProvider} constants The rendering
+ *   constants provider.
+ * @param {!Blockly.Input} input The statement input to measure and store
+ *     information for.
+ * @package
+ * @constructor
+ * @extends {Blockly.blockRendering.InputConnection}
+ */
+Blockly.blockRendering.StatementInput = function(constants, input) {
+  Blockly.blockRendering.StatementInput.superClass_.constructor.call(this,
+      constants, input);
+  this.type |= Blockly.blockRendering.Types.STATEMENT_INPUT;
+
+  if (!this.connectedBlock) {
+    this.height = this.constants_.EMPTY_STATEMENT_INPUT_HEIGHT;
+  } else {
+    // We allow the dark path to show on the parent block so that the child
+    // block looks embossed.  This takes up an extra pixel in both x and y.
+    this.height =
+        this.connectedBlockHeight + this.constants_.STATEMENT_BOTTOM_SPACER;
+  }
+  this.width = this.constants_.STATEMENT_INPUT_NOTCH_OFFSET + this.shape.width;
+};
+Blockly.utils.object.inherits(Blockly.blockRendering.StatementInput,
+    Blockly.blockRendering.InputConnection);
+
+/**
+ * An object containing information about the space an external value input
+ * takes up during rendering
+ * @param {!Blockly.blockRendering.ConstantProvider} constants The rendering
+ *   constants provider.
+ * @param {!Blockly.Input} input The external value input to measure and store
+ *     information for.
+ * @package
+ * @constructor
+ * @extends {Blockly.blockRendering.InputConnection}
+ */
+Blockly.blockRendering.ExternalValueInput = function(constants, input) {
+  Blockly.blockRendering.ExternalValueInput.superClass_.constructor.call(this,
+      constants, input);
+  this.type |= Blockly.blockRendering.Types.EXTERNAL_VALUE_INPUT;
+  if (!this.connectedBlock) {
+    this.height = this.shape.height;
+  } else {
+    this.height =
+        this.connectedBlockHeight - this.constants_.TAB_OFFSET_FROM_TOP -
+        this.constants_.MEDIUM_PADDING;
+  }
+  this.width = this.shape.width +
+      this.constants_.EXTERNAL_VALUE_INPUT_PADDING;
+
+  this.connectionOffsetY = this.constants_.TAB_OFFSET_FROM_TOP;
+  this.connectionHeight = this.shape.height;
+  this.connectionWidth = this.shape.width;
+};
+Blockly.utils.object.inherits(Blockly.blockRendering.ExternalValueInput,
+    Blockly.blockRendering.InputConnection);