support custom categories in libraries

HISTORY.md

@@ -29,6 +29,9 @@
     * German
     * Chinese, thanks, Simon!
 
+### 2021-07-23
+* byob, objects, gui, store: support custom categories in libraries
+
 ### 2021-07-22
 * store: serialize user defined block palettes
 * objects: enabled custom categories for the stage

snap.html

@@ -18,19 +18,19 @@
         <script src="src/widgets.js?version=2021-07-21"></script>
         <script src="src/blocks.js?version=2021-07-05"></script>
         <script src="src/threads.js?version=2021-07-20"></script>
-        <script src="src/objects.js?version=2021-07-22"></script>
+        <script src="src/objects.js?version=2021-07-23"></script>
         <script src="src/scenes.js?version=2021-07-21"></script>
-        <script src="src/gui.js?version=2021-07-22"></script>
+        <script src="src/gui.js?version=2021-07-23"></script>
         <script src="src/paint.js?version=2021-07-05"></script>
         <script src="src/lists.js?version=2021-07-19"></script>
-        <script src="src/byob.js?version=2021-07-21"></script>
+        <script src="src/byob.js?version=2021-07-23"></script>
         <script src="src/tables.js?version=2021-05-07"></script>
         <script src="src/sketch.js?version=2021-07-05"></script>
         <script src="src/video.js?version=2019-06-27"></script>
         <script src="src/maps.js?version=2021-06-15"></script>
         <script src="src/extensions.js?version=2021-07-20"></script>
         <script src="src/xml.js?version=2021-07-05"></script>
-        <script src="src/store.js?version=2021-07-22"></script>
+        <script src="src/store.js?version=2021-07-23"></script>
         <script src="src/locale.js?version=2021-07-12"></script>
         <script src="src/cloud.js?version=2021-02-04"></script>
         <script src="src/api.js?version=2021-07-05"></script>

src/byob.js

@@ -108,7 +108,7 @@ WatcherMorph, XML_Serializer, SnapTranslator, SnapExtensions*/
 
 // Global stuff ////////////////////////////////////////////////////////
 
-modules.byob = '2021-July-21';
+modules.byob = '2021-July-23';
 
 // Declarations
 
