1 files changed, 39 insertions, 23 deletions

diff --git a/ui.js b/ui.js
index 99039cf..b6d525c 100644
--- a/ui.js
+++ b/ui.js
@@ -109,7 +109,7 @@ class AppElement extends FocusElement {
     grouplikeListing.on('browse', item => grouplikeListing.loadGrouplike(item))
     grouplikeListing.on('menu', (item, opts) => this.menu.show(opts))
 
-    grouplikeListing.on('queue', (item, {where = 'end', shuffle = false, play = false}) => {
+    grouplikeListing.on('queue', (item, {where = 'end', shuffle = false, play = false} = {}) => {
       if (isGroup(item) && shuffle) {
         item = {items: shuffleArray(flattenGrouplike(item).items)}
       }
@@ -181,14 +181,11 @@ class AppElement extends FocusElement {
       }
     })
 
-    grouplikeListing.on('paste', (item, {where = 'below'}) => {
+    grouplikeListing.on('paste', (item, {where = 'below'} = {}) => {
       if (this.editMode && this.markGrouplike.items.length) {
         let parent, index
 
-        if (where === 'inside') {
-          parent = item
-          index = 0
-        } else if (where === 'above') {
+        if (where === 'above') {
           parent = item[parentSymbol]
           index = parent.items.indexOf(item)
         } else if (where === 'below') {
@@ -752,16 +749,23 @@ class GrouplikeListingElement extends FocusElement {
       form.addInput(upButton)
     }
 
+    let itemElements = []
     if (this.grouplike.items.length) {
-      for (const item of this.grouplike.items) {
-        const itemElement = new GrouplikeItemElement(item, this.recordStore)
-        for (const evtName of ['download', 'remove', 'mark', 'paste', 'browse', 'queue', 'menu']) {
-          itemElement.on(evtName, (...data) => this.emit(evtName, item, ...data))
-        }
-        form.addInput(itemElement)
-      }
+      itemElements = this.grouplike.items.map(item => new GrouplikeItemElement(item, this.recordStore))
     } else if (!this.grouplike.isTheQueue) {
-      form.addInput(new Button('(No items in this group)'))
+      const fakeItem = {
+        fake: true,
+        name: '(This group is empty)',
+        [parentSymbol]: this.grouplike
+      }
+      itemElements = [new GrouplikeItemElement(fakeItem, this.recordStore)]
+    }
+
+    for (const itemElement of itemElements) {
+      for (const evtName of ['download', 'remove', 'mark', 'paste', 'browse', 'queue', 'menu']) {
+        itemElement.on(evtName, (...data) => this.emit(evtName, itemElement.item, ...data))
+      }
+      form.addInput(itemElement)
     }
 
     if (wasSelected) {
@@ -918,6 +922,18 @@ class GrouplikeItemElement extends Button {
     return this.recordStore.app.editMode && this.recordStore.app.markGrouplike.items.includes(this.item)
   }
 
+  get isReal() {
+    return !this.item.fake
+  }
+
+  get isGroup() {
+    return isGroup(this.item) && this.isReal
+  }
+
+  get isTrack() {
+    return isTrack(this.item) && this.isReal
+  }
+
   keyPressed(keyBuf) {
     if (telc.isCaselessLetter(keyBuf, 'd')) {
       this.emit('download')
@@ -940,15 +956,15 @@ class GrouplikeItemElement extends Button {
         x: this.absLeft,
         y: this.absTop + 1,
         items: [
-          editMode && {label: this.isMarked ? 'Unmark' : 'Mark', action: () => this.emit('mark')},
-          anyMarked && {label: 'Paste (above)', action: () => this.emit('paste', {where: 'above'})},
-          anyMarked && {label: 'Paste (below)', action: () => this.emit('paste', {where: 'below'})},
-          anyMarked && isGroup(this.item) && {label: 'Paste (inside)', action: () => this.emit('paste', {where: 'inside'})},
-          {label: 'Play', action: () => this.emit('queue', {where: 'next', play: true})},
-          {label: 'Play next', action: () => this.emit('queue', {where: 'next'})},
-          {label: 'Play at end', action: () => this.emit('queue', {where: 'end'})},
-          isGroup(this.item) && {label: 'Play next, shuffled', action: () => this.emit('queue', {where: 'next', shuffle: true})},
-          isGroup(this.item) && {label: 'Play at end, shuffled', action: () => this.emit('queue', {where: 'end', shuffle: true})}
+          editMode && this.isReal && {label: this.isMarked ? 'Unmark' : 'Mark', action: () => this.emit('mark')},
+          anyMarked && this.isReal && {label: 'Paste (above)', action: () => this.emit('paste', {where: 'above'})},
+          anyMarked && this.isReal && {label: 'Paste (below)', action: () => this.emit('paste', {where: 'below'})},
+          anyMarked && !this.isReal && {label: 'Paste', action: () => this.emit('paste')}, // No "above" or "elow" in the label because the fake item will be replaced (it'll disappear, since there'll be an item in the group)
+          this.isReal && {label: 'Play', action: () => this.emit('queue', {where: 'next', play: true})},
+          this.isReal && {label: 'Play next', action: () => this.emit('queue', {where: 'next'})},
+          this.isReal && {label: 'Play at end', action: () => this.emit('queue', {where: 'end'})},
+          this.isGroup && {label: 'Play next, shuffled', action: () => this.emit('queue', {where: 'next', shuffle: true})},
+          this.isGroup && {label: 'Play at end, shuffled', action: () => this.emit('queue', {where: 'end', shuffle: true})}
         ]
       })
     }