Auto set width of albums and restrict queue view width

Persephone.xcodeproj/project.pbxproj

@@ -179,6 +179,7 @@
 		E407861A2110CE6E006887B1 /* Persephone */ = {
 			isa = PBXGroup;
 			children = (
+				E407861F2110CE70006887B1 /* Assets.xcassets */,
 				E408D3B7220DE8CC0006D9BE /* Extensions */,
 				E4D1B598220BA3C90026F233 /* Resources */,
 				E4D1B597220BA3A20026F233 /* Controllers */,
@@ -230,9 +231,7 @@
 		E408D3C3220E138B0006D9BE /* Views */ = {
 			isa = PBXGroup;
 			children = (
-				E40786212110CE70006887B1 /* Main.storyboard */,
 				E408D3C8220E341D0006D9BE /* AlbumItem.swift */,
-				E408D3C9220E341D0006D9BE /* AlbumItem.xib */,
 			);
 			path = Views;
 			sourceTree = "<group>";
@@ -340,7 +339,8 @@
 		E4D1B598220BA3C90026F233 /* Resources */ = {
 			isa = PBXGroup;
 			children = (
-				E407861F2110CE70006887B1 /* Assets.xcassets */,
+				E40786212110CE70006887B1 /* Main.storyboard */,
+				E408D3C9220E341D0006D9BE /* AlbumItem.xib */,
 			);
 			path = Resources;
 			sourceTree = "<group>";

Persephone/Controllers/AlbumViewController.swift

@@ -10,8 +10,12 @@ import Cocoa
 
 class AlbumViewController: NSViewController,
                            NSCollectionViewDataSource,
-                           NSCollectionViewDelegate {
+                           NSCollectionViewDelegate,
+                           NSCollectionViewDelegateFlowLayout {
   var albums: [MPDClient.Album] = []
+  var albumWidth: CGFloat = 0
+  let paddingWidth: CGFloat = 40
+  let gutterWidth: CGFloat = 20
 
   override func viewDidLoad() {
     super.viewDidLoad()
@@ -24,6 +28,12 @@ class AlbumViewController: NSViewController,
     )
   }
 
+  override func viewWillLayout() {
+    super.viewWillLayout()
+
+    albumCollectionView.collectionViewLayout?.invalidateLayout()
+  }
+
   @objc func updateAlbums(_ notification: Notification) {
     guard let albums = notification.userInfo?[Notification.albumsKey] as? [MPDClient.Album]
       else { return }
@@ -51,5 +61,22 @@ class AlbumViewController: NSViewController,
     return albumItem
   }
 
+  func collectionView(_ collectionView: NSCollectionView, layout: NSCollectionViewLayout, sizeForItemAt: IndexPath) -> NSSize {
+    let width = collectionView.frame.size.width
+    var divider: CGFloat = 1
+    var itemWidth: CGFloat = 0
+
+    repeat {
+      let totalPaddingWidth = paddingWidth * 2
+      let totalGutterWidth = (divider - 1) * (gutterWidth + 1)
+      itemWidth = (width - totalPaddingWidth - totalGutterWidth) / divider
+      divider = divider + 1
+    } while itemWidth > 180
+
+    let itemHeight = itemWidth + 39
+
+    return NSSize(width: itemWidth, height: itemHeight)
+  }
+
   @IBOutlet var albumCollectionView: NSCollectionView!
 }

Persephone/Controllers/QueueViewController.swift

@@ -28,7 +28,7 @@ class QueueViewController: NSViewController, NSOutlineViewDataSource, NSOutlineV
   override func viewDidLoad() {
     super.viewDidLoad()
 
-    queueView.columnAutoresizingStyle = .uniformColumnAutoresizingStyle
+    queueView.columnAutoresizingStyle = .sequentialColumnAutoresizingStyle
 
     NotificationCenter.default.addObserver(
       self,

Persephone/Resources/AlbumItem.xib

@@ -16,43 +16,43 @@
         <customObject id="-1" userLabel="First Responder" customClass="FirstResponder"/>
         <customObject id="-3" userLabel="Application" customClass="NSObject"/>
         <customView id="Hz6-mo-xeY">
-            <rect key="frame" x="0.0" y="0.0" width="160" height="207"/>
+            <rect key="frame" x="0.0" y="0.0" width="128" height="167"/>
             <autoresizingMask key="autoresizingMask" flexibleMaxX="YES" flexibleMinY="YES"/>
             <subviews>
-                <imageView identifier="albumArtwork" horizontalHuggingPriority="251" verticalHuggingPriority="251" translatesAutoresizingMaskIntoConstraints="NO" id="Kfb-8f-ean">
+                <textField identifier="albumTitle" horizontalHuggingPriority="251" verticalHuggingPriority="750" translatesAutoresizingMaskIntoConstraints="NO" id="KEh-NL-c2W">
-                    <rect key="frame" x="0.0" y="45" width="160" height="162"/>
+                    <rect key="frame" x="-2" y="18" width="132" height="17"/>
-                    <imageCell key="cell" refusesFirstResponder="YES" alignment="left" imageScaling="proportionallyUpOrDown" image="blankAlbum" id="FsA-JX-BFh"/>
-                </imageView>
-                <textField identifier="albumTitle" horizontalHuggingPriority="251" verticalHuggingPriority="750" preferredMaxLayoutWidth="206" translatesAutoresizingMaskIntoConstraints="NO" id="KEh-NL-c2W">
-                    <rect key="frame" x="-2" y="20" width="164" height="17"/>
                     <textFieldCell key="cell" lineBreakMode="truncatingTail" title="Label" id="pDs-0t-e1j">
                         <font key="font" metaFont="system"/>
                         <color key="textColor" name="labelColor" catalog="System" colorSpace="catalog"/>
                         <color key="backgroundColor" name="textBackgroundColor" catalog="System" colorSpace="catalog"/>
                     </textFieldCell>
                 </textField>
-                <textField identifier="albumArtist" horizontalHuggingPriority="251" verticalHuggingPriority="750" preferredMaxLayoutWidth="206" translatesAutoresizingMaskIntoConstraints="NO" id="5Uu-j1-qyT">
+                <textField identifier="albumArtist" horizontalHuggingPriority="251" verticalHuggingPriority="750" translatesAutoresizingMaskIntoConstraints="NO" id="5Uu-j1-qyT">
-                    <rect key="frame" x="-2" y="0.0" width="164" height="17"/>
+                    <rect key="frame" x="-2" y="0.0" width="132" height="17"/>
                     <textFieldCell key="cell" lineBreakMode="truncatingTail" title="Label" id="yZn-e9-zyP">
                         <font key="font" metaFont="system"/>
                         <color key="textColor" name="secondaryLabelColor" catalog="System" colorSpace="catalog"/>
                         <color key="backgroundColor" name="textBackgroundColor" catalog="System" colorSpace="catalog"/>
                     </textFieldCell>
                 </textField>
+                <imageView identifier="albumArtwork" horizontalHuggingPriority="251" verticalHuggingPriority="251" translatesAutoresizingMaskIntoConstraints="NO" id="Kfb-8f-ean">
+                    <rect key="frame" x="0.0" y="39" width="128" height="128"/>
+                    <imageCell key="cell" refusesFirstResponder="YES" alignment="left" imageScaling="proportionallyUpOrDown" image="blankAlbum" id="FsA-JX-BFh"/>
+                </imageView>
             </subviews>
             <constraints>
                 <constraint firstItem="5Uu-j1-qyT" firstAttribute="trailing" secondItem="KEh-NL-c2W" secondAttribute="trailing" id="64z-uz-4nY"/>
-                <constraint firstAttribute="bottom" secondItem="KEh-NL-c2W" secondAttribute="bottom" constant="20" symbolic="YES" id="8Kg-1r-wNp"/>
+                <constraint firstAttribute="bottom" secondItem="KEh-NL-c2W" secondAttribute="bottom" constant="18" id="8Kg-1r-wNp"/>
                 <constraint firstItem="Kfb-8f-ean" firstAttribute="leading" secondItem="Hz6-mo-xeY" secondAttribute="leading" id="JMi-4i-dgs"/>
                 <constraint firstAttribute="trailing" secondItem="Kfb-8f-ean" secondAttribute="trailing" id="KQC-Wz-Bsg"/>
                 <constraint firstItem="5Uu-j1-qyT" firstAttribute="leading" secondItem="KEh-NL-c2W" secondAttribute="leading" id="MUo-0i-fX9"/>
                 <constraint firstItem="Kfb-8f-ean" firstAttribute="top" secondItem="Hz6-mo-xeY" secondAttribute="top" id="Qbk-jx-zAi"/>
                 <constraint firstItem="KEh-NL-c2W" firstAttribute="trailing" secondItem="Kfb-8f-ean" secondAttribute="trailing" id="U0w-G4-ggX"/>
                 <constraint firstItem="KEh-NL-c2W" firstAttribute="leading" secondItem="Kfb-8f-ean" secondAttribute="leading" id="V8r-Rc-Dx7"/>
-                <constraint firstItem="KEh-NL-c2W" firstAttribute="top" secondItem="Kfb-8f-ean" secondAttribute="bottom" constant="8" symbolic="YES" id="XFx-sv-dpF"/>
                 <constraint firstAttribute="bottom" secondItem="5Uu-j1-qyT" secondAttribute="bottom" id="gci-4h-pDZ"/>
+                <constraint firstAttribute="bottom" secondItem="Kfb-8f-ean" secondAttribute="bottom" constant="39" id="sid-zJ-YMA"/>
             </constraints>
-            <point key="canvasLocation" x="-22" y="139.5"/>
+            <point key="canvasLocation" x="-22" y="125.5"/>
         </customView>
         <collectionViewItem id="Qgu-aI-55A" customClass="AlbumItem" customModule="Persephone" customModuleProvider="target"/>
     </objects>

Persephone/Resources/Base.lproj/Main.storyboard

@@ -737,7 +737,7 @@
             <objects>
                 <splitViewController id="fnD-7K-pHK" sceneMemberID="viewController">
                     <splitViewItems>
-                        <splitViewItem canCollapse="YES" holdingPriority="260" behavior="sidebar" id="CWo-v7-gd2"/>
+                        <splitViewItem holdingPriority="255" behavior="contentList" id="CWo-v7-gd2"/>
                         <splitViewItem id="y8g-4F-czS"/>
                     </splitViewItems>
                     <splitView key="splitView" dividerStyle="thin" vertical="YES" id="g34-ef-XN0">
@@ -762,23 +762,23 @@
             <objects>
                 <viewController id="KIP-rq-4dM" customClass="QueueViewController" customModule="Persephone" customModuleProvider="target" sceneMemberID="viewController">
                     <view key="view" id="2su-YT-hba">
-                        <rect key="frame" x="0.0" y="0.0" width="450" height="300"/>
+                        <rect key="frame" x="0.0" y="0.0" width="350" height="300"/>
                         <autoresizingMask key="autoresizingMask"/>
                         <subviews>
                             <scrollView borderType="none" autohidesScrollers="YES" horizontalLineScroll="19" horizontalPageScroll="10" verticalLineScroll="19" verticalPageScroll="10" usesPredominantAxisScrolling="NO" translatesAutoresizingMaskIntoConstraints="NO" id="S3o-nF-NN7">
-                                <rect key="frame" x="0.0" y="0.0" width="450" height="300"/>
+                                <rect key="frame" x="0.0" y="0.0" width="350" height="300"/>
                                 <clipView key="contentView" drawsBackground="NO" id="WI8-Pw-03L">
-                                    <rect key="frame" x="0.0" y="0.0" width="450" height="300"/>
+                                    <rect key="frame" x="0.0" y="0.0" width="350" height="300"/>
                                     <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
                                     <subviews>
                                         <outlineView verticalHuggingPriority="750" allowsExpansionToolTips="YES" columnAutoresizingStyle="lastColumnOnly" selectionHighlightStyle="sourceList" multipleSelection="NO" autosaveColumns="NO" rowSizeStyle="automatic" viewBased="YES" indentationPerLevel="16" outlineTableColumn="0Co-uF-CCB" id="jEJ-jg-fll">
-                                            <rect key="frame" x="0.0" y="0.0" width="450" height="300"/>
+                                            <rect key="frame" x="0.0" y="0.0" width="350" height="300"/>
                                             <autoresizingMask key="autoresizingMask"/>
                                             <size key="intercellSpacing" width="3" height="2"/>
                                             <color key="backgroundColor" name="_sourceListBackgroundColor" catalog="System" colorSpace="catalog"/>
                                             <color key="gridColor" name="gridColor" catalog="System" colorSpace="catalog"/>
                                             <tableColumns>
-                                                <tableColumn identifier="songTitleColumn" width="222" minWidth="128" maxWidth="1000" id="0Co-uF-CCB">
+                                                <tableColumn identifier="songTitleColumn" width="200" minWidth="128" maxWidth="1000" id="0Co-uF-CCB">
                                                     <tableHeaderCell key="headerCell" lineBreakMode="truncatingTail" borderStyle="border" title="Title">
                                                         <font key="font" metaFont="smallSystem"/>
                                                         <color key="textColor" name="headerTextColor" catalog="System" colorSpace="catalog"/>
@@ -792,7 +792,7 @@
                                                     <tableColumnResizingMask key="resizingMask" resizeWithTable="YES"/>
                                                     <prototypeCellViews>
                                                         <tableCellView identifier="queueHeadingCell" id="GOd-cg-juD">
-                                                            <rect key="frame" x="1" y="1" width="222" height="17"/>
+                                                            <rect key="frame" x="1" y="1" width="200" height="17"/>
                                                             <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
                                                             <subviews>
                                                                 <textField verticalHuggingPriority="750" fixedFrame="YES" translatesAutoresizingMaskIntoConstraints="NO" id="xgd-Cz-np3">
@@ -807,7 +807,7 @@
                                                             </subviews>
                                                         </tableCellView>
                                                         <tableCellView identifier="songTitleCell" id="5rR-Gz-AcP">
-                                                            <rect key="frame" x="1" y="20" width="222" height="17"/>
+                                                            <rect key="frame" x="1" y="20" width="200" height="17"/>
                                                             <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
                                                             <subviews>
                                                                 <imageView translatesAutoresizingMaskIntoConstraints="NO" id="o8i-cz-hIP">
@@ -818,7 +818,7 @@
                                                                     <imageCell key="cell" refusesFirstResponder="YES" imageScaling="proportionallyDown" id="ckK-gW-Vhx"/>
                                                                 </imageView>
                                                                 <textField verticalHuggingPriority="750" translatesAutoresizingMaskIntoConstraints="NO" id="i0h-bn-auJ">
-                                                                    <rect key="frame" x="25" y="0.0" width="197" height="17"/>
+                                                                    <rect key="frame" x="25" y="0.0" width="175" height="17"/>
                                                                     <textFieldCell key="cell" lineBreakMode="truncatingTail" sendsActionOnEndEditing="YES" title="Table View Cell" id="ei8-1e-ErK">
                                                                         <font key="font" metaFont="system"/>
                                                                         <color key="textColor" name="controlTextColor" catalog="System" colorSpace="catalog"/>
@@ -841,7 +841,7 @@
                                                         </tableCellView>
                                                     </prototypeCellViews>
                                                 </tableColumn>
-                                                <tableColumn identifier="songArtistColumn" width="222" minWidth="128" maxWidth="1000" id="SPM-QP-DX8">
+                                                <tableColumn identifier="songArtistColumn" width="144" minWidth="128" maxWidth="1000" id="SPM-QP-DX8">
                                                     <tableHeaderCell key="headerCell" lineBreakMode="truncatingTail" borderStyle="border" alignment="left" title="Artist">
                                                         <font key="font" metaFont="smallSystem"/>
                                                         <color key="textColor" name="headerTextColor" catalog="System" colorSpace="catalog"/>
@@ -855,7 +855,7 @@
                                                     <tableColumnResizingMask key="resizingMask" resizeWithTable="YES"/>
                                                     <prototypeCellViews>
                                                         <tableCellView identifier="songArtistCell" id="JSk-Vc-Y7e">
-                                                            <rect key="frame" x="226" y="1" width="222" height="17"/>
+                                                            <rect key="frame" x="204" y="1" width="144" height="17"/>
                                                             <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
                                                             <subviews>
                                                                 <textField verticalHuggingPriority="750" horizontalCompressionResistancePriority="250" fixedFrame="YES" translatesAutoresizingMaskIntoConstraints="NO" id="tBe-Q9-3Rw">
@@ -883,8 +883,12 @@
                                     </subviews>
                                     <nil key="backgroundColor"/>
                                 </clipView>
+                                <constraints>
+                                    <constraint firstAttribute="width" relation="lessThanOrEqual" constant="500" id="tgW-46-U0V"/>
+                                    <constraint firstAttribute="width" relation="greaterThanOrEqual" constant="200" id="ynf-58-b0B"/>
+                                </constraints>
                                 <scroller key="horizontalScroller" hidden="YES" wantsLayer="YES" verticalHuggingPriority="750" horizontal="YES" id="7mx-v9-DSr">
-                                    <rect key="frame" x="0.0" y="284" width="450" height="16"/>
+                                    <rect key="frame" x="0.0" y="284" width="350" height="16"/>
                                     <autoresizingMask key="autoresizingMask"/>
                                 </scroller>
                                 <scroller key="verticalScroller" hidden="YES" wantsLayer="YES" verticalHuggingPriority="750" horizontal="NO" id="p5z-C0-FUJ">