Merge tag '0.1.0-prerelease.20200618175748' into scratch-desktop

Pull revert from VM
Merge pull request #5901 from LLK/dependabot/npm_and_yarn/scratch-blocks-0.1.0-prerelease.20200617163252
2020-06-22 10:42:52 -07:00 · 2020-06-18 13:53:00 -04:00 · 2020-06-17 22:34:03 +00:00 · 2020-06-17 22:16:42 +00:00 · 2020-06-17 22:13:53 +00:00 · 2020-06-17 22:02:57 +00:00
30 changed files with 6694 additions and 1048 deletions
@@ -12,6 +12,7 @@
 *.svg binary

 # Prefer LF for most file types
+*.css text eol=lf
 *.frag text eol=lf
 *.htm text eol=lf
 *.html text eol=lf
@@ -1,11 +1,64 @@
 ## Contributing
 The development of Scratch is an ongoing process, and we love to have people in the Scratch and open source communities help us along the way.

-If you're interested in contributing, please take a look at the [issues](https://github.com/LLK/scratch-gui/issues) on this repository.
-Two great ways of helping are by identifying bugs and documenting them as issues, or fixing issues and creating pull requests. When looking for bugs to fix, please look for the ["Help Wanted" label](https://github.com/LLK/scratch-gui/issues?q=label%3A%22help+wanted%22). Bugs with this label have been specifically set aside for Open Source contributors. Issues without the label can also be worked on but we ask that you comment on the issue prior to starting work. When submitting pull requests please be patient -- it can take a while to find time to review them. The organization and class structures can't be radically changed without significant coordination and collaboration from the Scratch Team, so these types of changes should be avoided.
+### Ways to Help

-It's been said that the Scratch Team spends about one hour of design discussion for every pixel in Scratch, but some think that estimate is a little low. While we welcome suggestions for new features in our [suggestions forum](https://scratch.mit.edu/discuss/1/) (especially ones that come with mockups), we are unlikely to accept PRs with new features that haven't been thought through and discussed as a group. Why? Because we have a strong belief in the value of keeping things simple for new users. To learn more about our design philosophy, see [the Scratch Developers page](https://scratch.mit.edu/developers), or [this paper](http://web.media.mit.edu/~mres/papers/Scratch-CACM-final.pdf).
+* **Documenting bugs**
+  * If you've identified a bug in Scratch you should first check to see if it's been filed as an issue, if not you can file one.  Make sure you follow the issue template.
+  * It's important that we can consistently reproduce issues. When writing an issue, be sure to follow our [reproduction step guidelines](https://github.com/LLK/scratch-gui/wiki/Writing-good-repro-steps).
+    * Some issues are marked "Needs Repro". Adding a comment with good reproduction steps to those issues is a great way to help.
+  * If you don't have an issue in mind already, you can look through the [Bugs & Glitches forum.](https://scratch.mit.edu/discuss/3/) Look for users reporting problems, reproduce the problem yourself, and file new issues following our guidelines. 

+* **Fixing bugs**
+  * You can request to fix a bug in a comment on the issue if you at mention the repo coordinator, who for this repo is @chrisgarrity.
+    * If the issue is marked "Help Wanted" you can go ahead and start working on it!
+  * **We will only accept Pull Requests for bugs that have an issue filed that has a priority label** 
+    * If you're interested in fixing a bug with no issue, file the issue first and wait for it to have a priority added to it.
+  
+  * We are not looking for Pull Requests ("PR") for every issue and may deny a PR if it doesn't fit our criteria.
+    * We are far more likely to accept a PR if it is for an issue marked with Help Wanted.
+    * We will not accept PRs for issues marked with "Needs Discussion" or "Needs Design."
+    * Wait until the Repo Coordinator assigns the issue to you before you begin work or submit a PR.
+
+### Learning Git and Github
+
+If you want to work on fixing issues, you should be familiar with Git and Github.
+
+* [Learn Git branching](https://learngitbranching.js.org/) includes an introduction to basic git commands and useful branching features.
+* Here's a general introduction to [contributing to an open source project](https://egghead.io/courses/how-to-contribute-to-an-open-source-project-on-github).
+
+**Important:** we follow the [Github Flow process](https://guides.github.com/introduction/flow/) as our development process.
+
+### How to Fix Bugs
+1. Identify which Github issue you are working on. Leave a comment on the issue to let us (and other contributors) know you're working on it.
+2. Make sure you have a fork of this repo (see [Github's forking a repo](https://help.github.com/en/github/getting-started-with-github/fork-a-repo) for details)
+3. Switch to the `develop` branch, and pull down the latest changes from upstream
+4. Run the code, and reproduce the problem
+5. Create your branch from the `develop` branch
+6. Make code changes to fix the problem
+7. Run `npm test` to make sure that your changes pass our tests
+8. Commit your changes
+9. Push your branch to your fork
+10. Create your pull request
+    1. Make sure to follow the template in the PR description
+    1. Remember to check the “[Allow edits from maintainers](https://help.github.com/en/github/collaborating-with-issues-and-pull-requests/allowing-changes-to-a-pull-request-branch-created-from-a-fork)” box
+
+When submitting pull requests keep in mind:
+* please be patient -- it can take a while to find time to review them
+* try to change the least amount of code necessary to fix the bug
+* the code can't be radically changed without significant coordination with the Scratch Team, so these types of changes should be avoided
+* if you find yourself changing a substantial amount of code or considering radical changes, please ask for clarification -- we may have envisioned a different approach, or underestimated the amount of effort
+
+### Suggestions
+![Block sketch](https://user-images.githubusercontent.com/3431616/77192550-1dcebe00-6ab3-11ea-9606-8ecd8500c958.png)
+
+Please note: **_we are unlikely to accept PRs with new features that haven't been thought through and discussed as a group_**.
+
+Why? Because we have a strong belief in the value of keeping things simple for new users. It's been said that the Scratch Team spends about one hour of design discussion for every pixel in Scratch. To learn more about our design philosophy, see [the Scratch Developers page](https://scratch.mit.edu/developers), or [this paper](http://web.media.mit.edu/~mres/papers/Scratch-CACM-final.pdf).
+
+We welcome suggestions! If you want to suggest a feature, please post in our [suggestions forum](https://scratch.mit.edu/discuss/1/). Your suggestion will be helped if you include a mockup design; this can be simple, even hand-drawn.
+
+### Other resources
 Beyond this repo, there are also some other resources that you might want to take a look at:
 * [Community Guidelines](https://github.com/LLK/scratch-www/wiki/Community-Guidelines) (we find it important to maintain a constructive and welcoming community, just like on Scratch)
 * [Open Source forum](https://scratch.mit.edu/discuss/49/) on Scratch
@@ -5,8 +5,11 @@
 /node_modules
 npm-*

-# Double copies of all the static assets and tutorial gifs
-/src
+# TO REVERT: the scratch-desktop branch wants to build scratch-gui from source.
+# To support that we need to un-ignore the /src directory.
+# Once we merge the scratch-desktop branch into develop we should re-ignore /src here.
+# We can also do that by omitting or reverting this commit during the merge.
+# /src

 # Testing
 /.nyc_output
@@ -4,7 +4,7 @@ dist: xenial
 addons:
    chrome: stable
 node_js:
- 8
+- 10
 env:
  global:
  - CHROMEDRIVER_VERSION=LATEST
@@ -54,7 +54,7 @@ deploy:
 - provider: script
  on:
    all_branches: true
-    condition: $TRAVIS_EVENT_TYPE != cron && ! $TRAVIS_BRANCH =~ ^greenkeeper/
+    condition: $TRAVIS_EVENT_TYPE != cron && ! $TRAVIS_BRANCH =~ ^dependabot/
    tags: false # Don't push tags to gh-pages
  skip_cleanup: true
  script: npm run deploy -- -x -e $TRAVIS_BRANCH -r https://${GH_TOKEN}@github.com/${TRAVIS_REPO_SLUG}.git
@@ -44,7 +44,7 @@
    "babel-loader": "^8.0.4",
    "base64-loader": "1.0.0",
    "bowser": "1.9.4",
-    "chromedriver": "80.0.0",
+    "chromedriver": "83.0.0",
    "classnames": "2.2.6",
    "computed-style-to-inline-style": "3.0.0",
    "copy-webpack-plugin": "^4.5.1",
@@ -108,14 +108,14 @@
    "redux-mock-store": "^1.2.3",
    "redux-throttle": "0.1.1",
    "rimraf": "^2.6.1",
-    "scratch-audio": "0.1.0-prerelease.20190925183642",
-    "scratch-blocks": "0.1.0-prerelease.1584453125",
-    "scratch-l10n": "3.7.20200317213230",
-    "scratch-paint": "0.2.0-prerelease.20200213174123",
-    "scratch-render": "0.1.0-prerelease.20200228152431",
-    "scratch-storage": "1.3.2",
-    "scratch-svg-renderer": "0.2.0-prerelease.20200205003400",
-    "scratch-vm": "0.2.0-prerelease.20200319175700",
+    "scratch-audio": "0.1.0-prerelease.20200528195344",
+    "scratch-blocks": "0.1.0-prerelease.20200617163252",
+    "scratch-l10n": "3.10.20200617210158",
+    "scratch-paint": "0.2.0-prerelease.20200615150428",
+    "scratch-render": "0.1.0-prerelease.20200617185826",
+    "scratch-storage": "1.3.3",
+    "scratch-svg-renderer": "0.2.0-prerelease.20200610220938",
+    "scratch-vm": "0.2.0-prerelease.20200618162938",
    "selenium-webdriver": "3.6.0",
    "startaudiocontext": "1.2.1",
    "style-loader": "^0.23.0",
@@ -140,7 +140,8 @@
    ],
    "moduleNameMapper": {
      "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/test/__mocks__/fileMock.js",
-      "\\.(css|less)$": "<rootDir>/test/__mocks__/styleMock.js"
+      "\\.(css|less)$": "<rootDir>/test/__mocks__/styleMock.js",
+      "editor-msgs(\\.js)?$": "<rootDir>/test/__mocks__/editor-msgs-mock.js"
    }
  }
 }
@@ -15,6 +15,7 @@
    padding-right: 1rem;
    margin-bottom: 7px;
    min-height: 1.5rem;
+    pointer-events: all;
 }

 .alert.warn {
@@ -309,6 +309,7 @@ $fade-out-distance: 15px;
    z-index: $z-index-alerts;
    position: absolute;
    margin-top: 53px;
+    pointer-events: none;
 }

 /*
@@ -89,6 +89,7 @@ const GUIComponent = props => {
        loading,
        logo,
        renderLogin,
+        onClickAbout,
        onClickAccountNav,
        onCloseAccountNav,
        onLogOut,
@@ -105,6 +106,7 @@ const GUIComponent = props => {
        onRequestCloseTelemetryModal,
        onSeeCommunity,
        onShare,
+        onShowPrivacyPolicy,
        onTelemetryModalCancel,
        onTelemetryModalOptIn,
        onTelemetryModalOptOut,
@@ -162,6 +164,7 @@ const GUIComponent = props => {
                        onOptIn={onTelemetryModalOptIn}
                        onOptOut={onTelemetryModalOptOut}
                        onRequestClose={onRequestCloseTelemetryModal}
+                        onShowPrivacyPolicy={onShowPrivacyPolicy}
                    />
                ) : null}
                {loading ? (
@@ -218,6 +221,7 @@ const GUIComponent = props => {
                    logo={logo}
                    renderLogin={renderLogin}
                    showComingSoon={showComingSoon}
+                    onClickAbout={onClickAbout}
                    onClickAccountNav={onClickAccountNav}
                    onClickLogo={onClickLogo}
                    onCloseAccountNav={onCloseAccountNav}
@@ -388,6 +392,7 @@ GUIComponent.propTypes = {
    onActivateCostumesTab: PropTypes.func,
    onActivateSoundsTab: PropTypes.func,
    onActivateTab: PropTypes.func,
+    onClickAbout: PropTypes.func,
    onClickAccountNav: PropTypes.func,
    onClickLogo: PropTypes.func,
    onCloseAccountNav: PropTypes.func,
@@ -399,6 +404,7 @@ GUIComponent.propTypes = {
    onRequestCloseTelemetryModal: PropTypes.func,
    onSeeCommunity: PropTypes.func,
    onShare: PropTypes.func,
+    onShowPrivacyPolicy: PropTypes.func,
    onTabSelect: PropTypes.func,
    onTelemetryModalCancel: PropTypes.func,
    onTelemetryModalOptIn: PropTypes.func,
@@ -49,19 +49,33 @@ const getAssetTypeForFileExtension = function (fileExtension) {
 };

 /**
- * Figure out an `imageSource` (URI or asset ID & type) for a library item's icon.
+ * Figure out one or more icon(s) for a library item.
+ * If it's an animated thumbnail, this will return an array of `imageSource`.
+ * Otherwise it'll return just one `imageSource`.
 * @param {object} item - either a library item or one of a library item's costumes.
- * @returns {object} - an `imageSource` ready to be passed to a `ScratchImage`.
+ *   The latter is used internally as part of processing an animated thumbnail.
+ * @returns {LibraryItem.PropTypes.icons} - an `imageSource` or array of them, ready for `LibraryItem` & `ScratchImage`
 */
-const getItemImageSource = function (item) {
+const getItemIcons = function (item) {
+    const costumes = (item.json && item.json.costumes) || item.costumes;
+    if (costumes) {
+        return costumes.map(getItemIcons);
+    }
+
    if (item.rawURL) {
        return {
            uri: item.rawURL
        };
    }

-    // TODO: adjust libraries to be more storage-friendly; don't use split() here.
-    const md5ext = item.md5 || item.baseLayerMD5;
+    if (item.assetId && item.dataFormat) {
+        return {
+            assetId: item.assetId,
+            assetType: getAssetTypeForFileExtension(item.dataFormat)
+        };
+    }
+
+    const md5ext = item.md5ext || item.md5 || item.baseLayerMD5;
    if (md5ext) {
        const [assetId, fileExtension] = md5ext.split('.');
        return {
@@ -251,8 +265,7 @@ class LibraryComponent extends React.Component {
                    ref={this.setFilteredDataRef}
                >
                    {this.state.loaded ? this.getFilteredData().map((dataItem, index) => {
-                        const iconSource = getItemImageSource(dataItem);
-                        const icons = dataItem.json && dataItem.json.costumes.map(getItemImageSource);
+                        const icons = getItemIcons(dataItem);
                        return (<LibraryItem
                            bluetoothRequired={dataItem.bluetoothRequired}
                            collaborator={dataItem.collaborator}
@@ -261,7 +274,6 @@ class LibraryComponent extends React.Component {
                            extensionId={dataItem.extensionId}
                            featured={dataItem.featured}
                            hidden={dataItem.hidden}
-                            iconSource={iconSource}
                            icons={icons}
                            id={index}
                            insetIconURL={dataItem.insetIconURL}
@@ -0,0 +1 @@
+<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><path d="M10 2c4.418 0 8 3.582 8 8s-3.582 8-8 8-8-3.582-8-8 3.582-8 8-8zm-.072 10.42c-.256 0-.472.076-.648.227-.176.151-.264.338-.264.56 0 .25.091.445.273.584.182.139.395.209.639.209.236 0 .444-.07.624-.211s.27-.335.27-.581c0-.222-.086-.409-.258-.56-.172-.151-.384-.227-.636-.227zm.144-6.42c-.624 0-1.17.113-1.638.338-.468.225-.824.51-1.068.853-.244.343-.366.683-.366 1.017 0 .162.077.313.231.452.154.139.343.209.567.209.38 0 .638-.199.774-.597.144-.38.32-.668.528-.864.208-.196.532-.293.972-.293.376 0 .683.097.921.291.238.194.357.432.357.713 0 .144-.039.278-.117.402-.078.123-.174.235-.288.336-.114.1-.299.249-.555.446-.292.225-.524.42-.696.584-.172.164-.31.354-.414.571-.104.217-.156.473-.156.769 0 .236.071.414.213.534.142.12.317.18.525.18.4 0 .638-.183.714-.55l.099-.362.093-.206.183-.227.327-.288c.492-.387.833-.663 1.023-.827.19-.164.354-.358.492-.584.138-.225.207-.488.207-.787 0-.38-.121-.733-.363-1.057-.242-.324-.585-.58-1.029-.769-.444-.188-.956-.283-1.536-.283z" id="a"/></defs><g transform="translate(-2 -2)" fill="none"><mask><use xlink:href="#a"/></mask><use fill="#fff" xlink:href="#a"/></g></svg>
@@ -218,3 +218,9 @@
 .mystuff > a {
  background-image: url("/images/mystuff.png");
 }
+
+.about-icon {
+    height: 1.25rem;
+    margin: 0.5rem;
+    vertical-align: middle;
+}
@@ -69,6 +69,7 @@ import profileIcon from './icon--profile.png';
 import remixIcon from './icon--remix.svg';
 import dropdownCaret from './dropdown-caret.svg';
 import languageIcon from '../language-selector/language-icon.svg';
+import aboutIcon from './icon--about.svg';

 import scratchLogo from './scratch-logo.svg';

@@ -141,6 +142,19 @@ MenuItemTooltip.propTypes = {
    isRtl: PropTypes.bool
 };

+const AboutButton = props => (
+    <Button
+        className={classNames(styles.menuBarItem, styles.hoverable)}
+        iconClassName={styles.aboutIcon}
+        iconSrc={aboutIcon}
+        onClick={props.onClick}
+    />
+);
+
+AboutButton.propTypes = {
+    onClick: PropTypes.func.isRequired
+};
+
 class MenuBar extends React.Component {
    constructor (props) {
        super(props);
@@ -311,6 +325,8 @@ class MenuBar extends React.Component {
                {remixMessage}
            </Button>
        );
+        // Show the About button only if we have a handler for it (like in the desktop app)
+        const aboutButton = this.props.onClickAbout ? <AboutButton onClick={this.props.onClickAbout} /> : null;
        return (
            <Box
                className={classNames(
@@ -689,6 +705,8 @@ class MenuBar extends React.Component {
                        </React.Fragment>
                    )}
                </div>
+
+                {aboutButton}
            </Box>
        );
    }
@@ -722,6 +740,7 @@ MenuBar.propTypes = {
    locale: PropTypes.string.isRequired,
    loginMenuOpen: PropTypes.bool,
    logo: PropTypes.string,
+    onClickAbout: PropTypes.func,
    onClickAccount: PropTypes.func,
    onClickEdit: PropTypes.func,
    onClickFile: PropTypes.func,
@@ -94,7 +94,6 @@ class ScratchImage extends React.PureComponent {
    }
    render () {
        const {
-            src: _src,
            imageSource: _imageSource,
            ...imgProps
        } = this.props;
@@ -109,8 +108,8 @@ class ScratchImage extends React.PureComponent {
                        ScratchImage.loadPendingImages();
                        return (
                            <img
-                                src={this.state.imageURI}
-                                {...imgProps}
+                                {...imgProps} // do this first in case it contains `src`
+                                src={this.state.imageURI} // overrides imgProps.src if present
                            />
                        );
                    }
@@ -66,7 +66,6 @@

    overflow: hidden;
    display: flex;
-    align-items: center;
    justify-content: center;
 }

@@ -133,7 +132,6 @@ to adjust for the border using a different method */
 }

 .frame {
-    box-sizing: content-box !important;
    background: $motion-transparent;
    border: 2px solid $motion-primary;
    border-radius: 0.5rem;
@@ -101,6 +101,9 @@ class TelemetryModal extends React.PureComponent {
                            privacyPolicyLink: (<a
                                className={styles.privacyPolicyLink}
                                href="https://scratch.mit.edu/privacy_policy/"
+                                onClick={this.props.onShowPrivacyPolicy}
+                                target="_blank"
+                                rel="noopener noreferrer"
                            >
                                <FormattedMessage {...messages.privacyPolicyLink} />
                            </a>)
@@ -134,7 +137,8 @@ TelemetryModal.propTypes = {
    onCancel: PropTypes.func,
    onOptIn: PropTypes.func.isRequired,
    onOptOut: PropTypes.func.isRequired,
-    onRequestClose: PropTypes.func
+    onRequestClose: PropTypes.func,
+    onShowPrivacyPolicy: PropTypes.func
 };

 export default injectIntl(TelemetryModal);
@@ -338,7 +338,7 @@ class Blocks extends React.Component {
            const stageCostumes = stage.getCostumes();
            const targetCostumes = target.getCostumes();
            const targetSounds = target.getSounds();
-            const dynamicBlocksXML = this.props.vm.runtime.getBlocksXML();
+            const dynamicBlocksXML = this.props.vm.runtime.getBlocksXML(target);
            return makeToolboxXML(target.isStage, target.id, dynamicBlocksXML,
                targetCostumes[targetCostumes.length - 1].name,
                stageCostumes[stageCostumes.length - 1].name,
@@ -21,6 +21,7 @@ class LibraryItem extends React.PureComponent {
            'startRotatingIcons',
            'stopRotatingIcons'
        ]);
+        this.hasIconsArray = Array.isArray(props.icons);
        this.state = {
            iconIndex: 0,
            isRotatingIcon: false
@@ -53,7 +54,7 @@ class LibraryItem extends React.PureComponent {
        // only show hover effects on the item if not showing a play button
        if (!this.props.showPlayButton) {
            this.props.onMouseEnter(this.props.id);
-            if (this.props.icons && this.props.icons.length) {
+            if (this.hasIconsArray) {
                this.stopRotatingIcons();
                this.setState({
                    isRotatingIcon: true
@@ -65,7 +66,7 @@ class LibraryItem extends React.PureComponent {
        // only show hover effects on the item if not showing a play button
        if (!this.props.showPlayButton) {
            this.props.onMouseLeave(this.props.id);
-            if (this.props.icons && this.props.icons.length) {
+            if (this.hasIconsArray) {
                this.setState({
                    isRotatingIcon: false
                }, this.stopRotatingIcons);
@@ -92,13 +93,18 @@ class LibraryItem extends React.PureComponent {
        this.setState({iconIndex: nextIconIndex});
    }
    curIconSource () {
-        if (this.props.icons &&
-            this.state.isRotatingIcon &&
-            this.state.iconIndex < this.props.icons.length &&
-            this.props.icons[this.state.iconIndex]) {
-            return this.props.icons[this.state.iconIndex];
+        if (this.hasIconsArray) {
+            if (this.state.isRotatingIcon &&
+                this.state.iconIndex < this.props.icons.length &&
+                this.props.icons[this.state.iconIndex]) {
+                // multiple icons, currently animating: show current frame
+                return this.props.icons[this.state.iconIndex];
+            }
+            // multiple icons, not currently animating: show first frame
+            return this.props.icons[0];
        }
-        return this.props.iconSource;
+        // single icon
+        return this.props.icons;
    }
    render () {
        const iconSource = this.curIconSource();
@@ -142,8 +148,10 @@ LibraryItem.propTypes = {
    extensionId: PropTypes.string,
    featured: PropTypes.bool,
    hidden: PropTypes.bool,
-    iconSource: LibraryItemComponent.propTypes.iconSource, // single icon
-    icons: PropTypes.arrayOf(LibraryItemComponent.propTypes.iconSource), // rotating icons
+    icons: PropTypes.oneOfType([
+        LibraryItemComponent.propTypes.iconSource, // single icon
+        PropTypes.arrayOf(LibraryItemComponent.propTypes.iconSource) // rotating icons
+    ]),
    id: PropTypes.number.isRequired,
    insetIconURL: PropTypes.string,
    internetConnectionRequired: PropTypes.bool,
@@ -2,10 +2,22 @@ import StartAudioContext from 'startaudiocontext';
 import bowser from 'bowser';

 let AUDIO_CONTEXT;
-if (!bowser.msie) {
-    AUDIO_CONTEXT = new (window.AudioContext || window.webkitAudioContext)();

-    StartAudioContext(AUDIO_CONTEXT);
+if (!bowser.msie) {
+    /**
+     * AudioContext can be initialized only when user interaction event happens
+     */
+    const event =
+        typeof document.ontouchstart === 'undefined' ?
+            'mousedown' :
+            'touchstart';
+    const initAudioContext = () => {
+        document.removeEventListener(event, initAudioContext);
+        AUDIO_CONTEXT = new (window.AudioContext ||
+            window.webkitAudioContext)();
+        StartAudioContext(AUDIO_CONTEXT);
+    };
+    document.addEventListener(event, initAudioContext);
 }

 /**
@@ -8,11 +8,23 @@ export default (filename, blob) => {
        return;
    }

-    const url = window.URL.createObjectURL(blob);
-    downloadLink.href = url;
-    downloadLink.download = filename;
-    downloadLink.type = blob.type;
-    downloadLink.click();
-    window.URL.revokeObjectURL(url);
-    document.body.removeChild(downloadLink);
+    if ('download' in HTMLAnchorElement.prototype) {
+        const url = window.URL.createObjectURL(blob);
+        downloadLink.href = url;
+        downloadLink.download = filename;
+        downloadLink.type = blob.type;
+        downloadLink.click();
+        document.body.removeChild(downloadLink);
+        window.URL.revokeObjectURL(url);
+    } else {
+        // iOS Safari, open a new page and set href to data-uri
+        let popup = window.open('', '_blank');
+        const reader = new FileReader();
+        reader.onloadend = function () {
+            popup.location.href = reader.result;
+            popup = null;
+        };
+        reader.readAsDataURL(blob);
+    }
+
 };
@@ -78,7 +78,7 @@ const DropAreaHOC = function (dragTypes) {
                }
            }
            render () {
-                const componentProps = omit(this.props, ['onDrop', 'dragInfo']);
+                const componentProps = omit(this.props, ['onDrop', 'dragInfo', 'componentRef']);
                return (
                    <WrappedComponent
                        containerRef={this.setRef}
@@ -2072,6 +2072,476 @@
            2
        ]
    },
+    {
+        "name": "Character1-a",
+        "md5": "03bc23a9fa12c1244c83a07a81f20bfd.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            49,
+            124,
+            1
+        ]
+    },
+    {
+        "name": "Character1-b",
+        "md5": "f26b130c2c58b812be21d1a9745863a1.svg",
+        "type": "costume",
+        "tags": [
+            "disability",
+            "disabled",
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            54,
+            122,
+            1
+        ]
+    },
+    {
+        "name": "Character1-c",
+        "md5": "cc0be722cf93eef63726bd606ab11c5c.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            54,
+            126,
+            1
+        ]
+    },
+    {
+        "name": "Character1-d",
+        "md5": "6be261800647c53becb1f93ed31ed13e.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            54,
+            123,
+            1
+        ]
+    },
+    {
+        "name": "Character1-e",
+        "md5": "6f78ce6a87d114162ed9fbef30f9a0fd.svg",
+        "type": "costume",
+        "tags": [
+            "disability",
+            "disabled",
+            "wheelchair",
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            65,
+            120,
+            1
+        ]
+    },
+    {
+        "name": "Character1-f",
+        "md5": "527ba82c5e82f43c8fca0be905dbe20a.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            54,
+            126,
+            1
+        ]
+    },
+    {
+        "name": "Character1-g",
+        "md5": "1e303bb57aac0cb4678e85de4251f3f4.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            54,
+            125,
+            1
+        ]
+    },
+    {
+        "name": "Character1-h",
+        "md5": "0f18f9e90d0ed68ebec23da087eb2603.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            54,
+            126,
+            1
+        ]
+    },
+    {
+        "name": "Character1-i",
+        "md5": "5e2f620e5687a36e1954414054c69ccc.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            59,
+            124,
+            1
+        ]
+    },
+    {
+        "name": "Character1-j",
+        "md5": "1044a68cc743f83564e36a6bca16830b.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            57,
+            127,
+            1
+        ]
+    },
+    {
+        "name": "Character1-k",
+        "md5": "b37d0e0d46f07cb2cbdc5285e176bf62.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            55,
+            122,
+            1
+        ]
+    },
+    {
+        "name": "Character1-l",
+        "md5": "984043e1e7c544999c31f952d1d43a56.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            56,
+            124,
+            1
+        ]
+    },
+    {
+        "name": "Character1-m",
+        "md5": "6d5ddfc69f9c6a3f1d2ded1428237931.svg",
+        "type": "costume",
+        "tags": [
+            "old",
+            "grandma",
+            "mom",
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            56,
+            126,
+            1
+        ]
+    },
+    {
+        "name": "Character2-a",
+        "md5": "7084b3baab935de819cc5ab46f7cecf8.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            47,
+            127,
+            1
+        ]
+    },
+    {
+        "name": "Character2-b",
+        "md5": "df7cbf2913bcea721df2e0360644f193.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            44,
+            125,
+            1
+        ]
+    },
+    {
+        "name": "Character2-c",
+        "md5": "e0eacf1e575adc559c41e3a81a892168.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            47,
+            123,
+            1
+        ]
+    },
+    {
+        "name": "Character2-d",
+        "md5": "e8b44b0e904fd4bb7430c26b743f1520.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            44,
+            128,
+            1
+        ]
+    },
+    {
+        "name": "Character2-e",
+        "md5": "67d425b11544caa0fe9228f355c6485b.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            48,
+            122,
+            1
+        ]
+    },
+    {
+        "name": "Character2-f",
+        "md5": "db3f436fcb6fb28828a4c932b60feb5e.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            48,
+            126,
+            1
+        ]
+    },
+    {
+        "name": "Character2-g",
+        "md5": "93e035270675f933b94ee951d7e475e3.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            47,
+            125,
+            1
+        ]
+    },
+    {
+        "name": "Character2-h",
+        "md5": "f4f2778df2840de5a6449a49f3efb599.svg",
+        "type": "costume",
+        "tags": [
+            "disability",
+            "disabled",
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            44,
+            128,
+            1
+        ]
+    },
+    {
+        "name": "Character2-i",
+        "md5": "1cf73a791959e07b5bafe18474f93b78.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            48,
+            126,
+            1
+        ]
+    },
+    {
+        "name": "Character2-j",
+        "md5": "bf0d808f7bf0c11c338b4fea0a735874.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            48,
+            128,
+            1
+        ]
+    },
    {
        "name": "Cheesy Puffs",
        "md5": "82772a61ec74974e84c686c61ea0b7d5.png",
@@ -6302,6 +6772,66 @@
            1
        ]
    },
+    {
+        "name": "Kia-a",
+        "md5": "e56e480c994572323d88355b8733e1a3.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            38,
+            133,
+            1
+        ]
+    },
+    {
+        "name": "Kia-b",
+        "md5": "b3d0a248adbc26b0d0826e042a81670a.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            33,
+            133,
+            1
+        ]
+    },
+    {
+        "name": "Kia-c",
+        "md5": "db6cd6b145bb6d8dc299475af7423d6e.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            55,
+            133,
+            1
+        ]
+    },
    {
        "name": "Kiran-a",
        "md5": "7c0bedab5404830a5147cc4a2d46e997.svg",
@@ -6781,6 +7311,66 @@
            1
        ]
    },
+    {
+        "name": "Luca-a",
+        "md5": "90fa2ad340edc6e6ba963710feef940e.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            44,
+            130,
+            1
+        ]
+    },
+    {
+        "name": "Luca-b",
+        "md5": "18dfad514602a4907502c7c84861b24e.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            41,
+            130,
+            1
+        ]
+    },
+    {
+        "name": "Luca-c",
+        "md5": "963cb82687acaf5de53a22b287192723.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            50,
+            130,
+            1
+        ]
+    },
    {
        "name": "Magicwand",
        "md5": "89aa5332042d7bbf8368293a4efeafa4.svg",
@@ -7409,6 +7999,66 @@
            1
        ]
    },
+    {
+        "name": "Noor-a",
+        "md5": "4cf233c6540e434aded60608ba316ce3.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            38,
+            130,
+            1
+        ]
+    },
+    {
+        "name": "Noor-b",
+        "md5": "975585ca9461f0730a285fc96df73425.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            41,
+            130,
+            1
+        ]
+    },
+    {
+        "name": "Noor-c",
+        "md5": "c1792bbd5970034b4595ff7e742d6e47.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            50,
+            130,
+            1
+        ]
+    },
    {
        "name": "Octopus-a",
        "md5": "e22d9b633feffc1d026980a1f21e07d7.svg",
@@ -9088,6 +9738,66 @@
            2
        ]
    },
+    {
+        "name": "Sasha-a",
+        "md5": "e26bf53469cafd730ca150e745ceeafc.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            48,
+            132,
+            1
+        ]
+    },
+    {
+        "name": "Sasha-b",
+        "md5": "a0b8890ce458aebed5e7002e1897508e.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            40,
+            132,
+            1
+        ]
+    },
+    {
+        "name": "Sasha-c",
+        "md5": "89bb25e1465eb9481d267e4f9df592af.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            56,
+            131,
+            1
+        ]
+    },
    {
        "name": "Saxophone-a",
        "md5": "4414c51bdd03f60f40a1210e1d55cf57.svg",
@@ -9890,6 +10600,166 @@
            1
        ]
    },
+    {
+        "name": "Tatiana-a",
+        "md5": "5cf65a9f942ca92c93915527ff9db1e6.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            60,
+            53,
+            1
+        ]
+    },
+    {
+        "name": "Tatiana-b",
+        "md5": "91fb7d056beaf553ccec03d61d72c545.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            49,
+            61,
+            1
+        ]
+    },
+    {
+        "name": "Tatiana-c",
+        "md5": "e207fd3f99e1db8c5d66f49446f27e37.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            60,
+            53,
+            1
+        ]
+    },
+    {
+        "name": "Tatiana-d",
+        "md5": "e2ea6bbc6066574d4836e808a1c5f849.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            49,
+            55,
+            1
+        ]
+    },
+    {
+        "name": "Taylor-a",
+        "md5": "ae2eaae0882543dc276c8e7d56ff2e7b.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            59,
+            52,
+            1
+        ]
+    },
+    {
+        "name": "Taylor-b",
+        "md5": "e0082f49fc5d0d83d7fad6124ba82bb1.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            48,
+            53,
+            1
+        ]
+    },
+    {
+        "name": "Taylor-c",
+        "md5": "ae2eaae0882543dc276c8e7d56ff2e7b.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            59,
+            52,
+            1
+        ]
+    },
+    {
+        "name": "Taylor-d",
+        "md5": "a504d785629f2d1ca6b87e80b334d5e8.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            48,
+            50,
+            1
+        ]
+    },
    {
        "name": "Ten80 Pop Down",
        "md5": "fea7045c09073700b88fae8d4d257cd1.png",
@@ -10248,6 +11118,86 @@
            1
        ]
    },
+    {
+        "name": "Trisha-a",
+        "md5": "55d31103bc86447c6a727b4f0664a5ea.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            81,
+            57,
+            1
+        ]
+    },
+    {
+        "name": "Trisha-b",
+        "md5": "c31dc8487a841f644889784ff437e2c5.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            63,
+            60,
+            1
+        ]
+    },
+    {
+        "name": "Trisha-c",
+        "md5": "55d31103bc86447c6a727b4f0664a5ea.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            81,
+            57,
+            1
+        ]
+    },
+    {
+        "name": "Trisha-d",
+        "md5": "2d06023ec09ec312ab49055530511134.svg",
+        "type": "costume",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            63,
+            55,
+            1
+        ]
+    },
    {
        "name": "Truck-a",
        "md5": "aaa05abc5aa182a0d7bfdc6db0f3207a.svg",
@@ -3424,6 +3424,319 @@
            "objName": "Champ99"
        }
    },
+    {
+        "name": "Characters 1",
+        "md5": "03bc23a9fa12c1244c83a07a81f20bfd.svg",
+        "type": "sprite",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            0,
+            13,
+            1
+        ],
+        "json": {
+            "isStage": false,
+            "name": "Characters 1",
+            "variables": {},
+            "lists": {},
+            "broadcasts": {},
+            "blocks": {},
+            "comments": {},
+            "currentCostume": 0,
+            "costumes": [
+                {
+                    "assetId": "03bc23a9fa12c1244c83a07a81f20bfd",
+                    "name": "character1-a",
+                    "bitmapResolution": 1,
+                    "md5ext": "03bc23a9fa12c1244c83a07a81f20bfd.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 49.8898709690844,
+                    "rotationCenterY": 124.76092657062226
+                },
+                {
+                    "assetId": "f26b130c2c58b812be21d1a9745863a1",
+                    "name": "character1-b",
+                    "bitmapResolution": 1,
+                    "md5ext": "f26b130c2c58b812be21d1a9745863a1.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 54.60290188300769,
+                    "rotationCenterY": 122.98040317401274
+                },
+                {
+                    "assetId": "cc0be722cf93eef63726bd606ab11c5c",
+                    "name": "character1-c",
+                    "bitmapResolution": 1,
+                    "md5ext": "cc0be722cf93eef63726bd606ab11c5c.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 54.60291410943074,
+                    "rotationCenterY": 126.85057804587933
+                },
+                {
+                    "assetId": "6be261800647c53becb1f93ed31ed13e",
+                    "name": "character1-d",
+                    "bitmapResolution": 1,
+                    "md5ext": "6be261800647c53becb1f93ed31ed13e.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 54.602918664146046,
+                    "rotationCenterY": 123.84994499999999
+                },
+                {
+                    "assetId": "6f78ce6a87d114162ed9fbef30f9a0fd",
+                    "name": "character1-e",
+                    "bitmapResolution": 1,
+                    "md5ext": "6f78ce6a87d114162ed9fbef30f9a0fd.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 65.725,
+                    "rotationCenterY": 120.67006881854581
+                },
+                {
+                    "assetId": "527ba82c5e82f43c8fca0be905dbe20a",
+                    "name": "character1-f",
+                    "bitmapResolution": 1,
+                    "md5ext": "527ba82c5e82f43c8fca0be905dbe20a.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 54.60291455471537,
+                    "rotationCenterY": 126.76429674297606
+                },
+                {
+                    "assetId": "1e303bb57aac0cb4678e85de4251f3f4",
+                    "name": "character1-g",
+                    "bitmapResolution": 1,
+                    "md5ext": "1e303bb57aac0cb4678e85de4251f3f4.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 54.60291143772301,
+                    "rotationCenterY": 125.34991500000001
+                },
+                {
+                    "assetId": "0f18f9e90d0ed68ebec23da087eb2603",
+                    "name": "character1-h",
+                    "bitmapResolution": 1,
+                    "md5ext": "0f18f9e90d0ed68ebec23da087eb2603.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 54.60291643772288,
+                    "rotationCenterY": 126.34996499999997
+                },
+                {
+                    "assetId": "5e2f620e5687a36e1954414054c69ccc",
+                    "name": "character1-i",
+                    "bitmapResolution": 1,
+                    "md5ext": "5e2f620e5687a36e1954414054c69ccc.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 59.662344830457954,
+                    "rotationCenterY": 124.64983500000002
+                },
+                {
+                    "assetId": "1044a68cc743f83564e36a6bca16830b",
+                    "name": "character1-j",
+                    "bitmapResolution": 1,
+                    "md5ext": "1044a68cc743f83564e36a6bca16830b.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 57.80000000000001,
+                    "rotationCenterY": 127.9064156368213
+                },
+                {
+                    "assetId": "b37d0e0d46f07cb2cbdc5285e176bf62",
+                    "name": "character1-k",
+                    "bitmapResolution": 1,
+                    "md5ext": "b37d0e0d46f07cb2cbdc5285e176bf62.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 55.00291821886171,
+                    "rotationCenterY": 122.96517404562759
+                },
+                {
+                    "assetId": "984043e1e7c544999c31f952d1d43a56",
+                    "name": "character1-l",
+                    "bitmapResolution": 1,
+                    "md5ext": "984043e1e7c544999c31f952d1d43a56.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 56,
+                    "rotationCenterY": 124.849995
+                },
+                {
+                    "assetId": "6d5ddfc69f9c6a3f1d2ded1428237931",
+                    "name": "character1-m",
+                    "bitmapResolution": 1,
+                    "md5ext": "6d5ddfc69f9c6a3f1d2ded1428237931.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 56,
+                    "rotationCenterY": 126.73041545130786
+                }
+            ],
+            "sounds": [
+                {
+                    "assetId": "83a9787d4cb6f3b7632b4ddfebf74367",
+                    "name": "pop",
+                    "dataFormat": "wav",
+                    "format": "",
+                    "rate": 48000,
+                    "sampleCount": 1123,
+                    "md5ext": "83a9787d4cb6f3b7632b4ddfebf74367.wav"
+                }
+            ],
+            "volume": 100,
+            "layerOrder": 9,
+            "visible": true,
+            "x": -102,
+            "y": -23.999999999999993,
+            "size": 100,
+            "direction": 90,
+            "draggable": false,
+            "rotationStyle": "all around",
+            "objName": "Characters 1"
+        }
+    },
+    {
+        "name": "Characters 2",
+        "md5": "7084b3baab935de819cc5ab46f7cecf8.svg",
+        "type": "sprite",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            0,
+            10,
+            1
+        ],
+        "json": {
+            "isStage": false,
+            "name": "Characters 2",
+            "variables": {},
+            "lists": {},
+            "broadcasts": {},
+            "blocks": {},
+            "comments": {},
+            "currentCostume": 0,
+            "costumes": [
+                {
+                    "assetId": "7084b3baab935de819cc5ab46f7cecf8",
+                    "name": "character2-a",
+                    "bitmapResolution": 1,
+                    "md5ext": "7084b3baab935de819cc5ab46f7cecf8.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 47.99056799868501,
+                    "rotationCenterY": 127.80503283089969
+                },
+                {
+                    "assetId": "df7cbf2913bcea721df2e0360644f193",
+                    "name": "character2-b",
+                    "bitmapResolution": 1,
+                    "md5ext": "df7cbf2913bcea721df2e0360644f193.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 44.99552075655663,
+                    "rotationCenterY": 125.14875889583388
+                },
+                {
+                    "assetId": "e0eacf1e575adc559c41e3a81a892168",
+                    "name": "character2-c",
+                    "bitmapResolution": 1,
+                    "md5ext": "e0eacf1e575adc559c41e3a81a892168.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 47.95809,
+                    "rotationCenterY": 123.53880000000001
+                },
+                {
+                    "assetId": "e8b44b0e904fd4bb7430c26b743f1520",
+                    "name": "character2-d",
+                    "bitmapResolution": 1,
+                    "md5ext": "e8b44b0e904fd4bb7430c26b743f1520.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 44.995540756556636,
+                    "rotationCenterY": 128.2061488659535
+                },
+                {
+                    "assetId": "67d425b11544caa0fe9228f355c6485b",
+                    "name": "character2-e",
+                    "bitmapResolution": 1,
+                    "md5ext": "67d425b11544caa0fe9228f355c6485b.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 48.00809000000001,
+                    "rotationCenterY": 122.45
+                },
+                {
+                    "assetId": "db3f436fcb6fb28828a4c932b60feb5e",
+                    "name": "character2-f",
+                    "bitmapResolution": 1,
+                    "md5ext": "db3f436fcb6fb28828a4c932b60feb5e.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 48.53553350541961,
+                    "rotationCenterY": 126.89993965793039
+                },
+                {
+                    "assetId": "93e035270675f933b94ee951d7e475e3",
+                    "name": "character2-g",
+                    "bitmapResolution": 1,
+                    "md5ext": "93e035270675f933b94ee951d7e475e3.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 47.53308999999999,
+                    "rotationCenterY": 125.43368141092515
+                },
+                {
+                    "assetId": "f4f2778df2840de5a6449a49f3efb599",
+                    "name": "character2-h",
+                    "bitmapResolution": 1,
+                    "md5ext": "f4f2778df2840de5a6449a49f3efb599.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 44.953870756556626,
+                    "rotationCenterY": 128.08851543576878
+                },
+                {
+                    "assetId": "1cf73a791959e07b5bafe18474f93b78",
+                    "name": "character2-i",
+                    "bitmapResolution": 1,
+                    "md5ext": "1cf73a791959e07b5bafe18474f93b78.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 48.00809000000001,
+                    "rotationCenterY": 126.87082000000001
+                },
+                {
+                    "assetId": "bf0d808f7bf0c11c338b4fea0a735874",
+                    "name": "character2-j",
+                    "bitmapResolution": 1,
+                    "md5ext": "bf0d808f7bf0c11c338b4fea0a735874.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 48.64271853726632,
+                    "rotationCenterY": 128.03860864267807
+                }
+            ],
+            "sounds": [
+                {
+                    "assetId": "83a9787d4cb6f3b7632b4ddfebf74367",
+                    "name": "pop",
+                    "dataFormat": "wav",
+                    "format": "",
+                    "rate": 48000,
+                    "sampleCount": 1123,
+                    "md5ext": "83a9787d4cb6f3b7632b4ddfebf74367.wav"
+                }
+            ],
+            "volume": 100,
+            "layerOrder": 8,
+            "visible": true,
+            "x": -195,
+            "y": 37.00000000000001,
+            "size": 100,
+            "direction": 90,
+            "draggable": false,
+            "rotationStyle": "all around",
+            "objName": "Characters 2"
+        }
+    },
    {
        "name": "Cheesy Puffs",
        "md5": "82772a61ec74974e84c686c61ea0b7d5.png",
@@ -10977,6 +11290,86 @@
            "objName": "Keyboard"
        }
    },
+    {
+        "name": "Kia",
+        "md5": "e56e480c994572323d88355b8733e1a3.svg",
+        "type": "sprite",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            0,
+            3,
+            1
+        ],
+        "json": {
+            "isStage": false,
+            "name": "Kia",
+            "variables": {},
+            "lists": {},
+            "broadcasts": {},
+            "blocks": {},
+            "comments": {},
+            "currentCostume": 0,
+            "costumes": [
+                {
+                    "assetId": "e56e480c994572323d88355b8733e1a3",
+                    "name": "Kia-a",
+                    "bitmapResolution": 1,
+                    "md5ext": "e56e480c994572323d88355b8733e1a3.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 38.99436950683594,
+                    "rotationCenterY": 133.91017150878906
+                },
+                {
+                    "assetId": "b3d0a248adbc26b0d0826e042a81670a",
+                    "name": "Kia-b",
+                    "bitmapResolution": 1,
+                    "md5ext": "b3d0a248adbc26b0d0826e042a81670a.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 33.86018625895264,
+                    "rotationCenterY": 133.81014001838557
+                },
+                {
+                    "assetId": "db6cd6b145bb6d8dc299475af7423d6e",
+                    "name": "Kia-c",
+                    "bitmapResolution": 1,
+                    "md5ext": "db6cd6b145bb6d8dc299475af7423d6e.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 55.533868959382346,
+                    "rotationCenterY": 133.7360717987814
+                }
+            ],
+            "sounds": [
+                {
+                    "assetId": "83a9787d4cb6f3b7632b4ddfebf74367",
+                    "name": "Pop",
+                    "dataFormat": "wav",
+                    "format": "",
+                    "rate": 48000,
+                    "sampleCount": 1123,
+                    "md5ext": "83a9787d4cb6f3b7632b4ddfebf74367.wav"
+                }
+            ],
+            "volume": 100,
+            "layerOrder": 4,
+            "visible": true,
+            "x": 211.99999999999997,
+            "y": 39.00000000000001,
+            "size": 100,
+            "direction": 90,
+            "draggable": false,
+            "rotationStyle": "all around",
+            "objName": "Kia"
+        }
+    },
    {
        "name": "Kiran",
        "md5": "7c0bedab5404830a5147cc4a2d46e997.svg",
@@ -11759,6 +12152,86 @@
            "objName": "Llama"
        }
    },
+    {
+        "name": "Luca",
+        "md5": "90fa2ad340edc6e6ba963710feef940e.svg",
+        "type": "sprite",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            0,
+            3,
+            1
+        ],
+        "json": {
+            "isStage": false,
+            "name": "Luca",
+            "variables": {},
+            "lists": {},
+            "broadcasts": {},
+            "blocks": {},
+            "comments": {},
+            "currentCostume": 0,
+            "costumes": [
+                {
+                    "assetId": "90fa2ad340edc6e6ba963710feef940e",
+                    "name": "Luca-a",
+                    "bitmapResolution": 1,
+                    "md5ext": "90fa2ad340edc6e6ba963710feef940e.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 44.518938859952925,
+                    "rotationCenterY": 130.28487970293187
+                },
+                {
+                    "assetId": "18dfad514602a4907502c7c84861b24e",
+                    "name": "Luca-b",
+                    "bitmapResolution": 1,
+                    "md5ext": "18dfad514602a4907502c7c84861b24e.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 41.801770753585856,
+                    "rotationCenterY": 130.2642790555675
+                },
+                {
+                    "assetId": "963cb82687acaf5de53a22b287192723",
+                    "name": "Luca-c",
+                    "bitmapResolution": 1,
+                    "md5ext": "963cb82687acaf5de53a22b287192723.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 50.565256229860694,
+                    "rotationCenterY": 130.02168173555543
+                }
+            ],
+            "sounds": [
+                {
+                    "assetId": "83a9787d4cb6f3b7632b4ddfebf74367",
+                    "name": "Pop",
+                    "dataFormat": "wav",
+                    "format": "",
+                    "rate": 48000,
+                    "sampleCount": 1123,
+                    "md5ext": "83a9787d4cb6f3b7632b4ddfebf74367.wav"
+                }
+            ],
+            "volume": 100,
+            "layerOrder": 5,
+            "visible": true,
+            "x": 179,
+            "y": 17,
+            "size": 100,
+            "direction": 90,
+            "draggable": false,
+            "rotationStyle": "all around",
+            "objName": "Luca"
+        }
+    },
    {
        "name": "Magic Wand",
        "md5": "89aa5332042d7bbf8368293a4efeafa4.svg",
@@ -12848,6 +13321,86 @@
            "objName": "Neigh Pony"
        }
    },
+    {
+        "name": "Noor",
+        "md5": "4cf233c6540e434aded60608ba316ce3.svg",
+        "type": "sprite",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            0,
+            3,
+            1
+        ],
+        "json": {
+            "isStage": false,
+            "name": "Noor",
+            "variables": {},
+            "lists": {},
+            "broadcasts": {},
+            "blocks": {},
+            "comments": {},
+            "currentCostume": 0,
+            "costumes": [
+                {
+                    "assetId": "4cf233c6540e434aded60608ba316ce3",
+                    "name": "Noor-a",
+                    "bitmapResolution": 1,
+                    "md5ext": "4cf233c6540e434aded60608ba316ce3.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 38.4758779691426,
+                    "rotationCenterY": 130.22760078036825
+                },
+                {
+                    "assetId": "975585ca9461f0730a285fc96df73425",
+                    "name": "Noor-b",
+                    "bitmapResolution": 1,
+                    "md5ext": "975585ca9461f0730a285fc96df73425.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 41.73210898803782,
+                    "rotationCenterY": 130.22760078036825
+                },
+                {
+                    "assetId": "c1792bbd5970034b4595ff7e742d6e47",
+                    "name": "Noor-c",
+                    "bitmapResolution": 1,
+                    "md5ext": "c1792bbd5970034b4595ff7e742d6e47.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 50.673619073816894,
+                    "rotationCenterY": 130.25802625960853
+                }
+            ],
+            "sounds": [
+                {
+                    "assetId": "83a9787d4cb6f3b7632b4ddfebf74367",
+                    "name": "Pop",
+                    "dataFormat": "wav",
+                    "format": "",
+                    "rate": 48000,
+                    "sampleCount": 1123,
+                    "md5ext": "83a9787d4cb6f3b7632b4ddfebf74367.wav"
+                }
+            ],
+            "volume": 100,
+            "layerOrder": 6,
+            "visible": true,
+            "x": 154,
+            "y": -19,
+            "size": 100,
+            "direction": 90,
+            "draggable": false,
+            "rotationStyle": "all around",
+            "objName": "Noor"
+        }
+    },
    {
        "name": "Octopus",
        "md5": "e22d9b633feffc1d026980a1f21e07d7.svg",
@@ -15694,6 +16247,86 @@
            "objName": "Sam"
        }
    },
+    {
+        "name": "Sasha",
+        "md5": "e26bf53469cafd730ca150e745ceeafc.svg",
+        "type": "sprite",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            0,
+            3,
+            1
+        ],
+        "json": {
+            "isStage": false,
+            "name": "Sasha",
+            "variables": {},
+            "lists": {},
+            "broadcasts": {},
+            "blocks": {},
+            "comments": {},
+            "currentCostume": 0,
+            "costumes": [
+                {
+                    "assetId": "e26bf53469cafd730ca150e745ceeafc",
+                    "name": "Sasha-a",
+                    "bitmapResolution": 1,
+                    "md5ext": "e26bf53469cafd730ca150e745ceeafc.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 48.12538146972656,
+                    "rotationCenterY": 132.3017578125
+                },
+                {
+                    "assetId": "a0b8890ce458aebed5e7002e1897508e",
+                    "name": "Sasha-b",
+                    "bitmapResolution": 1,
+                    "md5ext": "a0b8890ce458aebed5e7002e1897508e.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 40.4882598059082,
+                    "rotationCenterY": 132.05174255371094
+                },
+                {
+                    "assetId": "89bb25e1465eb9481d267e4f9df592af",
+                    "name": "Sasha-c",
+                    "bitmapResolution": 1,
+                    "md5ext": "89bb25e1465eb9481d267e4f9df592af.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 56.06647351528716,
+                    "rotationCenterY": 131.95398475097656
+                }
+            ],
+            "sounds": [
+                {
+                    "assetId": "83a9787d4cb6f3b7632b4ddfebf74367",
+                    "name": "Pop",
+                    "dataFormat": "wav",
+                    "format": "",
+                    "rate": 48000,
+                    "sampleCount": 1123,
+                    "md5ext": "83a9787d4cb6f3b7632b4ddfebf74367.wav"
+                }
+            ],
+            "volume": 100,
+            "layerOrder": 7,
+            "visible": true,
+            "x": 119.00000000000001,
+            "y": -50,
+            "size": 100,
+            "direction": 90,
+            "draggable": false,
+            "rotationStyle": "all around",
+            "objName": "Sasha"
+        }
+    },
    {
        "name": "Saxophone",
        "md5": "4414c51bdd03f60f40a1210e1d55cf57.svg",
@@ -17405,6 +18038,184 @@
            "objName": "Takeout"
        }
    },
+    {
+        "name": "Tatiana",
+        "md5": "5cf65a9f942ca92c93915527ff9db1e6.svg",
+        "type": "sprite",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            0,
+            4,
+            1
+        ],
+        "json": {
+            "isStage": false,
+            "name": "Tatiana",
+            "variables": {},
+            "lists": {},
+            "broadcasts": {},
+            "blocks": {},
+            "comments": {},
+            "currentCostume": 0,
+            "costumes": [
+                {
+                    "assetId": "5cf65a9f942ca92c93915527ff9db1e6",
+                    "name": "Tatiana-a",
+                    "bitmapResolution": 1,
+                    "md5ext": "5cf65a9f942ca92c93915527ff9db1e6.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 60.66618579359704,
+                    "rotationCenterY": 53.97647634953694
+                },
+                {
+                    "assetId": "91fb7d056beaf553ccec03d61d72c545",
+                    "name": "Tatiana-b",
+                    "bitmapResolution": 1,
+                    "md5ext": "91fb7d056beaf553ccec03d61d72c545.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 49.74537298932822,
+                    "rotationCenterY": 61.254895800177906
+                },
+                {
+                    "assetId": "e207fd3f99e1db8c5d66f49446f27e37",
+                    "name": "Tatiana-c",
+                    "bitmapResolution": 1,
+                    "md5ext": "e207fd3f99e1db8c5d66f49446f27e37.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 60.666205767105936,
+                    "rotationCenterY": 53.86536113811712
+                },
+                {
+                    "assetId": "e2ea6bbc6066574d4836e808a1c5f849",
+                    "name": "Tatiana-d",
+                    "bitmapResolution": 1,
+                    "md5ext": "e2ea6bbc6066574d4836e808a1c5f849.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 49.85653018505951,
+                    "rotationCenterY": 55.72124957487232
+                }
+            ],
+            "sounds": [
+                {
+                    "assetId": "c893b0a9b3e2e0594f1f921a12aa66be",
+                    "name": "Footsteps",
+                    "dataFormat": "wav",
+                    "format": "",
+                    "rate": 48000,
+                    "sampleCount": 256348,
+                    "md5ext": "c893b0a9b3e2e0594f1f921a12aa66be.wav"
+                }
+            ],
+            "volume": 100,
+            "layerOrder": 2,
+            "visible": true,
+            "x": -8.99999999999999,
+            "y": 122.00000000000001,
+            "size": 100,
+            "direction": 90,
+            "draggable": false,
+            "rotationStyle": "all around",
+            "objName": "Tatiana"
+        }
+    },
+    {
+        "name": "Taylor",
+        "md5": "ae2eaae0882543dc276c8e7d56ff2e7b.svg",
+        "type": "sprite",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            0,
+            4,
+            1
+        ],
+        "json": {
+            "isStage": false,
+            "name": "Taylor",
+            "variables": {},
+            "lists": {},
+            "broadcasts": {},
+            "blocks": {},
+            "comments": {},
+            "currentCostume": 0,
+            "costumes": [
+                {
+                    "assetId": "ae2eaae0882543dc276c8e7d56ff2e7b",
+                    "name": "Taylor-a",
+                    "bitmapResolution": 1,
+                    "md5ext": "ae2eaae0882543dc276c8e7d56ff2e7b.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 59.066061145351995,
+                    "rotationCenterY": 52.19126
+                },
+                {
+                    "assetId": "e0082f49fc5d0d83d7fad6124ba82bb1",
+                    "name": "Taylor-b",
+                    "bitmapResolution": 1,
+                    "md5ext": "e0082f49fc5d0d83d7fad6124ba82bb1.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 48.612321639466984,
+                    "rotationCenterY": 53.0163
+                },
+                {
+                    "assetId": "ae2eaae0882543dc276c8e7d56ff2e7b",
+                    "name": "Taylor-c",
+                    "bitmapResolution": 1,
+                    "md5ext": "ae2eaae0882543dc276c8e7d56ff2e7b.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 59.066061145351995,
+                    "rotationCenterY": 52.19126
+                },
+                {
+                    "assetId": "a504d785629f2d1ca6b87e80b334d5e8",
+                    "name": "Taylor-d",
+                    "bitmapResolution": 1,
+                    "md5ext": "a504d785629f2d1ca6b87e80b334d5e8.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 48.945654918401004,
+                    "rotationCenterY": 50.35257000000004
+                }
+            ],
+            "sounds": [
+                {
+                    "assetId": "c893b0a9b3e2e0594f1f921a12aa66be",
+                    "name": "Footsteps",
+                    "dataFormat": "wav",
+                    "format": "",
+                    "rate": 48000,
+                    "sampleCount": 256348,
+                    "md5ext": "c893b0a9b3e2e0594f1f921a12aa66be.wav"
+                }
+            ],
+            "volume": 100,
+            "layerOrder": 1,
+            "visible": true,
+            "x": 2.000000000000007,
+            "y": -116.99999999999999,
+            "size": 100,
+            "direction": 90,
+            "draggable": false,
+            "rotationStyle": "all around",
+            "objName": "Taylor"
+        }
+    },
    {
        "name": "Ten80 Dance",
        "md5": "f60f99278455c843b7833fb7615428dd.png",
@@ -17961,6 +18772,95 @@
            "objName": "Trees"
        }
    },
+    {
+        "name": "Trisha",
+        "md5": "55d31103bc86447c6a727b4f0664a5ea.svg",
+        "type": "sprite",
+        "tags": [
+            "people",
+            "person",
+            "boy",
+            "girl",
+            "nonbinary",
+            "non-binary",
+            "kid",
+            "character"
+        ],
+        "info": [
+            0,
+            4,
+            1
+        ],
+        "json": {
+            "isStage": false,
+            "name": "Trisha",
+            "variables": {},
+            "lists": {},
+            "broadcasts": {},
+            "blocks": {},
+            "comments": {},
+            "currentCostume": 0,
+            "costumes": [
+                {
+                    "assetId": "55d31103bc86447c6a727b4f0664a5ea",
+                    "name": "Trisha-a",
+                    "bitmapResolution": 1,
+                    "md5ext": "55d31103bc86447c6a727b4f0664a5ea.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 81.34455278988648,
+                    "rotationCenterY": 57.02459255690913
+                },
+                {
+                    "assetId": "c31dc8487a841f644889784ff437e2c5",
+                    "name": "Trisha-b",
+                    "bitmapResolution": 1,
+                    "md5ext": "c31dc8487a841f644889784ff437e2c5.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 63.260135124357646,
+                    "rotationCenterY": 60.86251166255646
+                },
+                {
+                    "assetId": "55d31103bc86447c6a727b4f0664a5ea",
+                    "name": "Trisha-c",
+                    "bitmapResolution": 1,
+                    "md5ext": "55d31103bc86447c6a727b4f0664a5ea.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 81.34455278988648,
+                    "rotationCenterY": 57.02459255690913
+                },
+                {
+                    "assetId": "2d06023ec09ec312ab49055530511134",
+                    "name": "Trisha-d",
+                    "bitmapResolution": 1,
+                    "md5ext": "2d06023ec09ec312ab49055530511134.svg",
+                    "dataFormat": "svg",
+                    "rotationCenterX": 63.275047131412066,
+                    "rotationCenterY": 55.525379847189015
+                }
+            ],
+            "sounds": [
+                {
+                    "assetId": "c893b0a9b3e2e0594f1f921a12aa66be",
+                    "name": "Footsteps",
+                    "dataFormat": "wav",
+                    "format": "",
+                    "rate": 48000,
+                    "sampleCount": 256348,
+                    "md5ext": "c893b0a9b3e2e0594f1f921a12aa66be.wav"
+                }
+            ],
+            "volume": 100,
+            "layerOrder": 3,
+            "visible": true,
+            "x": 5.999999999999982,
+            "y": -0.9999999999999964,
+            "size": 100,
+            "direction": 90,
+            "draggable": false,
+            "rotationStyle": "all around",
+            "objName": "Trisha"
+        }
+    },
    {
        "name": "Truck",
        "md5": "aaa05abc5aa182a0d7bfdc6db0f3207a.svg",
@@ -251,6 +251,7 @@ const ProjectSaverHOC = function (WrappedComponent) {
                    if (id && this.props.onUpdateProjectThumbnail) {
                        this.storeProjectThumbnail(id);
                    }
+                    this.reportTelemetryEvent('projectDidSave');
                    return response;
                })
                .catch(err => {
@@ -291,9 +292,15 @@ const ProjectSaverHOC = function (WrappedComponent) {
         */
        // TODO make a telemetry HOC and move this stuff there
        reportTelemetryEvent (event) {
-            if (this.props.onProjectTelemetryEvent) {
-                const metadata = collectMetadata(this.props.vm, this.props.reduxProjectTitle, this.props.locale);
-                this.props.onProjectTelemetryEvent(event, metadata);
+            try {
+                if (this.props.onProjectTelemetryEvent) {
+                    const metadata = collectMetadata(this.props.vm, this.props.reduxProjectTitle, this.props.locale);
+                    this.props.onProjectTelemetryEvent(event, metadata);
+                }
+            } catch (e) {
+                log.error('Telemetry error', event, e);
+                // This is intentionally fire/forget because a failure
+                // to report telemetry should not block saving
            }
        }

@@ -0,0 +1,3 @@
+export default {
+    en: {}
+};
@@ -19,6 +19,7 @@ class SeleniumHelper {
            'clickText',
            'clickButton',
            'clickXpath',
+            'clickBlocksCategory',
            'elementIsVisible',
            'findByText',
            'findByXpath',
@@ -124,6 +125,17 @@ class SeleniumHelper {
        return this.findByText(text, scope).then(el => el.click());
    }

+    async clickBlocksCategory (categoryText) {
+        // The toolbox is destroyed and recreated several times, so avoid clicking on a nonexistent element and erroring
+        // out. First we wait for the block pane itself to appear, then wait 100ms for the toolbox to finish refreshing,
+        // then finally click the toolbox text.
+
+        await this.findByXpath('//div[contains(@class, "blocks_blocks")]');
+        await this.driver.sleep(100);
+        await this.clickText(categoryText, 'div[contains(@class, "blocks_blocks")]');
+        await this.driver.sleep(500); // Wait for scroll to finish
+    }
+
    rightClickText (text, scope) {
        return this.findByText(text, scope).then(el => this.driver.actions()
            .click(el, Button.RIGHT)
@@ -3,6 +3,7 @@ import SeleniumHelper from '../helpers/selenium-helper';

 const {
    clickText,
+    clickBlocksCategory,
    clickButton,
    clickXpath,
    findByText,
@@ -31,8 +32,7 @@ describe('Working with the blocks', () => {
    test('Blocks report when clicked in the toolbox', async () => {
        await loadUri(uri);
        await clickText('Code');
-        await clickText('Operators', scope.blocksTab);
-        await new Promise(resolve => setTimeout(resolve, 1000)); // Wait for scroll animation
+        await clickBlocksCategory('Operators');
        await clickText('join', scope.blocksTab); // Click "join <hello> <world>" block
        await findByText('apple banana', scope.reportedValue); // Tooltip with result
        const logs = await getLogs();
@@ -41,14 +41,13 @@ describe('Working with the blocks', () => {

    test('Switching sprites updates the block menus', async () => {
        await loadUri(uri);
-        await clickText('Sound', scope.blocksTab);
-        await new Promise(resolve => setTimeout(resolve, 1000)); // Wait for scroll animation
+        await clickBlocksCategory('Sound');
        // "Meow" sound block should be visible
        await findByText('Meow', scope.blocksTab);
        await clickText('Backdrops'); // Switch to the backdrop
        // Now "pop" sound block should be visible and motion blocks hidden
        await findByText('pop', scope.blocksTab);
-        await clickText('Motion', scope.blocksTab);
+        await clickBlocksCategory('Motion');
        await findByText('Stage selected: no motion blocks');

        const logs = await getLogs();
@@ -58,8 +57,7 @@ describe('Working with the blocks', () => {
    test('Creating variables', async () => {
        await loadUri(uri);
        await clickText('Code');
-        await clickText('Variables', scope.blocksTab);
-        await new Promise(resolve => setTimeout(resolve, 1000)); // Wait for scroll animation
+        await clickBlocksCategory('Variables');

        // Expect a default variable "my variable" to be visible
        await clickText('my\u00A0variable', scope.blocksTab);
@@ -75,8 +73,7 @@ describe('Working with the blocks', () => {
        await clickButton('OK');

        // Make sure reporting works on a new variable
-        await clickText('Variables', scope.blocksTab);
-        await new Promise(resolve => setTimeout(resolve, 1000)); // Wait for scroll animation
+        await clickBlocksCategory('Variables');
        await clickText('score', scope.blocksTab);
        await findByText('0', scope.reportedValue); // Tooltip with result

@@ -100,8 +97,7 @@ describe('Working with the blocks', () => {
    test('Creating a list', async () => {
        await loadUri(uri);
        await clickText('Code');
-        await clickText('Variables', scope.blocksTab);
-        await new Promise(resolve => setTimeout(resolve, 1000)); // Wait for scroll animation
+        await clickBlocksCategory('Variables');

        await clickText('Make a List');
        let el = await findByXpath("//input[@name='New list name:']");
@@ -133,8 +129,7 @@ describe('Working with the blocks', () => {

    test('Custom procedures', async () => {
        await loadUri(uri);
-        await clickText('My Blocks');
-        await new Promise(resolve => setTimeout(resolve, 1000)); // Wait for scroll animation
+        await clickBlocksCategory('My Blocks');
        await clickText('Make a Block');
        // Click on the "add an input" buttons
        await clickText('number or text', scope.modal);
@@ -165,8 +160,7 @@ describe('Working with the blocks', () => {
    test('Record option from sound block menu opens sound recorder', async () => {
        await loadUri(uri);
        await clickText('Code');
-        await clickText('Sound', scope.blocksTab);
-        await new Promise(resolve => setTimeout(resolve, 1000)); // Wait for scroll animation
+        await clickBlocksCategory('Sound');
        await clickText('Meow', scope.blocksTab); // Click "play sound <Meow> until done" block
        await clickText('record'); // Click "record..." option in the block's sound menu
        // Access has been force denied, so close the alert that comes up
@@ -193,8 +187,7 @@ describe('Working with the blocks', () => {

        // Make sure it is updated in the block menu
        await clickText('Code');
-        await clickText('Looks', scope.blocksTab);
-        await driver.sleep(500); // Wait for scroll to finish
+        await clickBlocksCategory('Looks');
        await clickText('newname', scope.blocksTab);
    });

@@ -213,19 +206,17 @@ describe('Working with the blocks', () => {

        // Make sure it is updated in the block menu
        await clickText('Code');
-        await clickText('Looks', scope.blocksTab);
-        await driver.sleep(500); // Wait for scroll to finish
+        await clickBlocksCategory('Looks');
        await clickText('<NewCostume>', scope.blocksTab);

-        await clickText('Sound', scope.blocksTab);
+        await clickBlocksCategory('Sound');
    });

    test('Adding costumes DOES update the default costume name in the toolbox', async () => {
        await loadUri(uri);

        // By default, costume2 is in the costume tab
-        await clickText('Looks', scope.blocksTab);
-        await driver.sleep(500); // Wait for scroll to finish
+        await clickBlocksCategory('Looks');
        await clickText('costume2', scope.blocksTab);

        // Also check that adding a new costume does update the list
@@ -254,8 +245,7 @@ describe('Working with the blocks', () => {
        await findByXpath("//div[contains(@class,'sprite-selector-item_is-selected_')]" +
            "//div[contains(text(), 'A Bass')]");
        await clickText('Code');
-        await clickText('Sound', scope.blocksTab);
-        await driver.sleep(500); // Wait for scroll to finish
+        await clickBlocksCategory('Sound');
        await clickText('A\u00A0Bass', scope.blocksTab); // Need &nbsp; for block text
    });

@@ -264,15 +254,13 @@ describe('Working with the blocks', () => {
        const playerUri = path.resolve(__dirname, '../../build/player.html');
        await loadUri(playerUri);
        await clickText('See inside');
-        await clickText('Variables');
-        await driver.sleep(500); // Wait for scroll to finish
+        await clickBlocksCategory('Variables');
        await clickText('my\u00A0variable');

        await clickText('See Project Page');
        await clickText('See inside');

-        await clickText('Variables');
-        await driver.sleep(500); // Wait for scroll to finish
+        await clickBlocksCategory('Variables');
        await clickText('my\u00A0variable');
    });

@@ -281,8 +269,7 @@ describe('Working with the blocks', () => {
        await loadUri(uri);
        await clickText('Costumes');
        await clickText('Code');
-        await clickText('Variables', scope.blocksTab);
-        await driver.sleep(500); // Wait for scroll
+        await clickBlocksCategory('Variables');
        await clickText('Make a List');
        const el = await findByXpath("//input[@name='New list name:']");
        await el.sendKeys('list1');
@@ -25,16 +25,12 @@ describe('Localization', () => {
    });

    test('Switching languages', async () => {
-        await driver.quit();
-        driver = getDriver();
        await loadUri(uri);

        // Add a sprite to make sure it stays when switching languages
-        await clickText('Costumes');
        await clickXpath('//button[@aria-label="Choose a Sprite"]');
        await clickText('Apple', scope.modal); // Closes modal

-        await clickText('Code');
        await clickXpath('//*[@aria-label="language selector"]');
        await clickText('Deutsch');
        await new Promise(resolve => setTimeout(resolve, 1000)); // wait for blocks refresh
@@ -0,0 +1,52 @@
+import React from 'react';
+import {mountWithIntl} from '../../helpers/intl-helpers';
+import MenuBar from '../../../src/components/menu-bar/menu-bar';
+import {menuInitialState} from '../../../src/reducers/menus';
+import {LoadingState} from '../../../src/reducers/project-state';
+
+import configureStore from 'redux-mock-store';
+import {Provider} from 'react-redux';
+import VM from 'scratch-vm';
+
+
+describe('MenuBar Component', () => {
+    const store = configureStore()({
+        locales: {
+            isRtl: false,
+            locale: 'en-US'
+        },
+        scratchGui: {
+            menus: menuInitialState,
+            projectState: {
+                loadingState: LoadingState.NOT_LOADED
+            },
+            vm: new VM()
+        }
+    });
+
+    const getComponent = function (props = {}) {
+        return <Provider store={store}><MenuBar {...props} /></Provider>;
+    };
+
+    test('menu bar with no About handler has no About button', () => {
+        const menuBar = mountWithIntl(getComponent());
+        const button = menuBar.find('AboutButton');
+        expect(button.exists()).toBe(false);
+    });
+
+    test('menu bar with an About handler has an About button', () => {
+        const onClickAbout = jest.fn();
+        const menuBar = mountWithIntl(getComponent({onClickAbout}));
+        const button = menuBar.find('AboutButton');
+        expect(button.exists()).toBe(true);
+    });
+
+    test('clicking on About button calls the handler', () => {
+        const onClickAbout = jest.fn();
+        const menuBar = mountWithIntl(getComponent({onClickAbout}));
+        const button = menuBar.find('AboutButton');
+        expect(onClickAbout).toHaveBeenCalledTimes(0);
+        button.simulate('click');
+        expect(onClickAbout).toHaveBeenCalledTimes(1);
+    });
+});
@@ -0,0 +1,25 @@
+import 'web-audio-test-api';
+import SharedAudioContext from '../../../src/lib/audio/shared-audio-context';
+
+describe('Shared Audio Context', () => {
+    const audioContext = new AudioContext();
+
+    test('returns empty object without user gesture', () => {
+        const sharedAudioContext = new SharedAudioContext();
+        expect(sharedAudioContext).toMatchObject({});
+    });
+
+    test('returns AudioContext when mousedown is triggered', () => {
+        const sharedAudioContext = new SharedAudioContext();
+        const event = new Event('mousedown');
+        document.dispatchEvent(event);
+        expect(sharedAudioContext).toMatchObject(audioContext);
+    });
+
+    test('returns AudioContext when touchstart is triggered', () => {
+        const sharedAudioContext = new SharedAudioContext();
+        const event = new Event('touchstart');
+        document.dispatchEvent(event);
+        expect(sharedAudioContext).toMatchObject(audioContext);
+    });
+});
				`@@ -0,0 +1 @@`
				<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><path d="M10 2c4.418 0 8 3.582 8 8s-3.582 8-8 8-8-3.582-8-8 3.582-8 8-8zm-.072 10.42c-.256 0-.472.076-.648.227-.176.151-.264.338-.264.56 0 .25.091.445.273.584.182.139.395.209.639.209.236 0 .444-.07.624-.211s.27-.335.27-.581c0-.222-.086-.409-.258-.56-.172-.151-.384-.227-.636-.227zm.144-6.42c-.624 0-1.17.113-1.638.338-.468.225-.824.51-1.068.853-.244.343-.366.683-.366 1.017 0 .162.077.313.231.452.154.139.343.209.567.209.38 0 .638-.199.774-.597.144-.38.32-.668.528-.864.208-.196.532-.293.972-.293.376 0 .683.097.921.291.238.194.357.432.357.713 0 .144-.039.278-.117.402-.078.123-.174.235-.288.336-.114.1-.299.249-.555.446-.292.225-.524.42-.696.584-.172.164-.31.354-.414.571-.104.217-.156.473-.156.769 0 .236.071.414.213.534.142.12.317.18.525.18.4 0 .638-.183.714-.55l.099-.362.093-.206.183-.227.327-.288c.492-.387.833-.663 1.023-.827.19-.164.354-.358.492-.584.138-.225.207-.488.207-.787 0-.38-.121-.733-.363-1.057-.242-.324-.585-.58-1.029-.769-.444-.188-.956-.283-1.536-.283z" id="a"/></defs><g transform="translate(-2 -2)" fill="none"><mask><use xlink:href="#a"/></mask><use fill="#fff" xlink:href="#a"/></g></svg>