Order sprites in 2.0 projects based on the serailzied indexInLibrary property. Store original ordering (e.g. layer order of sprites on the stage) to use when installing targets.

src/serialization/sb2.js

@@ -568,6 +568,12 @@ const parseScratchObject = function (object, runtime, extensions, topLevel, zip)
             }
         }
     }
+    if (object.hasOwnProperty('indexInLibrary')) {
+        // Temporarily store the 'indexInLibrary' property from the sb2 file
+        // so that we can correctly order sprites in the target pane.
+        // This will be deleted after we are done parsing and ordering the targets list.
+        target.targetPaneOrder = object.indexInLibrary;
+    }
 
     target.isStage = topLevel;
 
@@ -652,6 +658,25 @@ const parseScratchObject = function (object, runtime, extensions, topLevel, zip)
     );
 };
 
+const reorderParsedTargets = function (targets) {
+    // Reorder parsed targets based on the temporary targetPaneOrder property
+    // and also create a layerOrder property to track the sprite's layer ordering.
+
+    targets.forEach((t, index) => {
+        t.layerOrder = index;
+    });
+
+    targets.sort((a, b) => a.targetPaneOrder - b.targetPaneOrder);
+
+    // Delete the temporary target pane ordering since we shouldn't need it anymore.
+    targets.forEach(t => {
+        delete t.targetPaneOrder;
+    });
+
+    return targets;
+};
+
+
 /**
  * Top-level handler. Parse provided JSON,
  * and process the top-level object (the stage object).
@@ -667,6 +692,7 @@ const sb2import = function (json, runtime, optForceSprite, zip) {
         extensionURLs: new Map()
     };
     return parseScratchObject(json, runtime, extensions, !optForceSprite, zip)
+        .then(reorderParsedTargets)
         .then(targets => ({
             targets,
             extensions

test/unit/serialization_sb2.js

@@ -87,3 +87,18 @@ test('whenclicked blocks imported separately', t => {
         t.end();
     });
 });
+
+test('Ordering', t => {
+    // This SB2 has 3 sprites that have been reordered in scratch 2
+    // so the order in the file is not the order specified by the indexInLibrary property.
+    const uri = path.resolve(__dirname, '../fixtures/ordering.sb2');
+    const json = extractProjectJson(uri);
+    const rt = new Runtime();
+    sb2.deserialize(json, rt).then(({targets}) => {
+        // Would fail with any other ordering.
+        t.equal(targets[1].sprite.name, 'First');
+        t.equal(targets[2].sprite.name, 'Second');
+        t.equal(targets[3].sprite.name, 'Third');
+        t.end();
+    });
+});