From f5d792b365a0aa0ff0e52fc7f5fb8b8e068b2f60 Mon Sep 17 00:00:00 2001 From: Greg Annandale Date: Tue, 17 Mar 2026 16:20:00 +0000 Subject: [PATCH] chore(docs): update docs config and paths (removing `blockly/`) Also setting correct GitHub org name --- .../codelabs/context-menu-option/summary.mdx | 4 +- packages/docs/docs/codelabs/css/blocks.mdx | 6 +- .../docs/docs/codelabs/css/categories.mdx | 4 +- .../docs/codelabs/css/codelab-overview.mdx | 4 +- .../docs/docs/codelabs/css/components.mdx | 4 +- packages/docs/docs/codelabs/css/summary.mdx | 2 +- .../block-generator-overview.mdx | 4 +- .../understand-connection-shapes.mdx | 2 +- .../add-an-icon-to-your-category.mdx | 2 +- .../change-the-look-of-a-category.mdx | 2 +- .../custom-toolbox/codelab-overview.mdx | 4 +- .../create-a-blockly-workspace.mdx | 4 +- .../getting-started/create-a-custom-block.mdx | 4 +- .../generate-javaScript-code.mdx | 2 +- .../docs/codelabs/getting-started/the-end.mdx | 2 +- packages/docs/docs/codelabs/index.mdx | 32 +++---- .../customize-block-styles.mdx | 2 +- .../theme-extension-identifier/summary.mdx | 4 +- .../codelab-overview.mdx | 4 +- .../validation-and-warnings/summary.mdx | 14 +-- .../guides/app-integration/attribution.md | 44 ++++----- .../docs/guides/app-integration/run-code.mdx | 6 +- .../configure/web/appearance/block-colour.mdx | 12 +-- .../web/appearance/colour-formats.mdx | 4 +- .../guides/configure/web/appearance/css.mdx | 14 +-- .../configure/web/appearance/themes.mdx | 18 ++-- .../guides/configure/web/block_comment.mdx | 4 +- .../docs/guides/configure/web/colour-a11y.mdx | 2 +- .../configure/web/configuration_struct.mdx | 24 ++--- .../guides/configure/web/context-menus.mdx | 36 ++++---- .../docs/guides/configure/web/copy-paste.mdx | 22 ++--- .../guides/configure/web/customization.mdx | 40 ++++----- .../web/dragging/block-drag-strategies.mdx | 10 +-- .../configure/web/dragging/draggable.mdx | 20 ++--- .../guides/configure/web/dragging/dragger.mdx | 6 +- .../docs/docs/guides/configure/web/events.mdx | 6 +- .../docs/guides/configure/web/fixed-size.mdx | 4 +- .../docs/docs/guides/configure/web/focus.mdx | 16 ++-- .../docs/docs/guides/configure/web/grid.mdx | 2 +- .../guides/configure/web/keyboard-nav.mdx | 2 +- .../configure/web/keyboard-shortcuts.mdx | 14 +-- .../docs/docs/guides/configure/web/media.mdx | 2 +- .../guides/configure/web/metrics_manager.mdx | 20 ++--- .../docs/docs/guides/configure/web/move.mdx | 2 +- .../docs/guides/configure/web/resizable.mdx | 2 +- .../guides/configure/web/serialization.mdx | 22 ++--- .../configure/web/toolboxes/appearance.mdx | 6 +- .../configure/web/toolboxes/category.mdx | 2 +- .../web/toolboxes/disable-categories.mdx | 2 +- .../configure/web/toolboxes/dynamic.mdx | 4 +- .../guides/configure/web/toolboxes/flyout.mdx | 2 +- .../guides/configure/web/toolboxes/preset.mdx | 2 +- .../configure/web/toolboxes/toolbox.mdx | 8 +- .../guides/configure/web/translations.mdx | 10 +-- .../configure/web/workspace_comment.mdx | 72 +++++++-------- .../docs/docs/guides/configure/web/zoom.mdx | 2 +- .../core-architecture/render-management.mdx | 2 +- .../core/add_localization_token.mdx | 6 +- .../docs/guides/contribute/core/advanced.mdx | 2 +- .../docs/guides/contribute/core/building.mdx | 4 +- .../docs/guides/contribute/core/index.mdx | 4 +- .../docs/guides/contribute/core/klingon.mdx | 2 +- .../guides/contribute/core/style_guide.mdx | 2 +- .../contribute/core/write_a_codelab.mdx | 8 +- .../guides/contribute/get-started/index.mdx | 12 +-- .../contribute/get-started/issue_labels.mdx | 10 +-- .../contribute/get-started/playground.mdx | 4 +- .../get-started/write_a_good_issue.mdx | 4 +- .../get-started/write_a_good_pr.mdx | 10 +-- .../docs/docs/guides/contribute/index.mdx | 18 ++-- .../contribute/samples/add_a_plugin.mdx | 6 +- .../contribute/samples/block_factory.mdx | 2 +- .../docs/guides/contribute/samples/index.mdx | 6 +- .../docs/guides/contribute/samples/naming.mdx | 8 +- .../blockly-developer-tools.md | 26 +++--- .../code-generation/block-code.mdx | 10 +-- .../code-generation/caching-arguments.mdx | 2 +- .../code-generation/operator-precedence.mdx | 16 ++-- .../code-generation/overview.mdx | 6 +- .../define/block-anatomy.mdx | 68 +++++++------- .../define/block-definitions.mdx | 14 +-- .../create-custom-blocks/define/destroy.mdx | 2 +- .../define/extensions.mdx | 2 +- .../define/inline-vs-external.mdx | 2 +- .../define/json-and-js.mdx | 16 ++-- .../define/modify-definitions.mdx | 14 +-- .../define/structure-js.mdx | 14 +-- .../define/structure-json.mdx | 48 +++++----- .../define/top-level-connections.mdx | 4 +- .../fields/anatomy-of-a-field.mdx | 32 +++---- .../fields/built-in-fields/checkbox.mdx | 2 +- .../fields/built-in-fields/dropdown.mdx | 6 +- .../fields/built-in-fields/image.mdx | 4 +- .../built-in-fields/label-serializable.mdx | 2 +- .../fields/built-in-fields/label.mdx | 4 +- .../fields/built-in-fields/number.mdx | 2 +- .../fields/built-in-fields/overview.mdx | 18 ++-- .../fields/built-in-fields/text-input.mdx | 2 +- .../fields/built-in-fields/variable.mdx | 6 +- .../fields/customizing-fields/creating.mdx | 90 +++++++++---------- .../fields/customizing-fields/extending.mdx | 20 ++--- .../fields/customizing-fields/overview.mdx | 16 ++-- .../fields/customizing-fields/upgrading.mdx | 34 +++---- .../create-custom-blocks/fields/overview.mdx | 10 +-- .../fields/validators.mdx | 10 +-- .../basic-implementation.mdx | 32 +++---- .../creating-custom-bubbles.mdx | 10 +-- .../override-built-in.mdx | 20 ++--- .../creating-custom-icons/save-and-load.mdx | 14 +-- .../creating-custom-icons/use-bubbles.mdx | 10 +-- .../use-custom-icons.mdx | 2 +- .../create-custom-blocks/icons/overview.mdx | 6 +- .../inputs/connection-check-playbook.mdx | 38 ++++---- .../inputs/connection-checks.mdx | 10 +-- .../inputs/connection-previews.mdx | 18 ++-- .../inputs/connection_checker.mdx | 2 +- .../inputs/creating-custom-inputs.mdx | 8 +- .../legacy-blockly-developer-tools.md | 18 ++-- .../guides/create-custom-blocks/mutators.mdx | 8 +- .../guides/create-custom-blocks/overview.mdx | 8 +- .../creating-custom-procedure-blocks.mdx | 12 +-- .../creating-custom-procedure-data-models.mdx | 4 +- .../procedures/overview.mdx | 10 +-- .../procedures/using-procedures.mdx | 2 +- .../renderers/concepts/constants.mdx | 10 +-- .../renderers/concepts/drawer.mdx | 10 +-- .../renderers/concepts/elements.mdx | 16 ++-- .../renderers/concepts/info.mdx | 14 +-- .../renderers/concepts/overview.mdx | 38 ++++---- .../renderers/concepts/path-object.mdx | 12 +-- .../renderers/concepts/renderer.mdx | 10 +-- .../renderers/concepts/rows.mdx | 20 ++--- .../basic-implementation.mdx | 28 +++--- .../connection-shapes.mdx | 74 +++++++-------- .../renderers/overview.mdx | 12 +-- .../guides/create-custom-blocks/variables.mdx | 8 +- .../docs/docs/guides/design/app-overview.mdx | 26 +++--- .../docs/docs/guides/design/applications.mdx | 4 +- .../docs/docs/guides/get-started/blocks.mdx | 10 +-- .../guides/get-started/code-generation.mdx | 6 +- .../docs/guides/get-started/get-the-code.mdx | 2 +- .../docs/guides/get-started/save-and-load.mdx | 2 +- .../docs/docs/guides/get-started/toolbox.mdx | 6 +- .../guides/get-started/what-is-blockly.mdx | 4 +- .../guides/get-started/workspace-anatomy.mdx | 82 ++++++++--------- .../guides/get-started/workspace-creation.mdx | 4 +- .../guides/programming/forking_blockly.mdx | 6 +- .../guides/programming/plugin_overview.mdx | 8 +- .../guides/programming/unforking_blockly.mdx | 2 +- .../guides/programming/using_blockly_apis.mdx | 4 +- packages/docs/docusaurus.config.js | 16 ++-- 151 files changed, 924 insertions(+), 924 deletions(-) diff --git a/packages/docs/docs/codelabs/context-menu-option/summary.mdx b/packages/docs/docs/codelabs/context-menu-option/summary.mdx index c355d4f54..dc3ff7440 100644 --- a/packages/docs/docs/codelabs/context-menu-option/summary.mdx +++ b/packages/docs/docs/codelabs/context-menu-option/summary.mdx @@ -13,6 +13,6 @@ In this codelab you have learned how to create and modify context menu options. ### Additional information -- [Context menu documentation](/blockly/guides/configure/web/context-menus) +- [Context menu documentation](/guides/configure/web/context-menus) -- You can also define [block context menus](/blockly/guides/configure/web/context-menus#customize-per-block) directly on a block definition, which is equivalent to adding a precondition based on the type of the block. \ No newline at end of file +- You can also define [block context menus](/guides/configure/web/context-menus#customize-per-block) directly on a block definition, which is equivalent to adding a precondition based on the type of the block. \ No newline at end of file diff --git a/packages/docs/docs/codelabs/css/blocks.mdx b/packages/docs/docs/codelabs/css/blocks.mdx index 39ab75087..b5db9a440 100644 --- a/packages/docs/docs/codelabs/css/blocks.mdx +++ b/packages/docs/docs/codelabs/css/blocks.mdx @@ -8,14 +8,14 @@ description: Styling blocks with CSS ## 6. Blocks -In this section, you will create CSS rules to assign the colours used by the [blocks section](/blockly/codelabs/theme-extension-identifier/customize-block-styles/index.html) of the themes codelab to the logic, loops, text, and lists blocks. This is a bit more complex than setting component or category colours and you'll do it in several steps. +In this section, you will create CSS rules to assign the colours used by the [blocks section](/codelabs/theme-extension-identifier/customize-block-styles/index.html) of the themes codelab to the logic, loops, text, and lists blocks. This is a bit more complex than setting component or category colours and you'll do it in several steps. ### Block fill and stroke Your first step is to set the `fill` and `stroke` of the logic blocks. Note that setting the `fill` and `stroke` is specific to the -[renderer](/blockly/guides/create-custom-blocks/renderers/overview) +[renderer](/guides/create-custom-blocks/renderers/overview) you are using. (In this codelab, you are using the Thrasos renderer.) An important consequence of this is that you need different CSS for different renderers. @@ -61,7 +61,7 @@ The last step before writing your colour rules is to decide what colours to use. How these colours are used depends on the renderer. The Thrasos renderer uses the primary colour as the `fill` of the block, the tertiary colour as the `stroke`, and the secondary colour as the `fill` when the block is a -[shadow block](/blockly/guides/configure/web/toolboxes/preset#shadow-blocks). +[shadow block](/guides/configure/web/toolboxes/preset#shadow-blocks). #### Add your rules You're now ready to add your rules to set the `fill` and `stroke` of the logic blocks: diff --git a/packages/docs/docs/codelabs/css/categories.mdx b/packages/docs/docs/codelabs/css/categories.mdx index f04f47b1a..cd5871794 100644 --- a/packages/docs/docs/codelabs/css/categories.mdx +++ b/packages/docs/docs/codelabs/css/categories.mdx @@ -8,7 +8,7 @@ description: Styling toolbox categories with CSS ## 5. Toolbox categories -In this section, you will create CSS rules to assign the colours used by the [categories section](/blockly/codelabs/theme-extension-identifier/customize-category-styles/index.html) of the themes codelab to the toolbox's categories. +In this section, you will create CSS rules to assign the colours used by the [categories section](/codelabs/theme-extension-identifier/customize-category-styles/index.html) of the themes codelab to the toolbox's categories. ### Identify the category element @@ -55,7 +55,7 @@ define rules that apply to all categories. }, ``` -For a complete explanation of how `cssConfig` works, see [Custom CSS classes](/blockly/guides/configure/web/toolboxes/appearance#custom-css-classes) in the toolbox documentation. +For a complete explanation of how `cssConfig` works, see [Custom CSS classes](/guides/configure/web/toolboxes/appearance#custom-css-classes) in the toolbox documentation. ### Add your rules diff --git a/packages/docs/docs/codelabs/css/codelab-overview.mdx b/packages/docs/docs/codelabs/css/codelab-overview.mdx index 381f2b043..756a84586 100644 --- a/packages/docs/docs/codelabs/css/codelab-overview.mdx +++ b/packages/docs/docs/codelabs/css/codelab-overview.mdx @@ -19,12 +19,12 @@ In this codelab you will learn how to use CSS to customize the colours of: If you don't need the fine-grained control provided by CSS, consider using themes instead. For more information, see the -[Customizing your themes](/blockly/codelabs/theme-extension-identifier/codelab-overview/index.html) +[Customizing your themes](/codelabs/theme-extension-identifier/codelab-overview/index.html) codelab. ### What you'll build -A simple Blockly workspace that uses the same Halloween colours as the [Customizing your themes](/blockly/codelabs/theme-extension-identifier/codelab-overview/index.html) codelab. +A simple Blockly workspace that uses the same Halloween colours as the [Customizing your themes](/codelabs/theme-extension-identifier/codelab-overview/index.html) codelab. ### What you'll need diff --git a/packages/docs/docs/codelabs/css/components.mdx b/packages/docs/docs/codelabs/css/components.mdx index ab9b4e858..54cf3f416 100644 --- a/packages/docs/docs/codelabs/css/components.mdx +++ b/packages/docs/docs/codelabs/css/components.mdx @@ -8,7 +8,7 @@ description: Styling Blockly components with CSS ## 4. Components -In this section, you will create CSS rules to assign the colours used by the [components section](/blockly/codelabs/theme-extension-identifier/customize-components/index.html) of the themes codelab to various components. +In this section, you will create CSS rules to assign the colours used by the [components section](/codelabs/theme-extension-identifier/customize-components/index.html) of the themes codelab to various components. To start, create a file named `halloween.css` and add it to your `index.html` file: @@ -152,4 +152,4 @@ You might have also noticed that some rules use an `!important` declaration whil - **Inline styles:** These rules are included via a `style` attribute and can only be overridden by an `!important` declaration. As you will see later, the colour of the arrow in a dropdown field is set with an inline style and must be overridden with `!important`. -The easiest way to determine how a rule is set is to highlight the appropriate element in the element inspector and look at the corresponding style information. In a few cases, this isn't possible. For example, an insertion marker is created only when you drag a child near its parent and is deleted when you let go of the parent to highlight the insertion marker's element. In these cases, you will need to [search Blockly's rules](/blockly/guides/configure/web/appearance/css#blockly-css-rules). +The easiest way to determine how a rule is set is to highlight the appropriate element in the element inspector and look at the corresponding style information. In a few cases, this isn't possible. For example, an insertion marker is created only when you drag a child near its parent and is deleted when you let go of the parent to highlight the insertion marker's element. In these cases, you will need to [search Blockly's rules](/guides/configure/web/appearance/css#blockly-css-rules). diff --git a/packages/docs/docs/codelabs/css/summary.mdx b/packages/docs/docs/codelabs/css/summary.mdx index 4d6f06bb2..0ab49d433 100644 --- a/packages/docs/docs/codelabs/css/summary.mdx +++ b/packages/docs/docs/codelabs/css/summary.mdx @@ -9,4 +9,4 @@ description: Summary of the CSS in Blockly codelab In this codelab, you learned how to use CSS to set the colours of your Blockly editor. -For more information, see [Style with CSS](/blockly/guides/configure/web/appearance/css) in the Blockly user guides. +For more information, see [Style with CSS](/guides/configure/web/appearance/css) in the Blockly user guides. diff --git a/packages/docs/docs/codelabs/custom-generator/block-generator-overview.mdx b/packages/docs/docs/codelabs/custom-generator/block-generator-overview.mdx index 51089dc61..a28b0c5d5 100644 --- a/packages/docs/docs/codelabs/custom-generator/block-generator-overview.mdx +++ b/packages/docs/docs/codelabs/custom-generator/block-generator-overview.mdx @@ -35,7 +35,7 @@ sampleGenerator.forBlock['left_turn_block'] = function(block, generator) { Value blocks represent code that returns a value. -A value block's generator returns an array containing a string and a [precedence value](/blockly/guides/create-custom-blocks/code-generation/operator-precedence). The built-in generators have predefined operator precedence values exported as an `Order` enum. +A value block's generator returns an array containing a string and a [precedence value](/guides/create-custom-blocks/code-generation/operator-precedence). The built-in generators have predefined operator precedence values exported as an `Order` enum. This code defines a block generator that always returns `1 + 1`: @@ -51,7 +51,7 @@ Operator precedence rules determine how the correct order of operations is maint --> Read more about [operator precedence in JavaScript](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Operator_Precedence). ---> Read more about [operator precedence in Blockly](/blockly/guides/create-custom-blocks/code-generation/operator-precedence). +--> Read more about [operator precedence in Blockly](/guides/create-custom-blocks/code-generation/operator-precedence). Since JSON does not allow values that are expressions, the code does not need to consider operator precedence for the generator being built in this codelab. The same value can be used everywhere a precedence value is required. Since parentheses never need to be added to the JSON, call this value `ATOMIC`. diff --git a/packages/docs/docs/codelabs/custom-renderer/understand-connection-shapes.mdx b/packages/docs/docs/codelabs/custom-renderer/understand-connection-shapes.mdx index 39fbc4202..92d24aba9 100644 --- a/packages/docs/docs/codelabs/custom-renderer/understand-connection-shapes.mdx +++ b/packages/docs/docs/codelabs/custom-renderer/understand-connection-shapes.mdx @@ -15,7 +15,7 @@ The outline of the block is a single [SVG path](https://developer.mozilla.org/en Each sub-path is a string of [path commands](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/d#path_commands) that describe the appropriate shape. These commands must use relative (rather than absolute) coordinates. -SVG path commands can be written as strings, but Blockly provides a set of [utility functions](/blockly/reference/js/blockly.utils_namespace.svgpaths_namespace) to make writing and reading paths easier. +SVG path commands can be written as strings, but Blockly provides a set of [utility functions](/reference/js/blockly.utils_namespace.svgpaths_namespace) to make writing and reading paths easier. ### `init()` diff --git a/packages/docs/docs/codelabs/custom-toolbox/add-an-icon-to-your-category.mdx b/packages/docs/docs/codelabs/custom-toolbox/add-an-icon-to-your-category.mdx index 6113c9aa4..b97e1af4d 100644 --- a/packages/docs/docs/codelabs/custom-toolbox/add-an-icon-to-your-category.mdx +++ b/packages/docs/docs/codelabs/custom-toolbox/add-an-icon-to-your-category.mdx @@ -28,7 +28,7 @@ to be: ``` All the classes used to create a category can be set similar to how we set the -icon class above. See the [Blockly toolbox documentation](/blockly/guides/configure/web/toolboxes/appearance#category-css) for more information. +icon class above. See the [Blockly toolbox documentation](/guides/configure/web/toolboxes/appearance#category-css) for more information. ### Add some CSS If you open `index.html` you will notice that the gear icon is positioned diff --git a/packages/docs/docs/codelabs/custom-toolbox/change-the-look-of-a-category.mdx b/packages/docs/docs/codelabs/custom-toolbox/change-the-look-of-a-category.mdx index 21b833713..40b26407d 100644 --- a/packages/docs/docs/codelabs/custom-toolbox/change-the-look-of-a-category.mdx +++ b/packages/docs/docs/codelabs/custom-toolbox/change-the-look-of-a-category.mdx @@ -38,7 +38,7 @@ The logic_category style looks like: "colour": "210" } ``` -For more information on Blockly styles please visit the [themes documentation](/blockly/guides/configure/web/appearance/themes#category-style). +For more information on Blockly styles please visit the [themes documentation](/guides/configure/web/appearance/themes#category-style). ### Add some CSS diff --git a/packages/docs/docs/codelabs/custom-toolbox/codelab-overview.mdx b/packages/docs/docs/codelabs/custom-toolbox/codelab-overview.mdx index 4c4825102..b2361d493 100644 --- a/packages/docs/docs/codelabs/custom-toolbox/codelab-overview.mdx +++ b/packages/docs/docs/codelabs/custom-toolbox/codelab-overview.mdx @@ -34,8 +34,8 @@ The code samples are written in ES6 syntax. You can find the code for the [compl - A browser. - A text editor. - Basic knowledge of HTML, CSS, and JavaScript. -- Basic understanding of the [Blockly toolbox](/blockly/guides/configure/web/toolboxes/toolbox). +- Basic understanding of the [Blockly toolbox](/guides/configure/web/toolboxes/toolbox). -Throughout various parts of this codelab we will be talking about [toolbox definitions](/blockly/guides/configure/web/toolboxes/category?tab=xml). +Throughout various parts of this codelab we will be talking about [toolbox definitions](/guides/configure/web/toolboxes/category?tab=xml). The toolbox definition can be written in XML or JSON. We will be using an XML toolbox definition that can be found in the provided code. \ No newline at end of file diff --git a/packages/docs/docs/codelabs/getting-started/create-a-blockly-workspace.mdx b/packages/docs/docs/codelabs/getting-started/create-a-blockly-workspace.mdx index f8092f8e5..4856dbbb4 100644 --- a/packages/docs/docs/codelabs/getting-started/create-a-blockly-workspace.mdx +++ b/packages/docs/docs/codelabs/getting-started/create-a-blockly-workspace.mdx @@ -23,7 +23,7 @@ The toolbox may be organized into categories, and may contain both single blocks A toolbox is defined as a JavaScript object and passed into the workspace constructor through an options struct. -For more information on this JSON format and toolbox configuration, including category creation, please see our toolbox documentation. +For more information on this JSON format and toolbox configuration, including category creation, please see our toolbox documentation. ### Define the toolbox @@ -87,7 +87,7 @@ Let's look at the options we used to initialize your blockly editor: - `horizontalLayout`: Whether to display the toolbox horizontally or vertically in the workspace. - `toolboxPosition`: Whether to show the toolbox at the top or bottom of the workspace. -The `options` struct gives you significant control over your Blockly instance. You can pass options to set Blockly's theme, modify scrolling behaviour, set the renderer, and more. For more information, head over to Blockly's developer site and check out the [configuration](/blockly/guides/configure/web/configuration_struct#the-options-dictionary) section. +The `options` struct gives you significant control over your Blockly instance. You can pass options to set Blockly's theme, modify scrolling behaviour, set the renderer, and more. For more information, head over to Blockly's developer site and check out the [configuration](/guides/configure/web/configuration_struct#the-options-dictionary) section. ### Check your work diff --git a/packages/docs/docs/codelabs/getting-started/create-a-custom-block.mdx b/packages/docs/docs/codelabs/getting-started/create-a-custom-block.mdx index dd06f0648..65b073b4f 100644 --- a/packages/docs/docs/codelabs/getting-started/create-a-custom-block.mdx +++ b/packages/docs/docs/codelabs/getting-started/create-a-custom-block.mdx @@ -15,7 +15,7 @@ Since this is a music maker app, we want a block that plays sounds. We could cre In Blockly, a *block definition* describes how a block looks and behaves. This includes its text, colour, and shape. It may also include which other blocks it can connect to. -Blocks can be defined in either JavaScript or JSON. The developer site has a full article on [how to define a block](/blockly/guides/create-custom-blocks/define/block-definitions#how-to-create-block-definitions). +Blocks can be defined in either JavaScript or JSON. The developer site has a full article on [how to define a block](/guides/create-custom-blocks/define/block-definitions#how-to-create-block-definitions). In this codelab we will simply provide the block definition for you to copy and use. @@ -102,4 +102,4 @@ Run the app one more time, and play around with the new `Play (sound)` block. It ### The block factory -This step discussed how to manually define custom blocks in Blockly. Once you've completed the entire codelab, we recommend that you check out our [block factory tool](/blockly/guides/create-custom-blocks/blockly-developer-tools), which helps automate part of this process. \ No newline at end of file +This step discussed how to manually define custom blocks in Blockly. Once you've completed the entire codelab, we recommend that you check out our [block factory tool](/guides/create-custom-blocks/blockly-developer-tools), which helps automate part of this process. \ No newline at end of file diff --git a/packages/docs/docs/codelabs/getting-started/generate-javaScript-code.mdx b/packages/docs/docs/codelabs/getting-started/generate-javaScript-code.mdx index cba55a61a..08b246ca8 100644 --- a/packages/docs/docs/codelabs/getting-started/generate-javaScript-code.mdx +++ b/packages/docs/docs/codelabs/getting-started/generate-javaScript-code.mdx @@ -44,4 +44,4 @@ translates into the JavaScript code: MusicMaker.queueSound('Sounds/c4.m4a'); ``` -For more information on block generators, read the [generating code](/blockly/guides/create-custom-blocks/code-generation/overview#block-code-generators) page on the developer site. \ No newline at end of file +For more information on block generators, read the [generating code](/guides/create-custom-blocks/code-generation/overview#block-code-generators) page on the developer site. \ No newline at end of file diff --git a/packages/docs/docs/codelabs/getting-started/the-end.mdx b/packages/docs/docs/codelabs/getting-started/the-end.mdx index dc86b201c..e1f6508d0 100644 --- a/packages/docs/docs/codelabs/getting-started/the-end.mdx +++ b/packages/docs/docs/codelabs/getting-started/the-end.mdx @@ -10,6 +10,6 @@ description: Summary of the "Getting started with Blockly" codelab. And with that, you're done with the Blockly codelab! If you'd like to continue playing with the app, we suggest adding or changing the available blocks. There are sample sound files in the `sounds` folder - try hooking them up to a new block! -For more documentation, visit the [Blockly developer site](/blockly/guides/get-started/what-is-blockly). +For more documentation, visit the [Blockly developer site](/guides/get-started/what-is-blockly). Additionally, Blockly has an active [developer forum](https://groups.google.com/g/blockly). Please drop by and say hello. We're happy to answer any questions or give advice on best practices for building an app with Blockly. Feel free to show us your prototypes early; collectively we have a lot of experience and can offer hints which will save you time. \ No newline at end of file diff --git a/packages/docs/docs/codelabs/index.mdx b/packages/docs/docs/codelabs/index.mdx index d8014b932..b2dc45051 100644 --- a/packages/docs/docs/codelabs/index.mdx +++ b/packages/docs/docs/codelabs/index.mdx @@ -15,49 +15,49 @@ Blockly Codelabs provide a guided, tutorial, hands-on coding experience of Block - Blockly icon + href="/codelabs/getting-started/codelab-overview"> + Blockly icon - Blockly icon + href="/codelabs/custom-toolbox/codelab-overview"> + Blockly icon - Blockly icon + href="/codelabs/theme-extension-identifier/codelab-overview"> + Blockly icon - Blockly icon + href="/codelabs/context-menu-option/codelab-overview"> + Blockly icon - Blockly icon + href="/codelabs/validation-and-warnings/codelab-overview"> + Blockly icon - Blockly icon + href="/codelabs/css/codelab-overview"> + Blockly icon - Blockly icon + href="/codelabs/custom-generator/codelab-overview"> + Blockly icon - Blockly icon + href="/codelabs/custom-renderer/codelab-overview"> + Blockly icon diff --git a/packages/docs/docs/codelabs/theme-extension-identifier/customize-block-styles.mdx b/packages/docs/docs/codelabs/theme-extension-identifier/customize-block-styles.mdx index 02f85fd7e..ac873f723 100644 --- a/packages/docs/docs/codelabs/theme-extension-identifier/customize-block-styles.mdx +++ b/packages/docs/docs/codelabs/theme-extension-identifier/customize-block-styles.mdx @@ -9,7 +9,7 @@ description: How to use a theme to set the colours of blocks. A block style currently only holds three different colour properties. They are 'colourPrimary', 'colourSecondary' and 'colourTertiary'. This value can either be defined as a hex value or as a hue. -For more information on block styles visit our themes [documentation](/blockly/guides/configure/web/appearance/themes#block-style) +For more information on block styles visit our themes [documentation](/guides/configure/web/appearance/themes#block-style) Update the Theme definition to have the block styles as below. diff --git a/packages/docs/docs/codelabs/theme-extension-identifier/summary.mdx b/packages/docs/docs/codelabs/theme-extension-identifier/summary.mdx index 8bdad9858..7aa6ba0ff 100644 --- a/packages/docs/docs/codelabs/theme-extension-identifier/summary.mdx +++ b/packages/docs/docs/codelabs/theme-extension-identifier/summary.mdx @@ -13,6 +13,6 @@ In this codelab you have learned how to extend and customize themes for the bloc ### Additional information -- [Themes documentation](/blockly/guides/configure/web/appearance/themes) +- [Themes documentation](/guides/configure/web/appearance/themes) -- You can also customize the font styles. Details are available in the [documentation](/blockly/guides/configure/web/appearance/themes#font-styles). \ No newline at end of file +- You can also customize the font styles. Details are available in the [documentation](/guides/configure/web/appearance/themes#font-styles). \ No newline at end of file diff --git a/packages/docs/docs/codelabs/validation-and-warnings/codelab-overview.mdx b/packages/docs/docs/codelabs/validation-and-warnings/codelab-overview.mdx index 360cf01ec..39cbdcf55 100644 --- a/packages/docs/docs/codelabs/validation-and-warnings/codelab-overview.mdx +++ b/packages/docs/docs/codelabs/validation-and-warnings/codelab-overview.mdx @@ -26,5 +26,5 @@ You can find the code for the [completed custom block](https://github.com/Raspbe - A browser. - A text editor. - Basic knowledge of JavaScript. -- Basic understanding of the [Blockly toolbox](/blockly/guides/configure/web/toolboxes/toolbox). -- Basic understanding of [using JSON to define custom blocks](/blockly/guides/create-custom-blocks/define/structure-json). \ No newline at end of file +- Basic understanding of the [Blockly toolbox](/guides/configure/web/toolboxes/toolbox). +- Basic understanding of [using JSON to define custom blocks](/guides/create-custom-blocks/define/structure-json). \ No newline at end of file diff --git a/packages/docs/docs/codelabs/validation-and-warnings/summary.mdx b/packages/docs/docs/codelabs/validation-and-warnings/summary.mdx index c27f6fdc2..e7a720055 100644 --- a/packages/docs/docs/codelabs/validation-and-warnings/summary.mdx +++ b/packages/docs/docs/codelabs/validation-and-warnings/summary.mdx @@ -20,10 +20,10 @@ You can find the code for the [completed custom block](https://github.com/Raspbe ### Resources For more information related topics, check out the documentation: -* [Defining the toolbox](/blockly/guides/configure/web/toolboxes/toolbox) -* [Defining custom blocks](/blockly/guides/create-custom-blocks/overview) -* [Generating code from blocks](/blockly/guides/create-custom-blocks/code-generation/overview) -* [Creating extensions](/blockly/guides/create-custom-blocks/define/extensions#extensions) -* [Listening for change events](/blockly/guides/configure/web/events) -* [Custom validators](/blockly/guides/create-custom-blocks/fields/validators) -* [Custom block style guide](/blockly/guides/design/blocks) \ No newline at end of file +* [Defining the toolbox](/guides/configure/web/toolboxes/toolbox) +* [Defining custom blocks](/guides/create-custom-blocks/overview) +* [Generating code from blocks](/guides/create-custom-blocks/code-generation/overview) +* [Creating extensions](/guides/create-custom-blocks/define/extensions#extensions) +* [Listening for change events](/guides/configure/web/events) +* [Custom validators](/guides/create-custom-blocks/fields/validators) +* [Custom block style guide](/guides/design/blocks) \ No newline at end of file diff --git a/packages/docs/docs/guides/app-integration/attribution.md b/packages/docs/docs/guides/app-integration/attribution.md index 6afadf3f4..242bd28aa 100644 --- a/packages/docs/docs/guides/app-integration/attribution.md +++ b/packages/docs/docs/guides/app-integration/attribution.md @@ -18,7 +18,7 @@ practices for referring to Blockly and attributing it as well as appropriate uses of the logo. Download all assets + href="/images/logos/blockly_logos_all.zip" target="_blank">Download all assets ## How to refer to Blockly @@ -56,12 +56,12 @@ following logos, depending on background color: - Built on Blockly white - Built on Blockly black @@ -72,10 +72,10 @@ following logos, depending on background color: For dark backgrounds with overlapping shapes or varied patterns. - PNG - SVG - PNG - SVG + PNG + SVG + PNG + SVG @@ -91,8 +91,8 @@ Please hyperlink the badge to Blockly's home page: [https://www.blockly.com](htt logo. Never crowd or overlap the logo with other elements.

