added separators to list morphs, '~' for the libraries dialog

HISTORY.md

@@ -4,6 +4,7 @@
 
 ### 2020-07-23
 * morphic: fixed mouseDown events for touch devices
+* morphic, gui: added separators to list morphs, '~' for the libraries dialog 
 
 ### 2020-07-22
 * morphic, blocks, gui: tweaked block-fading mouse-over

snap.html

@@ -10,7 +10,7 @@
         <script src="src/blocks.js?version=2020-07-22"></script>
         <script src="src/threads.js?version=2020-07-22"></script>
         <script src="src/objects.js?version=2020-07-20"></script>
-        <script src="src/gui.js?version=2020-07-22"></script>
+        <script src="src/gui.js?version=2020-07-23"></script>
         <script src="src/paint.js?version=2020-05-17"></script>
         <script src="src/lists.js?version=2020-07-01"></script>
         <script src="src/byob.js?version=2020-07-01"></script>

src/gui.js

@@ -78,7 +78,7 @@ Animation, BoxMorph, BlockEditorMorph, BlockDialogMorph, Note, ZERO, BLACK*/
 
 // Global stuff ////////////////////////////////////////////////////////
 
-modules.gui = '2020-July-22';
+modules.gui = '2020-July-23';
 
 // Declarations
 
@@ -7855,7 +7855,8 @@ LibraryImportDialogMorph.prototype.installLibrariesList = function () {
         this.librariesData,
         element => element.name,
         null,
-        () => this.importLibrary()
+        () => this.importLibrary(),
+        '~' // separator
     );
 
     this.fixListFieldItemColors();

src/morphic.js

@@ -10745,7 +10745,7 @@ ListMorph.prototype = new ScrollFrameMorph();
 ListMorph.prototype.constructor = ListMorph;
 ListMorph.uber = ScrollFrameMorph.prototype;
 
-function ListMorph(elements, labelGetter, format, doubleClickAction) {
+function ListMorph(elements, labelGetter, format, onDoubleClick, separator) {
 /*
     passing a format is optional. If the format parameter is specified
     it has to be of the following pattern:
@@ -10778,7 +10778,8 @@ function ListMorph(elements, labelGetter, format, doubleClickAction) {
             return element.toString();
         },
         format || [],
-        doubleClickAction // optional callback
+        onDoubleClick, // optional callback
+        separator // string indicating a horizontal line between items
     );
 }
 
@@ -10786,7 +10787,8 @@ ListMorph.prototype.init = function (
     elements,
     labelGetter,
     format,
-    doubleClickAction
+    onDoubleClick,
+    separator
 ) {
     ListMorph.uber.init.call(this);
 
@@ -10801,7 +10803,8 @@ ListMorph.prototype.init = function (
     this.selected = null; // actual element currently selected
     this.active = null; // menu item representing the selected element
     this.action = null;
-    this.doubleClickAction = doubleClickAction || null;
+    this.doubleClickAction = onDoubleClick || null;
+    this.separator = separator || '';
     this.acceptsDrops = false;
     this.buildListContents();
 };
@@ -10821,7 +10824,8 @@ ListMorph.prototype.buildListContents = function () {
     this.elements.forEach(element => {
         var color = null,
             bold = false,
-            italic = false;
+            italic = false,
+            label;
 
         this.format.forEach(pair => {
             if (pair[1].call(null, element)) {
@@ -10834,15 +10838,21 @@ ListMorph.prototype.buildListContents = function () {
                 }
             }
         });
-        this.listContents.addItem(
-            this.labelGetter(element), // label string
-            element, // action
-            null, // hint
-            color,
-            bold,
-            italic,
-            this.doubleClickAction
-        );
+
+        label = this.labelGetter(element);
+        if (label === this.separator) {
+            this.listContents.addLine();
+        } else {
+            this.listContents.addItem(
+                label, // label string
+                element, // action
+                null, // hint
+                color,
+                bold,
+                italic,
+                this.doubleClickAction
+            );
+        }
     });
     this.listContents.isListContents = true;
     this.listContents.createItems();