1 files changed, 71 insertions, 16 deletions

diff --git a/ui.js b/ui.js
index 18652f5..dc9dab9 100644
--- a/ui.js
+++ b/ui.js
@@ -351,7 +351,6 @@ class AppElement extends FocusElement {
         return [
           {label: playingTrack ? `("${playingTrack.name}")` : '(No track playing.)'},
           {divider: true},
-          {element: this.loopModeControl},
           {element: this.volumeSlider},
           {divider: true},
           playingTrack && {element: this.playingControl},
@@ -373,6 +372,8 @@ class AppElement extends FocusElement {
         return [
           {label: `(Queue - ${curIndex >= 0 ? `${curIndex + 1}/` : ''}${items.length} items.)`},
           {divider: true},
+          {element: this.loopModeControl},
+          {divider: true},
           items.length && {label: 'Shuffle', action: () => this.shuffleQueue()},
           items.length && {label: 'Clear', action: () => this.clearQueue()}
         ]
@@ -406,7 +407,7 @@ class AppElement extends FocusElement {
       getEnabled: () => this.config.canControlPlayback
     })
 
-    this.loopModeControl = new InlineListPickerElement('Loop mode', [
+    this.loopModeControl = new InlineListPickerElement('Loop queue?', [
       {value: 'end', label: 'Don\'t loop'},
       {value: 'loop', label: 'Loop (same order)'},
       {value: 'shuffle', label: 'Loop (shuffle)'}
@@ -1973,7 +1974,7 @@ class AppElement extends FocusElement {
       return
     }
 
-    const { playingTrack, timeData } = this.SQP
+    const { playingTrack, timeData, queueEndMode } = this.SQP
     const { items } = this.SQP.queueGrouplike
     const {
       currentInput: currentInput,
@@ -2073,25 +2074,34 @@ class AppElement extends FocusElement {
     const { duration: durationString } = getTimeStringsFromSec(0, durationTotal)
     this.queueTimeLabel.text = `(${durationSymbol + durationString + approxSymbol})`
 
-    let collapseExtraInfo = false
     if (playingTrack) {
       let trackPart
+      let trackPartShort
+      let trackPartReallyShort
 
       {
         const distance = Math.abs(selectedIndex - playingIndex)
 
         let insertString
+        let insertStringShort
         if (selectedIndex < playingIndex) {
           insertString = ` (-${distance})`
-          collapseExtraInfo = true
+          insertStringShort = `-${distance}`
         } else if (selectedIndex > playingIndex) {
           insertString = ` (+${distance})`
-          collapseExtraInfo = true
+          insertStringShort = `+${distance}`
         } else {
           insertString = ''
+          insertStringShort = ''
         }
 
         trackPart = `${playingIndex + 1 + insertString} / ${items.length}`
+        trackPartShort = (insertString
+          ? `${playingIndex + 1 + insertStringShort}/${items.length}`
+          : `${playingIndex + 1}/${items.length}`)
+        trackPartReallyShort = (insertString
+          ? insertStringShort
+          : `#${playingIndex + 1}`)
       }
 
       let timestampPart
@@ -2106,10 +2116,8 @@ class AppElement extends FocusElement {
         let insertString
         if (selectedTimestampIndex < playingTimestampIndex) {
           insertString = ` (-${distance})`
-          collapseExtraInfo = true
         } else if (selectedTimestampIndex > playingTimestampIndex) {
           insertString = ` (+${distance})`
-          collapseExtraInfo = true
         } else {
           insertString = ''
         }
@@ -2117,19 +2125,66 @@ class AppElement extends FocusElement {
         timestampPart = `${playingTimestampIndex + 1 + insertString} / ${timestampData.length}`
       }
 
-      if (timestampPart) {
-        this.queueLengthLabel.text = `(${this.SQP.playSymbol} ${trackPart} : ${timestampPart})`
-      } else {
-        this.queueLengthLabel.text = `(${this.SQP.playSymbol} ${trackPart})`
+      let queueLoopPart
+      let queueLoopPartShort
+
+      if (selectedIndex === playingIndex) {
+        switch (queueEndMode) {
+          case 'loop':
+            queueLoopPart = 'Repeat'
+            queueLoopPartShort = 'R'
+            break
+          case 'shuffle':
+            queueLoopPart = 'Shuffle'
+            queueLoopPartShort = 'S'
+            break
+          case 'end':
+          default:
+            break
+        }
+      }
+
+      let partsTogether
+
+      const all = () => `(${this.SQP.playSymbol} ${partsTogether})`
+      const tooWide = () => all().length > this.queuePane.contentW
+
+      // goto irl
+      determineParts: {
+        if (timestampPart) {
+          if (queueLoopPart) {
+            partsTogether = `${trackPart} : ${timestampPart} »${queueLoopPartShort}`
+          } else {
+            partsTogether = `(${this.SQP.playSymbol} ${trackPart} : ${timestampPart})`
+          }
+          break determineParts
+        }
+
+        if (queueLoopPart) includeQueueLoop: {
+          partsTogether = `${trackPart} » ${queueLoopPart}`
+          if (tooWide()) {
+            partsTogether = `${trackPart} »${queueLoopPartShort}`
+            if (tooWide()) {
+              break includeQueueLoop
+            }
+          }
+          break determineParts
+        }
+
+        partsTogether = trackPart
+        if (tooWide()) {
+          partsTogether = trackPartShort
+          if (tooWide()) {
+            partsTogether = trackPartReallyShort
+          }
+        }
       }
+
+      this.queueLengthLabel.text = all()
     } else {
       this.queueLengthLabel.text = `(${items.length})`
     }
 
-    if (this.SQP.loopQueueAtEnd) {
-      this.queueLengthLabel.text += (collapseExtraInfo ? ` [L${unic.ELLIPSIS}]` : ` [Looping]`)
-    }
-
     // Layout stuff to position the length and time labels correctly.
     this.queueLengthLabel.centerInParent()
     this.queueTimeLabel.centerInParent()