From 267b91cee8f55e82efec42231b38734175c24ab1 Mon Sep 17 00:00:00 2001
From: sheaf <sam.derbyshire@gmail.com>
Date: Thu, 6 Aug 2020 02:45:20 +0200
Subject: [PATCH] file selection bar

---
 app/Main.hs      | 32 +++++++++++++++++++++++++-------
 assets/theme.css | 48 +++++++++++++++++++++++++++++++++---------------
 2 files changed, 58 insertions(+), 22 deletions(-)

diff --git a/app/Main.hs b/app/Main.hs
index b701a3b..3b58f55 100644
--- a/app/Main.hs
+++ b/app/Main.hs
@@ -8,6 +8,8 @@ module Main
   where
 
 -- base
+import Data.Foldable
+  ( for_ )
 import Data.Int
   ( Int32 )
 import System.Exit
@@ -95,23 +97,24 @@ main = do
   logo      <- GTK.boxNew   GTK.OrientationVertical   0
   titleBar  <- GTK.boxNew   GTK.OrientationHorizontal 0
   toolBar   <- GTK.boxNew   GTK.OrientationVertical   0
-  fileBar   <- GTK.boxNew   GTK.OrientationHorizontal 0
   mainPane  <- GTK.panedNew GTK.OrientationHorizontal
   panelGrid <- GTK.gridNew
 
   GTK.gridAttach uiGrid logo      0 0 1 2
   GTK.gridAttach uiGrid titleBar  1 0 3 1
   GTK.gridAttach uiGrid toolBar   0 2 2 2
-  GTK.gridAttach uiGrid fileBar   2 1 1 1
-  GTK.gridAttach uiGrid mainPane  2 2 2 3
+  GTK.gridAttach uiGrid mainPane  2 1 2 4
 
   mainView     <- GTK.boxNew GTK.OrientationVertical   0
-  viewportGrid <- GTK.gridNew
-  infoBar      <- GTK.boxNew GTK.OrientationHorizontal 0
 
   GTK.panedPack1 mainPane mainView  True  False
   GTK.panedPack2 mainPane panelGrid False False
 
+  fileBar      <- GTK.scrolledWindowNew ( Nothing @GTK.Adjustment ) ( Nothing @GTK.Adjustment )
+  viewportGrid <- GTK.gridNew
+  infoBar      <- GTK.boxNew GTK.OrientationHorizontal 0
+
+  GTK.boxPackStart mainView fileBar      False False 0
   GTK.boxPackStart mainView viewportGrid True  True  0
   GTK.boxPackStart mainView infoBar      False False 0
 
@@ -138,14 +141,14 @@ main = do
   widgetAddClass titleBar "titleBar"
 
   ( menuBar, _menu ) <- newMenuBar
-  widgetAddClasses menuBar [ "text", "plain" ]
+  widgetAddClasses menuBar [ "menuBar", "text", "plain" ]
   GTK.boxPackStart titleBar menuBar False False 0
 
   windowIcons <- GTK.boxNew GTK.OrientationHorizontal 0
   widgetAddClasses windowIcons [ "windowIcon" ]
   GTK.boxPackEnd titleBar windowIcons False False 0
 
-  title <- GTK.labelNew ( Just "● New Document – MetaBrush" )
+  title <- GTK.labelNew ( Just "● New Document (1) – MetaBrush" )
   widgetAddClasses title [ "text", "title", "plain" ]
   GTK.boxSetCenterWidget titleBar ( Just title )
 
@@ -162,6 +165,21 @@ main = do
   ---------------------------------------------------------
   -- Main viewport
 
+  fileTabs <- GTK.boxNew GTK.OrientationHorizontal 0
+  GTK.containerAdd fileBar fileTabs
+  widgetAddClasses fileTabs [ "fileBar", "plain", "text" ]
+
+  phantomRadioButton <- GTK.radioButtonNew ( [] @GTK.RadioButton )
+
+  for_ [ 1 .. 12 ] \ i -> do
+    pgButton <- GTK.radioButtonNewWithLabelFromWidget ( Just phantomRadioButton ) ( "● New Document (" <> Text.pack ( show i ) <> ")" )
+    GTK.toggleButtonSetMode pgButton False -- don't display radio indicator
+    widgetAddClasses pgButton [ "fileBarTab" ]
+    GTK.boxPackStart fileTabs pgButton False False 0
+
+  GTK.scrolledWindowSetPolicy           fileBar GTK.PolicyTypeAutomatic GTK.PolicyTypeNever
+  GTK.scrolledWindowSetOverlayScrolling fileBar True
+
   widgetAddClass viewportGrid "viewport_bg"
   
   rvRulerCorner <- GTK.revealerNew
diff --git a/assets/theme.css b/assets/theme.css
index a6f5411..6712d32 100644
--- a/assets/theme.css
+++ b/assets/theme.css
@@ -14,8 +14,8 @@
 /* Viewport background colour */
 .viewport_bg {
   background-color: rgb(236, 223, 210);
-  min-width: 20px;
-  min-height: 20px;
+  min-width: 60px;
+  min-height: 40px;
 }
 
 /* Basic text colour */
@@ -45,8 +45,7 @@
 
 /* Logo area */
 .logo {
-  padding-left: 2px;
-  padding-top: 0px;
+  margin-left: 4px;
 }
 
 /* Logo base colour */
@@ -104,7 +103,7 @@
 
 /* Title bar */
 .titleBar {
-  min-height: 20px;
+  min-height: 24px;
   font-size: 12px;
 }
 
@@ -116,17 +115,20 @@
   border-top: 2px solid rgb(41, 40, 40);
 }
 
+.menuBar {
+  padding-left: 4px;
+}
+
 .menuItem {
   background-color: rgb(41, 40, 40);
-  margin-left: 2px;
-  padding-left: 6px;
-  padding-right: 6px;
+  padding-left: 8px;
+  padding-right: 8px;
   margin-left: 0px;
   border-top: 2px solid rgb(41, 40, 40);
 }
 
 .menuItem:hover {
-  border-top: 2px solid rgb(234,223,204);
+  border-color: rgb(234,223,204);
   background-color: rgb(72,70,61);
 }
 
@@ -140,8 +142,8 @@
 .submenuItem {
   padding-top: 4px;
   padding-bottom: 4px;
-  padding-left: 8px;
-  padding-right: 8px;
+  padding-left: 10px;
+  padding-right: 10px;
   background-color: rgb(41, 40, 40);
   border-left: 2px solid rgb(41, 40, 40);
 }
@@ -152,7 +154,7 @@
 }
 
 .submenuItem:hover {
-  border-left: 2px solid rgb(234,223,204);
+  border-color: rgb(234,223,204);
 }
 
 /*
@@ -167,13 +169,29 @@
 
 /* File bar */
 .fileBar {
-  min-height: 25px;
-  font-size:  10px;
+  min-height: 24px;
+  font-size: 12px;
+  margin-top: 2px;
+}
+
+.fileBarTab {
+  border-top: 3px solid rgb(41, 40, 40);
+  padding-left: 8px;
+  padding-right: 8px;
+}
+
+.fileBarTab:hover {
+  border-color: rgb(72,70,61);
+}
+
+.fileBarTab:active, .fileBarTab:checked {
+  border-color: rgb(234,223,204);
+  background-color: rgb(72,70,61);
 }
 
 /* Panels */
 .panels {
-  min-width: 160px;
+  min-width: 120px;
   font-size: 12px;
 }