@@ -4134,7 +4134,7 @@ BlockExportDialogMorph.prototype.buildContents = function () {
     // populate palette
     x = palette.left() + padding;
     y = palette.top() + padding;
-    SpriteMorph.prototype.categories.forEach(category => {
+    SpriteMorph.prototype.allCategories().forEach(category => {
         this.blocks.forEach(definition => {
             if (definition.category === category) {
                 if (lastCat && (category !== lastCat)) {
@@ -4230,6 +4230,7 @@ BlockExportDialogMorph.prototype.exportBlocks = function () {
             + '" version="'
             + this.serializer.version
             + '">'
+            + this.paletteXML()
             + str
             + '</blocks>';
         ide.saveXMLAs(
@@ -4245,6 +4246,19 @@ BlockExportDialogMorph.prototype.exportBlocks = function () {
     }
 };
 
+BlockExportDialogMorph.prototype.paletteXML = function () {
+    var palette = new Map();
+    this.blocks.forEach(def => {
+        if (SpriteMorph.prototype.customCategories.has(def.category)) {
+            palette.set(
+                def.category,
+                SpriteMorph.prototype.customCategories.get(def.category)
+            );
+        }
+    });
+    return this.serializer.paletteToXML(palette);
+};
+
 // BlockExportDialogMorph layout
 
 BlockExportDialogMorph.prototype.fixLayout

src/gui.js

@@ -85,7 +85,7 @@ Animation, BoxMorph, BlockDialogMorph, RingMorph, Project, ZERO, BLACK*/
 
 // Global stuff ////////////////////////////////////////////////////////
 
-modules.gui = '2021-July-22';
+modules.gui = '2021-July-23';
 
 // Declarations
 
@@ -5566,6 +5566,10 @@ IDE_Morph.prototype.rawOpenBlocksString = function (str, name, silently) {
     } else {
         new BlockImportDialogMorph(blocks, this.stage, name).popUp();
     }
+    this.createCategories();
+    this.createPaletteHandle();
+    this.categories.fixLayout();
+    this.fixLayout();
 };
 
 IDE_Morph.prototype.openSpritesString = function (str) {
@@ -8679,6 +8683,11 @@ function LibraryImportDialogMorph(ide, librariesData) {
 }
 
 LibraryImportDialogMorph.prototype.init = function (ide, librariesData) {
+    // additional properties
+    this.isLoadingLibrary = false;
+    this.originalCategories = null;
+    this.captureOriginalCategories();
+
     // initialize inherited properties:
     LibraryImportDialogMorph.uber.init.call(
         this,
@@ -8709,6 +8718,13 @@ LibraryImportDialogMorph.prototype.init = function (ide, librariesData) {
     this.buildContents();
 };
 
+LibraryImportDialogMorph.prototype.captureOriginalCategories = function () {
+    this.originalCategories = new Map();
+    SpriteMorph.customCategories.forEach((color, name) =>
+        this.originalCategories.set(name, color)
+    );
+};
+
 LibraryImportDialogMorph.prototype.buildContents = function () {
     this.addBody(new Morph());
     this.body.color = this.color;
@@ -8835,6 +8851,13 @@ LibraryImportDialogMorph.prototype.popUp = function () {
     }
 };
 
+LibraryImportDialogMorph.prototype.destroy = function () {
+    LibraryImportDialogMorph.uber.destroy.call(this);
+    if (!this.isLoadingLibrary) {
+        SpriteMorph.prototype.customCategories = this.originalCategories;
+    }
+};
+
 LibraryImportDialogMorph.prototype.fixListFieldItemColors =
     ProjectDialogMorph.prototype.fixListFieldItemColors;
 
@@ -8912,14 +8935,18 @@ LibraryImportDialogMorph.prototype.cachedLibrary = function (key) {
     return this.libraryCache[key];
 };
 
-LibraryImportDialogMorph.prototype.importLibrary = function () {
+LibraryImportDialogMorph.prototype.importLibrary = function () { // +++ clean up
     if (!this.listField.selected) {return; }
 
-    var blocks,
+    var // blocks,
         ide = this.ide,
         selectedLibrary = this.listField.selected.fileName,
         libraryName = this.listField.selected.name;
 
+    // restore captured user-blocks categories
+    SpriteMorph.prototype.customCategories = this.originalCategories;
+
+/*
     if (this.hasCached(selectedLibrary)) {
         blocks = this.cachedLibrary(selectedLibrary);
         blocks.forEach(def => {
@@ -8929,14 +8956,16 @@ LibraryImportDialogMorph.prototype.importLibrary = function () {
         });
         ide.showMessage(localize('Imported') + ' ' + localize(libraryName), 2);
     } else {
+*/
         ide.showMessage(localize('Loading') + ' ' + localize(libraryName));
         ide.getURL(
             ide.resourceURL('libraries', selectedLibrary),
-            function(libraryText) {
+            libraryText => {
                 ide.droppedText(libraryText, libraryName);
+                this.isLoadingLibrary = true;
             }
         );
-    }
+//    }
 };
 
 LibraryImportDialogMorph.prototype.displayBlocks = function (libraryKey) {

src/objects.js

@@ -86,7 +86,7 @@ AlignmentMorph, Process, WorldMap, copyCanvas, useBlurredShadows*/
 
 /*jshint esversion: 6*/
 
-modules.objects = '2021-July-22';
+modules.objects = '2021-July-23';
 
 var SpriteMorph;
 var StageMorph;
@@ -3165,7 +3165,8 @@ SpriteMorph.prototype.freshPalette = function (category) {
     if (category !== 'unified') {
         blocks.push('=');
         blocks.push(...this.customBlockTemplatesForCategory(category));
-    } else if (category === 'variables') {
+    }
+    if (category === 'variables') {
         blocks.push(...this.customBlockTemplatesForCategory('lists'));
         blocks.push(...this.customBlockTemplatesForCategory('other'));
     }

src/store.js

@@ -63,7 +63,7 @@ Project*/
 
 // Global stuff ////////////////////////////////////////////////////////
 
-modules.store = '2021-July-22';
+modules.store = '2021-July-23';
 
 // XML_Serializer ///////////////////////////////////////////////////////
 /*
@@ -666,6 +666,13 @@ SnapSerializer.prototype.loadBlocks = function (xmlString, targetStage) {
     if (+model.attributes.version > this.version) {
         throw 'Module uses newer version of Serializer';
     }
+    model.palette = model.childNamed('palette');
+    if (model.palette) {
+        SpriteMorph.prototype.customCategories = this.loadPalette(
+            model.palette
+        );
+    }
+    model.removeChild(model.palette);
     this.loadCustomBlocks(stage, model, true);
     this.populateCustomBlocks(
         stage,