- Blockly Badge - Blockly Badge + Blockly Badge + Blockly Badge
@@ -108,7 +108,7 @@ element on your page.
- Standard Blockly logo @@ -119,8 +119,8 @@ element on your page. with a full color logomark and neutral 700 (#5F6368) or solid white logotype.

- PNG - SVG + PNG + SVG
@@ -129,17 +129,17 @@ element on your page. - Blockly vertical logo - Blockly logomark - Blockly knockout logo @@ -157,12 +157,12 @@ element on your page. - PNG - SVG - PNG - SVG - PNG - SVG + PNG + SVG + PNG + SVG + PNG + SVG @@ -227,7 +227,7 @@ element on your page.
- Height references for padding the logo
diff --git a/packages/docs/docs/guides/app-integration/run-code.mdx b/packages/docs/docs/guides/app-integration/run-code.mdx index 2da6913ee..a13e75dd1 100644 --- a/packages/docs/docs/guides/app-integration/run-code.mdx +++ b/packages/docs/docs/guides/app-integration/run-code.mdx @@ -13,7 +13,7 @@ Your application can generate code at any time. For example, it might generate code when the end user clicks a button or every time the user makes a change. For an overview of code generation, see [Code -generation](/blockly/guides/create-custom-blocks/code-generation/overview). +generation](/guides/create-custom-blocks/code-generation/overview). ## Import a language code generator @@ -140,12 +140,12 @@ Deciding how to execute it is very application-specific, and outside the scope of Blockly. If you want to execute JavaScript code, see [Generate and run -JavaScript](/blockly/guides/app-integration/running-javascript). This discusses +JavaScript](/guides/app-integration/running-javascript). This discusses some special features of the JavaScript code generator, as well as [JSInterpreter][jsinterpreter], which the Blockly team recommends as a way to safely execute JavaScript. Other languages require other tools. -[event]: /blockly/guides/configure/web/events +[event]: /guides/configure/web/events [jsinterpreter]: https://github.com/NeilFraser/JS-Interpreter diff --git a/packages/docs/docs/guides/configure/web/appearance/block-colour.mdx b/packages/docs/docs/guides/configure/web/appearance/block-colour.mdx index 23fefe25d..4d1683d1f 100644 --- a/packages/docs/docs/guides/configure/web/appearance/block-colour.mdx +++ b/packages/docs/docs/guides/configure/web/appearance/block-colour.mdx @@ -17,20 +17,20 @@ with the colours mirrored by the various toolbar categories in the demos: colour.](/images/standard-block-colors.png) Additional colours on the block are derived from the main colour. For example, -[shadow blocks](/blockly/guides/configure/web/toolboxes/preset#shadow-blocks) +[shadow blocks](/guides/configure/web/toolboxes/preset#shadow-blocks) are a desaturated version of the main colour, and border colours are a darker version. :::tip If you want more control over shadow block or border colours, learn about -[defining a theme](/blockly/guides/configure/web/appearance/themes). +[defining a theme](/guides/configure/web/appearance/themes). ::: ## Set block colour The primary colour of a block can be defined in either JSON or JavaScript. You can pass the hue (preferred), RGB value, or color name; for more information, -see [Colour formats](/blockly/guides/configure/web/appearance/colour-formats). +see [Colour formats](/guides/configure/web/appearance/colour-formats). @@ -53,11 +53,11 @@ see [Colour formats](/blockly/guides/configure/web/appearance/colour-formats). Note the British spelling. Failure to set the colour results in a black block. You can also set the block color using the -[`Block.setColour(..)`](/blockly/reference/js/blockly.block_class.setcolour_1_method) -function, or by using [themes](/blockly/guides/configure/web/appearance/themes) +[`Block.setColour(..)`](/reference/js/blockly.block_class.setcolour_1_method) +function, or by using [themes](/guides/configure/web/appearance/themes) and defining a block style. ## Accessibility For information about how colour affects accessibility, see [Colour and -accessibility](/blockly/guides/configure/web/colour-a11y) +accessibility](/guides/configure/web/colour-a11y) diff --git a/packages/docs/docs/guides/configure/web/appearance/colour-formats.mdx b/packages/docs/docs/guides/configure/web/appearance/colour-formats.mdx index 2e2469154..67a864cc4 100644 --- a/packages/docs/docs/guides/configure/web/appearance/colour-formats.mdx +++ b/packages/docs/docs/guides/configure/web/appearance/colour-formats.mdx @@ -58,7 +58,7 @@ W3C](https://www.w3.org/TR/css-color-3/#html4). Often, multiple blocks share the same colour, and centralizing the colour definitions simplifies managing the colours and adding new blocks of the correct colour. Block colours and toolbox categories can use [localization -tokens](/blockly/guides/configure/web/translations#use-localization-tokens-in-json) +tokens](/guides/configure/web/translations#use-localization-tokens-in-json) to do exactly that. Blockly includes nine colour constants in the string table, corresponding to the @@ -77,7 +77,7 @@ toolbox categories, plus a distinct colour for dynamic variables: ``` These string values can be used in both the JSON definitions and -[`block.setColour(..)`](/blockly/reference/js/blockly.block_class.setcolour_1_method). +[`block.setColour(..)`](/reference/js/blockly.block_class.setcolour_1_method). You can add your own colour constants by adding to `Blockly.Msg`: diff --git a/packages/docs/docs/guides/configure/web/appearance/css.mdx b/packages/docs/docs/guides/configure/web/appearance/css.mdx index ade2eca9f..1c5feaa1d 100644 --- a/packages/docs/docs/guides/configure/web/appearance/css.mdx +++ b/packages/docs/docs/guides/configure/web/appearance/css.mdx @@ -17,10 +17,10 @@ You can use CSS to style your application: * Add your own CSS classes to Blockly components for additional specificity. * Use CSS classes and rules to style custom components. -For a practical introduction to using CSS in blockly, see the [Use CSS in Blockly](/blockly/codelabs/css/codelab-overview/index.html) +For a practical introduction to using CSS in blockly, see the [Use CSS in Blockly](/codelabs/css/codelab-overview/index.html) :::note -The easiest way to style Blockly is with [themes](/blockly/guides/configure/web/appearance/themes). If you need finer-grained control, use CSS. +The easiest way to style Blockly is with [themes](/guides/configure/web/appearance/themes). If you need finer-grained control, use CSS. ::: ## CSS classes @@ -67,12 +67,12 @@ To add or remove a CSS class from a workspace's injection `
`, call To add a CSS class to a button or a label in a toolbox, use the `web-class` key in your JSON definition of the toolbox. For more information, see [Buttons and -labels](/blockly/guides/configure/web/toolboxes/buttons). +labels](/guides/configure/web/toolboxes/buttons). To override the CSS classes used for the various parts of a category, use the `cssConfig` key in your JSON definition of the category. This allows you to style individual categories. For more information, see [Category -CSS](/blockly/guides/configure/web/toolboxes/appearance#category-css). +CSS](/guides/configure/web/toolboxes/appearance#category-css). #### Blocks @@ -129,9 +129,9 @@ custom CSS classes: ``` For more information, see [Customizing fields with - CSS](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#customizing-with-css) + CSS](/guides/create-custom-blocks/fields/customizing-fields/creating#customizing-with-css) or [Create the icon's - view](/blockly/guides/create-custom-blocks/icons/creating-custom-icons/basic-implementation#create-the-icons-view). + view](/guides/create-custom-blocks/icons/creating-custom-icons/basic-implementation#create-the-icons-view). * When constructing an SVG element, pass your class to `Blockly.utils.dom.createSvgElement`: @@ -289,7 +289,7 @@ tag. The rules in this tag come from: `Blockly.css.register`](https://github.com/search?q=repo%3ARaspberryPiFoundation%2Fblockly+css.register+path%3Acore&type=code). If you do not want to use these rules, set the [`css` configuration -option](/blockly/guides/configure/web/configuration_struct#the-options-dictionary) +option](/guides/configure/web/configuration_struct#the-options-dictionary) to `false`. In this case, you are responsible for providing an alternate set of CSS rules. diff --git a/packages/docs/docs/guides/configure/web/appearance/themes.mdx b/packages/docs/docs/guides/configure/web/appearance/themes.mdx index ad34ca390..09698a136 100644 --- a/packages/docs/docs/guides/configure/web/appearance/themes.mdx +++ b/packages/docs/docs/guides/configure/web/appearance/themes.mdx @@ -17,19 +17,19 @@ as a class on the injection `div`. This allows users to change the look of any unsupported components through CSS. Our main goal in creating themes is to empower developers to create Blockly experiences that are more accessible. -For a practical introduction to using themes, see the [Customizing your themes](/blockly/codelabs/theme-extension-identifier/codelab-overview/index.html) +For a practical introduction to using themes, see the [Customizing your themes](/codelabs/theme-extension-identifier/codelab-overview/index.html) :::note -The easiest way to style Blockly is with themes. If you need finer-grained control, use [CSS](/blockly/guides/configure/web/appearance/css). +The easiest way to style Blockly is with themes. If you need finer-grained control, use [CSS](/guides/configure/web/appearance/css). ::: :::note If you only want to control the main colour of a block, rather than have more fine-grained control over the appearance, you can set the colour in the -[block definition](/blockly/guides/configure/web/appearance/block-colour#set-block-colour) +[block definition](/guides/configure/web/appearance/block-colour#set-block-colour) instead of creating a theme. If you want to change the shape of a block instead of its colour, learn more about -[renderers](/blockly/guides/create-custom-blocks/renderers/overview). +[renderers](/guides/create-custom-blocks/renderers/overview). ::: ## Theme Properties @@ -53,9 +53,9 @@ A block style is made up of four fields: - `colourTertiary` (optional) - The border or highlight colour of the block. - `hat` (optional) - Adds a hat to a block, if the value is set to `cap`. Learn more about - [hats](/blockly/guides/design/applications#event-driven-program). + [hats](/guides/design/applications#event-driven-program). -Block with arrows pointing to primary, secondary and tertiary colour +Block with arrows pointing to primary, secondary and tertiary colour ```js const listBlocks = { @@ -92,7 +92,7 @@ A category style only holds a colour property. in the category. This makes it easy for users to tell which blocks belong in a given category. -Screenshot of toolbox with different category colours +Screenshot of toolbox with different category colours ```js const mathCategory = { @@ -162,13 +162,13 @@ const fontStyle = { :::tip Learn more about the use cases of start hats on our -[application design page](/blockly/guides/design/applications#event-driven-program). +[application design page](/guides/design/applications#event-driven-program). ::: If you set `startHats: true` directly in a theme object, a hat will be added to all blocks with no previous or output connections. If you want more control over exactly which blocks get a hat, you can instead use the -[block style](/blockly/guides/configure/web/appearance/themes/#block-style) property. +[block style](/guides/configure/web/appearance/themes/#block-style) property. ## Custom Themes diff --git a/packages/docs/docs/guides/configure/web/block_comment.mdx b/packages/docs/docs/guides/configure/web/block_comment.mdx index a5253ca3b..a08deb5a9 100644 --- a/packages/docs/docs/guides/configure/web/block_comment.mdx +++ b/packages/docs/docs/guides/configure/web/block_comment.mdx @@ -66,5 +66,5 @@ The ability to work with comments programmatically is not affected by the state of the block (such as whether it is editable or collapsed) or the setting of the `comments` configuration option. -[editable]: /blockly/guides/create-custom-blocks/define/block-state#editable-state -[config-option]: /blockly/guides/configure/web/configuration_struct#the-options-dictionary +[editable]: /guides/create-custom-blocks/define/block-state#editable-state +[config-option]: /guides/configure/web/configuration_struct#the-options-dictionary diff --git a/packages/docs/docs/guides/configure/web/colour-a11y.mdx b/packages/docs/docs/guides/configure/web/colour-a11y.mdx index c38c3b61f..033851c6b 100644 --- a/packages/docs/docs/guides/configure/web/colour-a11y.mdx +++ b/packages/docs/docs/guides/configure/web/colour-a11y.mdx @@ -12,7 +12,7 @@ text on the block, and so not a critical attribute. However, when choosing a block colour palette, colour blindness should be a consideration. Blockly provides [several -themes](/blockly/guides/configure/web/appearance/themes#built-in) in an effort +themes](/guides/configure/web/appearance/themes#built-in) in an effort to accommodate some types of colour vision deficiency. [This page](http://mkweb.bcgsc.ca/colorblind/palettes.mhtml#projecthome) includes example 8, 12, 15, and 24 colour palettes that attempt to maximize distinction diff --git a/packages/docs/docs/guides/configure/web/configuration_struct.mdx b/packages/docs/docs/guides/configure/web/configuration_struct.mdx index 431c0c5e6..4a6978201 100644 --- a/packages/docs/docs/guides/configure/web/configuration_struct.mdx +++ b/packages/docs/docs/guides/configure/web/configuration_struct.mdx @@ -25,7 +25,7 @@ two are different and should not be confused. ::: For more information, see [Create a -workspace](/blockly/guides/get-started/workspace-creation). +workspace](/guides/get-started/workspace-creation). ## Direct creation @@ -38,7 +38,7 @@ directly. ## Configuration options{#the-options-dictionary} The configuration object implements -[`Blockly.BlocklyOptions`](/blockly/reference/js/blockly.blocklyoptions_interface) +[`Blockly.BlocklyOptions`](/reference/js/blockly.blocklyoptions_interface) and has the following options. Note that several of these options change their default value based on whether the provided toolbox has categories or not. @@ -69,14 +69,14 @@ default value based on whether the provided toolbox has categories or not. | `trashcan` | boolean | Displays or hides the trashcan. Defaults to `true` if the toolbox has categories, `false` otherwise. | `zoom` | object | Configures zooming behaviour. See [Zoom]. | -[Grid]: /blockly/guides/configure/web/grid -[media]: /blockly/guides/configure/web/media -[Move]: /blockly/guides/configure/web/move -[setIsReadOnly]: /blockly/reference/js/blockly.workspace_class.setisreadonly_1_method -[isReadOnly]: /blockly/reference/js/blockly.workspace_class.isreadonly_1_method -[renderer]: /blockly/guides/create-custom-blocks/renderers/create-custom-renderers/basic-implementation +[Grid]: /guides/configure/web/grid +[media]: /guides/configure/web/media +[Move]: /guides/configure/web/move +[setIsReadOnly]: /reference/js/blockly.workspace_class.setisreadonly_1_method +[isReadOnly]: /reference/js/blockly.workspace_class.isreadonly_1_method +[renderer]: /guides/create-custom-blocks/renderers/create-custom-renderers/basic-implementation [RTL demo]: https://raspberrypifoundation.github.io/blockly-samples/examples/rtl-demo/ -[Themes]: /blockly/guides/configure/web/appearance/themes -[defining the toolbox]: /blockly/guides/configure/web/toolboxes/toolbox -[Zoom]: /blockly/guides/configure/web/zoom -[replacement]: /blockly/guides/configure/web/customization#injecting-subclasses +[Themes]: /guides/configure/web/appearance/themes +[defining the toolbox]: /guides/configure/web/toolboxes/toolbox +[Zoom]: /guides/configure/web/zoom +[replacement]: /guides/configure/web/customization#injecting-subclasses diff --git a/packages/docs/docs/guides/configure/web/context-menus.mdx b/packages/docs/docs/guides/configure/web/context-menus.mdx index a92a05c89..6f2cf1654 100644 --- a/packages/docs/docs/guides/configure/web/context-menus.mdx +++ b/packages/docs/docs/guides/configure/web/context-menus.mdx @@ -16,7 +16,7 @@ response to a right-click or a long press on a touch device. If you use the shown with a keyboard shortcut, which defaults to `Ctrl+Enter` on Windows or `Command+Enter` on Mac. -The default context menu for a block +The default context menu for a block Context menus are a good place to add actions that the user performs infrequently, such as downloading a screenshot. If you think an action will be @@ -55,7 +55,7 @@ Blockly defines a standard set of templates for the context menus for workspaces, blocks, and workspace comments. It preloads the templates for workspaces and blocks into the registry. If you want to use the templates for workspace comments, you must [load them into the registry -yourself](/blockly/guides/configure/web/workspace_comment#enable-workspace-comments). +yourself](/guides/configure/web/workspace_comment#enable-workspace-comments). For information on how to add, delete, and modify templates in the registry, see [Customize the registry](#customize-the-registry). @@ -80,7 +80,7 @@ context menu was invoked is stored in the `focusedNode` property as an object that implements [`IFocusableNode`][i-focusable-node]. (`IFocusableNode` is implemented by all components that users can focus on, including those that implement context menus. For more information, see [Focus -system](/blockly/guides/configure/web/focus).) +system](/guides/configure/web/focus).) The `Scope` object is passed to several of the functions in a template. In any function that gets a `Scope` object, you can decide what to do based on the type @@ -132,8 +132,8 @@ It should return one of a set of strings: `'enabled'`, `'disabled'`, or | Value | Description | Image | | ------------ | ---------------------------------- | --------------------------------------------------- | -| `'enabled'` | Shows that the item is active. | An enabled option | -| `'disabled'` | Shows that the item is not active. | A disabled option | +| `'enabled'` | Shows that the item is active. | An enabled option | +| `'disabled'` | Shows that the item is not active. | A disabled option | | `'hidden'` | Hides the item. | | The `preconditionFn` is also passed a [`Scope`][Scope] which you can use to @@ -329,7 +329,7 @@ Blockly.ContextMenuRegistry.registry.register(collapseTemplate); :::note Check out the [context menu -codelab](/blockly/codelabs/context-menu-option/codelab-overview/index.html) +codelab](/codelabs/context-menu-option/codelab-overview/index.html) for worked examples of adding context menu items. ::: @@ -453,17 +453,17 @@ steps: 1. [Add templates](#add-a-template) to the registry for your context menu items. -[block-default-menu-image]: /blockly/images/context-menus/block-default-menu.png +[block-default-menu-image]: /images/context-menus/block-default-menu.png [context-menu-items-source]: https://github.com/RaspberryPiFoundation/blockly/blob/main/core/contextmenu_items.ts -[i-context-menu]: /blockly/reference/js/blockly.icontextmenu_interface -[i-focusable-node]: /blockly/reference/js/blockly.ifocusablenode_interface -[RegistryItem]: /blockly/reference/js/blockly.contextmenuregistry_namespace.registryitem_typealias +[i-context-menu]: /reference/js/blockly.icontextmenu_interface +[i-focusable-node]: /reference/js/blockly.ifocusablenode_interface +[RegistryItem]: /reference/js/blockly.contextmenuregistry_namespace.registryitem_typealias [Scope]: #scope -[enabled-image]: /blockly/images/context-menus/enabled-option.png -[disabled-image]: /blockly/images/context-menus/disabled-option.png -[customContextMenu]: /blockly/reference/js/blockly.blocksvg_class.customcontextmenu_property -[configureContextMenu]: /blockly/reference/js/blockly.workspacesvg_class.configurecontextmenu_property -[ContextMenuOption]: /blockly/reference/js/blockly.contextmenuregistry_namespace.contextmenuoption_typealias -[LegacyContextMenuOption]: /blockly/reference/js/blockly.contextmenuregistry_namespace.legacycontextmenuoption_interface -[coordinate-systems]: /blockly/guides/configure/web/metrics_manager#coordinate-systems -[keyboard-navigation-plugin]: /blockly/guides/configure/web/keyboard-nav +[enabled-image]: /images/context-menus/enabled-option.png +[disabled-image]: /images/context-menus/disabled-option.png +[customContextMenu]: /reference/js/blockly.blocksvg_class.customcontextmenu_property +[configureContextMenu]: /reference/js/blockly.workspacesvg_class.configurecontextmenu_property +[ContextMenuOption]: /reference/js/blockly.contextmenuregistry_namespace.contextmenuoption_typealias +[LegacyContextMenuOption]: /reference/js/blockly.contextmenuregistry_namespace.legacycontextmenuoption_interface +[coordinate-systems]: /guides/configure/web/metrics_manager#coordinate-systems +[keyboard-navigation-plugin]: /guides/configure/web/keyboard-nav diff --git a/packages/docs/docs/guides/configure/web/copy-paste.mdx b/packages/docs/docs/guides/configure/web/copy-paste.mdx index a83ca1cd2..8ef4c5381 100644 --- a/packages/docs/docs/guides/configure/web/copy-paste.mdx +++ b/packages/docs/docs/guides/configure/web/copy-paste.mdx @@ -152,16 +152,16 @@ find the paster associated with a given copy data from its `paster` property. Blockly.clipboard.registry.register('MY_PASTER', new MyPaster()); ``` -[implement-paster]: /blockly/guides/configure/web/copy-paste#implement-a-paster -[ICopyable]: /blockly/reference/js/blockly.icopyable_interface -[IDeletable]: /blockly/reference/js/blockly.ideletable_interface -[IDraggable]: /blockly/reference/js/blockly.idraggable_interface -[ICopyData]: /blockly/reference/js/blockly.icopyable_namespace.icopydata_interface -[IPaster]: /blockly/reference/js/blockly.ipaster_interface -[ISelectable]: /blockly/reference/js/blockly.iselectable_interface -[default-keyboard-shortcuts]: /blockly/guides/configure/web/keyboard-shortcuts#default-shortcuts -[context-menu-option]: /blockly/guides/configure/web/context-menus -[custom-draggables]: /blockly/guides/configure/web/dragging/draggable +[implement-paster]: /guides/configure/web/copy-paste#implement-a-paster +[ICopyable]: /reference/js/blockly.icopyable_interface +[IDeletable]: /reference/js/blockly.ideletable_interface +[IDraggable]: /reference/js/blockly.idraggable_interface +[ICopyData]: /reference/js/blockly.icopyable_namespace.icopydata_interface +[IPaster]: /reference/js/blockly.ipaster_interface +[ISelectable]: /reference/js/blockly.iselectable_interface +[default-keyboard-shortcuts]: /guides/configure/web/keyboard-shortcuts#default-shortcuts +[context-menu-option]: /guides/configure/web/context-menus +[custom-draggables]: /guides/configure/web/dragging/draggable [multiselect-plugin]: https://www.npmjs.com/package/@mit-app-inventor/blockly-plugin-workspace-multiselect [cross-tab-copy-paste-plugin]: https://www.npmjs.com/package/@blockly/plugin-cross-tab-copy-paste -[clipboard-namespace]: /blockly/reference/js/blockly.clipboard_namespace +[clipboard-namespace]: /reference/js/blockly.clipboard_namespace diff --git a/packages/docs/docs/guides/configure/web/customization.mdx b/packages/docs/docs/guides/configure/web/customization.mdx index 5132937db..247a6c9bc 100644 --- a/packages/docs/docs/guides/configure/web/customization.mdx +++ b/packages/docs/docs/guides/configure/web/customization.mdx @@ -28,25 +28,25 @@ The following Blockly classes can be replaced: | [`Blockly.VariableModel`] | [`Blockly.IVariableModel`] | -- | For information about how to replace a renderer, see [Create custom -renderers](/blockly/guides/create-custom-blocks/renderers/create-custom-renderers/basic-implementation). +renderers](/guides/create-custom-blocks/renderers/create-custom-renderers/basic-implementation). -[`Blockly.dragging.Dragger`]: /blockly/reference/js/blockly.dragging_namespace.dragger_class -[`Blockly.IDragger`]: /blockly/reference/js/blockly.idragger_interface -[`Blockly.ConnectionChecker`]: /blockly/reference/js/blockly.connectionchecker_class -[`Blockly.IConnectionChecker`]: /blockly/reference/js/blockly.iconnectionchecker_interface -[`Blockly.InsertionMarkerPreviewer`]: /blockly/reference/js/blockly.insertionmarkerpreviewer_class -[`Blockly.IConnectionPreviewer`]: /blockly/reference/js/blockly.iconnectionpreviewer_interface -[`Blockly.HorizontalFlyout`]: /blockly/reference/js/blockly.horizontalflyout_class -[`Blockly.VerticalFlyout`]: /blockly/reference/js/blockly.verticalflyout_class -[`Blockly.IFlyout`]: /blockly/reference/js/blockly.iflyout_interface -[`Blockly.MetricsManager`]: /blockly/reference/js/blockly.metricsmanager_class -[`Blockly.IMetricsManager`]: /blockly/reference/js/blockly.imetricsmanager_interface -[`Blockly.Toolbox`]: /blockly/reference/js/blockly.toolbox_class -[`Blockly.IToolbox`]: /blockly/reference/js/blockly.itoolbox_interface -[`Blockly.VariableMap`]: /blockly/reference/js/blockly.variablemap_class -[`Blockly.IVariableMap`]: /blockly/reference/js/blockly.ivariablemap_interface -[`Blockly.VariableModel`]: /blockly/reference/js/blockly.variablemodel_class -[`Blockly.IVariableModel`]: /blockly/reference/js/blockly.ivariablemodel_interface +[`Blockly.dragging.Dragger`]: /reference/js/blockly.dragging_namespace.dragger_class +[`Blockly.IDragger`]: /reference/js/blockly.idragger_interface +[`Blockly.ConnectionChecker`]: /reference/js/blockly.connectionchecker_class +[`Blockly.IConnectionChecker`]: /reference/js/blockly.iconnectionchecker_interface +[`Blockly.InsertionMarkerPreviewer`]: /reference/js/blockly.insertionmarkerpreviewer_class +[`Blockly.IConnectionPreviewer`]: /reference/js/blockly.iconnectionpreviewer_interface +[`Blockly.HorizontalFlyout`]: /reference/js/blockly.horizontalflyout_class +[`Blockly.VerticalFlyout`]: /reference/js/blockly.verticalflyout_class +[`Blockly.IFlyout`]: /reference/js/blockly.iflyout_interface +[`Blockly.MetricsManager`]: /reference/js/blockly.metricsmanager_class +[`Blockly.IMetricsManager`]: /reference/js/blockly.imetricsmanager_interface +[`Blockly.Toolbox`]: /reference/js/blockly.toolbox_class +[`Blockly.IToolbox`]: /reference/js/blockly.itoolbox_interface +[`Blockly.VariableMap`]: /reference/js/blockly.variablemap_class +[`Blockly.IVariableMap`]: /reference/js/blockly.ivariablemap_interface +[`Blockly.VariableModel`]: /reference/js/blockly.variablemodel_class +[`Blockly.IVariableModel`]: /reference/js/blockly.ivariablemodel_interface ## Create a replacement class @@ -86,13 +86,13 @@ Blockly.registry.register( ### Inject your replacement class {#injecting-subclasses} You can also inject replacement classes using the `plugins` [configuration -option](/blockly/guides/configure/web/configuration_struct#the-options-dictionary). +option](/guides/configure/web/configuration_struct#the-options-dictionary). This is an object that uses [registry type names](#replaceable-classes) as property names and replacement classes or registered names as property values. (In spite of the `plugins` property's name, your class does not need to be packaged and distributed through npm like the [plugins used to extend -Blockly](/blockly/guides/programming/plugin_overview).) +Blockly](/guides/programming/plugin_overview).) Either pass your replacement class to `Blockly.inject`: diff --git a/packages/docs/docs/guides/configure/web/dragging/block-drag-strategies.mdx b/packages/docs/docs/guides/configure/web/dragging/block-drag-strategies.mdx index 48f3446e8..58f2b4ba7 100644 --- a/packages/docs/docs/guides/configure/web/dragging/block-drag-strategies.mdx +++ b/packages/docs/docs/guides/configure/web/dragging/block-drag-strategies.mdx @@ -45,8 +45,8 @@ Blockly.Blocks['my_block'] = { } ``` -[draggable]: /blockly/guides/configure/web/dragging/draggable -[draggable-implementation]: /blockly/guides/configure/web/dragging/draggable#implementation -[setDragStrategy]: /blockly/reference/js/blockly.blocksvg_class.setdragstrategy_1_method -[IDraggable]: /blockly/reference/js/blockly.idraggable_interface -[IDragStrategy]: /blockly/reference/js/blockly.idragstrategy_interface +[draggable]: /guides/configure/web/dragging/draggable +[draggable-implementation]: /guides/configure/web/dragging/draggable#implementation +[setDragStrategy]: /reference/js/blockly.blocksvg_class.setdragstrategy_1_method +[IDraggable]: /reference/js/blockly.idraggable_interface +[IDragStrategy]: /reference/js/blockly.idragstrategy_interface diff --git a/packages/docs/docs/guides/configure/web/dragging/draggable.mdx b/packages/docs/docs/guides/configure/web/dragging/draggable.mdx index a2144a0e3..b9e6561c6 100644 --- a/packages/docs/docs/guides/configure/web/dragging/draggable.mdx +++ b/packages/docs/docs/guides/configure/web/dragging/draggable.mdx @@ -227,16 +227,16 @@ and define an `IPaster` to allow it to be pasted. For more information about copying pasting see [Copy paste][copy-paste]. -[workspace-visual-glossary]: /blockly/guides/get-started/workspace-anatomy#workspace +[workspace-visual-glossary]: /guides/get-started/workspace-anatomy#workspace [multiselect-plugin]: https://www.npmjs.com/package/@mit-app-inventor/blockly-plugin-workspace-multiselect {/* This doesn't exist yet */} -[events]: /blockly/guides/configure/web/events -[IRenderedElement]: /blockly/reference/js/blockly.irenderedelement_interface -[IDraggable]: /blockly/reference/js/blockly.idraggable_interface -[IDeletable]: /blockly/reference/js/blockly.ideletable_interface -[ISelectable]: /blockly/reference/js/blockly.iselectable_interface -[setSelected]: /blockly/reference/js/blockly.common_namespace.setselected_2_function +[events]: /guides/configure/web/events +[IRenderedElement]: /reference/js/blockly.irenderedelement_interface +[IDraggable]: /reference/js/blockly.idraggable_interface +[IDeletable]: /reference/js/blockly.ideletable_interface +[ISelectable]: /reference/js/blockly.iselectable_interface +[setSelected]: /reference/js/blockly.common_namespace.setselected_2_function [svg-group]: https://developer.mozilla.org/en-US/docs/Web/SVG/Element/g -[Coordinate]: /blockly/reference/js/blockly.utils_namespace.coordinate_class -[drag-target]: /blockly/reference/js/blockly.dragtarget_class -[copy-paste]: /blockly/guides/configure/web/copy-paste +[Coordinate]: /reference/js/blockly.utils_namespace.coordinate_class +[drag-target]: /reference/js/blockly.dragtarget_class +[copy-paste]: /guides/configure/web/copy-paste diff --git a/packages/docs/docs/guides/configure/web/dragging/dragger.mdx b/packages/docs/docs/guides/configure/web/dragging/dragger.mdx index f0d9593aa..30e60a926 100644 --- a/packages/docs/docs/guides/configure/web/dragging/dragger.mdx +++ b/packages/docs/docs/guides/configure/web/dragging/dragger.mdx @@ -169,7 +169,7 @@ const myWorkspace = Blockly.inject('blocklyDiv', { ``` -[draggable]: /blockly/guides/configure/web/dragging/draggable -[drag-target]: /blockly/reference/js/blockly.dragtarget_class +[draggable]: /guides/configure/web/dragging/draggable +[drag-target]: /reference/js/blockly.dragtarget_class [scroll-options-plugin]: https://www.npmjs.com/package/@blockly/plugin-scroll-options -[IDragger]: /blockly/reference/js/blockly.idragger_interface +[IDragger]: /reference/js/blockly.idragger_interface diff --git a/packages/docs/docs/guides/configure/web/events.mdx b/packages/docs/docs/guides/configure/web/events.mdx index 2add5de32..1d47c0077 100644 --- a/packages/docs/docs/guides/configure/web/events.mdx +++ b/packages/docs/docs/guides/configure/web/events.mdx @@ -16,7 +16,7 @@ the before and after state of each change. Workspaces have `addChangeListener` and `removeChangeListener` methods that can be used to listen to the event stream. One example is the -[real-time generation of code](/blockly/guides/app-integration/run-code#continuous-updates). +[real-time generation of code](/guides/app-integration/run-code#continuous-updates). Another example is the [maximum block limit demo](https://raspberrypifoundation.github.io/blockly-samples/examples/max-blocks-demo/). As is often the case, neither of these two examples care what the triggering @@ -55,7 +55,7 @@ workspace. The function is added by calling `Block.setOnChange` with a function and can be done during initialization or via a [JSON -extension](/blockly/guides/create-custom-blocks/define/extensions) if you plan +extension](/guides/create-custom-blocks/define/extensions) if you plan to use it on all platforms. @@ -130,7 +130,7 @@ and causing side effects. ## Event types -Refer to the [reference documentation](/blockly/reference/js/blockly.events_namespace) +Refer to the [reference documentation](/reference/js/blockly.events_namespace) for information about individual events. ## Demo diff --git a/packages/docs/docs/guides/configure/web/fixed-size.mdx b/packages/docs/docs/guides/configure/web/fixed-size.mdx index 92a58d359..dc99440e8 100644 --- a/packages/docs/docs/guides/configure/web/fixed-size.mdx +++ b/packages/docs/docs/guides/configure/web/fixed-size.mdx @@ -11,7 +11,7 @@ The simplest way to put Blockly into a webpage is to inject it into an empty ## 1. Get the code -[Get the code](/blockly/guides/get-started/get-the-code) in whatever +[Get the code](/guides/get-started/get-the-code) in whatever way works best for your application. ## 2. Define the area @@ -24,7 +24,7 @@ Add an empty `div` somewhere in the page's body and set its size: ## 3. Inject the workspace -[Define the toolbox](/blockly/guides/configure/web/toolboxes/toolbox) structure: +[Define the toolbox](/guides/configure/web/toolboxes/toolbox) structure: ```js const toolbox = { diff --git a/packages/docs/docs/guides/configure/web/focus.mdx b/packages/docs/docs/guides/configure/web/focus.mdx index ec6a49be4..7bd04b7ad 100644 --- a/packages/docs/docs/guides/configure/web/focus.mdx +++ b/packages/docs/docs/guides/configure/web/focus.mdx @@ -121,7 +121,7 @@ Suppose a block with two fields has Blockly focus, as indicated by a highlight arrow: 1. The [keyboard navigation - plugin](/blockly/guides/configure/web/keyboard-nav): + plugin](/guides/configure/web/keyboard-nav): * Receives a key press event. * Asks the navigation system (a part of core Blockly) to move focus to the "next" component. @@ -163,11 +163,11 @@ Here are some other examples: * When a block is deleted, its `dispose` method calls the focus manager to move focus to the block's parent. -* [Keyboard shortcuts](/blockly/guides/configure/web/keyboard-shortcuts) use +* [Keyboard shortcuts](/guides/configure/web/keyboard-shortcuts) use `IFocusableNode` to identify the Blockly component to which the shortcut applies. -* [Context menus](/blockly/guides/configure/web/context-menus) use +* [Context menus](/guides/configure/web/context-menus) use `IFocusableNode` to identify the Blockly component on which the menu was invoked. @@ -271,8 +271,8 @@ in an exception. If you write a custom component from scratch, you'll need to implement the focus interfaces yourself. See the reference documentation for -[`IFocusableTree`](/blockly/reference/js/blockly.ifocusabletree_interface) and -[`IFocusableNode`](/blockly/reference/js/blockly.ifocusablenode_interface) more +[`IFocusableTree`](/reference/js/blockly.ifocusabletree_interface) and +[`IFocusableNode`](/reference/js/blockly.ifocusablenode_interface) more information. After you have implemented your class, test it against the keyboard navigation @@ -321,9 +321,9 @@ returnEphemeralFocus(); ``` If you use -[`WidgetDiv`](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#widgetdiv-sample-code) +[`WidgetDiv`](/guides/create-custom-blocks/fields/customizing-fields/creating#widgetdiv-sample-code) or -[`DropDownDiv`](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#dropdowndiv-sample-code), +[`DropDownDiv`](/guides/create-custom-blocks/fields/customizing-fields/creating#dropdowndiv-sample-code), they will handle ephemeral focus for you. ### Tab stops @@ -367,7 +367,7 @@ manager just changes the actively focused node to passive focus.) Positionables are components that are positioned on top of the workspace and implement -[`IPositionable`](/blockly/reference/js/blockly.ipositionable_interface). +[`IPositionable`](/reference/js/blockly.ipositionable_interface). Examples are the trashcan and the backpack in the [backpack plugin](https://www.npmjs.com/package/@blockly/workspace-backpack). Positionables are not yet integrated into the focus system. diff --git a/packages/docs/docs/guides/configure/web/grid.mdx b/packages/docs/docs/guides/configure/web/grid.mdx index 70aac4b2d..56101dada 100644 --- a/packages/docs/docs/guides/configure/web/grid.mdx +++ b/packages/docs/docs/guides/configure/web/grid.mdx @@ -13,7 +13,7 @@ large area. The grid's settings are defined by an object that is part of Blockly's [configuration -options](/blockly/guides/configure/web/configuration_struct#the-options-dictionary). +options](/guides/configure/web/configuration_struct#the-options-dictionary). Here is an example: ```js diff --git a/packages/docs/docs/guides/configure/web/keyboard-nav.mdx b/packages/docs/docs/guides/configure/web/keyboard-nav.mdx index 56623ed2b..35429aff3 100644 --- a/packages/docs/docs/guides/configure/web/keyboard-nav.mdx +++ b/packages/docs/docs/guides/configure/web/keyboard-nav.mdx @@ -7,7 +7,7 @@ image: images/blockly_banner.png # Keyboard navigation Blockly provides keyboard navigation through the `@blockly/keyboard-navigation` -plugin. This code uses the [focus system](/blockly/guides/configure/web/focus) +plugin. This code uses the [focus system](/guides/configure/web/focus) and will eventually be integrated into Blockly core. You can [download the plugin from diff --git a/packages/docs/docs/guides/configure/web/keyboard-shortcuts.mdx b/packages/docs/docs/guides/configure/web/keyboard-shortcuts.mdx index 57a782b47..4acab0ff7 100644 --- a/packages/docs/docs/guides/configure/web/keyboard-shortcuts.mdx +++ b/packages/docs/docs/guides/configure/web/keyboard-shortcuts.mdx @@ -34,17 +34,17 @@ user presses a key (or combination of keys), Blockly: ## Scope A -[`Scope`](/blockly/reference/js/blockly.contextmenuregistry_namespace.scope_interface) +[`Scope`](/reference/js/blockly.contextmenuregistry_namespace.scope_interface) object identifies the Blockly component that currently has focus. Scope objects are passed to `preconditionFn` and `callback`, which use them to decide whether a shortcut applies to a particular component and, if so, how to apply it. To use a `Scope` object, use its `focusedNode` property. This is an object that implements -[`IFocusableNode`](/blockly/reference/js/blockly.ifocusablenode_interface). This +[`IFocusableNode`](/reference/js/blockly.ifocusablenode_interface). This interface is implemented by all Blockly components that the user can focus on, including workspaces, blocks, fields, comments, and your own custom components; -for more information, see [Focus system](/blockly/guides/configure/web/focus). +for more information, see [Focus system](/guides/configure/web/focus). For example, a `preconditionFn` might use `focusedNode` to ensure that a shortcut only applies to blocks. @@ -58,7 +58,7 @@ preconditionFn(workspace, scope) { ## The KeyboardShortcut interface Objects in the shortcut registry implement the -[`KeyboardShortcut`](/blockly/reference/js/blockly.shortcutregistry_namespace.keyboardshortcut_interface) +[`KeyboardShortcut`](/reference/js/blockly.shortcutregistry_namespace.keyboardshortcut_interface) interface. This contains the following properties. ### name (required) @@ -135,7 +135,7 @@ it. An array of keys (or combinations of keys) that activate this shortcut. To identify keys, use the keycodes in -[`Blockly.utils.KeyCodes`](/blockly/reference/js/blockly.utils_namespace.keycodes_enum). +[`Blockly.utils.KeyCodes`](/reference/js/blockly.utils_namespace.keycodes_enum). For example: ```js @@ -148,7 +148,7 @@ const logFieldsShortcut = { If you want map additional keys to an existing shortcut -- for example, you want to add keys to a [default shortcut](#default-shortcuts) -- you can call -[`Blockly.ShortcutRegistry.registry.addKeyMapping`](/blockly/reference/js/blockly.shortcutregistry_class.addkeymapping_1_method). +[`Blockly.ShortcutRegistry.registry.addKeyMapping`](/reference/js/blockly.shortcutregistry_class.addkeymapping_1_method). This is not common. #### Key combinations @@ -272,7 +272,7 @@ The shortcuts are defined in the `registerXxxx` functions. ## Keyboard navigation shortcuts -The [keyboard navigation plugin](/blockly/guides/configure/web/keyboard-nav) +The [keyboard navigation plugin](/guides/configure/web/keyboard-nav) contains shortcuts that allow users to navigate Blockly with the keyboard, such as by using arrow keys. Keyboard navigation is essential for users who cannot use a mouse, such as those with motor or visual impairments. It is also useful diff --git a/packages/docs/docs/guides/configure/web/media.mdx b/packages/docs/docs/guides/configure/web/media.mdx index 1cc16e569..8d6268219 100644 --- a/packages/docs/docs/guides/configure/web/media.mdx +++ b/packages/docs/docs/guides/configure/web/media.mdx @@ -18,7 +18,7 @@ or if you want your application to only make HTTP requests to your domain: place them in your own media folder. 1. Replace any assets you want to customize. 1. Set the `media` property in the [configuration - options](/blockly/guides/configure/web/configuration_struct#the-options-dictionary) + options](/guides/configure/web/configuration_struct#the-options-dictionary) to the URL of your media folder. This can be an absolute URL or a path relative to the current file. 1. Deploy your media folder and all of its assets along with the rest of your diff --git a/packages/docs/docs/guides/configure/web/metrics_manager.mdx b/packages/docs/docs/guides/configure/web/metrics_manager.mdx index b5669e738..c24ef8025 100644 --- a/packages/docs/docs/guides/configure/web/metrics_manager.mdx +++ b/packages/docs/docs/guides/configure/web/metrics_manager.mdx @@ -24,7 +24,7 @@ The toolbox metrics are composed of the `height`, `width` and `position` of a category toolbox. This does not include information on the flyout that is attached to the toolbox. -The Blockly workspace with arrows showing the width and height of the toolbox. +The Blockly workspace with arrows showing the width and height of the toolbox. The `position` of the toolbox is of the type `Blockly.utils.toolbox.Position`. @@ -37,7 +37,7 @@ flyout toolbox. It is important to note, that this is not the flyout that is attached to the category toolbox. This only pertains to flyout toolboxes as shown in the below photo. -The Blockly workspace with arrows showing the width and height of the flyout. +The Blockly workspace with arrows showing the width and height of the flyout. The `position` of the flyout is of the type `Blockly.utils.toolbox.Position`. @@ -49,7 +49,7 @@ The SVG metrics are composed of the `width` and `height` of the workspace's parent SVG. For the main workspace, this is the SVG with the `blocklySvg` class. This SVG includes the visible workspace as well as the toolbox. -The Blockly workspace with a blue rectangle around it. +The Blockly workspace with a blue rectangle around it. ### View Metrics @@ -59,12 +59,12 @@ The view metrics are composed of the `height`, `width`, `top` and `left` of the viewport. The viewport is the portion of the workspace that is visible. This does not include either type of toolbox. -The Blockly workspace with a blue rectangle around the area not including the toolbox. +The Blockly workspace with a blue rectangle around the area not including the toolbox. The top left is relative to the workspace origin. As we drag around the workspace the top and left position of the viewport are updated. -The Blockly workspace with a blue rectangle around the area not including the toolbox, and an origin shown offset from the top left corner. +The Blockly workspace with a blue rectangle around the area not including the toolbox, and an origin shown offset from the top left corner. ### Absolute Metrics @@ -74,8 +74,8 @@ The absolute metrics are composed of the `top` and `left` offset of the viewport from the pareng SVG. Depending on where the toolbox is positioned on the workspace, this is usually the width or height of the toolbox. -The Blockly workspace with a blue line to the right of the toolbox and on top of the workspace. -The Blockly workspace with a horizontal toolbox. There is a blue line on the left of the workspace and below the toolbox. +The Blockly workspace with a blue line to the right of the toolbox and on top of the workspace. +The Blockly workspace with a horizontal toolbox. There is a blue line on the left of the workspace and below the toolbox. ### Content Metrics @@ -86,10 +86,10 @@ the bounding box around any blocks or workspace comments. :::note Content metrics do not take into account block comments, only [workspace -comments](/blockly/reference/js/blockly.comments_namespace.workspacecomment_class/). +comments](/reference/js/blockly.comments_namespace.workspacecomment_class/). ::: -The Blockly workspace with a blue box around the contents of the workspace. +The Blockly workspace with a blue box around the contents of the workspace. ### Scroll Metrics @@ -99,7 +99,7 @@ The scroll metrics are composed of the `height`, `width`, `top` and `left` of the scrollable area. For a movable workspace, the scrollable area is the content area plus some padding. -The Blockly workspace with a large blue box surrounding it. +The Blockly workspace with a large blue box surrounding it. ## Coordinate Systems diff --git a/packages/docs/docs/guides/configure/web/move.mdx b/packages/docs/docs/guides/configure/web/move.mdx index 123d70f91..7d1896b85 100644 --- a/packages/docs/docs/guides/configure/web/move.mdx +++ b/packages/docs/docs/guides/configure/web/move.mdx @@ -11,7 +11,7 @@ scrollbars, the mouse, or the mouse wheel. The move settings are defined by an object that is part of Blockly's [configuration -options](/blockly/guides/configure/web/configuration_struct#the-options-dictionary). +options](/guides/configure/web/configuration_struct#the-options-dictionary). Here is an example: ```js diff --git a/packages/docs/docs/guides/configure/web/resizable.mdx b/packages/docs/docs/guides/configure/web/resizable.mdx index 87c79c284..2910ff2c5 100644 --- a/packages/docs/docs/guides/configure/web/resizable.mdx +++ b/packages/docs/docs/guides/configure/web/resizable.mdx @@ -28,7 +28,7 @@ of a table cell that fills the bottom of the screen. ## 2. Inject the workspace Injecting Blockly is the same as the process described in -[injecting fixed-sized Blockly](/blockly/guides/configure/web/fixed-size). +[injecting fixed-sized Blockly](/guides/configure/web/fixed-size). Add the code, the `blocklyDiv` element, a toolbox, and an injection call. Blockly should now be running on the page, just not located where it should be diff --git a/packages/docs/docs/guides/configure/web/serialization.mdx b/packages/docs/docs/guides/configure/web/serialization.mdx index 13b3577f5..967200cf2 100644 --- a/packages/docs/docs/guides/configure/web/serialization.mdx +++ b/packages/docs/docs/guides/configure/web/serialization.mdx @@ -8,7 +8,7 @@ image: images/blockly_banner.png Serialization is saving the state of your workspace so that it can be loaded back into the workspace later. This includes serializing the state of any -blocks, variables, or [plugins](/blockly/guides/programming/plugin_overview) +blocks, variables, or [plugins](/guides/programming/plugin_overview) that you want to save. You can convert all of the data you need to save into a text-based format for easy storage, and then load that data back into a fully functional workspace later. @@ -76,7 +76,7 @@ prevent duplicating state within a save. When `Blockly.serialization.workspaces.load` is called, serializers are given state to deserialize in order of *priority*. This is explained further in the -[Serializers](/blockly/guides/configure/web/serialization#serializer-hooks) +[Serializers](/guides/configure/web/serialization#serializer-hooks) section, and its purpose is to allow serializers to depend on state from other systems. @@ -91,7 +91,7 @@ The order for deserialization of built-in serializers is: 2. **Attributes are deserialized.** This includes properties that can apply to any block. For example: x, y, collapsed, disabled, and data. 4. **Extra state is deserialized.** See the - [Mutators](/blockly/guides/create-custom-blocks/mutators) documentation for + [Mutators](/guides/create-custom-blocks/mutators) documentation for more info. 5. **The block is connected to its parent (if one exists).** 1. **Icons are deserialized.** Individual icons are deserialized in an @@ -117,7 +117,7 @@ However, if you have an input that only exists if a field has a certain value, you do not need to add info about the field to your extra state. This is because the state of your field will be deserialized first, and when it is, you can add the input to your block. Usually adding the input will be triggered by a -[validator](/blockly/guides/create-custom-blocks/fields/validators#registering-a-local-validator). +[validator](/guides/create-custom-blocks/fields/validators#registering-a-local-validator). Note that the rule about duplicating state should also take into account that block stacks, icons, fields, and input blocks are deserialized in an arbitrary @@ -128,12 +128,12 @@ is deserialized before A. ### Block hooks For information about how to add extra serialization to blocks, see the -[Mutators](/blockly/guides/create-custom-blocks/mutators) documentation. +[Mutators](/guides/create-custom-blocks/mutators) documentation. ### Field hooks For information about how to serialize fields, see the [Custom -fields](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#serialization) +fields](/guides/create-custom-blocks/fields/customizing-fields/creating#serialization) documentation. ### Serializer hooks @@ -167,10 +167,10 @@ When you register a serializer you must provide several things: * A function to `clear` the state. * A function to `load` the state. * A `priority`, which is used to determine the [deserialization - order](/blockly/guides/configure/web/serialization#deserialization-order). + order](/guides/configure/web/serialization#deserialization-order). You can base the priority of your serializer on the [built-in - priorities](/blockly/reference/js/blockly.serialization_namespace.priorities_namespace) + priorities](/reference/js/blockly.serialization_namespace.priorities_namespace) When `Blockly.serialization.workspaces.save` is called, each serializer's `save` function will be called, and its data will be added to the final JSON output: @@ -215,17 +215,17 @@ For information on how to migrate to JSON, see the [migration guide]. ### APIs For information about the XML system's APIs see the [reference -documentation](/blockly/reference/js/blockly.xml_namespace). +documentation](/reference/js/blockly.xml_namespace). ### Block hooks For information about how to add extra serialization to blocks, see the -[Mutators](/blockly/guides/create-custom-blocks/mutators) documentation. +[Mutators](/guides/create-custom-blocks/mutators) documentation. ### Field hooks For information about how to serialize fields, see the [Custom -fields](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#serialization) +fields](/guides/create-custom-blocks/fields/customizing-fields/creating#serialization) documentation. ## Choosing between JSON and XML diff --git a/packages/docs/docs/guides/configure/web/toolboxes/appearance.mdx b/packages/docs/docs/guides/configure/web/toolboxes/appearance.mdx index ef8dcee0e..093475407 100644 --- a/packages/docs/docs/guides/configure/web/toolboxes/appearance.mdx +++ b/packages/docs/docs/guides/configure/web/toolboxes/appearance.mdx @@ -13,7 +13,7 @@ import ClassBlock from '@site/src/components/ClassBlock'; Blockly provides a default categories UI, and with it some basic options for styling. If you want information about how to do more advanced styling/configuration of the UI check out the [Customizing a Blockly toolbox -codelab](/blockly/codelabs/custom-toolbox/codelab-overview/index.html) +codelab](/codelabs/custom-toolbox/codelab-overview/index.html) and the [2021 Toolbox APIs talk](https://www.youtube.com/watch?v=JJVX_YuKDbo&list=PLSIUOFhnxEiCjoIwJ0jAdwpTZET73CK7d&index=9&t=1s). @@ -133,7 +133,7 @@ class to assign the label color: ## Themes -[Themes](/blockly/guides/configure/web/appearance/themes) allow you to specify all of the +[Themes](/guides/configure/web/appearance/themes) allow you to specify all of the colours of your workspace at once, including the colours of your categories. If you need finer-grained control, use CSS. @@ -195,4 +195,4 @@ spelling. Note that we also support using localizable [colour -references](/blockly/guides/configure/web/appearance/colour-formats#colour-references). +references](/guides/configure/web/appearance/colour-formats#colour-references). diff --git a/packages/docs/docs/guides/configure/web/toolboxes/category.mdx b/packages/docs/docs/guides/configure/web/toolboxes/category.mdx index a7e6a6116..c7eb9bbb9 100644 --- a/packages/docs/docs/guides/configure/web/toolboxes/category.mdx +++ b/packages/docs/docs/guides/configure/web/toolboxes/category.mdx @@ -18,7 +18,7 @@ blocks.](/images/toolbox-categories.png) To create a category toolbox, pass JSON or XML describing the toolbox to the `toolbox` property of the [configuration -options](/blockly/guides/configure/web/configuration_struct#the-options-dictionary). +options](/guides/configure/web/configuration_struct#the-options-dictionary). diff --git a/packages/docs/docs/guides/configure/web/toolboxes/disable-categories.mdx b/packages/docs/docs/guides/configure/web/toolboxes/disable-categories.mdx index 3596e8b87..6166c4cdd 100644 --- a/packages/docs/docs/guides/configure/web/toolboxes/disable-categories.mdx +++ b/packages/docs/docs/guides/configure/web/toolboxes/disable-categories.mdx @@ -62,7 +62,7 @@ category.show(); ## Expand categories This only applies to categories which contain other [nested -categories](/blockly/guides/configure/web/toolboxes/nested). +categories](/guides/configure/web/toolboxes/nested). An expanded category will show you its sub categories. By default, nested categories are collapsed, and need to be clicked to be expanded. diff --git a/packages/docs/docs/guides/configure/web/toolboxes/dynamic.mdx b/packages/docs/docs/guides/configure/web/toolboxes/dynamic.mdx index ed1a1c2e5..9f207e4ff 100644 --- a/packages/docs/docs/guides/configure/web/toolboxes/dynamic.mdx +++ b/packages/docs/docs/guides/configure/web/toolboxes/dynamic.mdx @@ -132,5 +132,5 @@ _Note: The word 'procedure' is used throughout the Blockly codebase, but the word 'function' has found to be more understandable by students. Sorry for the mismatch._ -[untyped-variable]: /blockly/guides/create-custom-blocks/variables#untyped-variable-blocks -[typed-variable]: /blockly/guides/create-custom-blocks/variables#typed-variable-blocks +[untyped-variable]: /guides/create-custom-blocks/variables#untyped-variable-blocks +[typed-variable]: /guides/create-custom-blocks/variables#typed-variable-blocks diff --git a/packages/docs/docs/guides/configure/web/toolboxes/flyout.mdx b/packages/docs/docs/guides/configure/web/toolboxes/flyout.mdx index ca437eb02..7e9bc3596 100644 --- a/packages/docs/docs/guides/configure/web/toolboxes/flyout.mdx +++ b/packages/docs/docs/guides/configure/web/toolboxes/flyout.mdx @@ -16,7 +16,7 @@ blocks.](/images/toolbox-minimal.png) To create a flyout toolbox, pass JSON or XML describing the toolbox to the `toolbox` property of the [configuration -options](/blockly/guides/configure/web/configuration_struct#the-options-dictionary). +options](/guides/configure/web/configuration_struct#the-options-dictionary). diff --git a/packages/docs/docs/guides/configure/web/toolboxes/preset.mdx b/packages/docs/docs/guides/configure/web/toolboxes/preset.mdx index cb733296c..1ad4b66fb 100644 --- a/packages/docs/docs/guides/configure/web/toolboxes/preset.mdx +++ b/packages/docs/docs/guides/configure/web/toolboxes/preset.mdx @@ -171,7 +171,7 @@ out.](/images/toolbox-disabled.png) You can also programmatically disable or enable a block by using -[`setDisabledReason`](/blockly/reference/js/blockly.block_class.setdisabledreason_1_method). +[`setDisabledReason`](/reference/js/blockly.block_class.setdisabledreason_1_method). ## Configure your blocks diff --git a/packages/docs/docs/guides/configure/web/toolboxes/toolbox.mdx b/packages/docs/docs/guides/configure/web/toolboxes/toolbox.mdx index 6db0f795c..3b8f8d2f0 100644 --- a/packages/docs/docs/guides/configure/web/toolboxes/toolbox.mdx +++ b/packages/docs/docs/guides/configure/web/toolboxes/toolbox.mdx @@ -9,9 +9,9 @@ image: images/blockly_banner.png The toolbox is the place where users get blocks. Usually it is displayed on one side of the workspace. -A [flyout toolbox](/blockly/guides/configure/web/toolboxes/flyout) has a single +A [flyout toolbox](/guides/configure/web/toolboxes/flyout) has a single set of blocks that are displayed at all times. A [category -toolbox](/blockly/guides/configure/web/toolboxes/category) has multiple sets of +toolbox](/guides/configure/web/toolboxes/category) has multiple sets of blocks that are arranged into different categories. Toolboxes can be defined using JSON (as of the [September 2020 @@ -21,8 +21,8 @@ The JSON format is preferred. This section mainly focuses on how to specify the *structure* of your toolbox (i.e. what categories it has, and what blocks they contain). If you want more details about how to change the *appearance* of your toolbox, see [Category -appearance](/blockly/guides/configure/web/toolboxes/appearance), the +appearance](/guides/configure/web/toolboxes/appearance), the [Customizing a Blockly toolbox -codelab](/blockly/codelabs/custom-toolbox/codelab-overview/index.html), +codelab](/codelabs/custom-toolbox/codelab-overview/index.html), and the [2021 Toolbox APIs talk](https://www.youtube.com/watch?v=JJVX_YuKDbo&list=PLSIUOFhnxEiCjoIwJ0jAdwpTZET73CK7d&index=9&t=1s). diff --git a/packages/docs/docs/guides/configure/web/translations.mdx b/packages/docs/docs/guides/configure/web/translations.mdx index 81c36de5e..43b4283fe 100644 --- a/packages/docs/docs/guides/configure/web/translations.mdx +++ b/packages/docs/docs/guides/configure/web/translations.mdx @@ -197,7 +197,7 @@ Blockly.Msg['LISTS_REPEAT_TITLE'] = "إنشئ قائمة مع العنصر %1 % For more information about how Blockly converts `message` keys into inputs and fields, see [Define block structure in -JSON](/blockly/guides/create-custom-blocks/define/structure-json). +JSON](/guides/create-custom-blocks/define/structure-json). ### Use localization tokens in JavaScript @@ -330,14 +330,14 @@ Blockly uses these functions to resolve token references in the `messageN`, One place you might need to use `replaceMessageReferences` is in custom fields. If your custom field accepts token references in any of its options, use `replaceMessageReferences` to resolve them. For more information, see [JSON and -registration](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#json-and-registration). +registration](/guides/create-custom-blocks/fields/customizing-fields/creating#json-and-registration). ## Related topics * Right-to-left languages: See the [RTL demo](https://raspberrypifoundation.github.io/blockly-samples/examples/rtl-demo/). * Help localize Blockly's text: See - [Translating](/blockly/guides/contribute/core/translating) in the section on + [Translating](/guides/contribute/core/translating) in the section on contributing to Blockly. ## Appendix: Where token references are allowed {#where} @@ -355,7 +355,7 @@ following JSON keys: * `colour` * In the options passed to all fields: * `tooltip` -* In the [nested arrays](/blockly/guides/create-custom-blocks/fields/built-in-fields/dropdown#creation) +* In the [nested arrays](/guides/create-custom-blocks/fields/built-in-fields/dropdown#creation) passed to `options` in `field_dropdown`: * The first element, when the first element is a string * The value of `alt`, when the first element is an object describing an @@ -387,4 +387,4 @@ And in the XML definition of a toolbox in the following attributes of * `colour` For more information about using token references as colour values, see [Colour -references](/blockly/guides/configure/web/appearance/colour-formats#colour-references). +references](/guides/configure/web/appearance/colour-formats#colour-references). diff --git a/packages/docs/docs/guides/configure/web/workspace_comment.mdx b/packages/docs/docs/guides/configure/web/workspace_comment.mdx index 6536e5936..61a9695af 100644 --- a/packages/docs/docs/guides/configure/web/workspace_comment.mdx +++ b/packages/docs/docs/guides/configure/web/workspace_comment.mdx @@ -12,7 +12,7 @@ A workspace comment is a graphical element that you can enter text into. Usually it's used to document things about your code, just like comments in a text-based programming language. -Workspace comment +Workspace comment :::note workspace comments cannot be added to the [flyout][flyout]. @@ -56,7 +56,7 @@ the colour of the comment top bar and the border of the comment. } ``` -A workspace comment with the colours changed +A workspace comment with the colours changed ### CSS classes @@ -65,15 +65,15 @@ view, which allow you to modify the elements' styling. | CSS class(es) | Image | | -------------------------------------------- | --------------------------------------------------------------------------------------------------------------------- | -| `blocklyComment`, `blocklyDraggable` | Workspace comment | -| `blocklySelected`, `blocklyCommentHighlight` | Selected comment Selected collapsed comment | : -| `blocklyCollapsed` | Collapsed workspace comment | -| `blocklyCommentTopbar` | Workspace comment topbar | -| `blocklyFoldoutIcon` | Foldout icon | -| `blocklyCommentPreview`, `blocklyText` | Comment preview | -| `blocklyDeleteIcon` | Delete icon | -| `blocklyText` | Text | -| `blocklyResizeHandle` | Resize icon | +| `blocklyComment`, `blocklyDraggable` | Workspace comment | +| `blocklySelected`, `blocklyCommentHighlight` | Selected comment Selected collapsed comment | : +| `blocklyCollapsed` | Collapsed workspace comment | +| `blocklyCommentTopbar` | Workspace comment topbar | +| `blocklyFoldoutIcon` | Foldout icon | +| `blocklyCommentPreview`, `blocklyText` | Comment preview | +| `blocklyDeleteIcon` | Delete icon | +| `blocklyText` | Text | +| `blocklyResizeHandle` | Resize icon | #### Basic CSS use @@ -86,7 +86,7 @@ class: } ``` -A workspace comment with a taller top bar +A workspace comment with a taller top bar #### CSS for text @@ -105,9 +105,9 @@ the renderer. } ``` -A workspace comment with blue preview text +A workspace comment with blue preview text -A workspace comment with blue input text +A workspace comment with blue input text #### CSS for selected highlights @@ -144,9 +144,9 @@ image in your [media folder][media]. | Image name | Image | | ------------------- | ---------------------------------------------------------- | -| `foldout-icon.svg` | Foldout icon | -| `delete-icon.svg` | Delete icon | -| `resize-handle.svg` | Resize icon | +| `foldout-icon.svg` | Foldout icon | +| `delete-icon.svg` | Delete icon | +| `resize-handle.svg` | Resize icon | #### Delete icon @@ -168,23 +168,23 @@ To set the default comment size, set the static property Blockly.comments.CommentView.defaultCommentSize = new Blockly.utils.Size(200, 200); ``` -[context-menus]: /blockly/guides/configure/web/context-menus -[flyout]: /blockly/guides/get-started/workspace-anatomy#flyout-toolbox -[themes]: /blockly/guides/configure/web/appearance/themes +[context-menus]: /guides/configure/web/context-menus +[flyout]: /guides/get-started/workspace-anatomy#flyout-toolbox +[themes]: /guides/configure/web/appearance/themes [svg-image-element]: https://developer.mozilla.org/en-US/docs/Web/SVG/Element/image -[media]: /blockly/guides/configure/web/media -[workspace-comment-image]: /blockly/images/workspace-comments/workspace-comment.png -[coloured-workspace-comment-image]: /blockly/images/workspace-comments/coloured-comment.png -[workspace-comment-outline-image]: /blockly/images/workspace-comments/workspace-comment-outline.png -[collapsed-outline-image]: /blockly/images/workspace-comments/collapsed-outline.png -[top-bar-outline-image]: /blockly/images/workspace-comments/top-bar-outline.png -[foldout-icon-outline-image]: /blockly/images/workspace-comments/foldout-icon-outline.png -[preview-text-outline-image]: /blockly/images/workspace-comments/preview-text-outline.png -[delete-icon-outline-image]: /blockly/images/workspace-comments/delete-icon-outline.png -[text-outline-image]: /blockly/images/workspace-comments/text-input-outline.png -[resize-handle-outline-image]: /blockly/images/workspace-comments/resize-handle-outline.png -[taller-top-bar-image]: /blockly/images/workspace-comments/tall-top-bar.png -[blue-input-text-image]: /blockly/images/workspace-comments/blue-text.png -[blue-preview-text-image]: /blockly/images/workspace-comments/blue-preview-text.png -[selected-comment]: /blockly/images/workspace-comments/selected-comment.png -[selected-collapsed]: /blockly/images/workspace-comments/selected-collapsed.png +[media]: /guides/configure/web/media +[workspace-comment-image]: /images/workspace-comments/workspace-comment.png +[coloured-workspace-comment-image]: /images/workspace-comments/coloured-comment.png +[workspace-comment-outline-image]: /images/workspace-comments/workspace-comment-outline.png +[collapsed-outline-image]: /images/workspace-comments/collapsed-outline.png +[top-bar-outline-image]: /images/workspace-comments/top-bar-outline.png +[foldout-icon-outline-image]: /images/workspace-comments/foldout-icon-outline.png +[preview-text-outline-image]: /images/workspace-comments/preview-text-outline.png +[delete-icon-outline-image]: /images/workspace-comments/delete-icon-outline.png +[text-outline-image]: /images/workspace-comments/text-input-outline.png +[resize-handle-outline-image]: /images/workspace-comments/resize-handle-outline.png +[taller-top-bar-image]: /images/workspace-comments/tall-top-bar.png +[blue-input-text-image]: /images/workspace-comments/blue-text.png +[blue-preview-text-image]: /images/workspace-comments/blue-preview-text.png +[selected-comment]: /images/workspace-comments/selected-comment.png +[selected-collapsed]: /images/workspace-comments/selected-collapsed.png diff --git a/packages/docs/docs/guides/configure/web/zoom.mdx b/packages/docs/docs/guides/configure/web/zoom.mdx index 7e5ada94a..09e601a98 100644 --- a/packages/docs/docs/guides/configure/web/zoom.mdx +++ b/packages/docs/docs/guides/configure/web/zoom.mdx @@ -11,7 +11,7 @@ or statically by the developer. The zoom settings are defined by an object that is part of Blockly's [configuration -options](/blockly/guides/configure/web/configuration_struct#the-options-dictionary). +options](/guides/configure/web/configuration_struct#the-options-dictionary). Here is an example: ```js diff --git a/packages/docs/docs/guides/contribute/core-architecture/render-management.mdx b/packages/docs/docs/guides/contribute/core-architecture/render-management.mdx index ebd2597f6..e679c10c9 100644 --- a/packages/docs/docs/guides/contribute/core-architecture/render-management.mdx +++ b/packages/docs/docs/guides/contribute/core-architecture/render-management.mdx @@ -118,5 +118,5 @@ render. There are also a few places in core where it triggers immediate renders for backwards compatibility reasons. These are planned to be removed in v11. -[renderer]: /blockly/guides/create-custom-blocks/renderers/overview +[renderer]: /guides/create-custom-blocks/renderers/overview [requestFrame]: https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame diff --git a/packages/docs/docs/guides/contribute/core/add_localization_token.mdx b/packages/docs/docs/guides/contribute/core/add_localization_token.mdx index 9bd6d1857..36f3a7cd7 100644 --- a/packages/docs/docs/guides/contribute/core/add_localization_token.mdx +++ b/packages/docs/docs/guides/contribute/core/add_localization_token.mdx @@ -130,6 +130,6 @@ string. Blockly.Msg.LOGIC_HUE = '210'; ``` -[translatewiki]: /blockly/guides/contribute/core/translating -[localization]: /blockly/guides/configure/web/translations -[block-colour]: /blockly/guides/configure/web/appearance/block-colour#set-block-colour +[translatewiki]: /guides/contribute/core/translating +[localization]: /guides/configure/web/translations +[block-colour]: /guides/configure/web/appearance/block-colour#set-block-colour diff --git a/packages/docs/docs/guides/contribute/core/advanced.mdx b/packages/docs/docs/guides/contribute/core/advanced.mdx index 8bef09c27..263b9ef2b 100644 --- a/packages/docs/docs/guides/contribute/core/advanced.mdx +++ b/packages/docs/docs/guides/contribute/core/advanced.mdx @@ -6,7 +6,7 @@ image: images/blockly_banner.png # Advanced compilation -The regular [build process](/blockly/guides/contribute/core/building) uses Google's online JavaScript compiler to reduce Blockly to a half a dozen files totaling about 720kb (160kb zipped). Alternatively one can use the Google's offline JavaScript compiler in "advanced compilation" mode which has a number of advantages: +The regular [build process](/guides/contribute/core/building) uses Google's online JavaScript compiler to reduce Blockly to a half a dozen files totaling about 720kb (160kb zipped). Alternatively one can use the Google's offline JavaScript compiler in "advanced compilation" mode which has a number of advantages: * Total Blockly size reduced to 300kb (100kb zipped) due to tree shaking. * Faster build times and no network traffic due to local compiler execution. diff --git a/packages/docs/docs/guides/contribute/core/building.mdx b/packages/docs/docs/guides/contribute/core/building.mdx index eb900664d..f075b7800 100644 --- a/packages/docs/docs/guides/contribute/core/building.mdx +++ b/packages/docs/docs/guides/contribute/core/building.mdx @@ -10,7 +10,7 @@ image: images/blockly_banner.png Unless you are modifying the Blockly source code directly, you probably don't need to build Blockly run any of the scripts documented below yourself. Instead, follow the instructions in [the "Get the Code" -section](/blockly/guides/get-started/get-the-code#get-the-code-1) of the [Get Started](/blockly/guides/get-started/get-the-code) page to install [the `blockly` NPM package]( +section](/guides/get-started/get-the-code#get-the-code-1) of the [Get Started](/guides/get-started/get-the-code) page to install [the `blockly` NPM package]( https://www.npmjs.com/package/blockly) or download the `.tgz` file attached to [the latest release on GitHub]( https://github.com/RaspberryPiFoundation/blockly/releases/latest). @@ -71,7 +71,7 @@ this alternative terminology is potentially confusing and discouraged. Unless you are modifying the Blockly source code directly, you probably don't need to build Blockly run any of the scripts documented below yourself. Instead, follow the instructions in [the "Get the Code" -section](/blockly/guides/get-started/get-the-code#get-the-code-1) of the [Get Started](/blockly/guides/get-started/get-the-code) page to install [the `blockly` NPM package]( +section](/guides/get-started/get-the-code#get-the-code-1) of the [Get Started](/guides/get-started/get-the-code) page to install [the `blockly` NPM package]( https://www.npmjs.com/package/blockly) or download the `.tgz` file attached to [the latest release on GitHub]( https://github.com/RaspberryPiFoundation/blockly/releases/latest). diff --git a/packages/docs/docs/guides/contribute/core/index.mdx b/packages/docs/docs/guides/contribute/core/index.mdx index d9e1a682e..e3facf271 100644 --- a/packages/docs/docs/guides/contribute/core/index.mdx +++ b/packages/docs/docs/guides/contribute/core/index.mdx @@ -20,7 +20,7 @@ to create a PR. - You must fill out the pull request template with the requested information. - Code must conform to Google's [TypeScript Style Guide](https://google.github.io/styleguide/tsguide.html). -- Use [conventional commits](/blockly/guides/contribute/get-started/commits) +- Use [conventional commits](/guides/contribute/get-started/commits) in your commit messages and pull request titles. - User-visible strings must be in the `/msg/messages.js` file so they may be translated. Less than 6% of the world speaks English natively. @@ -43,7 +43,7 @@ to create a PR. 1. Run `npm install` to install dependencies. 1. Run `npm run start` to start up a server running the playground. You can use this page to test the existing behavior. See the - [playground](/blockly/guides/contribute/get-started/playground) page for + [playground](/guides/contribute/get-started/playground) page for more information. 1. Make any necessary changes to the code. 1. If you've left the server running, refresh to see your changes. Otherwise, diff --git a/packages/docs/docs/guides/contribute/core/klingon.mdx b/packages/docs/docs/guides/contribute/core/klingon.mdx index 559832487..f94ad092e 100644 --- a/packages/docs/docs/guides/contribute/core/klingon.mdx +++ b/packages/docs/docs/guides/contribute/core/klingon.mdx @@ -49,7 +49,7 @@ translations or corrections -- whether for Klingon, or other languages. ## How? -Most of [Blockly's translations](/blockly/guides/contribute/core/translating) are done by volunteers +Most of [Blockly's translations](/guides/contribute/core/translating) are done by volunteers using Translatewiki. Unfortunately, Klingon is not in their language matrix. As a result, Klingon contributors need to edit two files manually: diff --git a/packages/docs/docs/guides/contribute/core/style_guide.mdx b/packages/docs/docs/guides/contribute/core/style_guide.mdx index b1ce96b44..fcb08f73f 100644 --- a/packages/docs/docs/guides/contribute/core/style_guide.mdx +++ b/packages/docs/docs/guides/contribute/core/style_guide.mdx @@ -83,7 +83,7 @@ documentation](https://github.com/google/closure-compiler/wiki/Annotating-JavaSc Functions or properties that should only be accessed within the Blockly library should be annotated with `@internal`. This prevents these properties from appearing in the public documentation. Other [visibility -modifiers](/blockly/guides/programming/using_blockly_apis) should be placed in +modifiers](/guides/programming/using_blockly_apis) should be placed in the TypeScript code directly, not in the TSDoc. ### Properties diff --git a/packages/docs/docs/guides/contribute/core/write_a_codelab.mdx b/packages/docs/docs/guides/contribute/core/write_a_codelab.mdx index cac3c9755..13c98c349 100644 --- a/packages/docs/docs/guides/contribute/core/write_a_codelab.mdx +++ b/packages/docs/docs/guides/contribute/core/write_a_codelab.mdx @@ -9,7 +9,7 @@ image: images/blockly_banner.png ## Introduction Codelabs are interactive tutorials written in Markdown syntax. They are -published as [part of our documentation](/blockly/codelabs/index). Codelabs use +published as [part of our documentation](/codelabs/index). Codelabs use a mix of natural language, code samples, and screenshots to create a more interesting tutorial experience. The target user of a codelab is following along and running the code as they read. @@ -29,13 +29,13 @@ understanding code to complete a specific task. ### Process If you have an idea for a codelab, you can tell us about it by making a -[feature request](/blockly/guides/contribute/get-started/write_a_good_issue#feature-request) +[feature request](/guides/contribute/get-started/write_a_good_issue#feature-request) in the blockly repository. Include a description of what you want to teach and what you will build in the codelab. We'll discuss and refine the idea. Then you can write it up and -[submit a pull request](/blockly/guides/contribute/get-started/write_a_good_pr) for +[submit a pull request](/guides/contribute/get-started/write_a_good_pr) for it. Once it's been through -[review](/blockly/guides/contribute/get-started/pr_review_process), a member of the +[review](/guides/contribute/get-started/pr_review_process), a member of the Blockly team will publish it. ## Directory structure diff --git a/packages/docs/docs/guides/contribute/get-started/index.mdx b/packages/docs/docs/guides/contribute/get-started/index.mdx index 715f934ca..f3f62b463 100644 --- a/packages/docs/docs/guides/contribute/get-started/index.mdx +++ b/packages/docs/docs/guides/contribute/get-started/index.mdx @@ -15,8 +15,8 @@ you are new to open source development. For information specific to Blockly that you should read before making a contribution, see the -[Contributing to Core](/blockly/guides/contribute/core/index) and -[Contributing to Samples](/blockly/guides/contribute/samples/index) sections. +[Contributing to Core](/guides/contribute/core/index) and +[Contributing to Samples](/guides/contribute/samples/index) sections. ## Which repository? @@ -35,7 +35,7 @@ this repository if you want to create or modify a plugin or a sample. These are the general steps you will follow any time you make a change. -1. **Install** Git and Node, following the links in the [Tools](/blockly/guides/contribute/get-started/development_tools) +1. **Install** Git and Node, following the links in the [Tools](/guides/contribute/get-started/development_tools) section. 1. **Fork and clone the repository.** GitHub has a wonderful tutorial about [forking a repo](https://help.github.com/en/github/getting-started-with-github/fork-a-repo#fork-an-example-repository). @@ -53,12 +53,12 @@ These are the general steps you will follow any time you make a change. terminal. The name should help you remember what you're working on. 1. **Make your changes.** 1. **Validate your changes,** following the guide for - [core](/blockly/guides/contribute/core/index) or - [samples](/blockly/guides/contribute/samples/index). + [core](/guides/contribute/core/index) or + [samples](/guides/contribute/samples/index). 1. **Save your changes** with `git commit -am "fix: My commit message"`. [Read more about commit messages](#). 1. **Push your changes** to GitHub with `git push origin myBranchName`. 1. **Open a pull request** when your code is ready. A member of the Blockly team will review your changes and merge them into Blockly if they are approved. For more information see - [PR Review Process](/blockly/guides/contribute/get-started/pr_review_process). + [PR Review Process](/guides/contribute/get-started/pr_review_process). diff --git a/packages/docs/docs/guides/contribute/get-started/issue_labels.mdx b/packages/docs/docs/guides/contribute/get-started/issue_labels.mdx index 1f29d0af6..84d285365 100644 --- a/packages/docs/docs/guides/contribute/get-started/issue_labels.mdx +++ b/packages/docs/docs/guides/contribute/get-started/issue_labels.mdx @@ -57,13 +57,13 @@ issue is currently in, so you can know what needs to be done next. * **[Discussion](https://github.com/RaspberryPiFoundation/blockly-samples/labels/status%3A%20discussion):** These issues are in the - [discussion phase](/blockly/guides/contribute/samples/add_a_plugin#discussion), + [discussion phase](/guides/contribute/samples/add_a_plugin#discussion), which means there are still questions that need to be answered before implementation. If you have any thoughts related to this issue, feel free to leave a comment! We're always looking for more input. * **[Implementation](https://github.com/RaspberryPiFoundation/blockly-samples/labels/status%3A%20implementation):** These issues have had enough discussion that they are clearly defined, and - have moved into the [implementation phase](/blockly/guides/contribute/samples/add_a_plugin#implementation). + have moved into the [implementation phase](/guides/contribute/samples/add_a_plugin#implementation). They are either waiting for implementation, or already being implemented. If you're interested in working on one of these, read through the whole issue and then leave a comment saying which part you want to work on, then go @@ -106,15 +106,15 @@ working on plugins, these labels can help you find issues you're interested in. * **[Codelab](https://github.com/RaspberryPiFoundation/blockly/labels/category%3A%20codelab):** These issues relate to Blockly - [codelabs](/blockly/guides/contribute/core/write_a_codelab/), + [codelabs](/guides/contribute/core/write_a_codelab/), a suite of interactive tutorials. * **[Example](https://github.com/RaspberryPiFoundation/blockly-samples/labels/category%3A%20example):** These issues relate to Blockly - [examples](/blockly/guides/contribute/samples/repository_structure#examples), + [examples](/guides/contribute/samples/repository_structure#examples), a set of self-contained demos showcasing how to include and extend Blockly. * **[Plugin](https://github.com/RaspberryPiFoundation/blockly-samples/labels/category%3A%20plugin):** These issues relate to Blockly - [plugins](/blockly/guides/contribute/samples/repository_structure#plugins), + [plugins](/guides/contribute/samples/repository_structure#plugins), a collection of extensions that add functionality Blockly. ### Project diff --git a/packages/docs/docs/guides/contribute/get-started/playground.mdx b/packages/docs/docs/guides/contribute/get-started/playground.mdx index d40b00b8c..ab23474b6 100644 --- a/packages/docs/docs/guides/contribute/get-started/playground.mdx +++ b/packages/docs/docs/guides/contribute/get-started/playground.mdx @@ -24,7 +24,7 @@ playground in uncompiled mode, you must load it from a local web server. We have created a script that starts up a local server and loads all of the code required to load the Blockly modules. You will need to have -[npm installed on your machine](/blockly/guides/contribute/get-started/development_tools#npm) +[npm installed on your machine](/guides/contribute/get-started/development_tools#npm) and run `npm install` from the root of Blockly in order to install all dependencies. @@ -118,7 +118,7 @@ the `test/playground.html` file in your browser. This is still possible with the simple and multi playgrounds, but it is no longer recommended. If you do this, the playground will detect that you are not running a local server and automatically use compressed Blockly files (see the -[Building Blockly page](/blockly/guides/contribute/core/building) for more +[Building Blockly page](/guides/contribute/core/building) for more info) and whenever you change something in core Blockly, you will have to rebuild core and stage the changes. You can still access these pages if hosted on a remote server, such as our example hosted on our demo site. The background diff --git a/packages/docs/docs/guides/contribute/get-started/write_a_good_issue.mdx b/packages/docs/docs/guides/contribute/get-started/write_a_good_issue.mdx index 053f3b1fb..9cc5dc4a7 100644 --- a/packages/docs/docs/guides/contribute/get-started/write_a_good_issue.mdx +++ b/packages/docs/docs/guides/contribute/get-started/write_a_good_issue.mdx @@ -151,8 +151,8 @@ requests we will pursue. Here are the guidelines for each of the different categories of projects: -- [Blockly core](/blockly/guides/contribute/index) -- [Plugins](/blockly/guides/contribute/samples/add_a_plugin#first-party-criteria) +- [Blockly core](/guides/contribute/index) +- [Plugins](/guides/contribute/samples/add_a_plugin#first-party-criteria) - Examples: Show how to use only one or two Blockly features. - Codelabs: Show how to complete a single task or implement a single behaviour. diff --git a/packages/docs/docs/guides/contribute/get-started/write_a_good_pr.mdx b/packages/docs/docs/guides/contribute/get-started/write_a_good_pr.mdx index 16b7e87ac..f1db61269 100644 --- a/packages/docs/docs/guides/contribute/get-started/write_a_good_pr.mdx +++ b/packages/docs/docs/guides/contribute/get-started/write_a_good_pr.mdx @@ -30,14 +30,14 @@ people working on the same thing. A team member will respond to confirm that it's yours. If you have an idea which is not covered by an issue, please [write one -up](/blockly/guides/contribute/get-started/write_a_good_issue) before you begin work. +up](/guides/contribute/get-started/write_a_good_issue) before you begin work. This gives the team a chance to discuss how best to build out the change *before* you start building, which saves you work in the long run. ### Get Set Up If this is your first time contributing to Blockly or blockly-samples, start at -the [development setup](/blockly/guides/contribute/get-started/development_tools) page. +the [development setup](/guides/contribute/get-started/development_tools) page. ### Keep it Small @@ -60,9 +60,9 @@ In addition to eslint, please follow these guides: - [Google JavaScript style guide](https://google.github.io/styleguide/jsguide.html). -- [Commit Message Guide](/blockly/guides/contribute/get-started/commits) -- [API visibility](/blockly/guides/programming/using_blockly_apis) -- [Codelab style guide](/blockly/guides/contribute/core/write_a_codelab#writing-tips) +- [Commit Message Guide](/guides/contribute/get-started/commits) +- [API visibility](/guides/programming/using_blockly_apis) +- [Codelab style guide](/guides/contribute/core/write_a_codelab#writing-tips) ### Test your Change diff --git a/packages/docs/docs/guides/contribute/index.mdx b/packages/docs/docs/guides/contribute/index.mdx index 4cc898b0d..7d1511ee4 100644 --- a/packages/docs/docs/guides/contribute/index.mdx +++ b/packages/docs/docs/guides/contribute/index.mdx @@ -12,23 +12,23 @@ contributions. ## How you can help -- [File bugs](/blockly/guides/contribute/get-started/write_a_good_issue) -- [File feature requests](/blockly/guides/contribute/get-started/write_a_good_issue#feature-request) -- [Fix bugs](/blockly/guides/contribute/get-started/write_a_good_pr) -- [Add tests](/blockly/guides/contribute/core/unit_testing) -- [Write codelabs](/blockly/guides/contribute/core/write_a_codelab) -- [Write plugins](/blockly/guides/contribute/samples/add_a_plugin) +- [File bugs](/guides/contribute/get-started/write_a_good_issue) +- [File feature requests](/guides/contribute/get-started/write_a_good_issue#feature-request) +- [Fix bugs](/guides/contribute/get-started/write_a_good_pr) +- [Add tests](/guides/contribute/core/unit_testing) +- [Write codelabs](/guides/contribute/core/write_a_codelab) +- [Write plugins](/guides/contribute/samples/add_a_plugin) - [Answer questions](https://groups.google.com/g/blockly) ## Where to start - If you're new to open source development, or you want to get more background knowledge, head over to the - [Getting Started contributing](/blockly/guides/contribute/get-started/index) + [Getting Started contributing](/guides/contribute/get-started/index) guides. - If you are ready to jump in, check out the - [Contributing to Core](/blockly/guides/contribute/core/index) or - [Contributing to Samples](/blockly/guides/contribute/samples/index) guides. + [Contributing to Core](/guides/contribute/core/index) or + [Contributing to Samples](/guides/contribute/samples/index) guides. ### Talk to us! diff --git a/packages/docs/docs/guides/contribute/samples/add_a_plugin.mdx b/packages/docs/docs/guides/contribute/samples/add_a_plugin.mdx index aec548a49..a1568095a 100644 --- a/packages/docs/docs/guides/contribute/samples/add_a_plugin.mdx +++ b/packages/docs/docs/guides/contribute/samples/add_a_plugin.mdx @@ -11,7 +11,7 @@ describes is for creating first-party plugins, you can use it as a guideline for creating third-party plugins. For an overview of plugins, -see [Plugins](/blockly/guides/programming/plugin_overview). +see [Plugins](/guides/programming/plugin_overview). For a quick introduction to creating a plugin, see our [How to Build a Plugin talk @@ -62,7 +62,7 @@ A plugin starts as a **suggestion**. You can suggest a plugin by creating a new issue with the [Feature Request](https://github.com/RaspberryPiFoundation/blockly-samples/issues/new?assignees=&labels=type%3A+feature+request%2C+triage&template=feature_request.yaml) template. For more information, read about [how to write a feature -request](/blockly/guides/contribute/get-started/write_a_good_issue#feature-request). +request](/guides/contribute/get-started/write_a_good_issue#feature-request). In addition to the basic feature request information, a plugin suggestion should include: @@ -87,7 +87,7 @@ Next, a plugin goes into the **discussion** phase. This phase includes: - Discussion of API changes in core Blockly. - Breaking large plugins into implementation steps. - Plugin naming, based on our [naming - conventions](/blockly/guides/contribute/samples/naming). + conventions](/guides/contribute/samples/naming). - Confirming all [first party criteria](#first-party-criteria) will be met. This discussion generally happens on the GitHub issue. The smaller the scope of diff --git a/packages/docs/docs/guides/contribute/samples/block_factory.mdx b/packages/docs/docs/guides/contribute/samples/block_factory.mdx index df76f3db2..b0124fad5 100644 --- a/packages/docs/docs/guides/contribute/samples/block_factory.mdx +++ b/packages/docs/docs/guides/contribute/samples/block_factory.mdx @@ -234,7 +234,7 @@ to an input on a block, and watch the output change. Check that the preview of the block looks right, and that the code for each of the output sections is correct. -[blockly-samples-development]: /blockly/guides/contribute/samples/index +[blockly-samples-development]: /guides/contribute/samples/index [source-developer-tools]: https://github.com/RaspberryPiFoundation/blockly-samples/blob/main/examples/developer-tools [source-blocks-index]: https://github.com/RaspberryPiFoundation/blockly-samples/blob/main/examples/developer-tools/src/blocks/index.ts [source-blocks-fields]: https://github.com/RaspberryPiFoundation/blockly-samples/blob/main/examples/developer-tools/src/blocks/fields.ts diff --git a/packages/docs/docs/guides/contribute/samples/index.mdx b/packages/docs/docs/guides/contribute/samples/index.mdx index ebe2296c0..779842b4a 100644 --- a/packages/docs/docs/guides/contribute/samples/index.mdx +++ b/packages/docs/docs/guides/contribute/samples/index.mdx @@ -11,7 +11,7 @@ slug: /guides/contribute/samples/index content related to Blockly that isn't part of the core repository, including plugins and example code. For more details about each of these, see the [Repository -Structure](/blockly/guides/contribute/samples/repository_structure) page. +Structure](/guides/contribute/samples/repository_structure) page. ## Need to Know @@ -27,7 +27,7 @@ order to create a PR. or [TypeScript Style Guide](https://google.github.io/styleguide/tsguide.html) depending on the language used. -- Use [conventional commits](/blockly/guides/contribute/get-started/commits) +- Use [conventional commits](/guides/contribute/get-started/commits) in your commit messages and pull request titles. - Any new code files must be prefixed with the Apache License v2.0: @@ -47,7 +47,7 @@ order to create a PR. running the plugin's test page. You can use this page to see the existing behavior of a plugin, or if you're adding a new plugin you will need to make this a useful test page so that others can see what your plugin does. See - the [playground](/blockly/guides/contribute/get-started/playground) page for + the [playground](/guides/contribute/get-started/playground) page for more information. 1. Make any necessary changes to the plugin's code. 1. If you've left the server running, your changes will load automatically. diff --git a/packages/docs/docs/guides/contribute/samples/naming.mdx b/packages/docs/docs/guides/contribute/samples/naming.mdx index 97c0a2669..aa64e5429 100644 --- a/packages/docs/docs/guides/contribute/samples/naming.mdx +++ b/packages/docs/docs/guides/contribute/samples/naming.mdx @@ -25,7 +25,7 @@ to find your plugin on npm. ### Field A field plugin publishes a single [custom -field](/blockly/guides/create-custom-blocks/fields/customizing-fields/overview). +field](/guides/create-custom-blocks/fields/customizing-fields/overview). Loading a field plugin registers a new field type that can be used in all Blockly workspaces on the page. @@ -39,7 +39,7 @@ Blockly workspaces on the page. ### Theme A theme plugin publishes a single Blockly -[theme](/blockly/guides/configure/web/appearance/themes). +[theme](/guides/configure/web/appearance/themes). Loading a theme plugin defines a new theme that can then be used in all Blockly workspaces on the page. @@ -53,7 +53,7 @@ workspaces on the page. ### Block A block plugin publishes one or more [block -definitions](/blockly/guides/create-custom-blocks/overview). +definitions](/guides/create-custom-blocks/overview). Loading a block plugin defines those blocks for all Blockly workspaces on the page. @@ -67,7 +67,7 @@ page. ### Block Extension A block extension plugin publishes one or more [block -extensions](/blockly/guides/create-custom-blocks/define/extensions), which can +extensions](/guides/create-custom-blocks/define/extensions), which can be used to programmatically share behaviour between blocks. Loading a block extension plugin registers the extensions for use on all Blockly diff --git a/packages/docs/docs/guides/create-custom-blocks/blockly-developer-tools.md b/packages/docs/docs/guides/create-custom-blocks/blockly-developer-tools.md index 683044351..16ff3357d 100644 --- a/packages/docs/docs/guides/create-custom-blocks/blockly-developer-tools.md +++ b/packages/docs/docs/guides/create-custom-blocks/blockly-developer-tools.md @@ -97,7 +97,7 @@ generators. The Code Headers section shows the code you need to load the core Blockly library and the language generator you've chosen. There may be other configuration here too; for example, some fields you might include in a block -are from Blockly [plugins](/blockly/guides/programming/plugin_overview). These +are from Blockly [plugins](/guides/programming/plugin_overview). These plugins will have their own import statements and possibly other code you'll have to run to initialize the field. This code should be included before any of the following code sections. @@ -170,15 +170,15 @@ following these steps: bug](https://github.com/RaspberryPiFoundation/blockly-samples/issues/new/choose) against blockly-samples and including the file that wouldn't parse. -[legacy-block-factory]: /blockly/guides/create-custom-blocks/legacy-blockly-developer-tools -[add-custom-blocks]: /blockly/guides/create-custom-blocks/overview -[json-and-js]: /blockly/guides/create-custom-blocks/define/json-and-js -[block-definitions]: /blockly/guides/create-custom-blocks/define/block-definitions -[block-code-generator]: /blockly/guides/create-custom-blocks/code-generation/overview#block-code-generators -[inputs]: /blockly/guides/get-started/workspace-anatomy#inputs -[fields]: /blockly/guides/get-started/workspace-anatomy#fields -[toolbox-preset]: /blockly/guides/configure/web/toolboxes/preset -[mutators]: /blockly/guides/create-custom-blocks/mutators -[loading-blockly]: /blockly/guides/get-started/get-the-code#get-the-code-1 -[code-generation]: /blockly/guides/create-custom-blocks/code-generation/overview#language-code-generators -[sample-app]: /blockly/guides/get-started/get-the-code#create-package-script +[legacy-block-factory]: /guides/create-custom-blocks/legacy-blockly-developer-tools +[add-custom-blocks]: /guides/create-custom-blocks/overview +[json-and-js]: /guides/create-custom-blocks/define/json-and-js +[block-definitions]: /guides/create-custom-blocks/define/block-definitions +[block-code-generator]: /guides/create-custom-blocks/code-generation/overview#block-code-generators +[inputs]: /guides/get-started/workspace-anatomy#inputs +[fields]: /guides/get-started/workspace-anatomy#fields +[toolbox-preset]: /guides/configure/web/toolboxes/preset +[mutators]: /guides/create-custom-blocks/mutators +[loading-blockly]: /guides/get-started/get-the-code#get-the-code-1 +[code-generation]: /guides/create-custom-blocks/code-generation/overview#language-code-generators +[sample-app]: /guides/get-started/get-the-code#create-package-script diff --git a/packages/docs/docs/guides/create-custom-blocks/code-generation/block-code.mdx b/packages/docs/docs/guides/create-custom-blocks/code-generation/block-code.mdx index fa925cef2..08a521ae6 100644 --- a/packages/docs/docs/guides/create-custom-blocks/code-generation/block-code.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/code-generation/block-code.mdx @@ -131,7 +131,7 @@ field's value, call `getFieldValue`. What is returned is different from field to field. For example, text fields return the exact text entered by the user, but dropdown fields return a language-neutral string associated with the item the user selected. For more information, see the [documentation for built-in -fields](/blockly/guides/create-custom-blocks/fields/built-in-fields/overview). +fields](/guides/create-custom-blocks/fields/built-in-fields/overview). Depending on the field, you may need to transform the returned value before using it in code. @@ -168,7 +168,7 @@ javascriptGenerator.forBlock['custom_if'] = function (block, generator) { For more information, see [Transform field -values](/blockly/guides/create-custom-blocks/code-generation/fields). +values](/guides/create-custom-blocks/code-generation/fields). ## Get code from inner blocks @@ -238,7 +238,7 @@ the inner block's code as needed: You don't actually need to know whether `valueToCode` added parentheses. All you need to do is pass the precedence to `valueToCode` and add the returned code to your code string. For more information, see [valueToCode -precedence](/blockly/guides/create-custom-blocks/code-generation/operator-precedence#valuetocode-precedence). +precedence](/guides/create-custom-blocks/code-generation/operator-precedence#valuetocode-precedence). ### Inner statement blocks @@ -276,7 +276,7 @@ type: precedence of the weakest operator in your code. `valueToCode` uses this to decide if your code needs to be wrapped in parentheses when your block is used as an inner block. For more information, see [Return - precedence](/blockly/guides/create-custom-blocks/code-generation/operator-precedence#return-precedence). + precedence](/guides/create-custom-blocks/code-generation/operator-precedence#return-precedence). * **Statement blocks:** Return the code string. @@ -307,7 +307,7 @@ javascriptGenerator.forBlock['custom_if'] = function (block, generator) { If you use the code of an inner value block multiple times in your code string, you should [cache the code from that -block](/blockly/guides/create-custom-blocks/code-generation/caching-arguments) +block](/guides/create-custom-blocks/code-generation/caching-arguments) to avoid subtle bugs and unwanted side-effects. ## Complete code generators diff --git a/packages/docs/docs/guides/create-custom-blocks/code-generation/caching-arguments.mdx b/packages/docs/docs/guides/create-custom-blocks/code-generation/caching-arguments.mdx index 8181272f1..e42fb8caa 100644 --- a/packages/docs/docs/guides/create-custom-blocks/code-generation/caching-arguments.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/code-generation/caching-arguments.mdx @@ -182,4 +182,4 @@ generator. It does not care about operators inside utility functions. So in the previous example the `valueToCode` call was changed to `Order.NONE` and the return tuple was changed to `Order.FUNCTION_CALL`. -[parentheses]: /blockly/guides/create-custom-blocks/code-generation/operator-precedence +[parentheses]: /guides/create-custom-blocks/code-generation/operator-precedence diff --git a/packages/docs/docs/guides/create-custom-blocks/code-generation/operator-precedence.mdx b/packages/docs/docs/guides/create-custom-blocks/code-generation/operator-precedence.mdx index fa6f395a9..1a6e904aa 100644 --- a/packages/docs/docs/guides/create-custom-blocks/code-generation/operator-precedence.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/code-generation/operator-precedence.mdx @@ -12,7 +12,7 @@ Blocks imply parentheses. For example, when you see the following blocks, you assume it means `-(5 + 2)` not `-5 + 2` because the `5` and the `2` are part of one block, and the `-` is part of another block. -blocks representing -(5 + 2) +blocks representing -(5 + 2) But if you put parentheses around every block, it makes the code much less readable. Compare `(((5) * (2)) + (3))` with `5 * 2 + 3`. Both of these @@ -47,7 +47,7 @@ For example, in the following blocks there is a unary negation operator and an addition operator. The unary negation has a stronger precedence than the addition operator. -negate-and-addition +negate-and-addition So if you don't add parentheses you get `-5 + 2`, and the `-` is evaluated before the `+`, which is doesn't match the blocks. @@ -61,7 +61,7 @@ tuple specifies the precedence of the inner operator. Here is an example for a block that includes two operators: -A block with a unary negation operator, and an addition operator, and a child block. +A block with a unary negation operator, and an addition operator, and a child block. ```js import {javascriptGenerator, Order} from 'blockly/javascript'; @@ -85,7 +85,7 @@ For example, in the following blocks both the unary negation operator and the addition operator are acting on the code of the inner block. The unary negation is stronger, so that is the precedence you should pass to `valueToCode`. -A block with a unary negation operator, and an addition operator, and a child block. +A block with a unary negation operator, and an addition operator, and a child block. ```js // The - is the strongest operator acting on the inner code. @@ -103,7 +103,7 @@ For example, the following block contains both a unary negation operator and an addition operator. The addition is weaker, so that is the precedence you should return from the block-code generator. -A block with a unary negation operator, and an addition operator, and no child block +A block with a unary negation operator, and an addition operator, and no child block ```js const code = `-${innerCode} + 2`; @@ -149,9 +149,9 @@ precedences, `Order.ATOMIC` and `Order.NONE`. * There are no operators acting on an inner block, so you pass it to `valueToCode`. -[negate-and-addition]: /blockly/images/code-generation/parentheses/negation-and-addition.png -[negate-plus-two-with-child]: /blockly/images/code-generation/parentheses/negate-plus-two-with-child.png -[negate-plus-two]: /blockly/images/code-generation/parentheses/negate-plus-two.png +[negate-and-addition]: /images/code-generation/parentheses/negation-and-addition.png +[negate-plus-two-with-child]: /images/code-generation/parentheses/negate-plus-two-with-child.png +[negate-plus-two]: /images/code-generation/parentheses/negate-plus-two.png [dart-order]: https://github.com/RaspberryPiFoundation/blockly/blob/dcd2d0e539f2b7aa34b58969d5dc812e7848800c/generators/dart/dart_generator.ts#L27 [javascript-order]: https://github.com/RaspberryPiFoundation/blockly/blob/dcd2d0e539f2b7aa34b58969d5dc812e7848800c/generators/javascript/javascript_generator.ts#L27 [lua-order]: https://github.com/RaspberryPiFoundation/blockly/blob/dcd2d0e539f2b7aa34b58969d5dc812e7848800c/generators/lua/lua_generator.ts#L28 diff --git a/packages/docs/docs/guides/create-custom-blocks/code-generation/overview.mdx b/packages/docs/docs/guides/create-custom-blocks/code-generation/overview.mdx index f34b73298..36077ee45 100644 --- a/packages/docs/docs/guides/create-custom-blocks/code-generation/overview.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/code-generation/overview.mdx @@ -64,7 +64,7 @@ pythonGenerator.forBlock['my_custom_block'] = function(block, generator) { /* .. Block-code generators are called by language code generators. For more information, see [Block-code -generators](/blockly/guides/create-custom-blocks/code-generation/block-code). +generators](/guides/create-custom-blocks/code-generation/block-code). ## Generate and run code @@ -76,7 +76,7 @@ Deciding how to execute it is very application-specific, and outside the scope of Blockly. For more information, see [Generate and run -code](/blockly/guides/app-integration/run-code). +code](/guides/app-integration/run-code). -[custom-code-generator]: /blockly/codelabs/custom-generator/codelab-overview/index.html +[custom-code-generator]: /codelabs/custom-generator/codelab-overview/index.html [js-code-generator]: https://github.com/RaspberryPiFoundation/blockly/blob/main/generators/javascript/javascript_generator.ts diff --git a/packages/docs/docs/guides/create-custom-blocks/define/block-anatomy.mdx b/packages/docs/docs/guides/create-custom-blocks/define/block-anatomy.mdx index e731abb86..cdc98ecb8 100644 --- a/packages/docs/docs/guides/create-custom-blocks/define/block-anatomy.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/define/block-anatomy.mdx @@ -26,10 +26,10 @@ There are four types of connections: | Connection type | Image | |---------------------|--------------------------------------------------| -| Output connection | an output connection | -| Input connection | an input connection | -| Previous connection | a previous connection | -| Next connection | a next connection | +| Output connection | an output connection | +| Input connection | an input connection | +| Previous connection | a previous connection | +| Next connection | a next connection | [output]: /images/connections/output-connection.png [input]: /images/connections/input-connection.png @@ -39,10 +39,10 @@ There are four types of connections: Output connections and input connections can connect together, and next connections and previous connections can connect together. You can further restrict connections with [connection -checks](/blockly/guides/create-custom-blocks/inputs/connection-checks). +checks](/guides/create-custom-blocks/inputs/connection-checks). You can [customize the shapes of -connections](/blockly/guides/create-custom-blocks/renderers/create-custom-renderers/connection-shapes) +connections](/guides/create-custom-blocks/renderers/create-custom-renderers/connection-shapes) using a custom renderer. ### Top-level connections @@ -54,7 +54,7 @@ connector on the leading edge of a block. An output connection passes a block's value (expression) to another block. A block with an output connection is called a **value block**. -A math_number block. +A math_number block. A block may have a previous connection on its top (represented as a notch) and a next connection on its bottom (represented as a tab). These allow blocks to be @@ -62,10 +62,10 @@ stacked vertically, representing a sequence of statements. A block without an output connection is called a **statement block** and usually has both previous and next connections. -A variables_set block. +A variables_set block. For more information, see [Top-level -connections](/blockly/guides/create-custom-blocks/define/top-level-connections). +connections](/guides/create-custom-blocks/define/top-level-connections). ## Fields @@ -75,15 +75,15 @@ string labels, dropdowns, checkboxes, images, and inputs for such as strings and numbers. For example, this loop block uses label fields, a dropdown field, and number fields. -A block with multiple fields. +A block with multiple fields. Blockly provides a number of [built-in -fields](/blockly/guides/create-custom-blocks/fields/built-in-fields/overview), +fields](/guides/create-custom-blocks/fields/built-in-fields/overview), including text inputs, color pickers, and images. You can also [create your own -fields](/blockly/guides/create-custom-blocks/fields/customizing-fields/overview). +fields](/guides/create-custom-blocks/fields/customizing-fields/overview). For more information, see -[Fields](/blockly/guides/create-custom-blocks/fields/overview). +[Fields](/guides/create-custom-blocks/fields/overview). ## Inputs @@ -100,27 +100,27 @@ has been entered. There are four different types of inputs, all of which can contain fields (including labels) and two of which contain a single connection. You can also [create custom -inputs](/blockly/guides/create-custom-blocks/inputs/creating-custom-inputs), +inputs](/guides/create-custom-blocks/inputs/creating-custom-inputs), which support [custom -rendering](/blockly/guides/create-custom-blocks/renderers/overview). +rendering](/guides/create-custom-blocks/renderers/overview). | Input type | Connection type | Image | |------------------|------------------|-------------------------------------------------| -| Dummy input | None | dummy input | -| End-of-row input | None | end-of-row input | -| Value input | Input connection | value input | -| Statement input | Next connection | statement input | +| Dummy input | None | dummy input | +| End-of-row input | None | end-of-row input | +| Value input | Input connection | value input | +| Statement input | Next connection | statement input | -[dummy-img]: /blockly/images/connections/dummy-input.png -[value-img]: /blockly/images/connections/input-connection.png -[statement-img]: /blockly/images/connections/statement-input.png +[dummy-img]: /images/connections/dummy-input.png +[value-img]: /images/connections/input-connection.png +[statement-img]: /images/connections/statement-input.png We will introduce these inputs through a series of examples. For information about defining the inputs, connections, and fields that make up a block, see [Block structure in -JSON](/blockly/guides/create-custom-blocks/define/structure-json) and [Block +JSON](/guides/create-custom-blocks/define/structure-json) and [Block structure in -JavaScript](/blockly/guides/create-custom-blocks/define/structure-js). +JavaScript](/guides/create-custom-blocks/define/structure-js). ### Dummy inputs @@ -128,17 +128,17 @@ A **dummy input** is just a container for fields -- it does not have a connection. For example, the following number block has a single dummy input that contains a single number field. -A number block with a dummy input and a number field. +A number block with a dummy input and a number field. As a more complex example, consider a block that adds two numbers together. This could be built from a single dummy input with three fields (number, label, number): -An addition block built from a dummy input with three fields. +An addition block built from a dummy input with three fields. or three dummy inputs, each with a single field: -An addition block built from three dummy inputs, each wieht a single field. +An addition block built from three dummy inputs, each wieht a single field. ### End-of-row inputs @@ -151,7 +151,7 @@ connection. For example, here is the addition block built from an end-of-row input with two fields and a dummy input with one field. The end-of-row input forces the dummy input to be rendered in a new row. -An addition block split into two rows by an end-of-row input. +An addition block split into two rows by an end-of-row input. ### Value inputs @@ -166,7 +166,7 @@ The following block replaces the number fields in the addition block with input connections. It is built from two value inputs -- the first does not contain any fields and the second contains a label field. Both end in input connections. -An addition block with two value inputs. +An addition block with two value inputs. ### Statement inputs @@ -176,13 +176,13 @@ stack of statement blocks inside your block. For example, consider the following repeat block. The second row of this block consists of a statement input with a single label field and a next connection. -A repeat block with a statement input to nest repeated statements. +A repeat block with a statement input to nest repeated statements. Statement inputs are always rendered in their own row. You can see this in the following if-then-else block, which has a value input in its first row and statement inputs in the next two rows. -An if-then-else block with separate statement inputs for then and else statements. +An if-then-else block with separate statement inputs for then and else statements. ### Inline versus external inputs @@ -196,7 +196,7 @@ inputs.](/images/set-inputs-inline.png) When you create a custom block, you can specify which to use or let Blockly decide for you. For more information, see [Inline vs. external -inputs](/blockly/guides/create-custom-blocks/define/inline-vs-external). +inputs](/guides/create-custom-blocks/define/inline-vs-external). ### Go play! @@ -211,10 +211,10 @@ In addition to inputs, connections, and fields, blocks can have one or more block-level comments, or displaying the mutator UI. For example, here is a block with a comment icon and its associated editor. -A block with a comment icon and an open comment editor. +A block with a comment icon and an open comment editor. For more information, see -[Icons](/blockly/guides/create-custom-blocks/icons/overview). +[Icons](/guides/create-custom-blocks/icons/overview). ## Blocks and JavaScript objects diff --git a/packages/docs/docs/guides/create-custom-blocks/define/block-definitions.mdx b/packages/docs/docs/guides/create-custom-blocks/define/block-definitions.mdx index cf079781c..71ffd1826 100644 --- a/packages/docs/docs/guides/create-custom-blocks/define/block-definitions.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/define/block-definitions.mdx @@ -70,15 +70,15 @@ Because the definition functions are mixed in to the block object: * The `this` keyword in definition functions refers to the block object. That is, it can be used to access the public methods and properties in the - [`Block`](/blockly/reference/js/blockly.block_class) (or - [`BlockSvg`](/blockly/reference/js/blockly.blocksvg_class)) class. + [`Block`](/reference/js/blockly.block_class) (or + [`BlockSvg`](/reference/js/blockly.blocksvg_class)) class. Blockly defines a small number of functions you can use to customize blocks. The most common of these is `init`, which Blockly calls to initialize a block and which is used to define the block's look and feel. For a complete list, see the function-valued properties in the -[`Block`](/blockly/reference/js/blockly.block_class#properties) and -[`BlockSvg`](/blockly/reference/js/blockly.blocksvg_class#properties) classes. +[`Block`](/reference/js/blockly.block_class#properties) and +[`BlockSvg`](/reference/js/blockly.blocksvg_class#properties) classes. These properties effectively form an interface for block definitions to implement; all of them are optional. @@ -94,9 +94,9 @@ There are several different ways to create block definitions: * Use the Blockly Developer Tools to define the look and feel of your block. Copy the generated JSON or JavaScript to your code and add custom code as needed. For more information, see [Blockly Developer - Tools](/blockly/guides/create-custom-blocks/blockly-developer-tools). + Tools](/guides/create-custom-blocks/blockly-developer-tools). * Find a similar block, copy its definition, and modify it as needed. For more information, see [Modify existing - definitions](/blockly/guides/create-custom-blocks/define/modify-definitions). + definitions](/guides/create-custom-blocks/define/modify-definitions). * Write a block definition by hand. For more information, see [JSON and - JavaScript](/blockly/guides/create-custom-blocks/define/json-and-js). + JavaScript](/guides/create-custom-blocks/define/json-and-js). diff --git a/packages/docs/docs/guides/create-custom-blocks/define/destroy.mdx b/packages/docs/docs/guides/create-custom-blocks/define/destroy.mdx index 662e27825..69cf10c1d 100644 --- a/packages/docs/docs/guides/create-custom-blocks/define/destroy.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/define/destroy.mdx @@ -29,7 +29,7 @@ resources associated with the block that are no longer needed. ``` In JSON, define a `destroy` hook with a - [mixin](/blockly/guides/create-custom-blocks/define/extensions#mixins). + [mixin](/guides/create-custom-blocks/define/extensions#mixins). ```js diff --git a/packages/docs/docs/guides/create-custom-blocks/define/extensions.mdx b/packages/docs/docs/guides/create-custom-blocks/define/extensions.mdx index df733e4ce..ce37adba8 100644 --- a/packages/docs/docs/guides/create-custom-blocks/define/extensions.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/define/extensions.mdx @@ -40,7 +40,7 @@ Blockly.Extensions.register( Extensions have to be "registered" so that they can be associated with a string key. Then you can assign this string key to the `extensions` property of your block type's [JSON -definition](/blockly/guides/create-custom-blocks/define/json-and-js) to apply +definition](/guides/create-custom-blocks/define/json-and-js) to apply the extension to the block. ```js diff --git a/packages/docs/docs/guides/create-custom-blocks/define/inline-vs-external.mdx b/packages/docs/docs/guides/create-custom-blocks/define/inline-vs-external.mdx index c1ca14ac8..72d580aad 100644 --- a/packages/docs/docs/guides/create-custom-blocks/define/inline-vs-external.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/define/inline-vs-external.mdx @@ -71,7 +71,7 @@ best. Assuming Blockly makes the right choice, leaving this field undefined is preferable since different language translations can automatically have different modes. See the example of `"set %1 to %2"` (external inputs) and `"put %2 in %1"` (inline inputs) in [Interpolation token -order](/blockly/guides/create-custom-blocks/define/structure-json#interpolation-token-order). +order](/guides/create-custom-blocks/define/structure-json#interpolation-token-order). Use inline inputs when a block is likely to have small inputs such as numbers. The user can toggle this option through the context menu. diff --git a/packages/docs/docs/guides/create-custom-blocks/define/json-and-js.mdx b/packages/docs/docs/guides/create-custom-blocks/define/json-and-js.mdx index 07559569f..93e802b30 100644 --- a/packages/docs/docs/guides/create-custom-blocks/define/json-and-js.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/define/json-and-js.mdx @@ -12,11 +12,11 @@ import TabItem from '@theme/TabItem'; Blockly has two ways of defining blocks: JSON objects, which use key-value pairs, and JavaScript functions, which call Blockly's API. The JSON format is preferred because it [simplifies -localization](/blockly/guides/configure/web/translations#json-message-interpolation) +localization](/guides/configure/web/translations#json-message-interpolation) and is easier to read and write. However, it cannot be used to directly define advanced features such as mutators or validators. These must be written in JavaScript, usually as -[extensions](/blockly/guides/create-custom-blocks/define/extensions). +[extensions](/guides/create-custom-blocks/define/extensions). :::info The "JSON" objects are, in fact, plain JavaScript objects. They are @@ -60,7 +60,7 @@ can be defined in JSON or JavaScript as follows. ``` `defineBlocksWithJsonArray` converts each JSON object into a -[block definition object](/blockly/guides/create-custom-blocks/define/block-definitions) +[block definition object](/guides/create-custom-blocks/define/block-definitions) with an `init` function. It stores these objects in `Blockly.Blocks`. @@ -84,7 +84,7 @@ Blockly.Blocks['string_length'] = { ``` Because -[block definition objects](/blockly/guides/create-custom-blocks/define/block-definitions) +[block definition objects](/guides/create-custom-blocks/define/block-definitions) are mixed in to block objects, the keyword `this` refers to the actual block being created. @@ -160,7 +160,7 @@ This section summarizes the objects and functions used to define custom blocks. ### Blockly.Blocks -[`Blockly.Blocks`](/blockly/reference/js/blockly.blocks_variable) is an object +[`Blockly.Blocks`](/reference/js/blockly.blocks_variable) is an object that stores block definitions. Its keys are block type names and its values are block definition objects. Use `Blockly.Blocks` when defining blocks with JavaScript: @@ -188,7 +188,7 @@ Blockly.Blocks['my_block'].setColour(150); ### defineBlocksWithJsonArray -[`defineBlocksWithJsonArray`](/blockly/reference/js/blockly.common_namespace.defineblockswithjsonarray_1_function) +[`defineBlocksWithJsonArray`](/reference/js/blockly.common_namespace.defineblockswithjsonarray_1_function) accepts an array of JSON objects, creates block definitions from them, and adds them to `Blockly.Blocks`. @@ -211,7 +211,7 @@ Blockly.common.defineBlocksWithJsonArray([ ### createBlockDefinitionsFromJsonArray and defineBlocks -[`createBlockDefinitionsFromJsonArray`](/blockly/reference/js/blockly.common_namespace.createblockdefinitionsfromjsonarray_1_function) +[`createBlockDefinitionsFromJsonArray`](/reference/js/blockly.common_namespace.createblockdefinitionsfromjsonarray_1_function) accepts an array of JSON objects and returns an object that maps block type names to block definitions. This is generally used with `defineBlocks`, which adds the block definitions to `Blockly.Blocks`. @@ -238,7 +238,7 @@ Blockly.common.defineBlocks(myBlockDefinitions); ### Block.jsonInit -[`jsonInit`](/blockly/reference/js/blockly.block_class.jsoninit_1_method) +[`jsonInit`](/reference/js/blockly.block_class.jsoninit_1_method) accepts a JSON object and calls the corresponding methods on `Block`. For example, a JSON object with the key-value pair `colour: 150` results in a call to `this.setColour(150)`. Use `jsonInit` in an `init` function to load a JSON diff --git a/packages/docs/docs/guides/create-custom-blocks/define/modify-definitions.mdx b/packages/docs/docs/guides/create-custom-blocks/define/modify-definitions.mdx index a89677733..de84d0181 100644 --- a/packages/docs/docs/guides/create-custom-blocks/define/modify-definitions.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/define/modify-definitions.mdx @@ -32,8 +32,8 @@ monkeypatching and forking the code. Both are strongly discouraged, as you run the risk of breaking code that depends on the monkeypatched or forked code. Both techniques also make it difficult to integrate updates and bug fixes. For more information, see [What about -monkeypatching?](/blockly/guides/programming/using_blockly_apis#what-about-monkeypatching) -and [Fork Blockly](/blockly/guides/programming/forking_blockly). +monkeypatching?](/guides/programming/using_blockly_apis#what-about-monkeypatching) +and [Fork Blockly](/guides/programming/forking_blockly). ### Subclass an existing definition @@ -62,7 +62,7 @@ magically replace just one line. There are several problems with this: function to copy -- it's generated at run time. * It requires you to define your block using JavaScript, which may [cause problems with - localization](/blockly/guides/configure/web/translations#json-message-interpolation). + localization](/guides/configure/web/translations#json-message-interpolation). ### Overwrite the results of init @@ -82,7 +82,7 @@ Blockly.Blocks['logic_null'].init = function() { Unfortunately, this is less useful that it seems. For example: * Broadening [connection - checks](/blockly/guides/create-custom-blocks/inputs/connection-checks) or + checks](/guides/create-custom-blocks/inputs/connection-checks) or applying a less-restrictive field validator may invalidate assumptions made by block-code generators and event handlers. @@ -90,7 +90,7 @@ Unfortunately, this is less useful that it seems. For example: field validators and may break event handlers. It may also be extremely difficult to do for localized blocks because different locales may result in blocks with [different types and orders of inputs and - fields](/blockly/guides/configure/web/translations#json-message-interpolation). + fields](/guides/configure/web/translations#json-message-interpolation). ### Overwrite a key-value pair in a JSON definition @@ -168,7 +168,7 @@ definition](#overwrite-a-key-value-pair-in-a-json-definition). ### Reuse functions Blocks may define a number of [standard -functions](/blockly/guides/create-custom-blocks/define/block-definitions#how-block-definitions-work), +functions](/guides/create-custom-blocks/define/block-definitions#how-block-definitions-work), such as block-level event handlers, custom tooltips, field validators, and the functions used by mutators, as well as functions that provide custom behavior, such as a function that sets field values from external data, like the current @@ -194,6 +194,6 @@ easier than writing and maintaining multiple blocks. If you have a set of blocks that represent different variations of the same programming structure, you may be able to create a single block that uses a -[mutator](/blockly/guides/create-custom-blocks/mutators). For example, the +[mutator](/guides/create-custom-blocks/mutators). For example, the built-in `controls_if` block can represent multiple variations of `if-then-else` statements. diff --git a/packages/docs/docs/guides/create-custom-blocks/define/structure-js.mdx b/packages/docs/docs/guides/create-custom-blocks/define/structure-js.mdx index 4146f6833..ca554b18b 100644 --- a/packages/docs/docs/guides/create-custom-blocks/define/structure-js.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/define/structure-js.mdx @@ -13,16 +13,16 @@ import TabItem from '@theme/TabItem'; In this document, we'll discuss how to use JavaScript to define the inputs and fields (including labels) in your block. If you're not familiar with these terms, see [Anatomy of a -block](/blockly/guides/create-custom-blocks/define/block-anatomy) before +block](/guides/create-custom-blocks/define/block-anatomy) before proceeding. You can also define your inputs, fields, and connections [in -JSON](/blockly/guides/create-custom-blocks/define/structure-json). +JSON](/guides/create-custom-blocks/define/structure-json). ## Append inputs The JavaScript API includes an `append` method for each [input -type](/blockly/guides/create-custom-blocks/define/block-anatomy#inputs): +type](/guides/create-custom-blocks/define/block-anatomy#inputs): @@ -45,7 +45,7 @@ type](/blockly/guides/create-custom-blocks/define/block-anatomy#inputs): ``` -A block with four rows. The first row has the labels "for each" and "item" and a variable dropdown with "x" chosen. The second row has the label "in list" and a value input. The third row has the label "do" and a statement input. And the last row has the label "end". +A block with four rows. The first row has the labels "for each" and "item" and a variable dropdown with "x" chosen. The second row has the label "in list" and a value input. The third row has the label "do" and a statement input. And the last row has the label "end". Each `appendInput` method can take an identifier string, which is used by code generators to retrieve code for the block connected to the input. Code @@ -75,7 +75,7 @@ are three built-in methods used for configuring inputs. Once an input has been created and appended to a block with `appendInput`, one may optionally append any number of -[fields](/blockly/guides/create-custom-blocks/define/block-anatomy#fields) to +[fields](/guides/create-custom-blocks/define/block-anatomy#fields) to the input. These fields are often used as labels to describe what each input is for. @@ -135,7 +135,7 @@ class name so that the label may be styled using a CSS rule. The `setCheck` method is used for type-checking connections. If given an argument of null, the default, then this input may be connected to any block. See [Connection -checks](/blockly/guides/create-custom-blocks/inputs/connection-checks) for +checks](/guides/create-custom-blocks/inputs/connection-checks) for details. ## Align fields @@ -161,4 +161,4 @@ When a block is rendered in right-to-left mode (e.g. Arabic and Hebrew), left and right are reversed. Thus `Blockly.inputs.Align.RIGHT` would align fields to the left. -[custom-inputs]: /blockly/guides/create-custom-blocks/inputs/creating-custom-inputs +[custom-inputs]: /guides/create-custom-blocks/inputs/creating-custom-inputs diff --git a/packages/docs/docs/guides/create-custom-blocks/define/structure-json.mdx b/packages/docs/docs/guides/create-custom-blocks/define/structure-json.mdx index c7c8ef9d2..703ef3799 100644 --- a/packages/docs/docs/guides/create-custom-blocks/define/structure-json.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/define/structure-json.mdx @@ -13,11 +13,11 @@ import Image from '@site/src/components/Image'; In this document, we'll discuss how to use JSON to define the inputs, fields (including labels), and connections in your block. If you're not familiar with these terms, see [Anatomy of a -block](/blockly/guides/create-custom-blocks/define/block-anatomy) before +block](/guides/create-custom-blocks/define/block-anatomy) before proceeding. You can also define your inputs, fields, and connections [in -JavaScript](/blockly/guides/create-custom-blocks/define/structure-js). +JavaScript](/guides/create-custom-blocks/define/structure-js). ## Overview @@ -57,10 +57,10 @@ is defined by the following JSON: The first interpolation token (`%1`) represents a [variable -field](/blockly/guides/create-custom-blocks/fields/built-in-fields/variable) +field](/guides/create-custom-blocks/fields/built-in-fields/variable) (`type: "field_variable"`). It is described by the first object in the `args0` array. The second token (`%2`) represents the input connection at the end of a -[value input](/blockly/guides/create-custom-blocks/define/block-anatomy#value-inputs) +[value input](/guides/create-custom-blocks/define/block-anatomy#value-inputs) (`type: "input_value"`). It is described by the second object in the `args0` array. @@ -91,7 +91,7 @@ are created from them. This creates a single value input with three fields: a label (`"set"`), a variable field, and another label (`"to"`). -Map the message to a value input with three fields. +Map the message to a value input with three fields. ### Example 2 @@ -111,7 +111,7 @@ variable field, and another label (`"to"`). This creates two value inputs. The first has no fields and the second has one field (`"+"`). -Map the message to two value inputs. +Map the message to two value inputs. ### Example 3 @@ -132,12 +132,12 @@ field (`"+"`). This creates: * A value input with no fields, -* An [end-of-row input](/blockly/guides/create-custom-blocks/define/block-anatomy#end-of-row-inputs) +* An [end-of-row input](/guides/create-custom-blocks/define/block-anatomy#end-of-row-inputs) with a label field (`"+"`), which causes the following value input to be rendered on a new row, and * A value input with no fields. -Map the message to two value inputs and an end-of-row input. +Map the message to two value inputs and an end-of-row input. ## Dummy input at end of message @@ -159,7 +159,7 @@ for you. For example, instead of defining a `lists_isEmpty` block like this: -Map the message to a value input and an automatically created dummy input. +Map the message to a value input and an automatically created dummy input. you can let Blockly add the dummy input and define it like this: @@ -176,7 +176,7 @@ you can let Blockly add the dummy input and define it like this: -Map the message to a value input and an automatically created dummy input. +Map the message to a value input and an automatically created dummy input. The automatic addition of a tailing dummy input allows translators to change `message` without needing to modify the arguments that describe the @@ -241,7 +241,7 @@ is to use more than one `message` and `args` properties: Map the message to a value input and an automatically created dummy input and the message to a statement -input. +input." src="/images/structure-json/controls-repeat-ext.png" srcDark="/images/structure-json/controls-repeat-ext-dark.png"/> Any number of `message`, `args`, and `implicitAlign` properties may be defined in the JSON format, starting with 0 and incrementing sequentially. Note that the @@ -273,7 +273,7 @@ inputs. The ability to change the order of the interpolation tokens in a message makes localization easier. For more information, see [JSON message -interpolation](/blockly/guides/configure/web/translations#json-message-interpolation). +interpolation](/guides/configure/web/translations#json-message-interpolation). ## Text handling @@ -298,7 +298,7 @@ string with an end-of-row input. -Map the newline character to an end-of-row input. +Map the newline character to an end-of-row input. ## Arguments arrays @@ -313,17 +313,17 @@ Every object in the arguments array has a `type` string. The rest of the parameters vary depending on the type: - * [**Fields**](/blockly/guides/create-custom-blocks/fields/overview): - * [`field_input`](/blockly/guides/create-custom-blocks/fields/built-in-fields/text-input) - * [`field_dropdown`](/blockly/guides/create-custom-blocks/fields/built-in-fields/dropdown) - * [`field_checkbox`](/blockly/guides/create-custom-blocks/fields/built-in-fields/checkbox) + * [**Fields**](/guides/create-custom-blocks/fields/overview): + * [`field_input`](/guides/create-custom-blocks/fields/built-in-fields/text-input) + * [`field_dropdown`](/guides/create-custom-blocks/fields/built-in-fields/dropdown) + * [`field_checkbox`](/guides/create-custom-blocks/fields/built-in-fields/checkbox) * [`field_colour`](https://www.npmjs.com/package/@blockly/field-colour) - * [`field_number`](/blockly/guides/create-custom-blocks/fields/built-in-fields/number) + * [`field_number`](/guides/create-custom-blocks/fields/built-in-fields/number) * [`field_angle`](https://www.npmjs.com/package/@blockly/field-angle) - * [`field_variable`](/blockly/guides/create-custom-blocks/fields/built-in-fields/variable) - * [`field_label`](/blockly/guides/create-custom-blocks/fields/built-in-fields/label) - * [`field_image`](/blockly/guides/create-custom-blocks/fields/built-in-fields/image). - * [**Inputs**](/blockly/guides/create-custom-blocks/define/block-anatomy#inputs): + * [`field_variable`](/guides/create-custom-blocks/fields/built-in-fields/variable) + * [`field_label`](/guides/create-custom-blocks/fields/built-in-fields/label) + * [`field_image`](/guides/create-custom-blocks/fields/built-in-fields/image). + * [**Inputs**](/guides/create-custom-blocks/define/block-anatomy#inputs): * `input_value` * `input_statement` * `input_dummy` @@ -367,5 +367,5 @@ An `alt` object may have its own `alt` object, thus allowing for chaining. Ultimately, if Blockly cannot create an object in the `args0` array (after attempting any `alt` objects) then that object is simply skipped. -[custom-inputs]: /blockly/guides/create-custom-blocks/inputs/creating-custom-inputs -[custom-fields]: /blockly/guides/create-custom-blocks/fields/customizing-fields/creating +[custom-inputs]: /guides/create-custom-blocks/inputs/creating-custom-inputs +[custom-fields]: /guides/create-custom-blocks/fields/customizing-fields/creating diff --git a/packages/docs/docs/guides/create-custom-blocks/define/top-level-connections.mdx b/packages/docs/docs/guides/create-custom-blocks/define/top-level-connections.mdx index 208772c6d..305e303fe 100644 --- a/packages/docs/docs/guides/create-custom-blocks/define/top-level-connections.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/define/top-level-connections.mdx @@ -23,7 +23,7 @@ to a block with no output connector. A statement block will usually have both a previous connection and a next connection. `nextStatement` and `previousStatement` connections can be -[typed](/blockly/guides/create-custom-blocks/inputs/connection-checks), +[typed](/guides/create-custom-blocks/inputs/connection-checks), but this feature is not utilized by standard blocks. ### Next Connection @@ -31,7 +31,7 @@ but this feature is not utilized by standard blocks. Creates a point at the bottom of the block, so that other statements can be stacked below it. A block with a next connection but no previous connection usually represents an event, and can be configured to render with -[a hat](/blockly/guides/design/applications#event-driven-program). +[a hat](/guides/design/applications#event-driven-program). ![A block with no fields and a tab on the bottom.](/images/set-next-statement.png) diff --git a/packages/docs/docs/guides/create-custom-blocks/fields/anatomy-of-a-field.mdx b/packages/docs/docs/guides/create-custom-blocks/fields/anatomy-of-a-field.mdx index 07082a94f..1b8bb218d 100644 --- a/packages/docs/docs/guides/create-custom-blocks/fields/anatomy-of-a-field.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/fields/anatomy-of-a-field.mdx @@ -33,17 +33,17 @@ Editable fields may show a rich editor when clicked. Editable fields include: -+ [Checkbox](/blockly/guides/create-custom-blocks/fields/built-in-fields/checkbox) ++ [Checkbox](/guides/create-custom-blocks/fields/built-in-fields/checkbox) + [Colour](https://www.npmjs.com/package/@blockly/field-colour) -+ [Dropdown](/blockly/guides/create-custom-blocks/fields/built-in-fields/dropdown) -+ [Number](/blockly/guides/create-custom-blocks/fields/built-in-fields/number) -+ [Text Input](/blockly/guides/create-custom-blocks/fields/built-in-fields/text-input) ++ [Dropdown](/guides/create-custom-blocks/fields/built-in-fields/dropdown) ++ [Number](/guides/create-custom-blocks/fields/built-in-fields/number) ++ [Text Input](/guides/create-custom-blocks/fields/built-in-fields/text-input) Non-editable fields include: -+ [Label](/blockly/guides/create-custom-blocks/fields/built-in-fields/label) -+ [Label Serializable](/blockly/guides/create-custom-blocks/fields/built-in-fields/label-serializable) -+ [Image](/blockly/guides/create-custom-blocks/fields/built-in-fields/image) ++ [Label](/guides/create-custom-blocks/fields/built-in-fields/label) ++ [Label Serializable](/guides/create-custom-blocks/fields/built-in-fields/label-serializable) ++ [Image](/guides/create-custom-blocks/fields/built-in-fields/image) ## Serialization @@ -53,17 +53,17 @@ fields' values are usually not dynamic, so they are usually not serialized. Serialized fields include: -+ [Checkbox](/blockly/guides/create-custom-blocks/fields/built-in-fields/checkbox) -+ [Colour](/blockly/guides/create-custom-blocks/fields/built-in-fields/colour) -+ [Dropdown](/blockly/guides/create-custom-blocks/fields/built-in-fields/dropdown) -+ [Number](/blockly/guides/create-custom-blocks/fields/built-in-fields/number) -+ [Text Input](/blockly/guides/create-custom-blocks/fields/built-in-fields/text-input) -+ [Label Serializable](/blockly/guides/create-custom-blocks/fields/built-in-fields/label-serializable) ++ [Checkbox](/guides/create-custom-blocks/fields/built-in-fields/checkbox) ++ [Colour](/guides/create-custom-blocks/fields/built-in-fields/colour) ++ [Dropdown](/guides/create-custom-blocks/fields/built-in-fields/dropdown) ++ [Number](/guides/create-custom-blocks/fields/built-in-fields/number) ++ [Text Input](/guides/create-custom-blocks/fields/built-in-fields/text-input) ++ [Label Serializable](/guides/create-custom-blocks/fields/built-in-fields/label-serializable) Non-serialized fields include: -+ [Label](/blockly/guides/create-custom-blocks/fields/built-in-fields/label) -+ [Image](/blockly/guides/create-custom-blocks/fields/built-in-fields/image) ++ [Label](/guides/create-custom-blocks/fields/built-in-fields/label) ++ [Image](/guides/create-custom-blocks/fields/built-in-fields/image) Note how the Label Serializable field is not editable, but is serializable. This means that it can only be edited programmatically, rather than through a @@ -120,4 +120,4 @@ fields. Accessibility mode: users may be using a screenreader or similar technology to interact with Blockly. The text of the field may be read out to the user. -[field-generator]: /blockly/guides/create-custom-blocks/code-generation/block-code#get-field-values +[field-generator]: /guides/create-custom-blocks/code-generation/block-code#get-field-values diff --git a/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/checkbox.mdx b/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/checkbox.mdx index ad19db4bd..33f5ab699 100644 --- a/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/checkbox.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/checkbox.mdx @@ -116,7 +116,7 @@ This is a global property, so it will modify all checkbox fields when set. ## Creating a checkbox validator :::note -For information on validators in general see [Validators](/blockly/guides/create-custom-blocks/fields/validators). +For information on validators in general see [Validators](/guides/create-custom-blocks/fields/validators). ::: A checkbox field's value is either `'TRUE'` or `'FALSE'` so a validator should diff --git a/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/dropdown.mdx b/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/dropdown.mdx index 11b4f4b7a..aedec3f80 100644 --- a/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/dropdown.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/dropdown.mdx @@ -198,7 +198,7 @@ Blockly.Extensions.register('flag_with_text_extension', ``` This is done using a JSON -[extension](/blockly/guides/create-custom-blocks/define/extensions). +[extension](/guides/create-custom-blocks/define/extensions). ```js @@ -281,7 +281,7 @@ Blockly.Extensions.register('dynamic_menu_extension', ``` This is done using a JSON -[extension](/blockly/guides/create-custom-blocks/define/extensions). +[extension](/guides/create-custom-blocks/define/extensions). ```js @@ -544,7 +544,7 @@ just insert a space where the break should be. For example `'訪問 中國'` and ## Creating a dropdown validator :::note -For information on validators in general see [Validators](/blockly/guides/create-custom-blocks/fields/validators). +For information on validators in general see [Validators](/guides/create-custom-blocks/fields/validators). ::: A dropdown field's value is a language-neutral string, so any validators must diff --git a/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/image.mdx b/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/image.mdx index e8d63f9dd..349bf1741 100644 --- a/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/image.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/image.mdx @@ -79,7 +79,7 @@ Image fields are not serializable. ## Click handler :::note -For information on validators in general see [Validators](/blockly/guides/create-custom-blocks/fields/validators). +For information on validators in general see [Validators](/guides/create-custom-blocks/fields/validators). ::: The image field does not accept a validator; instead it explicitly accepts a @@ -88,7 +88,7 @@ can act like buttons that exist on blocks. The on click handler can be set in the [JavaScript Constructor](#creation) or using the -[`setOnClickHandler`](/blockly/reference/js/blockly.fieldimage_class.setonclickhandler_1_method) +[`setOnClickHandler`](/reference/js/blockly.fieldimage_class.setonclickhandler_1_method) function. Here is an example of an on click handler that collapses the block when diff --git a/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/label-serializable.mdx b/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/label-serializable.mdx index 958ba2ea3..d29109f27 100644 --- a/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/label-serializable.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/label-serializable.mdx @@ -9,7 +9,7 @@ import TabItem from '@theme/TabItem'; # Serializable label fields -Serializable labels work exactly the same as [normal labels](/blockly/guides/create-custom-blocks/fields/built-in-fields/label) +Serializable labels work exactly the same as [normal labels](/guides/create-custom-blocks/fields/built-in-fields/label) except they also serialize to XML. They should only be used if you are editing the content of a label programmatically, and wish it to serialize to XML. diff --git a/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/label.mdx b/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/label.mdx index c6ad5263b..df97a56c5 100644 --- a/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/label.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/label.mdx @@ -74,7 +74,7 @@ collapsed.](/images/fields/label/collapsed.png) ``` -The [`appendField`](/blockly/reference/js/blockly.input_class.appendfield_1_method) +The [`appendField`](/reference/js/blockly.input_class.appendfield_1_method) function accepts both `FieldLabel` objects and, more commonly, strings to create labels. @@ -86,7 +86,7 @@ Both default to an empty string. Label fields are not serializable. If you would like your label to be serialized, because it is being changed -programmatically, see the [Serializable Label](/blockly/guides/create-custom-blocks/fields/built-in-fields/label-serializable) +programmatically, see the [Serializable Label](/guides/create-custom-blocks/fields/built-in-fields/label-serializable) field. ## Validators diff --git a/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/number.mdx b/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/number.mdx index 902bd72cc..15f3d5a40 100644 --- a/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/number.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/number.mdx @@ -105,7 +105,7 @@ The `value` should cast to a number. If it does not 0 will be used. ## Constraints Constraints can be set in the field definition, or by using the -[setConstraints](/blockly/reference/js/blockly.fieldnumber_class.setconstraints_1_method) +[setConstraints](/reference/js/blockly.fieldnumber_class.setconstraints_1_method) function. ### Minimum value diff --git a/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/overview.mdx b/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/overview.mdx index 67e0b095a..a1f99f99d 100644 --- a/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/overview.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/overview.mdx @@ -11,18 +11,18 @@ image: images/blockly_banner.png Blockly provides a number of prebuilt fields that you can use when defining a block. There are also a number of fields available as -[plugins](/blockly/guides/programming/plugin_overview). +[plugins](/guides/programming/plugin_overview). Built-in fields: -+ [Checkbox](/blockly/guides/create-custom-blocks/fields/built-in-fields/checkbox) -+ [Dropdown](/blockly/guides/create-custom-blocks/fields/built-in-fields/dropdown) -+ [Image](/blockly/guides/create-custom-blocks/fields/built-in-fields/image) -+ [Label](/blockly/guides/create-custom-blocks/fields/built-in-fields/label) -+ [Serializable label](/blockly/guides/create-custom-blocks/fields/built-in-fields/label-serializable) -+ [Number](/blockly/guides/create-custom-blocks/fields/built-in-fields/number) -+ [Text input](/blockly/guides/create-custom-blocks/fields/built-in-fields/text-input) -+ [Variables](/blockly/guides/create-custom-blocks/fields/built-in-fields/variable) ++ [Checkbox](/guides/create-custom-blocks/fields/built-in-fields/checkbox) ++ [Dropdown](/guides/create-custom-blocks/fields/built-in-fields/dropdown) ++ [Image](/guides/create-custom-blocks/fields/built-in-fields/image) ++ [Label](/guides/create-custom-blocks/fields/built-in-fields/label) ++ [Serializable label](/guides/create-custom-blocks/fields/built-in-fields/label-serializable) ++ [Number](/guides/create-custom-blocks/fields/built-in-fields/number) ++ [Text input](/guides/create-custom-blocks/fields/built-in-fields/text-input) ++ [Variables](/guides/create-custom-blocks/fields/built-in-fields/variable) Plugin fields: diff --git a/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/text-input.mdx b/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/text-input.mdx index 362c2e8c8..6a40aec49 100644 --- a/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/text-input.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/text-input.mdx @@ -119,7 +119,7 @@ This applies to individual fields. If you want to modify all fields change the ## Creating a text input validator :::note -For information on validators in general see [Validators](/blockly/guides/create-custom-blocks/fields/validators). +For information on validators in general see [Validators](/guides/create-custom-blocks/fields/validators). ::: A text input field's value is a string, so any validators must accept a string diff --git a/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/variable.mdx b/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/variable.mdx index 44c791206..41ad821e2 100644 --- a/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/variable.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/fields/built-in-fields/variable.mdx @@ -115,7 +115,7 @@ types, and an optional default type. to an empty string, meaning the initial variable will be flexibly typed. → For more information on strict typing, see -[Type Checks](/blockly/guides/create-custom-blocks/inputs/connection-checks). +[Type Checks](/guides/create-custom-blocks/inputs/connection-checks). ## Serialization @@ -172,7 +172,7 @@ types, and an optional default type. ## Creating a variable validator :::note -For information on validators in general see [Validators](/blockly/guides/create-custom-blocks/fields/validators). +For information on validators in general see [Validators](/guides/create-custom-blocks/fields/validators). ::: A variable field's value is a string, so any validators must accept a string and @@ -180,7 +180,7 @@ return a string, `null`, or `undefined`. Here's an example of a validator that only accepts some predefined variables as options. These variables would need to be defined with the -[`Workspace.getVariableMap().createVariable`](/blockly/reference/js/blockly.ivariablemap_interface.createvariable_1_methodsignature) +[`Workspace.getVariableMap().createVariable`](/reference/js/blockly.ivariablemap_interface.createvariable_1_methodsignature) function when the workspace is loaded. ```js diff --git a/packages/docs/docs/guides/create-custom-blocks/fields/customizing-fields/creating.mdx b/packages/docs/docs/guides/create-custom-blocks/fields/customizing-fields/creating.mdx index ed5844644..67944036b 100644 --- a/packages/docs/docs/guides/create-custom-blocks/fields/customizing-fields/creating.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/fields/customizing-fields/creating.mdx @@ -9,7 +9,7 @@ import Image from '@site/src/components/Image'; # Create a custom field Before creating a new field type, consider if one of the [other -methods](/blockly/guides/create-custom-blocks/fields/customizing-fields/overview) +methods](/guides/create-custom-blocks/fields/customizing-fields/overview) for customizing fields suits your needs. If your application needs to store a new value type, or you wish to create a new UI for an existing value type, you probably need to create a new field type. @@ -36,7 +36,7 @@ To create a new field, do the following: This section assumes that you have read and are familiar with the contents in [Anatomy of a -Field](/blockly/guides/create-custom-blocks/fields/anatomy-of-a-field). +Field](/guides/create-custom-blocks/fields/anatomy-of-a-field). For an example of a custom field see the [Custom Fields demo](https://raspberrypifoundation.github.io/blockly-samples/examples/pitch-field-demo/) @@ -46,7 +46,7 @@ demo](https://raspberrypifoundation.github.io/blockly-samples/examples/pitch-fie The field's constructor is responsible for setting up the field's initial value and optionally setting up a [local -validator](/blockly/guides/create-custom-blocks/fields/validators). The custom +validator](/guides/create-custom-blocks/fields/validators). The custom field's constructor is called during the source block initialization regardless of whether the source block is defined in JSON or JavaScript. So, the custom field doesn't have access to the source block during construction. @@ -72,7 +72,7 @@ default `Field` class, that value is `null`. If you don't want that default value, then be sure to pass a suitable value. The validator parameter is only present for editable fields and is typically marked as optional. Learn more about validators in the [Validators -docs](/blockly/guides/create-custom-blocks/fields/validators). +docs](/guides/create-custom-blocks/fields/validators). ### Structure @@ -85,13 +85,13 @@ The logic inside of your constructor should follow this flow: constructor. Editable fields must be serializable, and fields are editable by default, so you should probably set this property to true unless you know it shouldn't be serializable. -1. Optional: Apply additional customization (for example, [Label fields](/blockly/guides/create-custom-blocks/fields/built-in-fields/label) +1. Optional: Apply additional customization (for example, [Label fields](/guides/create-custom-blocks/fields/built-in-fields/label) allow a css class to be passed, which is then applied to the text). ## JSON and registration In [JSON block -definitions](/blockly/guides/create-custom-blocks/define/json-and-js), fields +definitions](/guides/create-custom-blocks/define/json-and-js), fields are described by a string (e.g. `field_number`, `field_textinput`). Blockly maintains a map from these strings to field objects, and calls `fromJson` on the appropriate object during construction. @@ -105,9 +105,9 @@ Blockly.fieldRegistry.register('field_generic', GenericField); You also need to define your `fromJson` function. Your implementation should first dereference any [references to localization -tokens](/blockly/guides/configure/web/translations#use-localization-tokens-in-json) +tokens](/guides/configure/web/translations#use-localization-tokens-in-json) using -[`replaceMessageReferences`](/blockly/reference/js/blockly.utils_namespace.parsing_namespace.replacemessagereferences_1_function), +[`replaceMessageReferences`](/reference/js/blockly.utils_namespace.parsing_namespace.replacemessagereferences_1_function), and then pass the values to the constructor. ```js @@ -120,7 +120,7 @@ GenericField.fromJson = function(options) { :::note Local validators are not currently supported when using a JSON definition. But they can be applied via an -[extension](/blockly/guides/create-custom-blocks/define/extensions). +[extension](/guides/create-custom-blocks/define/extensions). ::: ## Initializing @@ -145,7 +145,7 @@ elements you can use the `createBorderRect_` or `createTextElement_` functions. #### Customizing DOM construction If your field is a generic text field (e.g. [Text -Input](/blockly/guides/create-custom-blocks/fields/built-in-fields/text-input)), +Input](/guides/create-custom-blocks/fields/built-in-fields/text-input)), DOM construction will be handled for you. Otherwise you will need to override the `initView` function to create the DOM elements that you will need during future rendering of your field. @@ -166,7 +166,7 @@ The requirements of a field's on-block display are: + All DOM elements must stay inside the reported dimensions of the field. See the -[Rendering](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#updating-the-on-block-display) +[Rendering](/guides/create-custom-blocks/fields/customizing-fields/creating#updating-the-on-block-display) section for more details on customizing and updating your on-block display. #### Adding Text Symbols @@ -180,7 +180,7 @@ field's degree symbol) you can append the symbol element (usually contained in a By default fields register tooltip events, and mousedown events (to be used for showing -[editors](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#creating-an-editor)). +[editors](/guides/create-custom-blocks/fields/customizing-fields/creating#creating-an-editor)). If you want to listen for other kinds of events (e.g. if you want to handle dragging on a field) you should override the field's `bindEvents_` function. @@ -222,11 +222,11 @@ When overriding `bindEvents_` you should always call the base function. ::: To bind to an event you should generally use the -[`Blockly.utils.browserEvents.conditionalBind`](/blockly/reference/js/blockly.utils_namespace.browserevents_namespace.conditionalbind_1_function) +[`Blockly.utils.browserEvents.conditionalBind`](/reference/js/blockly.utils_namespace.browserevents_namespace.conditionalbind_1_function) function. This method of binding events filters out secondary touches during drags. If you want your handler to run even in the middle of an in-progress drag you can use the -[`Blockly.browserEvents.bind`](/blockly/reference/js/blockly.utils_namespace.browserevents_namespace.bind_1_function) +[`Blockly.browserEvents.bind`](/reference/js/blockly.utils_namespace.browserevents_namespace.bind_1_function) function. ## Disposing @@ -239,28 +239,28 @@ When overriding dispose you should always call the base function. ::: If you correctly [initialized the -view](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#initializing) +view](/guides/create-custom-blocks/fields/customizing-fields/creating#initializing) of your field (by appending all DOM elements to the `fieldGroup_`), then the field's DOM will be disposed of automatically. ## Value Handling → For information about a field's value vs its text see [Anatomy of a -field](/blockly/guides/create-custom-blocks/fields/anatomy-of-a-field). +field](/guides/create-custom-blocks/fields/anatomy-of-a-field). ### Validation order -Flowchart describing the order in which validators are run +Flowchart describing the order in which validators are run ### Implementing a class validator Fields should only accept certain values. For example, number fields should only accept numbers, colour fields should only accept colours etc. This is ensured through class and local -[validators](/blockly/guides/create-custom-blocks/fields/validators). The class +[validators](/guides/create-custom-blocks/fields/validators). The class validator follows the same rules as local validators except that it is also run in the -[constructor](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#implementing-a-constructor) +[constructor](/guides/create-custom-blocks/fields/customizing-fields/creating#implementing-a-constructor) and, as such, it should not reference the source block. To implement your field's class validator, override the `doClassValidation_` @@ -286,7 +286,7 @@ If the value passed to a field with `setValue` is valid you will receive a `doValueUpdate_` callback. By default the `doValueUpdate_` function: + Sets the `value_` property to `newValue`. -+ Sets the [`isDirty_`](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#isdirty_) ++ Sets the [`isDirty_`](/guides/create-custom-blocks/fields/customizing-fields/creating#isdirty_) property to `true`. If you simply need to store the value, and don't want to do any custom handling, @@ -319,15 +319,15 @@ If the value passed to the field with `setValue` is invalid you will receive a `doValueInvalid_` callback. By default the `doValueInvalid_` function does nothing. This means that by default invalid values will not be shown. It also means the field will not be rerendered, because the -[`isDirty_`](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#isdirty_) +[`isDirty_`](/guides/create-custom-blocks/fields/customizing-fields/creating#isdirty_) property will not be set. If you wish to display invalid values you should override `doValueInvalid_`. Under most circumstances you should set a `displayValue_` property to the invalid value, set -[`isDirty_`](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#isdirty_) +[`isDirty_`](/guides/create-custom-blocks/fields/customizing-fields/creating#isdirty_) to `true`, and [override -render_](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#updating-the-on-block-display) +render_](/guides/create-custom-blocks/fields/customizing-fields/creating#updating-the-on-block-display) for the on-block display to update based on the `displayValue_` instead of the `value_`. @@ -376,19 +376,19 @@ at the end of the `doClassValidation_` function, if any individual property is invalid, the value is cached to the `cacheValidatedValue_` property before returning `null` (invalid). Caching the object with individually validated properties allows the -[`doValueInvalid_`](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#handling-invalid-values) +[`doValueInvalid_`](/guides/create-custom-blocks/fields/customizing-fields/creating#handling-invalid-values) function to handle them separately, simply by doing a `!this.cacheValidatedValue_.property` check, instead of re-validating each property individually. This pattern for validating multi-part values can also be used in [local -validators](/blockly/guides/create-custom-blocks/fields/validators) but +validators](/guides/create-custom-blocks/fields/validators) but currently there is no way to enforce this pattern. ### isDirty_ `isDirty_` is a flag used in the -[`setValue`](/blockly/reference/js/blockly.field_class.setvalue_1_method) +[`setValue`](/reference/js/blockly.field_class.setvalue_1_method) function, as well as other parts of the field, to tell if the field needs to be re-rendered. If the field's display value has changed, `isDirty_` should usually be set to `true`. @@ -397,11 +397,11 @@ be set to `true`. → For information about where a field's text is used and how it is different from the field's value, see [Anatomy of a -field](/blockly/guides/create-custom-blocks/fields/anatomy-of-a-field). +field](/guides/create-custom-blocks/fields/anatomy-of-a-field). If the text of your field is different than the value of your field, you should override the -[`getText`](/blockly/reference/js/blockly.field_class.gettext_1_method)function +[`getText`](/reference/js/blockly.field_class.gettext_1_method)function to provide the correct text. ```js @@ -423,7 +423,7 @@ in your editor by wrapping it one of two special `div`s, called the :::info Updates to an editor's display should be handled during -[rendering](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#updating-the-on-block-display), +[rendering](/guides/create-custom-blocks/fields/customizing-fields/creating#updating-the-on-block-display), instead of being handled immediately. This allows validators to intercept the value before it is applied. ::: @@ -437,7 +437,7 @@ the `DropDownDiv`. ![Image of angle picker](/images/angle-picker.png) -The [`WidgetDiv`](/blockly/reference/js/blockly.widgetdiv_namespace) is used to +The [`WidgetDiv`](/reference/js/blockly.widgetdiv_namespace) is used to provide editors that do not live inside of a box. Number fields use the `WidgetDiv` to cover the field with an HTML text input box. While the `DropDownDiv` handles positioning for you, the `WidgetDiv` does not. Elements @@ -445,7 +445,7 @@ will need to be manually positioned. The coordinate system is in pixel coordinates relative to the top left of the window. The text input editor is a good example of the `WidgetDiv`. -Image of text input editor +Image of text input editor ### DropDownDiv sample code @@ -523,7 +523,7 @@ function when passing a dispose function, as shown in the above `DropDownDiv` and `WidgetDiv` examples. → For information about disposing not specific to disposing of editors see -[Disposing](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#disposing). +[Disposing](/guides/create-custom-blocks/fields/customizing-fields/creating#disposing). ## Updating the on-block display @@ -538,14 +538,14 @@ Common examples include: :::info The field should never call `render_` directly. Instead rerenders should be triggered by setting the -[`isDirty_`](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#isdirty_) +[`isDirty_`](/guides/create-custom-blocks/fields/customizing-fields/creating#isdirty_) property to `true`. ::: ### Defaults The default `render_` function sets the display text to the result of the -[`getDisplayText_`](/blockly/reference/js/blockly.field_class.getdisplaytext__1_method) +[`getDisplayText_`](/reference/js/blockly.field_class.getdisplaytext__1_method) function. The `getDisplayText_` function returns the field's `value_` property cast to a string, after it has been truncated to respect the maximum text length. @@ -556,14 +556,14 @@ works for your field, you do not need to override `render_`. If the default text behavior works for your field, but your field's on-block display has additional static elements, you can call the default `render_` function, but you will still need to override it to [update the field's -size](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#updating-size). +size](/guides/create-custom-blocks/fields/customizing-fields/creating#updating-size). If the default text behavior does not work for your field, or your field's on-block display has additional dynamic elements, you will need to [customize the `render_` -function](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#customizing-rendering). +function](/guides/create-custom-blocks/fields/customizing-fields/creating#customizing-rendering). -Flowchart describing how to make decision of whether to override render_ +Flowchart describing how to make decision of whether to override render_ ### Customizing rendering @@ -574,9 +574,9 @@ display text, to changing image elements, to updating background colours. All DOM attribute changes are legal, the only two things to remember are: 1. DOM *creation* should be handled during - [initialization](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#initializing), + [initialization](/guides/create-custom-blocks/fields/customizing-fields/creating#initializing), as it is more efficient. -1. You should always [update the `size_`](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#updating-size) +1. You should always [update the `size_`](/guides/create-custom-blocks/fields/customizing-fields/creating#updating-size) property to match the on-block display's size. ```js @@ -620,7 +620,7 @@ render_() { :::info Always use `this.textContent_.nodeValue` to update the display text of your field. This helps support [text -symbols](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#adding-text-symbols). +symbols](/guides/create-custom-blocks/fields/customizing-fields/creating#adding-text-symbols). ::: ### Updating size @@ -677,7 +677,7 @@ applyColour() { :::note You may want to cache the colours in the `applyColour` method, so you can apply them to your -[editor](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#creating-an-editor) +[editor](/guides/create-custom-blocks/fields/customizing-fields/creating#creating-an-editor) when it is activated. ::: @@ -711,7 +711,7 @@ Messing with a field's cursor is fragile. ## Serialization -[Serialization](/blockly/guides/configure/web/serialization) is about saving the +[Serialization](/guides/configure/web/serialization) is about saving the state of your field so that it can be reloaded into the workspace later. The state of your workspace always includes the field's value, but it could also @@ -832,7 +832,7 @@ it can be interacted with. It defaults to `true`. The `SERIALIZABLE` property determines if the field should be serialized. It defaults to `false`. If this property is `true`, you may need to provide serialization and deserialization functions (see -[Serialization](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#serialization)). +[Serialization](/guides/create-custom-blocks/fields/customizing-fields/creating#serialization)). :::info If `EDITABLE` is `true` for your field `SERIALIZABLE` should also be @@ -877,5 +877,5 @@ Before version 12.0.0, the `CURSOR` property determined the cursor. Its value was a valid CSS cursor string. ::: -[serializer]: /blockly/guides/configure/web/serialization#serializer-hooks -[field-generator]: /blockly/guides/create-custom-blocks/code-generation/overview#block-code-generators +[serializer]: /guides/configure/web/serialization#serializer-hooks +[field-generator]: /guides/create-custom-blocks/code-generation/overview#block-code-generators diff --git a/packages/docs/docs/guides/create-custom-blocks/fields/customizing-fields/extending.mdx b/packages/docs/docs/guides/create-custom-blocks/fields/customizing-fields/extending.mdx index 1f1df986f..a0160bfeb 100644 --- a/packages/docs/docs/guides/create-custom-blocks/fields/customizing-fields/extending.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/fields/customizing-fields/extending.mdx @@ -11,28 +11,28 @@ In order to extend an existing field you must subclass a built in field (e.g Some parts of a field you can modify are: + Its - [editor](/blockly/guides/create-custom-blocks/fields/anatomy-of-a-field#editor-display). + [editor](/guides/create-custom-blocks/fields/anatomy-of-a-field#editor-display). + Its - [on-block display](/blockly/guides/create-custom-blocks/fields/anatomy-of-a-field#on-block-display). + [on-block display](/guides/create-custom-blocks/fields/anatomy-of-a-field#on-block-display). + The - [text](/blockly/guides/create-custom-blocks/fields/anatomy-of-a-field#text) + [text](/guides/create-custom-blocks/fields/anatomy-of-a-field#text) it displays. If you want to [create a -custom field](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating) +custom field](/guides/create-custom-blocks/fields/customizing-fields/creating) that does not need behaviour from any built-in field you should subclass `Field`. ## Common extensions Most custom fields extend one of these three types: -- [Text Input](/blockly/guides/create-custom-blocks/fields/built-in-fields/text-input): If you want your users to type into your field, you should extend +- [Text Input](/guides/create-custom-blocks/fields/built-in-fields/text-input): If you want your users to type into your field, you should extend `FieldTextInput`. -- [Number](/blockly/guides/create-custom-blocks/fields/built-in-fields/number): If you want to store a number, you should extend `FieldNumber`. -- [Dropdown](/blockly/guides/create-custom-blocks/fields/built-in-fields/dropdown): If you want to create a dropdown, but you want it to store a different model +- [Number](/guides/create-custom-blocks/fields/built-in-fields/number): If you want to store a number, you should extend `FieldNumber`. +- [Dropdown](/guides/create-custom-blocks/fields/built-in-fields/dropdown): If you want to create a dropdown, but you want it to store a different model than the default string or image model, you should extend `FieldDropdown`. - Caution: Before extending `FieldDropdown`, check that the dropdown field's -[customization options](/blockly/guides/create-custom-blocks/fields/built-in-fields/dropdown#customization) cannot fulfill your needs. +[customization options](/guides/create-custom-blocks/fields/built-in-fields/dropdown#customization) cannot fulfill your needs. Under certain circumstances you may wish to extend a different field type. For example `FieldLabelSerializable` extends `FieldLabel`. @@ -51,7 +51,7 @@ export class MyCustomTextField extends Blockly.FieldTextInput { ``` The constructor for a field's subclass looks very similar to the [constructor for -a custom field](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#implementing-a-constructor). The signature of the sub-constructor should +a custom field](/guides/create-custom-blocks/fields/customizing-fields/creating#implementing-a-constructor). The signature of the sub-constructor should generally match the signature of the super-constructor. ## JSON and registration @@ -72,5 +72,5 @@ static fromJson(options) { } ``` -For more information about registering a field see the [JSON and registration](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#json-and-registration) +For more information about registering a field see the [JSON and registration](/guides/create-custom-blocks/fields/customizing-fields/creating#json-and-registration) section in Creating a Custom Field. diff --git a/packages/docs/docs/guides/create-custom-blocks/fields/customizing-fields/overview.mdx b/packages/docs/docs/guides/create-custom-blocks/fields/customizing-fields/overview.mdx index 41880fca1..4eeb8231a 100644 --- a/packages/docs/docs/guides/create-custom-blocks/fields/customizing-fields/overview.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/fields/customizing-fields/overview.mdx @@ -11,21 +11,21 @@ specialized case. Here are a few steps to take when customizing fields: 1. Read the documentation of any fields similar to what you require; they may provide a useful interface for customization. For example, -[dropdowns](/blockly/guides/create-custom-blocks/fields/built-in-fields/dropdown) have a lot of hidden functionality. +[dropdowns](/guides/create-custom-blocks/fields/built-in-fields/dropdown) have a lot of hidden functionality. -2. Consider using a [validator](/blockly/guides/create-custom-blocks/fields/validators) to solve your problem. +2. Consider using a [validator](/guides/create-custom-blocks/fields/validators) to solve your problem. Validators allow you to only accept certain values, modify input, or trigger functionality when a field's value changes. -3. Consider [extending a field](/blockly/guides/create-custom-blocks/fields/customizing-fields/extending). +3. Consider [extending a field](/guides/create-custom-blocks/fields/customizing-fields/extending). If there is a field that represents the value type you require, but you want to -modify its [editor](/blockly/guides/create-custom-blocks/fields/anatomy-of-a-field#editor-display), its -[appearance](/blockly/guides/create-custom-blocks/fields/anatomy-of-a-field#on-block-display), or the -[text](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#text) it -displays, you can [create a subclass](/blockly/guides/create-custom-blocks/fields/customizing-fields/extending#subclassing) +modify its [editor](/guides/create-custom-blocks/fields/anatomy-of-a-field#editor-display), its +[appearance](/guides/create-custom-blocks/fields/anatomy-of-a-field#on-block-display), or the +[text](/guides/create-custom-blocks/fields/customizing-fields/creating#text) it +displays, you can [create a subclass](/guides/create-custom-blocks/fields/customizing-fields/extending#subclassing) that inherits the bulk of the functionality, while overriding the specific parts you want to change. -4. [Create a new field type](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating). +4. [Create a new field type](/guides/create-custom-blocks/fields/customizing-fields/creating). While this is the most powerful option, it is also the most time consuming, and should generally only be used if you need to store a new value type. diff --git a/packages/docs/docs/guides/create-custom-blocks/fields/customizing-fields/upgrading.mdx b/packages/docs/docs/guides/create-custom-blocks/fields/customizing-fields/upgrading.mdx index 1c2d66eae..f381636dc 100644 --- a/packages/docs/docs/guides/create-custom-blocks/fields/customizing-fields/upgrading.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/fields/customizing-fields/upgrading.mdx @@ -21,7 +21,7 @@ cover something you are interested in, please read the section on :::note If you have a small number of custom fields it may be easier to simply -rewrite them using the [custom field creation instructions](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating), +rewrite them using the [custom field creation instructions](/guides/create-custom-blocks/fields/customizing-fields/creating), rather than trying to upgrade them piecemeal. ::: @@ -49,9 +49,9 @@ Blockly.fieldRegistry.register('my_field_name', myFieldClass); The `setText` function is no longer called by the Blockly core, so if your `setText` function contains logic it will need to be moved to the -[value handling](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#value-handling) -suite of functions, the [`getText`](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#text) -function, and the [rendering functions](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#updating-the-on-block-display) +[value handling](/guides/create-custom-blocks/fields/customizing-fields/creating#value-handling) +suite of functions, the [`getText`](/guides/create-custom-blocks/fields/customizing-fields/creating#text) +function, and the [rendering functions](/guides/create-custom-blocks/fields/customizing-fields/creating#updating-the-on-block-display) (depending on what exactly your `setText` function is doing). ```js @@ -101,9 +101,9 @@ Blockly automatically handles: You will need to handle: -+ [Value validation](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#value-handling) (`doClassValidation_`). -+ [Field text](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#text) (`getText`). -+ [Field UI](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#updating-the-on-block-display) ++ [Value validation](/guides/create-custom-blocks/fields/customizing-fields/creating#value-handling) (`doClassValidation_`). ++ [Field text](/guides/create-custom-blocks/fields/customizing-fields/creating#text) (`getText`). ++ [Field UI](/guides/create-custom-blocks/fields/customizing-fields/creating#updating-the-on-block-display) :::note We recommend that you change any `setText` calls to @@ -118,7 +118,7 @@ choose not to make changes your field will most likely still work. ### SERIALIZABLE For more information about the `EDITABLE` and `SERIALIZABLE` properties see -[Editable and serializable properties](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#editable-and-serializable-properties). +[Editable and serializable properties](/guides/create-custom-blocks/fields/customizing-fields/creating#editable-and-serializable-properties). ```js CustomFields.UpgradeField.prototype.SERIALIZABLE = true; @@ -163,7 +163,7 @@ The warning above means that Blockly has detected you are using an old method fo field, and would like you to use the new method. For more information about the `isDirty_` property see -[isDirty_](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#isdirty-). +[isDirty_](/guides/create-custom-blocks/fields/customizing-fields/creating#isdirty-). ### init @@ -244,10 +244,10 @@ This means that blockly now automatically handles: You will need to handle: + Adding additional - [DOM elements](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#on-block-display) (`initView`). + [DOM elements](/guides/create-custom-blocks/fields/customizing-fields/creating#on-block-display) (`initView`). + Adding additional - [event bindings](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#input-events) (`bindEvents_`). -+ [Disposing](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#disposing) of event bindings (`dispose`). + [event bindings](/guides/create-custom-blocks/fields/customizing-fields/creating#input-events) (`bindEvents_`). ++ [Disposing](/guides/create-custom-blocks/fields/customizing-fields/creating#disposing) of event bindings (`dispose`). :::info All DOM creation should be done inside `initView` as that is most @@ -275,7 +275,7 @@ We recommend that you override the `showEditor_` function to handle mouse clicks rather than the `onMouseDown_` function as that allows input to pass through the gesture system. -For more information on editors see [Editors](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#creating-an-editor). +For more information on editors see [Editors](/guides/create-custom-blocks/fields/customizing-fields/creating#creating-an-editor). ### setValue @@ -283,19 +283,19 @@ The `setValue` function is now a [template function](https://en.wikipedia.org/wiki/Template_method_pattern) to reduce duplicate code in subclasses. If your `setValue` function contains logic, consider refactoring it to fit the value handling paths described in [Value -handling](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#value-handling). +handling](/guides/create-custom-blocks/fields/customizing-fields/creating#value-handling). ### text_ We recommend that you never access or update the `text_` property of your field directly. Instead, use the -[`getText`](/blockly/reference/js/blockly.field_class.gettext_1_method) function +[`getText`](/reference/js/blockly.field_class.gettext_1_method) function to access the user readable text of your field and the -[`setValue`](/blockly/reference/js/blockly.field_class.setvalue_1_method) function +[`setValue`](/reference/js/blockly.field_class.setvalue_1_method) function to update the stored value of your field. For more information about a field's value vs its text see -[Anatomy of a field](/blockly/guides/create-custom-blocks/fields/anatomy-of-a-field). +[Anatomy of a field](/guides/create-custom-blocks/fields/anatomy-of-a-field). ## Getting upgrade assistance diff --git a/packages/docs/docs/guides/create-custom-blocks/fields/overview.mdx b/packages/docs/docs/guides/create-custom-blocks/fields/overview.mdx index 0e246b2d8..941ba0c2a 100644 --- a/packages/docs/docs/guides/create-custom-blocks/fields/overview.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/fields/overview.mdx @@ -24,16 +24,16 @@ Blockly provides several fields by default to handle a variety of user input. These can be customized through field-specific configuration or with validators, which tell a field how to handle specific content in a standard editor. -→ More info on [Built-in fields](/blockly/guides/create-custom-blocks/fields/built-in-fields/overview). +→ More info on [Built-in fields](/guides/create-custom-blocks/fields/built-in-fields/overview). -→ More info on [Validators](/blockly/guides/create-custom-blocks/fields/validators). +→ More info on [Validators](/guides/create-custom-blocks/fields/validators). If you need a fully custom field it takes a bit more work and you'll want to read most of the fields documentation. Start by learning about the parts that make up a field or the overview of creating custom fields. -→ More info on the [anatomy of a field](/blockly/guides/create-custom-blocks/fields/anatomy-of-a-field). +→ More info on the [anatomy of a field](/guides/create-custom-blocks/fields/anatomy-of-a-field). -→ More info on [creating custom fields](/blockly/guides/create-custom-blocks/fields/customizing-fields/overview). +→ More info on [creating custom fields](/guides/create-custom-blocks/fields/customizing-fields/overview). -[fields-vs-icons]: /blockly/guides/create-custom-blocks/fields/fields-vs-icons +[fields-vs-icons]: /guides/create-custom-blocks/fields/fields-vs-icons diff --git a/packages/docs/docs/guides/create-custom-blocks/fields/validators.mdx b/packages/docs/docs/guides/create-custom-blocks/fields/validators.mdx index c40bbf20d..01dab346b 100644 --- a/packages/docs/docs/guides/create-custom-blocks/fields/validators.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/fields/validators.mdx @@ -20,7 +20,7 @@ Some common examples: :::note Validators modify a field's -[_value_ not its _text_](/blockly/guides/create-custom-blocks/fields/anatomy-of-a-field#value). +[_value_ not its _text_](/guides/create-custom-blocks/fields/anatomy-of-a-field#value). ::: ## Types of validators @@ -34,7 +34,7 @@ fields only accept numeric characters). Class validators are run on all values passed to the field (including the value passed to the constructor). For more information about class validators see the -[Implementing a class validator](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#implementing-a-class-validator) +[Implementing a class validator](/guides/create-custom-blocks/fields/customizing-fields/creating#implementing-a-class-validator) section in Creating a Custom Field. **Local validators** are defined at the time of a field's construction. Local @@ -79,7 +79,7 @@ Blockly.Blocks['validator_example'] = { ``` + With -[`setValidator`](/blockly/reference/js/blockly.field_class.setvalidator_1_method). +[`setValidator`](/reference/js/blockly.field_class.setvalidator_1_method). ```js Blockly.Blocks['validator_example'] = { @@ -98,7 +98,7 @@ Blockly.Blocks['validator_example'] = { ``` Either of the above methods can be wrapped in an -[extension](/blockly/guides/create-custom-blocks/define/extensions), to support +[extension](/guides/create-custom-blocks/define/extensions), to support the JSON format. The field's value may be very different depending on the type of field being @@ -138,7 +138,7 @@ var validator = function(newValue) { Null, which means the given value is invalid. In most cases the field will ignore the input value. The exact behaviour is specified by the field's `doValueInvalid_` -[function](/blockly/guides/create-custom-blocks/fields/customizing-fields/creating#handling-invalid-values). +[function](/guides/create-custom-blocks/fields/customizing-fields/creating#handling-invalid-values). Example of a Nulling Validator: diff --git a/packages/docs/docs/guides/create-custom-blocks/icons/creating-custom-icons/basic-implementation.mdx b/packages/docs/docs/guides/create-custom-blocks/icons/creating-custom-icons/basic-implementation.mdx index 2ff6bcc2c..b2dea5005 100644 --- a/packages/docs/docs/guides/create-custom-blocks/icons/creating-custom-icons/basic-implementation.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/icons/creating-custom-icons/basic-implementation.mdx @@ -191,19 +191,19 @@ dispose() { } ``` -[bubble]: /blockly/guides/create-custom-blocks/icons/creating-custom-icons/use-bubbles -[IIcon]: /blockly/reference/js/blockly.iicon_interface -[Icon]: /blockly/reference/js/blockly.icons_namespace.icon_class -[getType]: /blockly/reference/js/blockly.iicon_interface.gettype_1_methodsignature -[registering]: /blockly/guides/create-custom-blocks/icons/creating-custom-icons/save-and-load#register-icon-classes -[getIcon]: /blockly/reference/js/blockly.block_class.geticon_1_method -[initView]: /blockly/reference/js/blockly.iicon_interface.initview_1_methodsignature -[blockly-utils-dom]: /blockly/reference/js/blockly.utils_namespace.dom_namespace -[getSize]: /blockly/reference/js/blockly.iicon_interface.getsize_1_methodsignature -[renderer]: /blockly/guides/create-custom-blocks/renderers/overview -[getWeight]: /blockly/reference/js/blockly.iicon_interface.getweight_1_methodsignature -[onClick]: /blockly/reference/js/blockly.iicon_interface.onclick_1_methodsignature -[updateEditable]: /blockly/reference/js/blockly.iicon_interface.updateeditable_1_methodsignature -[isShownWhenCollapsed]: /blockly/reference/js/blockly.iicon_interface.isshownwhencollapsed_1_methodsignature -[updateCollapsed]: /blockly/reference/js/blockly.iicon_interface.updatecollapsed_1_methodsignature -[dispose]: /blockly/reference/js/blockly.iicon_interface.dispose_1_methodsignature +[bubble]: /guides/create-custom-blocks/icons/creating-custom-icons/use-bubbles +[IIcon]: /reference/js/blockly.iicon_interface +[Icon]: /reference/js/blockly.icons_namespace.icon_class +[getType]: /reference/js/blockly.iicon_interface.gettype_1_methodsignature +[registering]: /guides/create-custom-blocks/icons/creating-custom-icons/save-and-load#register-icon-classes +[getIcon]: /reference/js/blockly.block_class.geticon_1_method +[initView]: /reference/js/blockly.iicon_interface.initview_1_methodsignature +[blockly-utils-dom]: /reference/js/blockly.utils_namespace.dom_namespace +[getSize]: /reference/js/blockly.iicon_interface.getsize_1_methodsignature +[renderer]: /guides/create-custom-blocks/renderers/overview +[getWeight]: /reference/js/blockly.iicon_interface.getweight_1_methodsignature +[onClick]: /reference/js/blockly.iicon_interface.onclick_1_methodsignature +[updateEditable]: /reference/js/blockly.iicon_interface.updateeditable_1_methodsignature +[isShownWhenCollapsed]: /reference/js/blockly.iicon_interface.isshownwhencollapsed_1_methodsignature +[updateCollapsed]: /reference/js/blockly.iicon_interface.updatecollapsed_1_methodsignature +[dispose]: /reference/js/blockly.iicon_interface.dispose_1_methodsignature diff --git a/packages/docs/docs/guides/create-custom-blocks/icons/creating-custom-icons/creating-custom-bubbles.mdx b/packages/docs/docs/guides/create-custom-blocks/icons/creating-custom-icons/creating-custom-bubbles.mdx index b14415db2..e214a0fe3 100644 --- a/packages/docs/docs/guides/create-custom-blocks/icons/creating-custom-icons/creating-custom-bubbles.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/icons/creating-custom-icons/creating-custom-bubbles.mdx @@ -79,8 +79,8 @@ dispose() { } ``` -[built-in-bubbles]: /blockly/reference/js/blockly.bubbles_namespace -[blockly-utils-dom]: /blockly/reference/js/blockly.utils_namespace.dom_namespace -[bubble]: /blockly/reference/js/blockly.bubbles_namespace.bubble_class -[setSize]: /blockly/reference/js/blockly.bubbles_namespace.bubble_class.setsize_1_method -[dispose]: /blockly/reference/js/blockly.bubbles_namespace.bubble_class.dispose_1_method +[built-in-bubbles]: /reference/js/blockly.bubbles_namespace +[blockly-utils-dom]: /reference/js/blockly.utils_namespace.dom_namespace +[bubble]: /reference/js/blockly.bubbles_namespace.bubble_class +[setSize]: /reference/js/blockly.bubbles_namespace.bubble_class.setsize_1_method +[dispose]: /reference/js/blockly.bubbles_namespace.bubble_class.dispose_1_method diff --git a/packages/docs/docs/guides/create-custom-blocks/icons/creating-custom-icons/override-built-in.mdx b/packages/docs/docs/guides/create-custom-blocks/icons/creating-custom-icons/override-built-in.mdx index 16d72cfbb..391a3bc12 100644 --- a/packages/docs/docs/guides/create-custom-blocks/icons/creating-custom-icons/override-built-in.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/icons/creating-custom-icons/override-built-in.mdx @@ -11,7 +11,7 @@ import Image from '@site/src/components/Image'; You can override the built-in comment icon. For example, you may want the comment's [pop-up bubble][use-bubbles] to look different. -A block with the comment icon highlighted +A block with the comment icon highlighted To override the comment icon, extend `CommentIcon`, override selected methods in `ICommentIcon`, and register your new icon. @@ -37,9 +37,9 @@ class MyCommentIcon extends Blockly.icons.CommentIcon { To customize your icon, you can override methods in `ICommentIcon` (described in the following sections) and -[`Blockly.icons.Icon`](/blockly/reference/js/blockly.icons_namespace.icon_class) +[`Blockly.icons.Icon`](/reference/js/blockly.icons_namespace.icon_class) (described in [Create custom -icons](/blockly/guides/create-custom-blocks/icons/creating-custom-icons/basic-implementation)). +icons](/guides/create-custom-blocks/icons/creating-custom-icons/basic-implementation)). Do not override `getType`, which must return `Blockly.icons.IconType.COMMENT`. ### Text @@ -152,10 +152,10 @@ After you register your icon, Blockly will use it in place of the built-in comment icon, such as when the user clicks "Add Comment" on the context menu or you call `myBlock.setCommentText()`. -[ICommentIcon]: /blockly/reference/js/blockly.icommenticon_interface -[IHasBubble]: /blockly/reference/js/blockly.ihasbubble_interface -[use-bubbles]: /blockly/guides/create-custom-blocks/icons/creating-custom-icons/use-bubbles -[ISerializable]: /blockly/reference/js/blockly.iserializable_interface -[CommentState]: /blockly/reference/js/blockly.icons_namespace.commentstate_interface -[icon-serialization]: /blockly/guides/create-custom-blocks/icons/creating-custom-icons/save-and-load -[comment-icon-image]: /blockly/images/block-icons/comment-icon-outline.png +[ICommentIcon]: /reference/js/blockly.icommenticon_interface +[IHasBubble]: /reference/js/blockly.ihasbubble_interface +[use-bubbles]: /guides/create-custom-blocks/icons/creating-custom-icons/use-bubbles +[ISerializable]: /reference/js/blockly.iserializable_interface +[CommentState]: /reference/js/blockly.icons_namespace.commentstate_interface +[icon-serialization]: /guides/create-custom-blocks/icons/creating-custom-icons/save-and-load +[comment-icon-image]: /images/block-icons/comment-icon-outline.png diff --git a/packages/docs/docs/guides/create-custom-blocks/icons/creating-custom-icons/save-and-load.mdx b/packages/docs/docs/guides/create-custom-blocks/icons/creating-custom-icons/save-and-load.mdx index 9087e25f2..280f5fb83 100644 --- a/packages/docs/docs/guides/create-custom-blocks/icons/creating-custom-icons/save-and-load.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/icons/creating-custom-icons/save-and-load.mdx @@ -100,10 +100,10 @@ Blockly.icons.registry.register( new Blockly.icons.IconType('my_icon'), myIcon); ``` -[ISerializable]: /blockly/reference/js/blockly.iserializable_interface -[registering]: /blockly/guides/create-custom-blocks/icons/creating-custom-icons/save-and-load#register-icon-classes -[saveState]: /blockly/reference/js/blockly.iserializable_interface.savestate_1_methodsignature -[loadState]: /blockly/reference/js/blockly.iserializable_interface.loadstate_1_methodsignature -[IconType]: /blockly/reference/js/blockly.icons_namespace.icontype_class -[getType]: /blockly/reference/js/blockly.iicon_interface.gettype_1_methodsignature -[serializer]: /blockly/guides/configure/web/serialization#serializer-hooks +[ISerializable]: /reference/js/blockly.iserializable_interface +[registering]: /guides/create-custom-blocks/icons/creating-custom-icons/save-and-load#register-icon-classes +[saveState]: /reference/js/blockly.iserializable_interface.savestate_1_methodsignature +[loadState]: /reference/js/blockly.iserializable_interface.loadstate_1_methodsignature +[IconType]: /reference/js/blockly.icons_namespace.icontype_class +[getType]: /reference/js/blockly.iicon_interface.gettype_1_methodsignature +[serializer]: /guides/configure/web/serialization#serializer-hooks diff --git a/packages/docs/docs/guides/create-custom-blocks/icons/creating-custom-icons/use-bubbles.mdx b/packages/docs/docs/guides/create-custom-blocks/icons/creating-custom-icons/use-bubbles.mdx index 710a6eee9..352b2d49a 100644 --- a/packages/docs/docs/guides/create-custom-blocks/icons/creating-custom-icons/use-bubbles.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/icons/creating-custom-icons/use-bubbles.mdx @@ -79,8 +79,8 @@ isBubbleVisible() { } ``` -[IIcon]: /blockly/reference/js/blockly.iicon_interface -[IHasBubble]: /blockly/reference/js/blockly.ihasbubble_interface -[setBubbleVisible]: /blockly/reference/js/blockly.ihasbubble_interface.setbubblevisible_1_methodsignature -[bubbleIsVisible]: /blockly/reference/js/blockly.ihasbubble_interface.bubbleisvisible_1_methodsignature -[onLocationChange]: /blockly/reference/js/blockly.iicon_interface.onlocationchange_1_methodsignature +[IIcon]: /reference/js/blockly.iicon_interface +[IHasBubble]: /reference/js/blockly.ihasbubble_interface +[setBubbleVisible]: /reference/js/blockly.ihasbubble_interface.setbubblevisible_1_methodsignature +[bubbleIsVisible]: /reference/js/blockly.ihasbubble_interface.bubbleisvisible_1_methodsignature +[onLocationChange]: /reference/js/blockly.iicon_interface.onlocationchange_1_methodsignature diff --git a/packages/docs/docs/guides/create-custom-blocks/icons/creating-custom-icons/use-custom-icons.mdx b/packages/docs/docs/guides/create-custom-blocks/icons/creating-custom-icons/use-custom-icons.mdx index 297974096..07b3462f9 100644 --- a/packages/docs/docs/guides/create-custom-blocks/icons/creating-custom-icons/use-custom-icons.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/icons/creating-custom-icons/use-custom-icons.mdx @@ -49,7 +49,7 @@ initializing the block or in response to an event. ## Get an icon To get a custom icon from a block, call `getIcon` and pass the [icon's type -string](/blockly/guides/create-custom-blocks/icons/creating-custom-icons/basic-implementation#specify-the-icons-type). +string](/guides/create-custom-blocks/icons/creating-custom-icons/basic-implementation#specify-the-icons-type). ```js const myIcon = myBlock.getIcon('my_icon'); diff --git a/packages/docs/docs/guides/create-custom-blocks/icons/overview.mdx b/packages/docs/docs/guides/create-custom-blocks/icons/overview.mdx index 7421d7183..e48868ad3 100644 --- a/packages/docs/docs/guides/create-custom-blocks/icons/overview.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/icons/overview.mdx @@ -22,6 +22,6 @@ or copyright information in a pop-up bubble. → More info on [Creating custom icons][custom-icons]. -[fields-vs-icons]: /blockly/guides/create-custom-blocks/fields/fields-vs-icons -[custom-icons]: /blockly/guides/create-custom-blocks/icons/creating-custom-icons/basic-implementation -[icons-reference]: /blockly/reference/js/blockly.icons_namespace +[fields-vs-icons]: /guides/create-custom-blocks/fields/fields-vs-icons +[custom-icons]: /guides/create-custom-blocks/icons/creating-custom-icons/basic-implementation +[icons-reference]: /reference/js/blockly.icons_namespace diff --git a/packages/docs/docs/guides/create-custom-blocks/inputs/connection-check-playbook.mdx b/packages/docs/docs/guides/create-custom-blocks/inputs/connection-check-playbook.mdx index ee5ad0d0a..2f6d53f53 100644 --- a/packages/docs/docs/guides/create-custom-blocks/inputs/connection-check-playbook.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/inputs/connection-check-playbook.mdx @@ -9,7 +9,7 @@ import Image from '@site/src/components/Image'; # Connection check playbook This document shows ways to use [connection -checks](/blockly/guides/create-custom-blocks/inputs/connection-checks). +checks](/guides/create-custom-blocks/inputs/connection-checks). ## Value examples @@ -24,14 +24,14 @@ should include *exactly* what they "return". In the most basic case where you want create a block that "accepts" or "returns" one type, you need to include that type in the connection's connection check. -a value block that accepts a single type +a value block that accepts a single type ### Accept multiple types To create a block that "accepts" multiple types, you need to include every accepted type in the input's connection check. -a value block that accepts multiple types +a value block that accepts multiple types By convention, if an output can *sometimes* be accepted in multiple situations (e.g. if you allow numbers to sometimes be used as strings) the output should be @@ -43,14 +43,14 @@ makes sure that outputs don't connect where they're not supported. To create a block that "accepts" any type, you need to set the input's connection check to `null`. -a value block that accepts any type +a value block that accepts any type ### Return subtypes To create a block that "returns" a subtype, you need to include both the type and the supertype in the output's connection check. -a value block that returns its type and its supertype +a value block that returns its type and its supertype In the case of subtypes, it is okay to have multiple checks in an output check, because the block *always* "returns" both types. @@ -64,7 +64,7 @@ connection check. Depending on how strict you want your block language to be, you may also want to include the type's [variance(s)][variance]. -a value block that returns its parameterized type and its unparameterized type +a value block that returns its parameterized type and its unparameterized type Just like with subtypes, it is okay to have multiple checks in an output check in this case, because the block *always* "returns" both types. @@ -89,7 +89,7 @@ To create a set of blocks that connect in a defined order, you need to include which blocks should follow the current one in the next connection check, and what the current block "is" in the previous connection check. -statement blocks that have a forced order +statement blocks that have a forced order ### Allow lots of middle blocks @@ -98,7 +98,7 @@ include at least one entry from the middle block's previous connection check in the middle block's next connection check. This allows the block to be followed by more of itself. -statement blocks that allow lots of middle blocks +statement blocks that allow lots of middle blocks ### Allow no middle blocks @@ -108,7 +108,7 @@ check, and the last block's previous connection check in the first block's next connection check. This allows the first block to be followed by either a middle block, or a last block. -statement blocks that allow no middle blocks +statement blocks that allow no middle blocks ### Either-or stacks @@ -122,15 +122,15 @@ from another (and not both), you need to do two things: which are in their previous connection checks (so they can only be followed by blocks of the same group). -statement blocks that can be followed by multiple of one type of block, or multiple of another, but not both +statement blocks that can be followed by multiple of one type of block, or multiple of another, but not both -[values-single-image]: /blockly/images/connection-checks/values-single.jpg -[values-multiple-image]: /blockly/images/connection-checks/values-multiple.jpg -[values-subtype-image]: /blockly/images/connection-checks/values-subtype.png -[values-parameterized-type-image]: /blockly/images/connection-checks/values-parameterized-type.png -[values-any-type-image]: /blockly/images/connection-checks/values-any-type.jpg -[statements-ordered-image]: /blockly/images/connection-checks/statements-ordered.png -[statements-multiple-middle-blocks-image]: /blockly/images/connection-checks/statements-multiple-middle-blocks.png -[statements-no-middle-blocks-image]: /blockly/images/connection-checks/statements-no-middle-blocks.png -[statements-either-or-image]: /blockly/images/connection-checks/statements-either-or.png +[values-single-image]: /images/connection-checks/values-single.jpg +[values-multiple-image]: /images/connection-checks/values-multiple.jpg +[values-subtype-image]: /images/connection-checks/values-subtype.png +[values-parameterized-type-image]: /images/connection-checks/values-parameterized-type.png +[values-any-type-image]: /images/connection-checks/values-any-type.jpg +[statements-ordered-image]: /images/connection-checks/statements-ordered.png +[statements-multiple-middle-blocks-image]: /images/connection-checks/statements-multiple-middle-blocks.png +[statements-no-middle-blocks-image]: /images/connection-checks/statements-no-middle-blocks.png +[statements-either-or-image]: /images/connection-checks/statements-either-or.png [variance]: https://en.wikipedia.org/wiki/Covariance_and_contravariance_(computer_science) diff --git a/packages/docs/docs/guides/create-custom-blocks/inputs/connection-checks.mdx b/packages/docs/docs/guides/create-custom-blocks/inputs/connection-checks.mdx index 286e4473b..ad9feb324 100644 --- a/packages/docs/docs/guides/create-custom-blocks/inputs/connection-checks.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/inputs/connection-checks.mdx @@ -71,7 +71,7 @@ does *not* make it so blocks of that type can connect. For a list of examples of how to use connection checks, see the [Connection check -playbook](/blockly/guides/create-custom-blocks/inputs/connection-check-playbook). +playbook](/guides/create-custom-blocks/inputs/connection-check-playbook). ## Set checks @@ -238,7 +238,7 @@ For example, if you wanted to create a more advanced system that handles some of the [limitations](#limitations) of this one, you can create a custom connection checker. -[connection-type]: /blockly/guides/create-custom-blocks/define/block-anatomy#connections -[event-system]: /blockly/guides/configure/web/events -[BlockMove]: /blockly/reference/js/blockly.events_namespace.blockmove_class -[custom-connection-checker]: /blockly/guides/create-custom-blocks/inputs/connection_checker +[connection-type]: /guides/create-custom-blocks/define/block-anatomy#connections +[event-system]: /guides/configure/web/events +[BlockMove]: /reference/js/blockly.events_namespace.blockmove_class +[custom-connection-checker]: /guides/create-custom-blocks/inputs/connection_checker diff --git a/packages/docs/docs/guides/create-custom-blocks/inputs/connection-previews.mdx b/packages/docs/docs/guides/create-custom-blocks/inputs/connection-previews.mdx index 8fa2fdfad..3f9ffe243 100644 --- a/packages/docs/docs/guides/create-custom-blocks/inputs/connection-previews.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/inputs/connection-previews.mdx @@ -34,7 +34,7 @@ will be disconnected, and the dragged block will be connected in its place. By default, we indicate this by putting a fade effect on the block that is being replaced. -The built-in replacement preview +The built-in replacement preview ### Insertion @@ -47,7 +47,7 @@ block doesn't get disconnected. By default, we indicate this by creating insertion markers, and highlighting the connections that will connect. -The built-in insertion preview +The built-in insertion preview ## Create a custom previewer @@ -197,10 +197,10 @@ const myWorkspace = Blockly.inject({ For more information about registration, see [Injecting subclasses][inject-subclasses]. -[built-in-replacement-preview-image]: /blockly/images/connections/built-in-replacement-preview.png -[built-in-insertion-preview-image]: /blockly/images/connections/built-in-insertion-preview.png -[built-in-previewer-image]: /blockly/images/connections/built-in-previewer.gif -[IConnectionPreviewer]: /blockly/reference/js/blockly.iconnectionpreviewer_interface -[insertion-marker]: /blockly/guides/get-started/workspace-anatomy#insertion-marker -[custom-renderer]: /blockly/guides/create-custom-blocks/renderers/create-custom-renderers/basic-implementation -[inject-subclasses]: /blockly/guides/configure/web/customization#injecting-subclasses +[built-in-replacement-preview-image]: /images/connections/built-in-replacement-preview.png +[built-in-insertion-preview-image]: /images/connections/built-in-insertion-preview.png +[built-in-previewer-image]: /images/connections/built-in-previewer.gif +[IConnectionPreviewer]: /reference/js/blockly.iconnectionpreviewer_interface +[insertion-marker]: /guides/get-started/workspace-anatomy#insertion-marker +[custom-renderer]: /guides/create-custom-blocks/renderers/create-custom-renderers/basic-implementation +[inject-subclasses]: /guides/configure/web/customization#injecting-subclasses diff --git a/packages/docs/docs/guides/create-custom-blocks/inputs/connection_checker.mdx b/packages/docs/docs/guides/create-custom-blocks/inputs/connection_checker.mdx index 0b0df4b52..30e1f31ea 100644 --- a/packages/docs/docs/guides/create-custom-blocks/inputs/connection_checker.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/inputs/connection_checker.mdx @@ -12,7 +12,7 @@ syntactically correct. The Connection Checker is the object that enforces Blockly's rules about which connections are compatible. By default the checker applies a simple type system, as described in the [Connection -checks](/blockly/guides/create-custom-blocks/inputs/connection-checks) page. +checks](/guides/create-custom-blocks/inputs/connection-checks) page. ## The Checks diff --git a/packages/docs/docs/guides/create-custom-blocks/inputs/creating-custom-inputs.mdx b/packages/docs/docs/guides/create-custom-blocks/inputs/creating-custom-inputs.mdx index 08942acb3..1e53f82cf 100644 --- a/packages/docs/docs/guides/create-custom-blocks/inputs/creating-custom-inputs.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/inputs/creating-custom-inputs.mdx @@ -50,7 +50,7 @@ unlike [custom fields][custom-fields], you can't override built-in inputs, and you can't add custom JSON configuration to them. ::: -[Input]: /blockly/reference/js/blockly.inputs_namespace.input_class -[makeConnection]: /blockly/reference/js/blockly.inputs_namespace.input_class.makeconnection_1_method -[json-block-def]: /blockly/guides/create-custom-blocks/define/json-and-js -[custom-fields]: /blockly/guides/create-custom-blocks/fields/customizing-fields/creating +[Input]: /reference/js/blockly.inputs_namespace.input_class +[makeConnection]: /reference/js/blockly.inputs_namespace.input_class.makeconnection_1_method +[json-block-def]: /guides/create-custom-blocks/define/json-and-js +[custom-fields]: /guides/create-custom-blocks/fields/customizing-fields/creating diff --git a/packages/docs/docs/guides/create-custom-blocks/legacy-blockly-developer-tools.md b/packages/docs/docs/guides/create-custom-blocks/legacy-blockly-developer-tools.md index 2520813f2..4a2ff5ac8 100644 --- a/packages/docs/docs/guides/create-custom-blocks/legacy-blockly-developer-tools.md +++ b/packages/docs/docs/guides/create-custom-blocks/legacy-blockly-developer-tools.md @@ -28,7 +28,7 @@ The Blockly developer process using the tool consists of three parts: ## Block Factory Tab The Block Factory tab helps you create [block -definitions](/blockly/guides/create-custom-blocks/define/block-definitions) and +definitions](/guides/create-custom-blocks/define/block-definitions) and [block-code generators][block-code-generator] for custom blocks. On this tab you can easily create, modify, and save custom blocks. @@ -116,7 +116,7 @@ starting workspace with the "Toolbox" and "Workspace" buttons. ### Building a toolbox This tab helps build the XML for a Toolbox. The material assumes -familiarity with features of a [Toolbox](/blockly/guides/configure/web/toolboxes/toolbox). +familiarity with features of a [Toolbox](/guides/configure/web/toolboxes/toolbox). If you already have XML for a toolbox that you want to edit here, you can load it by clicking "Load to Edit". @@ -167,7 +167,7 @@ to the toolbox. If you have blocks defined in JSON that aren't in your library, you can import them using the "Import Custom Blocks" button. Some blocks should be used together or include defaults. This is done with -[groups and shadows](/blockly/guides/configure/web/toolboxes/preset). Any +[groups and shadows](/guides/configure/web/toolboxes/preset). Any blocks that are connected in the editor will be added to the toolbox as a group. Blocks that are attached to another block can also be changed to shadow blocks by selecting the child block and clicking the "Make Shadow" button. @@ -179,7 +179,7 @@ blocks. If you include a variable or function block in their toolbox, include a "Variables" or "Functions" category in your toolbox to allow users to fully utilize the block. Learn more about ["Variables" or "Functions" -categories](/blockly/guides/configure/web/toolboxes/dynamic#built-in-dynamic-categories). +categories](/guides/configure/web/toolboxes/dynamic#built-in-dynamic-categories). ### Configuring a workspace @@ -189,10 +189,10 @@ tab and select "Workspace". #### Choose Workspace Options Set different values for [configuration -options](/blockly/guides/configure/web/configuration_struct#the-options-dictionary) +options](/guides/configure/web/configuration_struct#the-options-dictionary) and see the result in the preview area. Enabling -[grid](/blockly/guides/configure/web/grid) or -[zoom](/blockly/guides/configure/web/zoom) reveals more options to configure. +[grid](/guides/configure/web/grid) or +[zoom](/guides/configure/web/zoom) reveals more options to configure. Also, switching to using categories usually requires a more complex workspace; a trashcan and scrollbars are added automatically when you add your first category. @@ -242,6 +242,6 @@ these.](/images/workspace_export_opt.png) * Toolbox: Produces XML to specify your toolbox. * Workspace Blocks: Produces XML which can be loaded into a workspace. -[block-code-generator]: /blockly/guides/create-custom-blocks/code-generation/overview#block-code-generators -[block-factory-import]: /blockly/guides/create-custom-blocks/blockly-developer-tools#import-from-legacy-block-factory +[block-code-generator]: /guides/create-custom-blocks/code-generation/overview#block-code-generators +[block-factory-import]: /guides/create-custom-blocks/blockly-developer-tools#import-from-legacy-block-factory [legacy-tool]: https://blockly-demo.appspot.com/static/demos/blockfactory/index.html diff --git a/packages/docs/docs/guides/create-custom-blocks/mutators.mdx b/packages/docs/docs/guides/create-custom-blocks/mutators.mdx index eb1cb9400..bce11209f 100644 --- a/packages/docs/docs/guides/create-custom-blocks/mutators.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/mutators.mdx @@ -21,7 +21,7 @@ Note that changing the shape of your block *does not necessarily* mean you need extra serialization. For example, the `math_number_property` block changes shape, but it does that based on a dropdown field, whose value already gets serialized. As such, it can just use a [field -validator](/blockly/guides/create-custom-blocks/fields/validators), and doesn't +validator](/guides/create-custom-blocks/fields/validators), and doesn't need a mutator. ![The `math_number_property` block with its dropdown set to `even`. It has a @@ -30,7 +30,7 @@ block with its dropdown set to `divisible by`. It has two value inputs.](/images/is-divisible-by.png) See the [serialization -page](/blockly/guides/configure/web/serialization#when-to-save-extra-state) for +page](/guides/configure/web/serialization#when-to-save-extra-state) for more information about when you need a mutator and when you don't. Mutators also provide a built-in UI for users to change the shapes of blocks if @@ -269,7 +269,7 @@ saveConnections: function(topBlock) { Mutators are just a special kind of mixin, so they also have to be registered before you can use them in your block type's [JSON -definition](/blockly/guides/create-custom-blocks/define/json-and-js). +definition](/guides/create-custom-blocks/define/json-and-js). ```js // Function signature. @@ -318,4 +318,4 @@ var helper = function() { ``` [shareable-procedures]: https://www.npmjs.com/package/@blockly/block-shareable-procedures -[serializer]: /blockly/guides/configure/web/serialization#serializer-hooks +[serializer]: /guides/configure/web/serialization#serializer-hooks diff --git a/packages/docs/docs/guides/create-custom-blocks/overview.mdx b/packages/docs/docs/guides/create-custom-blocks/overview.mdx index c6a9f10eb..c2bf38764 100644 --- a/packages/docs/docs/guides/create-custom-blocks/overview.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/overview.mdx @@ -73,7 +73,7 @@ can be defined in JSON or JavaScript as follows: For more information about block definitions and how they work, see [What's a block -definition?](/blockly/guides/create-custom-blocks/define/block-definitions). +definition?](/guides/create-custom-blocks/define/block-definitions). ## Block-code generators @@ -95,7 +95,7 @@ generator. It generates code for any blocks attached to inputs (such as the resulting strings into a larger expression. For more information, see [Block-code -generators](/blockly/guides/create-custom-blocks/code-generation/block-code). +generators](/guides/create-custom-blocks/code-generation/block-code). ## Toolbox reference @@ -129,5 +129,5 @@ toolbox: For more information, see [Define a flyout -toolbox](/blockly/guides/configure/web/toolboxes/flyout) or [Define a category -toolbox](/blockly/guides/configure/web/toolboxes/category). +toolbox](/guides/configure/web/toolboxes/flyout) or [Define a category +toolbox](/guides/configure/web/toolboxes/category). diff --git a/packages/docs/docs/guides/create-custom-blocks/procedures/creating-custom-procedure-blocks.mdx b/packages/docs/docs/guides/create-custom-blocks/procedures/creating-custom-procedure-blocks.mdx index 12c99763f..fbaa6cdff 100644 --- a/packages/docs/docs/guides/create-custom-blocks/procedures/creating-custom-procedure-blocks.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/procedures/creating-custom-procedure-blocks.mdx @@ -10,9 +10,9 @@ Creating custom procedure blocks requires that you: 1. Install the [@blockly/block-shareable-procedures][shareable-procedures] plugin, as described on the [using procedures - page](/blockly/guides/create-custom-blocks/procedures/using-procedures). + page](/guides/create-custom-blocks/procedures/using-procedures). 2. Use the JSON serialization system, as explained on the [overview - page](/blockly/guides/create-custom-blocks/procedures/overview). + page](/guides/create-custom-blocks/procedures/overview). :::note If you defined custom procedure blocks to work with the legacy procedure @@ -227,11 +227,11 @@ Blockly.Blocks['my_procedure_call'] = { You can also add the ability for users to modify the procedure model. Calling the `insertParameter`, `deleteParameter`, or `setReturnTypes` -[methods](/blockly/reference/js/blockly.procedures_namespace.iproceduremodel_interface) +[methods](/reference/js/blockly.procedures_namespace.iproceduremodel_interface) will automatically trigger your blocks to rerender (via `doProcedureUpdate`). Options for creating UIs to modify the procedure model include using -[mutators](/blockly/guides/create-custom-blocks/mutators#ui-hooks) (which the +[mutators](/guides/create-custom-blocks/mutators#ui-hooks) (which the built-in procedure blocks use), image fields with click handlers, something completely external to Blockly, etc. @@ -240,8 +240,8 @@ completely external to Blockly, etc. Blockly’s built-in dynamic procedure category is specific to Blockly’s built-in procedure blocks. So to be able to access your blocks, you will need to define your own [custom dynamic -category](/blockly/guides/configure/web/toolboxes/dynamic), and [add it -to your toolbox](/blockly/guides/configure/web/toolboxes/dynamic). +category](/guides/configure/web/toolboxes/dynamic), and [add it +to your toolbox](/guides/configure/web/toolboxes/dynamic). ```js const proceduresFlyoutCallback = function(workspace) { diff --git a/packages/docs/docs/guides/create-custom-blocks/procedures/creating-custom-procedure-data-models.mdx b/packages/docs/docs/guides/create-custom-blocks/procedures/creating-custom-procedure-data-models.mdx index 3ab6d29c2..acc801bbb 100644 --- a/packages/docs/docs/guides/create-custom-blocks/procedures/creating-custom-procedure-data-models.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/procedures/creating-custom-procedure-data-models.mdx @@ -126,5 +126,5 @@ class MyParameterModel { ``` [shareable-procedures]: https://www.npmjs.com/package/@blockly/block-shareable-procedures -[IProcedureModel]: /blockly/reference/js/blockly.procedures_namespace.iproceduremodel_interface -[IParameterModel]: /blockly/reference/js/blockly.procedures_namespace.iparametermodel_interface +[IProcedureModel]: /reference/js/blockly.procedures_namespace.iproceduremodel_interface +[IParameterModel]: /reference/js/blockly.procedures_namespace.iparametermodel_interface diff --git a/packages/docs/docs/guides/create-custom-blocks/procedures/overview.mdx b/packages/docs/docs/guides/create-custom-blocks/procedures/overview.mdx index 097b9987b..89f86584e 100644 --- a/packages/docs/docs/guides/create-custom-blocks/procedures/overview.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/procedures/overview.mdx @@ -14,11 +14,11 @@ a procedure, and calling it. ![Procedure caller and definition blocks](/images/procedures.png) -→ More info on [using the blocks](/blockly/guides/create-custom-blocks/procedures/using-procedures). +→ More info on [using the blocks](/guides/create-custom-blocks/procedures/using-procedures). -→ More info on [creating custom procedure blocks](/blockly/guides/create-custom-blocks/procedures/creating-custom-procedure-blocks). +→ More info on [creating custom procedure blocks](/guides/create-custom-blocks/procedures/creating-custom-procedure-blocks). -→ More info on [creating custom procedure models](/blockly/guides/create-custom-blocks/procedures/creating-custom-procedure-data-models), which allow you to add new functionality like typed parameters. +→ More info on [creating custom procedure models](/guides/create-custom-blocks/procedures/creating-custom-procedure-data-models), which allow you to add new functionality like typed parameters. ## Built-in vs plugin @@ -46,12 +46,12 @@ provided by the plugin. [Learn more about upgrading to JSON](https://docs.google.com/document/d/1wv5ORrO4icVHeU15FLSn37mdNLyJpQbMTo7mmTqsGl0/edit?usp=sharing). - If you have defined custom procedure blocks, they need to be - [updated](/blockly/guides/create-custom-blocks/procedures/creating-custom-procedure-blocks) + [updated](/guides/create-custom-blocks/procedures/creating-custom-procedure-blocks) to work with the new data models. - If you have defined custom procedure definition blocks, *but are using the built-in procedure call block*, you need to continue using the legacy caller - block until you [update](/blockly/guides/create-custom-blocks/procedures/creating-custom-procedure-blocks) + block until you [update](/guides/create-custom-blocks/procedures/creating-custom-procedure-blocks) your definition block. [shareable-procedures]: https://www.npmjs.com/package/@blockly/block-shareable-procedures diff --git a/packages/docs/docs/guides/create-custom-blocks/procedures/using-procedures.mdx b/packages/docs/docs/guides/create-custom-blocks/procedures/using-procedures.mdx index c7a01c099..a8b2fb148 100644 --- a/packages/docs/docs/guides/create-custom-blocks/procedures/using-procedures.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/procedures/using-procedures.mdx @@ -14,7 +14,7 @@ import TabItem from '@theme/TabItem'; To use procedure blocks, we recommend using the [@blockly/block-shareable-procedures][shareable-procedures] plugin. For the difference between the plugin blocks and the built-in blocks see the -[overview](/blockly/guides/create-custom-blocks/procedures/overview). +[overview](/guides/create-custom-blocks/procedures/overview). ### Installation diff --git a/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/constants.mdx b/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/constants.mdx index 43973828c..47f9c8883 100644 --- a/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/constants.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/constants.mdx @@ -37,8 +37,8 @@ block, like jagged edges for collapsed blocks. And finally, the constant provider also defines various values for things like the padding between different elements, or the minimum heights of rows. -[ConstantProvider]: /blockly/reference/js/blockly.blockrendering_namespace.constantprovider_class -[Notch]: /blockly/reference/js/blockly.blockrendering_namespace.constantprovider_class.notch_property -[PuzzleTab]: /blockly/reference/js/blockly.blockrendering_namespace.constantprovider_class.puzzle_tab_property -[connection-check]: /blockly/guides/create-custom-blocks/inputs/connection-checks -[shapeFor]: /blockly/reference/js/blockly.blockrendering_namespace.constantprovider_class.shapefor_1_method +[ConstantProvider]: /reference/js/blockly.blockrendering_namespace.constantprovider_class +[Notch]: /reference/js/blockly.blockrendering_namespace.constantprovider_class.notch_property +[PuzzleTab]: /reference/js/blockly.blockrendering_namespace.constantprovider_class.puzzle_tab_property +[connection-check]: /guides/create-custom-blocks/inputs/connection-checks +[shapeFor]: /reference/js/blockly.blockrendering_namespace.constantprovider_class.shapefor_1_method diff --git a/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/drawer.mdx b/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/drawer.mdx index 526b89c55..c8d12f2ad 100644 --- a/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/drawer.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/drawer.mdx @@ -16,9 +16,9 @@ Blockly to do this. The drawer also updates the offsets of connections within the block. -[Drawer]: /blockly/reference/js/blockly.blockrendering_namespace.drawer_class +[Drawer]: /reference/js/blockly.blockrendering_namespace.drawer_class [paths]: https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Paths -[render-info]: /blockly/guides/create-custom-blocks/renderers/concepts/info -[path-object]: /blockly/guides/create-custom-blocks/renderers/concepts/path-object -[constants]: /blockly/guides/create-custom-blocks/renderers/concepts/constants -[svg-path-utils]: /blockly/reference/js/blockly.utils_namespace.svgpaths_namespace +[render-info]: /guides/create-custom-blocks/renderers/concepts/info +[path-object]: /guides/create-custom-blocks/renderers/concepts/path-object +[constants]: /guides/create-custom-blocks/renderers/concepts/constants +[svg-path-utils]: /reference/js/blockly.utils_namespace.svgpaths_namespace diff --git a/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/elements.mdx b/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/elements.mdx index bcacd5e97..822856963 100644 --- a/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/elements.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/elements.mdx @@ -21,7 +21,7 @@ representing: * Connections * Corners -A repeat-for block with the elements outlined +A repeat-for block with the elements outlined Each element is a rectangle defining the bounds of the visual thing, plus some extra data specific to each kind of element. @@ -35,7 +35,7 @@ by the field's [`getSize`][getSize] method. An element spacer is an empty space that goes between elements in a row. -A repeat-for block with the element spacers highlighted in pink +A repeat-for block with the element spacers highlighted in pink The bounds of spacers are determined by the [render info][render-info] during measurement. After measuring all of the elements of the block, the @@ -43,10 +43,10 @@ measurement. After measuring all of the elements of the block, the the elements. The sizes don't have to be consistent; they are often different depending on the elements to either side of the spacer. -[render-info]: /blockly/guides/create-custom-blocks/renderers/concepts/info -[row]: /blockly/guides/create-custom-blocks/renderers/concepts/rows -[field-element]: /blockly/reference/js/blockly.blockrendering_namespace.field_class -[getSize]: /blockly/reference/js/blockly.field_class.getsize_1_method +[render-info]: /guides/create-custom-blocks/renderers/concepts/info +[row]: /guides/create-custom-blocks/renderers/concepts/rows +[field-element]: /reference/js/blockly.blockrendering_namespace.field_class +[getSize]: /reference/js/blockly.field_class.getsize_1_method -[element-image]: /blockly/images/rendering/debug-renderer/element.png -[element-spacer-image]: /blockly/images/rendering/debug-renderer/element-spacer.png +[element-image]: /images/rendering/debug-renderer/element.png +[element-spacer-image]: /images/rendering/debug-renderer/element-spacer.png diff --git a/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/info.mdx b/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/info.mdx index ad3e740e3..bfc1701d1 100644 --- a/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/info.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/info.mdx @@ -27,10 +27,10 @@ which are organized into non-overlapping [rows][row], and Then the [drawer][drawer] uses that organized layout information to create the SVG paths representing the block. -[RenderInfo]: /blockly/reference/js/blockly.blockrendering_namespace.renderinfo_class -[drawer]: /blockly/guides/create-custom-blocks/renderers/concepts/drawer -[row]: /blockly/guides/create-custom-blocks/renderers/concepts/rows -[element]: /blockly/guides/create-custom-blocks/renderers/concepts/elements -[row-spacer]: /blockly/guides/create-custom-blocks/renderers/concepts/rows#row-spacer -[element-spacer]: /blockly/guides/create-custom-blocks/renderers/concepts/elements#element-spacer -[external-vs-inline]: /blockly/guides/create-custom-blocks/define/inline-vs-external +[RenderInfo]: /reference/js/blockly.blockrendering_namespace.renderinfo_class +[drawer]: /guides/create-custom-blocks/renderers/concepts/drawer +[row]: /guides/create-custom-blocks/renderers/concepts/rows +[element]: /guides/create-custom-blocks/renderers/concepts/elements +[row-spacer]: /guides/create-custom-blocks/renderers/concepts/rows#row-spacer +[element-spacer]: /guides/create-custom-blocks/renderers/concepts/elements#element-spacer +[external-vs-inline]: /guides/create-custom-blocks/define/inline-vs-external diff --git a/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/overview.mdx b/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/overview.mdx index e04ccd00b..d66d070e7 100644 --- a/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/overview.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/overview.mdx @@ -62,43 +62,43 @@ helper methods. A [row][row] is a horizontal collection of [elements][element] and [element spacers][element-spacer]. -A repeat-for block with the rows outlined. +A repeat-for block with the rows outlined. ### Row spacers A [row spacer][row-spacer] is an empty vertical space that goes between two rows. -A repeat-for block with the row spacers highlighted in blue +A repeat-for block with the row spacers highlighted in blue ### Elements An [element][element] represents a visual thing on a block. These include [fields][field], [icons][icon], connections, etc. -A repeat-for block with the elements outlined +A repeat-for block with the elements outlined ### Element spacers An [element spacer][element-spacer] is an empty space that goes between elements in a row. -A repeat-for block with the element spacers highlighted in pink +A repeat-for block with the element spacers highlighted in pink -[renderer]: /blockly/guides/create-custom-blocks/renderers/concepts/renderer -[constants]: /blockly/guides/create-custom-blocks/renderers/concepts/constants -[render-info]: /blockly/guides/create-custom-blocks/renderers/concepts/info -[path-object]: /blockly/guides/create-custom-blocks/renderers/concepts/path-object -[drawer]: /blockly/guides/create-custom-blocks/renderers/concepts/drawer +[renderer]: /guides/create-custom-blocks/renderers/concepts/renderer +[constants]: /guides/create-custom-blocks/renderers/concepts/constants +[render-info]: /guides/create-custom-blocks/renderers/concepts/info +[path-object]: /guides/create-custom-blocks/renderers/concepts/path-object +[drawer]: /guides/create-custom-blocks/renderers/concepts/drawer [paths]: https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Paths -[row]: /blockly/guides/create-custom-blocks/renderers/concepts/rows -[element]: /blockly/guides/create-custom-blocks/renderers/concepts/elements -[row-spacer]: /blockly/guides/create-custom-blocks/renderers/concepts/rows#row-spacer -[element-spacer]: /blockly/guides/create-custom-blocks/renderers/concepts/elements#element-spacer -[field]: /blockly/guides/create-custom-blocks/fields/overview -[icon]: /blockly/guides/create-custom-blocks/icons/overview +[row]: /guides/create-custom-blocks/renderers/concepts/rows +[element]: /guides/create-custom-blocks/renderers/concepts/elements +[row-spacer]: /guides/create-custom-blocks/renderers/concepts/rows#row-spacer +[element-spacer]: /guides/create-custom-blocks/renderers/concepts/elements#element-spacer +[field]: /guides/create-custom-blocks/fields/overview +[icon]: /guides/create-custom-blocks/icons/overview -[row-image]: /blockly/images/rendering/debug-renderer/row.png -[row-spacer-image]: /blockly/images/rendering/debug-renderer/row-spacer.png -[element-image]: /blockly/images/rendering/debug-renderer/element.png -[element-spacer-image]: /blockly/images/rendering/debug-renderer/element-spacer.png +[row-image]: /images/rendering/debug-renderer/row.png +[row-spacer-image]: /images/rendering/debug-renderer/row-spacer.png +[element-image]: /images/rendering/debug-renderer/element.png +[element-spacer-image]: /images/rendering/debug-renderer/element-spacer.png diff --git a/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/path-object.mdx b/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/path-object.mdx index 9145021b6..8d446f17b 100644 --- a/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/path-object.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/path-object.mdx @@ -26,9 +26,9 @@ It also handles: * Applying [theme colors][theme] to the SVG elements. * Applying other styling to the SVG elements. -[PathObject]: /blockly/reference/js/blockly.blockrendering_namespace.pathobject_class -[theme]: /blockly/guides/configure/web/appearance/themes#block-style -[built-in-renderers]: /blockly/guides/create-custom-blocks/renderers/overview#built-in-renderers -[drawer]: /blockly/guides/create-custom-blocks/renderers/concepts/drawer -[geras-paths-image]: /blockly/images/rendering/renderers/geras-paths.png -[thrasos-paths-image]: /blockly/images/rendering/renderers/thrasos-paths.png +[PathObject]: /reference/js/blockly.blockrendering_namespace.pathobject_class +[theme]: /guides/configure/web/appearance/themes#block-style +[built-in-renderers]: /guides/create-custom-blocks/renderers/overview#built-in-renderers +[drawer]: /guides/create-custom-blocks/renderers/concepts/drawer +[geras-paths-image]: /images/rendering/renderers/geras-paths.png +[thrasos-paths-image]: /images/rendering/renderers/thrasos-paths.png diff --git a/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/renderer.mdx b/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/renderer.mdx index 9ea166ab1..6330a955f 100644 --- a/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/renderer.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/renderer.mdx @@ -16,8 +16,8 @@ And it contains code for wiring them all together when it renders a block. If you want to change just one part of an existing renderer (e.g. the constants) you can subclass the relevant factory method. -[Renderer]: /blockly/reference/js/blockly.blockrendering_namespace.renderer_class -[constants]: /blockly/guides/create-custom-blocks/renderers/concepts/constants -[render-info]: /blockly/guides/create-custom-blocks/renderers/concepts/info -[path-object]: /blockly/guides/create-custom-blocks/renderers/concepts/path-object -[drawer]: /blockly/guides/create-custom-blocks/renderers/concepts/drawer +[Renderer]: /reference/js/blockly.blockrendering_namespace.renderer_class +[constants]: /guides/create-custom-blocks/renderers/concepts/constants +[render-info]: /guides/create-custom-blocks/renderers/concepts/info +[path-object]: /guides/create-custom-blocks/renderers/concepts/path-object +[drawer]: /guides/create-custom-blocks/renderers/concepts/drawer diff --git a/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/rows.mdx b/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/rows.mdx index 5accc4cb9..b17d572d2 100644 --- a/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/rows.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/renderers/concepts/rows.mdx @@ -23,7 +23,7 @@ a different number of rows! A [`Row`][Row] is a horizontal collection of non-overlapping [elements][element] and [element spacers][element-spacer]. -A repeat-for block with the rows outlined. +A repeat-for block with the rows outlined. The bounds of a row are determined by the bounds of the [elements][element] and [spacers][element-spacer] that belong to that row, so that all of the elements @@ -34,18 +34,18 @@ are contained. A [`RowSpacer`][RowSpacer] is an empty vertical space that goes between two rows. -A repeat-for block with the row spacers highlighted in blue +A repeat-for block with the row spacers highlighted in blue The bounds of the row spacers are determined by the [render info][render-info] itself. After measuring all of the rows of the block, the [render info][render-info] inserts spaces of its chosen size between rows. -[Row]: /blockly/reference/js/blockly.blockrendering_namespace.row_class -[RowSpacer]: /blockly/reference/js/blockly.blockrendering_namespace.spacerrow_class -[render-info]: /blockly/guides/create-custom-blocks/renderers/concepts/info -[external-vs-inline]: /blockly/guides/create-custom-blocks/define/inline-vs-external -[element]: /blockly/guides/create-custom-blocks/renderers/concepts/elements -[element-spacer]: /blockly/guides/create-custom-blocks/renderers/concepts/elements#element-spacer +[Row]: /reference/js/blockly.blockrendering_namespace.row_class +[RowSpacer]: /reference/js/blockly.blockrendering_namespace.spacerrow_class +[render-info]: /guides/create-custom-blocks/renderers/concepts/info +[external-vs-inline]: /guides/create-custom-blocks/define/inline-vs-external +[element]: /guides/create-custom-blocks/renderers/concepts/elements +[element-spacer]: /guides/create-custom-blocks/renderers/concepts/elements#element-spacer -[row-image]: /blockly/images/rendering/debug-renderer/row.png -[row-spacer-image]: /blockly/images/rendering/debug-renderer/row-spacer.png +[row-image]: /images/rendering/debug-renderer/row.png +[row-spacer-image]: /images/rendering/debug-renderer/row-spacer.png diff --git a/packages/docs/docs/guides/create-custom-blocks/renderers/create-custom-renderers/basic-implementation.mdx b/packages/docs/docs/guides/create-custom-blocks/renderers/create-custom-renderers/basic-implementation.mdx index 938041035..f26e2712b 100644 --- a/packages/docs/docs/guides/create-custom-blocks/renderers/create-custom-renderers/basic-implementation.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/renderers/create-custom-renderers/basic-implementation.mdx @@ -28,7 +28,7 @@ class CustomRenderer extends Blockly.blockRendering.Renderer { Without any customization, the default renderer looks like this: -base renderer +base renderer You can also subclass one of the other [built-in renderers][built-in-renderers] and then override parts of it. @@ -85,16 +85,16 @@ const workspace = Blockly.inject(blocklyDiv, { }); ``` -[Renderer]: /blockly/reference/js/blockly.blockrendering_namespace.renderer_class -[renderer-concept]: /blockly/guides/create-custom-blocks/renderers/concepts/renderer -[base-renderer-image]: /blockly/images/rendering/renderers/base-renderer.png -[built-in-renderers]: /blockly/guides/create-custom-blocks/renderers/overview#built-in-renderers -[renderer-component]: /blockly/guides/create-custom-blocks/renderers/concepts/overview -[connection-shape]: /blockly/guides/create-custom-blocks/renderers/create-custom-renderers/connection-shapes -[constants]: /blockly/guides/create-custom-blocks/renderers/concepts/constants -[makeConstants]: /blockly/reference/js/blockly.blockrendering_namespace.renderer_class.makeconstants__1_method -[makeRenderInfo]: /blockly/reference/js/blockly.blockrendering_namespace.renderer_class.makerenderinfo__1_method -[makePathObject]: /blockly/reference/js/blockly.blockrendering_namespace.renderer_class.makepathobject_1_method -[makeDrawer]: /blockly/reference/js/blockly.blockrendering_namespace.renderer_class.makedrawer__1_method -[inject-config]: /blockly/guides/configure/web/configuration_struct -[custom-renderer-codelab]: /blockly/codelabs/custom-renderer/codelab-overview/index.html +[Renderer]: /reference/js/blockly.blockrendering_namespace.renderer_class +[renderer-concept]: /guides/create-custom-blocks/renderers/concepts/renderer +[base-renderer-image]: /images/rendering/renderers/base-renderer.png +[built-in-renderers]: /guides/create-custom-blocks/renderers/overview#built-in-renderers +[renderer-component]: /guides/create-custom-blocks/renderers/concepts/overview +[connection-shape]: /guides/create-custom-blocks/renderers/create-custom-renderers/connection-shapes +[constants]: /guides/create-custom-blocks/renderers/concepts/constants +[makeConstants]: /reference/js/blockly.blockrendering_namespace.renderer_class.makeconstants__1_method +[makeRenderInfo]: /reference/js/blockly.blockrendering_namespace.renderer_class.makerenderinfo__1_method +[makePathObject]: /reference/js/blockly.blockrendering_namespace.renderer_class.makepathobject_1_method +[makeDrawer]: /reference/js/blockly.blockrendering_namespace.renderer_class.makedrawer__1_method +[inject-config]: /guides/configure/web/configuration_struct +[custom-renderer-codelab]: /codelabs/custom-renderer/codelab-overview/index.html diff --git a/packages/docs/docs/guides/create-custom-blocks/renderers/create-custom-renderers/connection-shapes.mdx b/packages/docs/docs/guides/create-custom-blocks/renderers/create-custom-renderers/connection-shapes.mdx index 696bdb82b..8fecbfcdb 100644 --- a/packages/docs/docs/guides/create-custom-blocks/renderers/create-custom-renderers/connection-shapes.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/renderers/create-custom-renderers/connection-shapes.mdx @@ -14,7 +14,7 @@ increasing difficulty. All of them require creating a ## Basic dimensions -connections with different dimensions +connections with different dimensions You can customize connections by changing their width or height, while maintaining the same basic shape. To do this, you need to create a @@ -50,7 +50,7 @@ class CustomConstantProvider extends Blockly.blockRendering.ConstantProvider { ## Basic shapes -connections with different shapes +connections with different shapes You can customize connections by overriding their basic shape. Basic shapes have a height, a width, and *two* paths. @@ -65,7 +65,7 @@ previous connections are drawn from left to right, but next connections are drawn from right to left. So you need to provide paths for both of those cases. -the direction a block gets drawn in +the direction a block gets drawn in :::note the [path object][path-object] handles flipping paths in RTL mode, so @@ -102,7 +102,7 @@ as a thin wrapper around these strings to make them more readable. ## Shapes for connection checks -different connections with different shapes +different connections with different shapes You can customize connections by changing the shape based on the connection's [connection check][connection-check]. @@ -212,11 +212,11 @@ Custom inputs can either: * Affect the outline of your block, like statement inputs - image of outline inputs + image of outline inputs * Or affect the internals of your block, like inline value inputs - image of internal inputs + image of internal inputs If the input affects the outline of your block, override [`drawOutline_`][drawOutline], otherwise, override @@ -266,36 +266,36 @@ export class Drawer extends Blockly.blockRendering.Drawer { } ``` -[overridden-connection-constants-image]: /blockly/images/rendering/connection-shapes/overridden-connection-constants.png -[connection-check-specific-shapes-image]: /blockly/images/rendering/connection-shapes/connection-check-specific-shapes.png -[overridden-connection-shapes-image]: /blockly/images/rendering/connection-shapes/overridden-connection-shapes.png -[shape-direction-image]: /blockly/images/rendering/connection-shapes/shape-direction.png -[drawing-direction-image]: /blockly/images/rendering/connection-shapes/drawing-direction.png -[outline-inputs-image]: /blockly/images/rendering/connection-shapes/outline-inputs.png -[internal-inputs-image]: /blockly/images/rendering/connection-shapes/internal-inputs.png -[basic-implementation]: /blockly/guides/create-custom-blocks/renderers/create-custom-renderers/basic-implementation -[constants]: /blockly/guides/create-custom-blocks/renderers/concepts/constants -[BaseConstants]: /blockly/reference/js/blockly.blockrendering_namespace.constantprovider_class -[GerasConstants]: /blockly/reference/js/blockly.geras_namespace.constantprovider_class -[ZelosConstants]: /blockly/reference/js/blockly.zelos_namespace.constantprovider_class -[NOTCH_WIDTH]: /blockly/reference/js/blockly.blockrendering_namespace.constantprovider_class.notch_width_property -[NOTCH_HEIGHT]: /blockly/reference/js/blockly.blockrendering_namespace.constantprovider_class.notch_height_property -[TAB_WIDTH]: /blockly/reference/js/blockly.blockrendering_namespace.constantprovider_class.tab_width_property -[TAB_HEIGHT]: /blockly/reference/js/blockly.blockrendering_namespace.constantprovider_class.tab_height_property -[path-object]: /blockly/guides/create-custom-blocks/renderers/concepts/path-object -[makeNotch]: /blockly/reference/js/blockly.blockrendering_namespace.constantprovider_class.makenotch_1_method -[makePuzzleTab]: /blockly/reference/js/blockly.blockrendering_namespace.constantprovider_class.makepuzzletab_1_method -[connection-check]: /blockly/guides/create-custom-blocks/inputs/connection-checks -[shapeFor]: /blockly/reference/js/blockly.blockrendering_namespace.constantprovider_class.shapefor_1_method +[overridden-connection-constants-image]: /images/rendering/connection-shapes/overridden-connection-constants.png +[connection-check-specific-shapes-image]: /images/rendering/connection-shapes/connection-check-specific-shapes.png +[overridden-connection-shapes-image]: /images/rendering/connection-shapes/overridden-connection-shapes.png +[shape-direction-image]: /images/rendering/connection-shapes/shape-direction.png +[drawing-direction-image]: /images/rendering/connection-shapes/drawing-direction.png +[outline-inputs-image]: /images/rendering/connection-shapes/outline-inputs.png +[internal-inputs-image]: /images/rendering/connection-shapes/internal-inputs.png +[basic-implementation]: /guides/create-custom-blocks/renderers/create-custom-renderers/basic-implementation +[constants]: /guides/create-custom-blocks/renderers/concepts/constants +[BaseConstants]: /reference/js/blockly.blockrendering_namespace.constantprovider_class +[GerasConstants]: /reference/js/blockly.geras_namespace.constantprovider_class +[ZelosConstants]: /reference/js/blockly.zelos_namespace.constantprovider_class +[NOTCH_WIDTH]: /reference/js/blockly.blockrendering_namespace.constantprovider_class.notch_width_property +[NOTCH_HEIGHT]: /reference/js/blockly.blockrendering_namespace.constantprovider_class.notch_height_property +[TAB_WIDTH]: /reference/js/blockly.blockrendering_namespace.constantprovider_class.tab_width_property +[TAB_HEIGHT]: /reference/js/blockly.blockrendering_namespace.constantprovider_class.tab_height_property +[path-object]: /guides/create-custom-blocks/renderers/concepts/path-object +[makeNotch]: /reference/js/blockly.blockrendering_namespace.constantprovider_class.makenotch_1_method +[makePuzzleTab]: /reference/js/blockly.blockrendering_namespace.constantprovider_class.makepuzzletab_1_method +[connection-check]: /guides/create-custom-blocks/inputs/connection-checks +[shapeFor]: /reference/js/blockly.blockrendering_namespace.constantprovider_class.shapefor_1_method [basic-shapes]: #basic-shapes -[custom-input]: /blockly/guides/create-custom-blocks/inputs/creating-custom-inputs -[measurable]: /blockly/guides/create-custom-blocks/renderers/concepts/overview#block-measurables -[InputConnection]: /blockly/reference/js/blockly.blockrendering_namespace.inputconnection_class -[render-info]: /blockly/guides/create-custom-blocks/renderers/concepts/info -[addInput]: /blockly/reference/js/blockly.blockrendering_namespace.renderinfo_class.addinput__1_method -[row]: /blockly/guides/create-custom-blocks/renderers/concepts/rows -[shouldStartNewRow]: /blockly/reference/js/blockly.blockrendering_namespace.renderinfo_class.shouldstartnewrow__1_method -[drawer]: /blockly/guides/create-custom-blocks/renderers/concepts/drawer -[drawOutline]: /blockly/reference/js/blockly.blockrendering_namespace.drawer_class.drawoutline__1_method -[drawInternals]: /blockly/reference/js/blockly.blockrendering_namespace.drawer_class.drawinternals__1_method +[custom-input]: /guides/create-custom-blocks/inputs/creating-custom-inputs +[measurable]: /guides/create-custom-blocks/renderers/concepts/overview#block-measurables +[InputConnection]: /reference/js/blockly.blockrendering_namespace.inputconnection_class +[render-info]: /guides/create-custom-blocks/renderers/concepts/info +[addInput]: /reference/js/blockly.blockrendering_namespace.renderinfo_class.addinput__1_method +[row]: /guides/create-custom-blocks/renderers/concepts/rows +[shouldStartNewRow]: /reference/js/blockly.blockrendering_namespace.renderinfo_class.shouldstartnewrow__1_method +[drawer]: /guides/create-custom-blocks/renderers/concepts/drawer +[drawOutline]: /reference/js/blockly.blockrendering_namespace.drawer_class.drawoutline__1_method +[drawInternals]: /reference/js/blockly.blockrendering_namespace.drawer_class.drawinternals__1_method [svg-path]: https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Paths diff --git a/packages/docs/docs/guides/create-custom-blocks/renderers/overview.mdx b/packages/docs/docs/guides/create-custom-blocks/renderers/overview.mdx index 26f6b56c0..d1c64f388 100644 --- a/packages/docs/docs/guides/create-custom-blocks/renderers/overview.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/renderers/overview.mdx @@ -43,10 +43,10 @@ Blockly team recommends you: 3. Add the [debug renderer][debug-renderer] to your project. 4. Customize your renderer. -[block-definition]: /blockly/guides/create-custom-blocks/define/block-definitions -[concept]: /blockly/guides/create-custom-blocks/renderers/concepts/overview -[custom-renderer-codelab]: /blockly/codelabs/custom-renderer/codelab-overview/index.html +[block-definition]: /guides/create-custom-blocks/define/block-definitions +[concept]: /guides/create-custom-blocks/renderers/concepts/overview +[custom-renderer-codelab]: /codelabs/custom-renderer/codelab-overview/index.html [debug-renderer]: https://www.npmjs.com/package/@blockly/dev-tools#debug-renderer -[thrasos]: /blockly/images/rendering/renderers/thrasos.png -[geras]: /blockly/images/rendering/renderers/geras.png -[zelos]: /blockly/images/rendering/renderers/zelos.png +[thrasos]: /images/rendering/renderers/thrasos.png +[geras]: /images/rendering/renderers/geras.png +[zelos]: /images/rendering/renderers/zelos.png diff --git a/packages/docs/docs/guides/create-custom-blocks/variables.mdx b/packages/docs/docs/guides/create-custom-blocks/variables.mdx index 25bcb19b3..4ad749b87 100644 --- a/packages/docs/docs/guides/create-custom-blocks/variables.mdx +++ b/packages/docs/docs/guides/create-custom-blocks/variables.mdx @@ -205,7 +205,7 @@ while providing a `variableTypes` array will cause an error to be thrown. By default there is no visual indicator to tell the user which type is being used. One easy way to differentiate variable types is by -[colour](/blockly/guides/configure/web/appearance/block-colour). +[colour](/guides/configure/web/appearance/block-colour). :::note The `variableTypes` key is optional on a field_variable. If it is @@ -218,7 +218,7 @@ all variables of any type use `"variableTypes": null`. To make this new type of variable useful to your users, you need to add a way to create and use the new variables. -Create a new [dynamic category](/blockly/guides/configure/web/toolboxes/dynamic) +Create a new [dynamic category](/guides/configure/web/toolboxes/dynamic) for variables if you do not already have one. ![An open category named "Variables" containing a "Create variable" @@ -234,7 +234,7 @@ blocks, and getter blocks.](/images/variables-category-filled.png) ### Create Variable Button Next, your user needs a way to create variables. The simplest way is with a -"Create Variable" [button](/blockly/guides/configure/web/toolboxes/buttons). +"Create Variable" [button](/guides/configure/web/toolboxes/buttons). When creating the button, make the callback call ```js @@ -260,4 +260,4 @@ with `Workspace.getVariableMap().getAllVariables()` to get all variables of all types or `Workspace.getVariableMap().getVariablesOfType()` to get all variables of a specific type. -[block-code-generator]: /blockly/guides/create-custom-blocks/code-generation/overview#block-code-generators +[block-code-generator]: /guides/create-custom-blocks/code-generation/overview#block-code-generators diff --git a/packages/docs/docs/guides/design/app-overview.mdx b/packages/docs/docs/guides/design/app-overview.mdx index fe1d45ed9..005493c44 100644 --- a/packages/docs/docs/guides/design/app-overview.mdx +++ b/packages/docs/docs/guides/design/app-overview.mdx @@ -13,8 +13,8 @@ A Blockly application is a web application that contains a Blockly editor for and looks at typical UI features. If you haven't already done so, be sure to read the [visual -glossary](/blockly/guides/get-started/workspace-anatomy) and [basic application -steps](/blockly/guides/get-started/workspace-creation) before continuing with +glossary](/guides/get-started/workspace-anatomy) and [basic application +steps](/guides/get-started/workspace-creation) before continuing with this document. ## What do Blockly applications do? @@ -66,7 +66,7 @@ Almost all Blockly applications share a few basic components: a Blockly editor (workspace), an output panel, and a "Run" button. For example, here is the UI of the [Maze](https://blockly.games/maze?level=4) in Blockly Games. -The UI of a maze application with an editor, an output panel, and a Run button. +The UI of a maze application with an editor, an output panel, and a Run button. A few Blockly applications omit the "Run" button and instead update the output panel every time the user makes a change. For example, the @@ -74,7 +74,7 @@ panel every time the user makes a change. For example, the application in Blockly's samples has two output panels (one for the graph and one for the equation) that it updates on every change. -The UI of a graph application with an editor, an output panel for an equation constructed by the user, and an output panel for a graph of that equation. +The UI of a graph application with an editor, an output panel for an equation constructed by the user, and an output panel for a graph of that equation. Some applications don't have an output panel. This is most common in hardware applications, such as those for programming robots. While some of these @@ -91,22 +91,22 @@ needs, such as designing a GUI. Here are some examples: and video games, has graphics and sound editors; panels to create new sprites and backdrops; and file, edit, and settings menus: - The Scratch user interface. + The Scratch user interface. * [MakeCode Arcade](https://www.microsoft.com/en-us/makecode), an application for creating video games, has output controls, code and graphics editors, a settings menu, and download and save buttons. Its output panel simulates a handheld game controller. - The MakeCode Arcade user interface. + The MakeCode Arcade user interface. * [MIT App Inventor](https://appinventor.mit.edu/), an application for creating phone apps, has separate screens for its GUI designer and Blockly editor, as well as file, connection, build, and settings menus. Instead of an output panel, users test generated code on their phone. - The GUI designer in the App Inventor user interface - The Blockly editor in the App Inventor user interface + The GUI designer in the App Inventor user interface + The Blockly editor in the App Inventor user interface Which additional components you should include depends on your application's goals and the abilities of your users. Some common components are: @@ -142,14 +142,14 @@ goals and the abilities of your users. Some common components are: ## Where do I go from here? If you're still thinking about your application, continue reading about [design -considerations](/blockly/guides/design/applications). +considerations](/guides/design/applications). If you want to see what it's like to build a simple application, try the [Getting started with Blockly -codelab](/blockly/codelabs/getting-started/codelab-overview/index.html). +codelab](/codelabs/getting-started/codelab-overview/index.html). And if you're ready to write your application: -* [Build your editor](/blockly/guides/configure/web/configuration_struct) -* [Build your blocks](/blockly/guides/create-custom-blocks/overview) -* [Build your application](/blockly/guides/app-integration/run-code) +* [Build your editor](/guides/configure/web/configuration_struct) +* [Build your blocks](/guides/create-custom-blocks/overview) +* [Build your application](/guides/app-integration/run-code) diff --git a/packages/docs/docs/guides/design/applications.mdx b/packages/docs/docs/guides/design/applications.mdx index caa506b25..ca820a4dd 100644 --- a/packages/docs/docs/guides/design/applications.mdx +++ b/packages/docs/docs/guides/design/applications.mdx @@ -121,10 +121,10 @@ Some developers like to add a 'hat' to the top of event blocks so that they look distinct from other blocks. This is not the default look for Blockly, but it may be added by either overriding the renderer constant `ADD_START_HATS` to `true` ([Custom renderers codelab - Override -constants](/blockly/codelabs/custom-renderer/override-constants/index.html)). +constants](/codelabs/custom-renderer/override-constants/index.html)). or by adding a theme and setting the hat option on the block style. For more information for setting hats on blocks as part of themes, see [Block -style](/blockly/guides/configure/web/appearance/themes/#block-style) in the themes +style](/guides/configure/web/appearance/themes/#block-style) in the themes documentation. ![The same "on mouse click" blocks with hats, which form a hump on top of the diff --git a/packages/docs/docs/guides/get-started/blocks.mdx b/packages/docs/docs/guides/get-started/blocks.mdx index 5dd51b53b..361eae87e 100644 --- a/packages/docs/docs/guides/get-started/blocks.mdx +++ b/packages/docs/docs/guides/get-started/blocks.mdx @@ -57,12 +57,12 @@ const definitions = Blockly.common.createBlockDefinitionsFromJsonArray([ Blockly.common.defineBlocks(definitions); ``` -A block for moving forward +A block for moving forward For more information about how to define your blocks and add them to your toolbox, see [Custom blocks overview][define-blocks]. -[visual-glossary-blocks]: /blockly/guides/get-started/workspace-anatomy#blocks -[block-code-generator]: /blockly/guides/get-started/code-generation -[define-blocks]: /blockly/guides/create-custom-blocks/overview -[move-forward]: /blockly/images/example-blocks/move-forward.png +[visual-glossary-blocks]: /guides/get-started/workspace-anatomy#blocks +[block-code-generator]: /guides/get-started/code-generation +[define-blocks]: /guides/create-custom-blocks/overview +[move-forward]: /images/example-blocks/move-forward.png diff --git a/packages/docs/docs/guides/get-started/code-generation.mdx b/packages/docs/docs/guides/get-started/code-generation.mdx index 36fe9a2c7..5b9695d75 100644 --- a/packages/docs/docs/guides/get-started/code-generation.mdx +++ b/packages/docs/docs/guides/get-started/code-generation.mdx @@ -63,6 +63,6 @@ of Blockly. For more information about ways to execute code, see [Generate and run code][code-execution]. -[code-generator-overview]: /blockly/guides/create-custom-blocks/code-generation/overview#language-code-generators -[block-code-generators]: /blockly/guides/create-custom-blocks/code-generation/overview#block-code-generators -[code-execution]: /blockly/guides/create-custom-blocks/code-generation/overview#generate-and-run-code +[code-generator-overview]: /guides/create-custom-blocks/code-generation/overview#language-code-generators +[block-code-generators]: /guides/create-custom-blocks/code-generation/overview#block-code-generators +[code-execution]: /guides/create-custom-blocks/code-generation/overview#generate-and-run-code diff --git a/packages/docs/docs/guides/get-started/get-the-code.mdx b/packages/docs/docs/guides/get-started/get-the-code.mdx index fb17b0699..af886eeb0 100644 --- a/packages/docs/docs/guides/get-started/get-the-code.mdx +++ b/packages/docs/docs/guides/get-started/get-the-code.mdx @@ -187,7 +187,7 @@ Blockly.setLocale(En); [npm-registry]: https://www.npmjs.com/package/blockly [yarn-registry]: https://yarnpkg.com/package/blockly -[plugins]: /blockly/guides/programming/plugin_overview +[plugins]: /guides/programming/plugin_overview [github-releases]: https://github.com/RaspberryPiFoundation/blockly/releases [install-node-npm]: https://docs.npmjs.com/downloading-and-installing-node-js-and-npm [webpack]: https://webpack.js.org/guides/ diff --git a/packages/docs/docs/guides/get-started/save-and-load.mdx b/packages/docs/docs/guides/get-started/save-and-load.mdx index 2857191fe..6d917ad3e 100644 --- a/packages/docs/docs/guides/get-started/save-and-load.mdx +++ b/packages/docs/docs/guides/get-started/save-and-load.mdx @@ -42,4 +42,4 @@ Blockly.serialization.workspaces.load(state, myWorkspace); This creates all of your saved blocks, variables, and other elements in the workspace. -[serialization]: /blockly/guides/configure/web/serialization +[serialization]: /guides/configure/web/serialization diff --git a/packages/docs/docs/guides/get-started/toolbox.mdx b/packages/docs/docs/guides/get-started/toolbox.mdx index 6ea472252..3b87c3084 100644 --- a/packages/docs/docs/guides/get-started/toolbox.mdx +++ b/packages/docs/docs/guides/get-started/toolbox.mdx @@ -53,6 +53,6 @@ For more information about how to define and configure your toolbox, see For more information about injection, see [Workspace creation][workspace-creation]. -[visual-glossary-toolbox]: /blockly/guides/get-started/workspace-anatomy#toolbox -[toolbox-overview]: /blockly/guides/configure/web/toolboxes/toolbox -[workspace-creation]: /blockly/guides/get-started/workspace-creation +[visual-glossary-toolbox]: /guides/get-started/workspace-anatomy#toolbox +[toolbox-overview]: /guides/configure/web/toolboxes/toolbox +[workspace-creation]: /guides/get-started/workspace-creation diff --git a/packages/docs/docs/guides/get-started/what-is-blockly.mdx b/packages/docs/docs/guides/get-started/what-is-blockly.mdx index b557bdd94..a9f69f3c5 100644 --- a/packages/docs/docs/guides/get-started/what-is-blockly.mdx +++ b/packages/docs/docs/guides/get-started/what-is-blockly.mdx @@ -31,11 +31,11 @@ You define the string (usually code) that gets generated for each block, and then Blockly handles concatenating whole strings of blocks. What you do with that result is up to you. You can do anything from solving a maze, to animating a character, to analyzing some data. For more examples, see the [Introduction to -Blockly applications](/blockly/guides/design/app-overview). +Blockly applications](/guides/design/app-overview). Blockly lets you focus on applying blocks to your domain without worrying about the details of how blocks work. For more information see [Why Blockly?][why-blockly] [blockly-apps]: https://blockly.com/#learn-with-blockly -[why-blockly]: /blockly/guides/get-started/why-blockly +[why-blockly]: /guides/get-started/why-blockly diff --git a/packages/docs/docs/guides/get-started/workspace-anatomy.mdx b/packages/docs/docs/guides/get-started/workspace-anatomy.mdx index 659df8406..d25c73e16 100644 --- a/packages/docs/docs/guides/get-started/workspace-anatomy.mdx +++ b/packages/docs/docs/guides/get-started/workspace-anatomy.mdx @@ -7,38 +7,38 @@ image: images/blockly_banner.png import Image from '@site/src/components/Image'; import ClassBlock from '@site/src/components/ClassBlock'; -[workspace]: /blockly/guides/configure/web/configuration_struct -[workspace-img]: /blockly/images/glossary/workspace.png -[output-img]: /blockly/images/connections/output-connection.png -[input-img]: /blockly/images/connections/input-connection.png -[inputs-img]: /blockly/images/glossary/inputs.png -[previous-img]: /blockly/images/connections/previous-connection.png -[next-img]: /blockly/images/connections/next-connection.png -[category-toolbox]: /blockly/guides/configure/web/toolboxes/category -[category-toolbox-img]: /blockly/images/glossary/category-toolbox.png -[category-with-flyout-toolbox-img]: /blockly/images/glossary/category-with-flyout-toolbox.png -[flyout-toolbox]: /blockly/guides/configure/web/toolboxes/flyout -[flyout-toolbox-img]: /blockly/images/glossary/flyout-toolbox.png -[trashcan-img]: /blockly/images/glossary/trashcan.png -[zoom-controls-img]: /blockly/images/glossary/zoom-controls.png -[context-menu-img]: /blockly/images/glossary/context-menu.png -[blocks-img]: /blockly/images/glossary/blocks.png -[block-stack-img]: /blockly/images/glossary/block-stack.png -[shadow-block]: /blockly/guides/configure/web/toolboxes/preset#shadow-blocks -[shadow-blocks-img]: /blockly/images/glossary/shadow-blocks.png -[insertion-marker-img]: /blockly/images/glossary/insertion-marker.png -[statement-img]: /blockly/images/connections/statement-input.png -[fields-img]: /blockly/images/glossary/fields.png -[icons-img]: /blockly/images/glossary/icons.png -[bubbles-img]: /blockly/images/bubbles/bubbles.png -[toolbox]: /blockly/guides/configure/web/toolboxes/toolbox -[zoom-controls]: /blockly/guides/configure/web/zoom -[context-menu]: /blockly/guides/configure/web/context-menus -[block]: /blockly/guides/create-custom-blocks/overview -[input]: /blockly/guides/create-custom-blocks/define/block-anatomy#inputs -[connection]: /blockly/guides/create-custom-blocks/define/block-anatomy#connections -[field]: /blockly/guides/create-custom-blocks/define/block-anatomy#fields -[icon]: /blockly/guides/create-custom-blocks/define/block-anatomy#icons +[workspace]: /guides/configure/web/configuration_struct +[workspace-img]: /images/glossary/workspace.png +[output-img]: /images/connections/output-connection.png +[input-img]: /images/connections/input-connection.png +[inputs-img]: /images/glossary/inputs.png +[previous-img]: /images/connections/previous-connection.png +[next-img]: /images/connections/next-connection.png +[category-toolbox]: /guides/configure/web/toolboxes/category +[category-toolbox-img]: /images/glossary/category-toolbox.png +[category-with-flyout-toolbox-img]: /images/glossary/category-with-flyout-toolbox.png +[flyout-toolbox]: /guides/configure/web/toolboxes/flyout +[flyout-toolbox-img]: /images/glossary/flyout-toolbox.png +[trashcan-img]: /images/glossary/trashcan.png +[zoom-controls-img]: /images/glossary/zoom-controls.png +[context-menu-img]: /images/glossary/context-menu.png +[blocks-img]: /images/glossary/blocks.png +[block-stack-img]: /images/glossary/block-stack.png +[shadow-block]: /guides/configure/web/toolboxes/preset#shadow-blocks +[shadow-blocks-img]: /images/glossary/shadow-blocks.png +[insertion-marker-img]: /images/glossary/insertion-marker.png +[statement-img]: /images/connections/statement-input.png +[fields-img]: /images/glossary/fields.png +[icons-img]: /images/glossary/icons.png +[bubbles-img]: /images/bubbles/bubbles.png +[toolbox]: /guides/configure/web/toolboxes/toolbox +[zoom-controls]: /guides/configure/web/zoom +[context-menu]: /guides/configure/web/context-menus +[block]: /guides/create-custom-blocks/overview +[input]: /guides/create-custom-blocks/define/block-anatomy#inputs +[connection]: /guides/create-custom-blocks/define/block-anatomy#connections +[field]: /guides/create-custom-blocks/define/block-anatomy#fields +[icon]: /guides/create-custom-blocks/define/block-anatomy#icons # Visual glossary @@ -53,7 +53,7 @@ The [workspace][workspace] is the highest level component in Blockly. It contains all of the other components. This is where you do the work of programming! -A workspace with a category toolbox, scroll bars, trashcan, and zoom controls. +A workspace with a category toolbox, scroll bars, trashcan, and zoom controls. ### Toolbox @@ -68,13 +68,13 @@ These can both be displayed vertically and horizontally. [Flyout toolboxes][flyout-toolbox] (aka simple toolboxes) have one set of blocks which is displayed at all times. -A workspace with a flyout toolbox containing four blocks. +A workspace with a flyout toolbox containing four blocks. #### Category toolbox [Category toolboxes][category-toolbox] have multiple sets of blocks. -A workspace with a category toolbox with eight categories (Logic, Loops, Math, etc.). No blocks are visible because no categories have been opened. +A workspace with a category toolbox with eight categories (Logic, Loops, Math, etc.). No blocks are visible because no categories have been opened. If you click a category item it opens a flyout that displays the blocks in the category. @@ -130,7 +130,7 @@ A [shadow block][shadow-block] is an editable but non-movable block connected to another block. You can drag non-shadow blocks on top of shadow blocks to overwrite them. -A block for rounding numbers connected to a shadow number block, and a print block connected to a shadow text block. The shadow blocks are greyed out to show that they are default blocks and that you can drag other blocks on top of them. +A block for rounding numbers connected to a shadow number block, and a print block connected to a shadow text block. The shadow blocks are greyed out to show that they are default blocks and that you can drag other blocks on top of them. ### Insertion marker @@ -160,17 +160,17 @@ A [connection][connection] is a place on a block other blocks can connect to. | Connection | Image | |------------------|------------------------------------------------------| -| Output | an output connection | -| Input | an input connection | -| Previous | a previous connection | -| Next | a next connection | +| Output | an output connection | +| Input | an input connection | +| Previous | a previous connection | +| Next | a next connection | ### Inputs An [input][input] is a container for fields and connections. A block is built by rendering its inputs in one or more rows like bricks. -Block built from a value input, an end-of-row input, and a statement input. +Block built from a value input, an end-of-row input, and a statement input. All inputs can contain fields. Only value and statement inputs can contain a connection. diff --git a/packages/docs/docs/guides/get-started/workspace-creation.mdx b/packages/docs/docs/guides/get-started/workspace-creation.mdx index 22d888c18..85200fc22 100644 --- a/packages/docs/docs/guides/get-started/workspace-creation.mdx +++ b/packages/docs/docs/guides/get-started/workspace-creation.mdx @@ -54,7 +54,7 @@ during injection. For more information about configuration options, see [Configuration options][config-options]. -[visual-glossary]: /blockly/guides/get-started/workspace-anatomy -[config-options]: /blockly/guides/configure/web/configuration_struct#the-options-dictionary +[visual-glossary]: /guides/get-started/workspace-anatomy +[config-options]: /guides/configure/web/configuration_struct#the-options-dictionary [fixed-demo]: https://raspberrypifoundation.github.io/blockly-samples/examples/fixed-demo/index.html [resizable-demo]: https://raspberrypifoundation.github.io/blockly-samples/examples/resizable-demo/index.html diff --git a/packages/docs/docs/guides/programming/forking_blockly.mdx b/packages/docs/docs/guides/programming/forking_blockly.mdx index 3ab14d8cf..5a1ba6af5 100644 --- a/packages/docs/docs/guides/programming/forking_blockly.mdx +++ b/packages/docs/docs/guides/programming/forking_blockly.mdx @@ -15,8 +15,8 @@ bugfixes in core Blockly. We strongly recommend that you customize Blockly using plugins and custom classes instead of by forking. For more information, see -[Plugins](/blockly/guides/programming/plugin_overview) and [Advanced -customization](/blockly/guides/configure/web/customization). +[Plugins](/guides/programming/plugin_overview) and [Advanced +customization](/guides/configure/web/customization). ## Alternatives @@ -49,7 +49,7 @@ Blockly welcomes contributions! If your change is general-purpose, your best bet may be to make a pull request. Blockly improves, you don't have to maintain a fork, and everyone wins. -Check out the [contributing](/blockly/guides/contribute/index) page to learn +Check out the [contributing](/guides/contribute/index) page to learn more. ## Updating a fork diff --git a/packages/docs/docs/guides/programming/plugin_overview.mdx b/packages/docs/docs/guides/programming/plugin_overview.mdx index bc60fbd9b..6885af3cf 100644 --- a/packages/docs/docs/guides/programming/plugin_overview.mdx +++ b/packages/docs/docs/guides/programming/plugin_overview.mdx @@ -16,9 +16,9 @@ custom renderer. Plugins are generally packaged and distributed through npm. :::note The [`BlocklyOptions` -object](/blockly/guides/configure/web/configuration_struct#the-options-dictionary) +object](/guides/configure/web/configuration_struct#the-options-dictionary) has a `plugins` property for injecting classes that [customize Blockly -behavior](/blockly/guides/configure/web/customization). While these classes may +behavior](/guides/configure/web/customization). While these classes may be implemented as plugins, this is not required and they are otherwise unrelated. ::: @@ -27,7 +27,7 @@ For a quick introduction to plugins, see our [Plugins Overview talk (2021)](https://www.youtube.com/watch?v=rg-V0w7UZFc&list=PLSIUOFhnxEiCjoIwJ0jAdwpTZET73CK7d&index=3). If you want to create your own plugin, see [Add a -plugin](/blockly/guides/contribute/samples/add_a_plugin). +plugin](/guides/contribute/samples/add_a_plugin). ## First- and third-party plugins @@ -144,7 +144,7 @@ plugin](https://www.npmjs.com/package/@blockly/field-angle): ]); ``` - A field for picking an angle from a 360-degree dial. + A field for picking an angle from a 360-degree dial. ## Plugin versions diff --git a/packages/docs/docs/guides/programming/unforking_blockly.mdx b/packages/docs/docs/guides/programming/unforking_blockly.mdx index 624999013..318ec3530 100644 --- a/packages/docs/docs/guides/programming/unforking_blockly.mdx +++ b/packages/docs/docs/guides/programming/unforking_blockly.mdx @@ -40,7 +40,7 @@ return to mainline: The final reason we see users fork is to patch Blockly to create custom functionality that they perceive isn't included upstream at the time. If your fork is significantly out of date, we may have already added the functionality -you need, either as [plugins](/blockly/guides/programming/plugin_overview) or in +you need, either as [plugins](/guides/programming/plugin_overview) or in core. Knowing what features you added in your fork can provide a roadmap for what features you will need to update. diff --git a/packages/docs/docs/guides/programming/using_blockly_apis.mdx b/packages/docs/docs/guides/programming/using_blockly_apis.mdx index e3fa059ef..b4e34aedf 100644 --- a/packages/docs/docs/guides/programming/using_blockly_apis.mdx +++ b/packages/docs/docs/guides/programming/using_blockly_apis.mdx @@ -8,7 +8,7 @@ image: images/blockly_banner.png This page describes best practices for calling functions and accessing properties in core Blockly. These principles apply to creating -[plugins](/blockly/guides/programming/plugin_overview) for Blockly and to +[plugins](/guides/programming/plugin_overview) for Blockly and to integrating Blockly into a standalone application. ## Visibility {#visibility} @@ -20,7 +20,7 @@ Some properties may be annotated with `@internal` in their [TsDoc](https://api-extractor.com/pages/tsdoc/tag_internal/) comments. All `public` and `protected` properties are documented in the -[References](/blockly/reference/js/blockly) section of the Blockly website. You +[References](/reference/js/blockly) section of the Blockly website. You can also check visibility by reading the code. :::warning diff --git a/packages/docs/docusaurus.config.js b/packages/docs/docusaurus.config.js index dead7eb3e..5be99497b 100644 --- a/packages/docs/docusaurus.config.js +++ b/packages/docs/docusaurus.config.js @@ -19,14 +19,14 @@ const config = { }, // Set the production url of your site here - url: 'https://joe-davis-blockly.github.io', + url: 'https://raspberrypifoundation.github.io', // Set the // pathname under which your site is served // For GitHub pages deployment, it is often '//' - baseUrl: '/blockly/', + baseUrl: '/docs/', // GitHub pages deployment config. // If you aren't using GitHub pages, you don't need these. - organizationName: 'Joe-Davis-Blockly', // Usually your GitHub org/user name. + organizationName: 'RaspberryPiFoundation', // Usually your GitHub org/user name. projectName: 'blockly', // Usually your repo name. onBrokenLinks: 'warn', @@ -68,7 +68,7 @@ const config = { // Please change this to your repo. // Remove this to remove the "edit this page" links. editUrl: - 'https://github.com/Joe-Davis-Blockly/blockly/tree/cybage-blockly/docs', + 'https://github.com/RaspberryPiFoundation/blockly/tree/main/packages/docs', }, blog: false, theme: { @@ -139,7 +139,7 @@ const config = { { type: 'docSidebar', label: 'Codelabs', - sidebarId: 'tutorialSidebar', + sidebarId: 'codelabsSidebar', position: 'left', }, { @@ -187,11 +187,11 @@ const config = { items: [ { label: 'Guides', - to: '/blockly/guides/get-started/what-is-blockly', + to: '/guides/get-started/what-is-blockly', }, { label: 'Reference', - to: '/blockly/reference/js/blockly', + to: '/reference/js/blockly', }, ], }, @@ -200,7 +200,7 @@ const config = { items: [ { label: 'Codelabs', - to: '/blockly/codelabs/index', + to: '/codelabs/index', }, { label: 'Samples and Demos',