diff --git a/blockly_uncompressed.js b/blockly_uncompressed.js index b89c8d7c9..b7f60f7d9 100644 --- a/blockly_uncompressed.js +++ b/blockly_uncompressed.js @@ -95,8 +95,8 @@ goog.addDependency("../../../" + dir + "/core/rendered_connection.js", ['Blockly goog.addDependency("../../../" + dir + "/core/renderers/block_rendering_rewrite/block_render_draw.js", ['Blockly.blockRendering.Drawer'], ['Blockly.blockRendering.Debug', 'Blockly.blockRendering.RenderInfo', 'Blockly.blockRendering.Measurable', 'Blockly.blockRendering.BottomRow', 'Blockly.blockRendering.InputRow', 'Blockly.blockRendering.Row', 'Blockly.blockRendering.SpacerRow', 'Blockly.blockRendering.TopRow']); goog.addDependency("../../../" + dir + "/core/renderers/block_rendering_rewrite/block_render_draw_debug.js", ['Blockly.blockRendering.Debug'], ['Blockly.blockRendering.RenderInfo', 'Blockly.blockRendering.Measurable', 'Blockly.blockRendering.BottomRow', 'Blockly.blockRendering.InputRow', 'Blockly.blockRendering.Row', 'Blockly.blockRendering.SpacerRow', 'Blockly.blockRendering.TopRow']); goog.addDependency("../../../" + dir + "/core/renderers/block_rendering_rewrite/block_render_info.js", ['Blockly.blockRendering.RenderInfo'], ['Blockly.blockRendering.Measurable', 'Blockly.blockRendering.BottomRow', 'Blockly.blockRendering.InputRow', 'Blockly.blockRendering.Row', 'Blockly.blockRendering.SpacerRow', 'Blockly.blockRendering.TopRow', 'Blockly.blockRendering.InlineInput', 'Blockly.blockRendering.ExternalValueInput', 'Blockly.blockRendering.StatementInput', 'Blockly.blockRendering.PreviousConnection', 'Blockly.blockRendering.NextConnection', 'Blockly.blockRendering.OutputConnection', 'Blockly.RenderedConnection']); -goog.addDependency("../../../" + dir + "/core/renderers/block_rendering_rewrite/block_rendering.js", ['Blockly.blockRendering'], ['Blockly.blockRendering.Debug', 'Blockly.blockRendering.Drawer', 'Blockly.blockRendering.RenderInfo', 'Blockly.blockRendering.ConstantProvider', 'Blockly.geras.HighlightConstantProvider', 'Blockly.geras.RenderInfo', 'Blockly.geras.Drawer', 'Blockly.thrasos.RenderInfo', 'Blockly.zelos.RenderInfo']); -goog.addDependency("../../../" + dir + "/core/renderers/block_rendering_rewrite/block_rendering_constants.js", ['Blockly.blockRendering.ConstantProvider'], ['Blockly.utils.svgPaths']); +goog.addDependency("../../../" + dir + "/core/renderers/block_rendering_rewrite/block_rendering.js", ['Blockly.blockRendering'], ['Blockly.blockRendering.Debug', 'Blockly.blockRendering.Drawer', 'Blockly.blockRendering.RenderInfo', 'Blockly.blockRendering.ConstantProvider', 'Blockly.geras.HighlightConstantProvider', 'Blockly.geras.RenderInfo', 'Blockly.geras.Drawer', 'Blockly.thrasos.RenderInfo', 'Blockly.zelos.RenderInfo', 'Blockly.zelos.ConstantProvider']); +goog.addDependency("../../../" + dir + "/core/renderers/block_rendering_rewrite/constants.js", ['Blockly.blockRendering.ConstantProvider'], ['Blockly.utils.svgPaths']); goog.addDependency("../../../" + dir + "/core/renderers/block_rendering_rewrite/measurables.js", ['Blockly.blockRendering.InRowSpacer'], ['Blockly.blockRendering.Measurable']); goog.addDependency("../../../" + dir + "/core/renderers/geras/drawer.js", ['Blockly.geras.Drawer'], ['Blockly.blockRendering.ConstantProvider', 'Blockly.blockRendering.Drawer', 'Blockly.geras.Highlighter', 'Blockly.geras.RenderInfo']); goog.addDependency("../../../" + dir + "/core/renderers/geras/highlight_constants.js", ['Blockly.geras.HighlightConstantProvider'], ['Blockly.blockRendering.ConstantProvider', 'Blockly.utils.svgPaths']); @@ -107,6 +107,7 @@ goog.addDependency("../../../" + dir + "/core/renderers/measurables/connections. goog.addDependency("../../../" + dir + "/core/renderers/measurables/inputs.js", ['Blockly.blockRendering.InputConnection', 'Blockly.blockRendering.InlineInput', 'Blockly.blockRendering.StatementInput', 'Blockly.blockRendering.ExternalValueInput'], ['Blockly.blockRendering.Connection', 'Blockly.blockRendering.Measurable']); goog.addDependency("../../../" + dir + "/core/renderers/measurables/rows.js", ['Blockly.blockRendering.BottomRow', 'Blockly.blockRendering.InputRow', 'Blockly.blockRendering.Row', 'Blockly.blockRendering.SpacerRow', 'Blockly.blockRendering.TopRow'], ['Blockly.blockRendering.InputConnection', 'Blockly.blockRendering.InRowSpacer', 'Blockly.blockRendering.Measurable', 'Blockly.blockRendering.NextConnection', 'Blockly.blockRendering.PreviousConnection', 'Blockly.RenderedConnection']); goog.addDependency("../../../" + dir + "/core/renderers/thrasos/info.js", ['Blockly.thrasos', 'Blockly.thrasos.RenderInfo'], ['Blockly.blockRendering.RenderInfo', 'Blockly.blockRendering.Measurable', 'Blockly.blockRendering.BottomRow', 'Blockly.blockRendering.InputRow', 'Blockly.blockRendering.Row', 'Blockly.blockRendering.SpacerRow', 'Blockly.blockRendering.TopRow', 'Blockly.blockRendering.InlineInput', 'Blockly.blockRendering.ExternalValueInput', 'Blockly.blockRendering.StatementInput', 'Blockly.blockRendering.PreviousConnection', 'Blockly.blockRendering.NextConnection', 'Blockly.blockRendering.OutputConnection', 'Blockly.RenderedConnection']); +goog.addDependency("../../../" + dir + "/core/renderers/zelos/constants.js", ['Blockly.zelos.ConstantProvider'], ['Blockly.blockRendering.ConstantProvider', 'Blockly.utils.svgPaths']); goog.addDependency("../../../" + dir + "/core/renderers/zelos/info.js", ['Blockly.zelos', 'Blockly.zelos.RenderInfo'], ['Blockly.blockRendering.RenderInfo', 'Blockly.blockRendering.Measurable', 'Blockly.blockRendering.BottomRow', 'Blockly.blockRendering.InputRow', 'Blockly.blockRendering.Row', 'Blockly.blockRendering.SpacerRow', 'Blockly.blockRendering.TopRow', 'Blockly.blockRendering.InlineInput', 'Blockly.blockRendering.ExternalValueInput', 'Blockly.blockRendering.StatementInput', 'Blockly.blockRendering.PreviousConnection', 'Blockly.blockRendering.NextConnection', 'Blockly.blockRendering.OutputConnection', 'Blockly.RenderedConnection']); goog.addDependency("../../../" + dir + "/core/scrollbar.js", ['Blockly.Scrollbar', 'Blockly.ScrollbarPair'], ['Blockly.Touch', 'Blockly.utils', 'Blockly.utils.Coordinate', 'Blockly.utils.dom']); goog.addDependency("../../../" + dir + "/core/theme.js", ['Blockly.Theme'], []); @@ -314,6 +315,7 @@ goog.require('Blockly.utils.uiMenu'); goog.require('Blockly.utils.userAgent'); goog.require('Blockly.utils.xml'); goog.require('Blockly.zelos'); +goog.require('Blockly.zelos.ConstantProvider'); goog.require('Blockly.zelos.RenderInfo'); delete root.BLOCKLY_DIR; diff --git a/core/renderers/block_rendering_rewrite/block_rendering.js b/core/renderers/block_rendering_rewrite/block_rendering.js index 4880cc942..41ae85a42 100644 --- a/core/renderers/block_rendering_rewrite/block_rendering.js +++ b/core/renderers/block_rendering_rewrite/block_rendering.js @@ -40,6 +40,7 @@ goog.require('Blockly.geras.RenderInfo'); goog.require('Blockly.geras.Drawer'); goog.require('Blockly.thrasos.RenderInfo'); goog.require('Blockly.zelos.RenderInfo'); +goog.require('Blockly.zelos.ConstantProvider'); // TODO (#2702): Pick an API for choosing a renderer. Blockly.blockRendering.rendererName = 'geras'; @@ -49,12 +50,22 @@ Blockly.blockRendering.rendererName = 'geras'; * @package */ Blockly.blockRendering.init = function() { - Blockly.blockRendering.constants = + if (Blockly.blockRendering.rendererName == 'geras') { + Blockly.blockRendering.constants = new Blockly.blockRendering.ConstantProvider(); - // No one else has a highlight provider. It's possible this should only be - // created if we're rendering with geras. - Blockly.blockRendering.highlightConstants = - new Blockly.geras.HighlightConstantProvider(); + Blockly.blockRendering.constants.init(); + // No one else has a highlight provider. + Blockly.blockRendering.highlightConstants = + new Blockly.geras.HighlightConstantProvider(); + } else if (Blockly.blockRendering.rendererName == 'thrasos') { + Blockly.blockRendering.constants = + new Blockly.blockRendering.ConstantProvider(); + Blockly.blockRendering.constants.init(); + } else if (Blockly.blockRendering.rendererName == 'zelos') { + Blockly.blockRendering.constants = + new Blockly.zelos.ConstantProvider(); + Blockly.blockRendering.constants.init(); + } }; /** diff --git a/core/renderers/block_rendering_rewrite/block_rendering_constants.js b/core/renderers/block_rendering_rewrite/constants.js similarity index 97% rename from core/renderers/block_rendering_rewrite/block_rendering_constants.js rename to core/renderers/block_rendering_rewrite/constants.js index 760119c8c..e485f6d14 100644 --- a/core/renderers/block_rendering_rewrite/block_rendering_constants.js +++ b/core/renderers/block_rendering_rewrite/constants.js @@ -75,8 +75,7 @@ Blockly.blockRendering.ConstantProvider = function() { // Offset from the left side of a block or the inside of a statement input to // the left side of the notch. - this.NOTCH_OFFSET_LEFT = - this.NOTCH_WIDTH; + this.NOTCH_OFFSET_LEFT = 15; this.STATEMENT_BOTTOM_SPACER = 5; this.STATEMENT_INPUT_PADDING_LEFT = 20; @@ -133,6 +132,13 @@ Blockly.blockRendering.ConstantProvider = function() { * @const */ this.JAGGED_TEETH_WIDTH = 6; +}; + +/** + * Initialize shape objects based on the constants set in the constructor. + * @package + */ +Blockly.blockRendering.ConstantProvider.prototype.init = function() { /** * An object containing sizing and path information about collapsed block diff --git a/core/renderers/zelos/constants.js b/core/renderers/zelos/constants.js new file mode 100644 index 000000000..d4bbe214a --- /dev/null +++ b/core/renderers/zelos/constants.js @@ -0,0 +1,81 @@ +/** + * @license + * Visual Blocks Editor + * + * Copyright 2019 Google Inc. + * https://developers.google.com/blockly/ + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +/** + * @fileoverview Methods for graphically rendering a block as SVG. + * @author fenichel@google.com (Rachel Fenichel) + */ +'use strict'; + +goog.provide('Blockly.zelos.ConstantProvider'); + +goog.require('Blockly.blockRendering.ConstantProvider'); +goog.require('Blockly.utils.svgPaths'); + +/** + * An object containing all sizing information needed to draw this block. + * + * This measure pass does not propagate changes to the block (although fields + * may choose to rerender when getSize() is called). However, calling it + * repeatedly may be expensive. + * + * @constructor + * @package + * @extends {Blockly.blockRendering.ConstantProvider} + */ +Blockly.zelos.ConstantProvider = function() { + Blockly.zelos.ConstantProvider.superClass_.constructor.call(this); +}; +goog.inherits(Blockly.zelos.ConstantProvider, + Blockly.blockRendering.ConstantProvider); + +/** + * @override + */ +Blockly.zelos.ConstantProvider.prototype.makePuzzleTab = function() { + // Example replacement of one connection shape with another. + // Eventually this will be replaced by a lookup based on connection type. + // For now this just makes Zelos visibly different from Thrasos. + return this.makeTriangle(); +}; + +Blockly.zelos.ConstantProvider.prototype.makeTriangle = function() { + var width = 20; + var height = 20; + // The 'up' and 'down' versions of the paths are the same, but the Y sign + // flips. Forward and back are the signs to use to move the cursor in the + // direction that the path is being drawn. + function makeMainPath(up) { + var forward = up ? -1 : 1; + + return Blockly.utils.svgPaths.lineTo(-width, forward * height / 2) + + Blockly.utils.svgPaths.lineTo(width, forward * height / 2); + } + + var pathUp = makeMainPath(true); + var pathDown = makeMainPath(false); + + return { + width: width, + height: height, + pathDown: pathDown, + pathUp: pathUp + }; +};