// title: Compact
// class: large
// order: 5
// min: 820x560
// pref: 980x660
//
// The medium window's one layout, a sidebar device: the volume over the
// playlists down the left; the screen over the keys, beside the display
// wing; what plays, the position line and Up Next's key in one row; and the
// list area (the tracks, the equalizer) beside Up Next. The groove under the
// device trades picture for list; the one in the sidebar trades volume
// for playlists.
use mod.prelude.widgets_internal.*
use mod.widgets.*

mod.widgets.HwLayout = View{
    width: Fill
    height: Fill
    flow: Right
    spacing: 12
    // Wide enough for the playlists' names and counts (a column narrower
    // than about 220 pt only cramps them).
    View{
        width: 240
        height: Fill
        side_split := mod.widgets.HwDeckSplitter{
            width: Fill
            height: Fill
            axis: SplitterAxis.Vertical
            align: SplitterAlign.FromA(236.0)
            min_horizontal: 150.0
            max_horizontal: 140.0
            a: mod.widgets.HwSlot{component: "volume" width: Fill height: Fill}
            b: mod.widgets.HwSlot{component: "library" width: Fill height: Fill}
        }
    }
    device_split := mod.widgets.HwDeckSplitter{
        width: Fill
        height: Fill
        axis: SplitterAxis.Vertical
        align: SplitterAlign.Weighted(0.56)
        min_horizontal: 320.0
        max_horizontal: 150.0
        a: View{
            width: Fill
            height: Fill
            flow: Down
            spacing: 8
            // The screen over the keys, the display wing beside both (tall
            // enough for its preset keys).
            View{
                width: Fill
                height: Fill
                flow: Right
                spacing: 10
                View{
                    width: Fill
                    height: Fill
                    flow: Down
                    spacing: 6
                    mod.widgets.HwSlot{component: "screen" width: Fill height: Fill}
                    mod.widgets.HwSlot{component: "transport" width: Fill height: 56}
                }
                mod.widgets.HwSlot{component: "display" width: 236 height: Fill}
            }
            View{
                width: Fill
                height: 46
                flow: Right
                spacing: 10
                mod.widgets.HwSlot{component: "now" width: 190 height: Fill}
                mod.widgets.HwSlot{component: "progress" width: Fill height: Fill}
                mod.widgets.HwSlot{component: "queue" width: 56 height: Fill}
            }
        }
        b: View{
            width: Fill
            height: Fill
            split := mod.widgets.HwSplitter{
                width: Fill
                height: Fill
                axis: SplitterAxis.Horizontal
                align: SplitterAlign.FromB(260.0)
                min_vertical: 320.0
                max_vertical: 200.0
                a: mod.widgets.HwSlot{component: "tracks" width: Fill height: Fill}
                b: mod.widgets.HwSlot{component: "upnext" width: Fill height: Fill}
            }
        }
    }
}
true