support dragging costumes and sounds out from table views

HISTORY.md

@@ -14,6 +14,9 @@
     * Hungarian, thank you, Attila Faragó, for this HUGE update!
     * German
 
+### 2022-01-28
+* tables: support dragging costumes and sounds out from table views
+
 ### 2022-01-27
 * blocks, gui: support dragging costumes and sounds out from result bubbles
 * objects: support dragging costumes and sounds out from speech balloons

snap.html

@@ -24,7 +24,7 @@
         <script src="src/paint.js?version=2021-07-05"></script>
         <script src="src/lists.js?version=2021-12-15"></script>
         <script src="src/byob.js?version=2022-01-07"></script>
-        <script src="src/tables.js?version=2022-01-23"></script>
+        <script src="src/tables.js?version=2022-01-28"></script>
         <script src="src/sketch.js?version=2021-11-03"></script>
         <script src="src/video.js?version=2019-06-27"></script>
         <script src="src/maps.js?version=2021-06-15"></script>

src/tables.js

@@ -68,11 +68,12 @@
 MorphicPreferences, FrameMorph, HandleMorph, DialogBoxMorph, StringMorph, isNil,
 SpriteMorph, Context, Costume, BlockEditorMorph, SymbolMorph, IDE_Morph, Sound,
 SyntaxElementMorph, MenuMorph, SpriteBubbleMorph, SpeechBubbleMorph, CellMorph,
-ListWatcherMorph, BoxMorph, Variable, isSnapObject, useBlurredShadows*/
+ListWatcherMorph, BoxMorph, Variable, isSnapObject, useBlurredShadows,
+CostumeIconMorph, SoundIconMorph*/
 
 /*jshint esversion: 6*/
 
-modules.tables = '2022-January-23';
+modules.tables = '2022-January-28';
 
 var Table;
 var TableCellMorph;
@@ -343,7 +344,8 @@ TableCellMorph.prototype.render = function (ctx) {
         x,
         y;
 
-    this.isDraggable = this.data instanceof Context;
+    this.isDraggable = (this.data instanceof Context) ||
+        (this.data instanceof Costume) || (this.data instanceof Sound);
     ctx.fillStyle = background;
     if (this.shouldBeList()) {
         BoxMorph.prototype.outlinePath.call(
@@ -477,6 +479,18 @@ TableCellMorph.prototype.mouseLeave = function () {
 };
 
 TableCellMorph.prototype.selectForEdit = function () {
+    if (this.data instanceof Context) {
+        return this.selectContextForEdit();
+    }
+    if (this.data instanceof Costume) {
+        return this.selectCostumeForEdit();
+    }
+    if (this.data instanceof Sound) {
+        return this.selectSoundForEdit();
+    }
+};
+
+TableCellMorph.prototype.selectContextForEdit = function () {
     var script = this.data.toBlock(),
         prepare = script.prepareToBeGrabbed,
         ide = this.parentThatIsA(IDE_Morph) ||
@@ -496,6 +510,54 @@ TableCellMorph.prototype.selectForEdit = function () {
     return script;
 };
 
+TableCellMorph.prototype.selectCostumeForEdit = function () {
+    var cst = this.data.copy(),
+        icon,
+        prepare,
+        ide = this.parentThatIsA(IDE_Morph)||
+            this.world().childThatIsA(IDE_Morph);
+
+    cst.name = ide.currentSprite.newCostumeName(cst.name);
+    icon = new CostumeIconMorph(cst);
+    prepare = icon.prepareToBeGrabbed;
+
+    icon.prepareToBeGrabbed = function (hand) {
+        hand.grabOrigin = {
+            origin: ide.palette,
+            position: ide.palette.center()
+        };
+        this.prepareToBeGrabbed = prepare;
+    };
+
+    if (ide.isAppMode) {return; }
+    icon.setCenter(this.center());
+    return icon;
+};
+
+TableCellMorph.prototype.selectSoundForEdit = function () {
+    var snd = this.data.copy(),
+        icon,
+        prepare,
+        ide = this.parentThatIsA(IDE_Morph)||
+            this.world().childThatIsA(IDE_Morph);
+
+    snd.name = ide.currentSprite.newSoundName(snd.name);
+    icon = new SoundIconMorph(snd);
+    prepare = icon.prepareToBeGrabbed;
+
+    icon.prepareToBeGrabbed = function (hand) {
+        hand.grabOrigin = {
+            origin: ide.palette,
+            position: ide.palette.center()
+        };
+        this.prepareToBeGrabbed = prepare;
+    };
+
+    if (ide.isAppMode) {return; }
+    icon.setCenter(this.center());
+    return icon;
+};
+
 // TableMorph //////////////////////////////////////////////////////////
 
 // TableMorph inherits from FrameMorph: