addon.tab.appendToSharedSpace

Description

Allows multiple addons to add their own UI elements to the same area inside Scratch.
The important part of this API is the order number, which prevents the appending new UI elements from being a racy operation and the order of the buttons varying impredictively, specially in the cases where the addons support dynamicEnable.

Method

ParameterTypeRequiredDescription
optionsObjectYes
PropertyTypeRequiredDescription
spaceStringYesThe ID of the space where the element should be appended.
elementHTMLElementYesThe element, owned by the addon calling the method, that should be appended.
orderNumberYesThe order number for the element. Lowest gets appended first in the parent element.
scopeHTMLElementOnly for some spacesThe specific element to append the element in, for spaces that appear multiple times per page.
Return valueBoolean
DescriptionWhether the element was appended.

Scratch editor spaces

stageHeader

Right side of the stage header in editor, embed and projectplayer modes.
The standard CSS margin for the buttons added in this space is margin-right: 0.2rem.

Space parent elementdiv[class^="stage-header_stage-size-row"]
Space starting boundNone
Space ending boundSmall stage button or fullscreen icon
scope option used
Addon IDElementOrder numberVisibility in small stage mode
debuggerDebugger button0Hidden
gamepadGamepad button1Hidden

fullscreenStageHeader

Right side of the stage header in fullscreen mode.
The standard CSS margin for the buttons added in this space is margin-right: 0.2rem.

Space parent elementdiv[class^="stage-header_stage-menu-wrapper"]
Space starting boundNone
Space ending boundFullscreen icon
scope option used
Addon IDElementOrder number
gamepadGamepad button0

afterGreenFlag

Buttons that go between the green flag and the stop button.

Space parent elementdiv[class^="controls_controls-container"]
Space starting boundGreen flag button
Space ending boundStop button
scope option used
Addon IDElementOrder numberVisibility in small stage mode
pausePause button0Visible

afterStopButton

Elements that go after the project control buttons.
The standard CSS for the buttons added in this space is padding: 0.25rem.

Space parent elementdiv[class^="controls_controls-container"]
Space starting boundStop button
Space ending boundNone
scope option used
Addon IDElementOrder numberVisibility in small stage mode
mute-projectMuted project indicator0Visible
mouse-posMouse coordinates1Hidden
clone-countClone count2Hidden

afterSoundTab

Added editor tabs that go after the sound tab.
The order number should match the used activeTabIndex by the new tab.

Space parent elementdiv[class^="react-tabs_react-tabs__tab-list"]
Space starting boundSound tab
Space ending boundSearch bar added by editor-devtools
scope option used
Addon IDElementOrder number
variable-managerVariables tab3

Scratch website spaces

afterCopyLinkButton

Buttons that go after the “copy link” button in project pages.

Space parent element.flex-row.action-buttons
Space starting boundCopy link button
Space ending boundNone
scope option used
Addon IDElementOrder number
remix-tree-buttonRemix tree button0

beforeRemixButton

Elements that go to the left of the “remix” or “see inside” buttons in project pages.

Space parent elementdiv.project-buttons
Space starting boundNone
Space ending boundRemix button or see inside button
scope option used
Addon IDElementOrder number
project-infoSprite and script count0
turbowarp-playerTurboWarp button1

Scratch forums spaces

forumsBeforePostReport

Links placed before the “report” button in a specific post.
If the “report” button does not exist, a visible placeholder dot will be added to the page automatically to act as a separator between the forumsBeforePostReport and forumsAfterPostReport spaces.
Addition of the | separator is handled by the space.

Space parent element.postfootright > ul
Space starting boundNone
Space ending boundReport button
scope option used✔️ (usually a div.blockpost)
Addon IDElementOrder number
my-ocularReactions0
my-ocularReaction menu1
my-ocularView in Ocular button2

forumsAfterPostReport

Links placed after the “report” button in a specific post.
If the “report” button does not exist, a visible placeholder dot will be added to the page automatically to act as a separator between the forumsBeforePostReport and forumsAfterPostReport spaces.
Addition of the | separator is handled by the space.

Space parent element.postfootright > ul
Space starting boundReport button
Space ending boundNone
scope option used✔️ (usually a div.blockpost)
Addon IDElementOrder number
show-bbcodeShow BBCode button0

Last updated at 27 July 2021 by WorldLanguages on commit 2bfaf63. Improve this page.

Comments

Make sure to follow the code of conduct. You can see this comment section on GitHub Discussions, as well as editing and removing your comment.