From d921231017b8c593b518a304b2c2252ba6bc37d3 Mon Sep 17 00:00:00 2001 From: Dan Anglin Date: Fri, 12 Jan 2024 12:33:18 +0000 Subject: [PATCH] refactor(ui): change type cardModal to cardForm - Change type cardModal to cardForm because it is a Form and not a Modal. - Text the card's details directly from the form items when the Save button is pressed instead of updating fields in the cardForm value every time a change is made to the input fields. --- internal/ui/cardform.go | 120 +++++++++++++++++++++++++++++++++++++++ internal/ui/cardmodal.go | 115 ------------------------------------- internal/ui/ui.go | 40 ++++++------- 3 files changed, 140 insertions(+), 135 deletions(-) create mode 100644 internal/ui/cardform.go delete mode 100644 internal/ui/cardmodal.go diff --git a/internal/ui/cardform.go b/internal/ui/cardform.go new file mode 100644 index 0000000..0069017 --- /dev/null +++ b/internal/ui/cardform.go @@ -0,0 +1,120 @@ +package ui + +import ( + "github.com/gdamore/tcell/v2" + "github.com/rivo/tview" +) + +type cardFormMode int + +const ( + create cardFormMode = iota + edit +) + +type cardForm struct { + *tview.Form + frame *tview.Frame + titleLabel string + descLabel string + done func(string, string, bool, cardFormMode) + mode cardFormMode +} + +func newCardForm() *cardForm { + var ( + background = tcell.ColorBlack.TrueColor() + buttonBackground = tcell.ColorBlueViolet.TrueColor() + textColour = tcell.ColorWhite.TrueColor() + fieldBackground = tcell.ColorGrey.TrueColor() + labelColour = tcell.ColorGreen.TrueColor() + + form = tview.NewForm() + ) + + c := cardForm{ + Form: form, + frame: tview.NewFrame(form), + done: nil, + mode: create, + titleLabel: "Title", + descLabel: "Description", + } + + // Stylise the buttons + c.SetButtonsAlign(tview.AlignCenter). + SetButtonBackgroundColor(buttonBackground). + SetButtonTextColor(textColour). + SetBorderPadding(0, 0, 0, 0) + + // Stylise the form + c.SetLabelColor(labelColour). + SetFieldBackgroundColor(fieldBackground). + SetFieldTextColor(textColour). + SetBackgroundColor(background) + + // Stylise the frame around the form + c.frame.SetBorders(0, 0, 1, 0, 0, 0). + SetBorder(true). + SetBorderColor(tcell.ColorOrangeRed.TrueColor()). + SetBackgroundColor(background). + SetBorderPadding(1, 1, 1, 1) + + c.AddButton("Save", func() { + if c.done != nil { + title, ok := c.GetFormItemByLabel(c.titleLabel).(*tview.InputField) + if !ok { + return + } + + description, ok := c.GetFormItemByLabel(c.descLabel).(*tview.TextArea) + if !ok { + return + } + + c.done(title.GetText(), description.GetText(), true, c.mode) + } + }) + + c.AddButton("Cancel", func() { + if c.done != nil { + c.done("", "", false, c.mode) + } + }) + + return &c +} + +func (c *cardForm) updateInputFields(title, description string) { + c.Clear(false) + c.AddInputField(c.titleLabel, title, 60, nil, nil) + c.AddTextArea(c.descLabel, description, 60, 10, 0, nil) +} + +func (c *cardForm) setDoneFunc(handler func(string, string, bool, cardFormMode)) *cardForm { + c.done = handler + + return c +} + +func (c *cardForm) Draw(screen tcell.Screen) { + buttonsWidth := 20 + screenWidth, screenHeight := screen.Size() + width := screenWidth / 3 + + if width < buttonsWidth { + width = buttonsWidth + } + + height := 20 + width += 4 + + // Set the form's position and size. + x := (screenWidth - width) / 2 + y := (screenHeight - height) / 2 + c.SetRect(x, y, width, height) + + // Draw the frame. + c.frame.SetRect(x, y, width, height) + c.frame.Draw(screen) +} diff --git a/internal/ui/cardmodal.go b/internal/ui/cardmodal.go deleted file mode 100644 index 2cfca1a..0000000 --- a/internal/ui/cardmodal.go +++ /dev/null @@ -1,115 +0,0 @@ -package ui - -import ( - "github.com/gdamore/tcell/v2" - "github.com/rivo/tview" -) - -type cardModalMode int - -const ( - create cardModalMode = iota - edit -) - -type cardModal struct { - *tview.Form - frame *tview.Frame - title string - description string - done func(string, string, bool, cardModalMode) - mode cardModalMode -} - -func newCardModal() *cardModal { - var ( - background = tcell.ColorBlack.TrueColor() - buttonBackground = tcell.ColorBlueViolet.TrueColor() - textColour = tcell.ColorWhite.TrueColor() - fieldBackground = tcell.ColorGrey.TrueColor() - labelColour = tcell.ColorGreen.TrueColor() - - form = tview.NewForm() - ) - - modal := cardModal{ - Form: form, - frame: tview.NewFrame(form), - title: "", - description: "", - done: nil, - mode: create, - } - - // Stylise the buttons - modal.SetButtonsAlign(tview.AlignCenter). - SetButtonBackgroundColor(buttonBackground). - SetButtonTextColor(textColour). - SetBorderPadding(0, 0, 0, 0) - - // Stylise the form - modal.SetLabelColor(labelColour). - SetFieldBackgroundColor(fieldBackground). - SetFieldTextColor(textColour). - SetBackgroundColor(background) - - // Stylise the frame around the form - modal.frame.SetBorders(0, 0, 1, 0, 0, 0). - SetBorder(true). - SetBorderColor(tcell.ColorOrangeRed.TrueColor()). - SetBackgroundColor(background). - SetBorderPadding(1, 1, 1, 1) - - modal.AddButton("Save", func() { - if modal.done != nil { - modal.done(modal.title, modal.description, true, modal.mode) - } - }) - - modal.AddButton("Cancel", func() { - if modal.done != nil { - modal.done(modal.title, modal.description, false, modal.mode) - } - }) - - return &modal -} - -func (m *cardModal) updateInputFields(title, description string) { - m.Clear(false) - m.AddInputField("Title", title, 60, nil, func(text string) { - m.title = text - }) - - m.AddTextArea("Description", description, 60, 10, 0, func(text string) { - m.description = text - }) -} - -func (m *cardModal) setDoneFunc(handler func(string, string, bool, cardModalMode)) *cardModal { - m.done = handler - - return m -} - -func (m *cardModal) Draw(screen tcell.Screen) { - buttonsWidth := 20 - screenWidth, screenHeight := screen.Size() - width := screenWidth / 3 - - if width < buttonsWidth { - width = buttonsWidth - } - - height := 20 - width += 4 - - // Set the modal's position and size. - x := (screenWidth - width) / 2 - y := (screenHeight - height) / 2 - m.SetRect(x, y, width, height) - - // Draw the frame. - m.frame.SetRect(x, y, width, height) - m.frame.Draw(screen) -} diff --git a/internal/ui/ui.go b/internal/ui/ui.go index b9cbbd6..e6a32df 100644 --- a/internal/ui/ui.go +++ b/internal/ui/ui.go @@ -26,7 +26,7 @@ const ( const ( mainPage string = "main" quitPage string = "quit" - cardModalPage string = "card modal" + cardFormPage string = "card form" deleteCardModalPage string = "delete card modal" ) @@ -40,7 +40,7 @@ type UI struct { board board.Board mode boardMode quitModal *tview.Modal - cardModal *cardModal + cardForm *cardForm deleteCardModal *tview.Modal statusSelection statusSelection } @@ -57,7 +57,7 @@ func NewUI(path string) (UI, error) { pages: tview.NewPages(), flex: tview.NewFlex(), quitModal: tview.NewModal(), - cardModal: newCardModal(), + cardForm: newCardForm(), focusedColumn: 0, columns: nil, board: kanban, @@ -95,11 +95,11 @@ func (u *UI) init() error { u.shiftColumnFocus(next) case letter == 'c': if u.mode == normal { - u.cardModal.mode = create - u.cardModal.updateInputFields("", "") - u.cardModal.frame.SetTitle(" Create Card ") - u.pages.ShowPage(cardModalPage) - u.SetFocus(u.cardModal) + u.cardForm.mode = create + u.cardForm.updateInputFields("", "") + u.cardForm.frame.SetTitle(" Create Card ") + u.pages.ShowPage(cardFormPage) + u.SetFocus(u.cardForm) } case letter == 'm': if u.mode == normal { @@ -109,12 +109,12 @@ func (u *UI) init() error { } case letter == 'e': if u.mode == normal { - u.cardModal.mode = edit + u.cardForm.mode = edit card, _ := u.getFocusedCard() - u.cardModal.updateInputFields(card.Title, card.Description) - u.cardModal.frame.SetTitle(" Edit Card ") - u.pages.ShowPage(cardModalPage) - u.SetFocus(u.cardModal) + u.cardForm.updateInputFields(card.Title, card.Description) + u.cardForm.frame.SetTitle(" Edit Card ") + u.pages.ShowPage(cardFormPage) + u.SetFocus(u.cardForm) } case key == tcell.KeyCtrlD: if u.mode == normal { @@ -150,8 +150,8 @@ func (u *UI) init() error { u.initQuitModal() u.pages.AddPage(quitPage, u.quitModal, false, false) - u.initCardModal() - u.pages.AddPage(cardModalPage, u.cardModal, false, false) + u.initCardForm() + u.pages.AddPage(cardFormPage, u.cardForm, false, false) u.initDeleteCardModal() u.pages.AddPage(deleteCardModalPage, u.deleteCardModal, false, false) @@ -165,9 +165,9 @@ func (u *UI) init() error { return nil } -// initCardModal initialises the card modal. -func (u *UI) initCardModal() { - doneFunc := func(title, description string, success bool, mode cardModalMode) { +// initCardForm initialises the card form. +func (u *UI) initCardForm() { + doneFunc := func(title, description string, success bool, mode cardFormMode) { if success { switch mode { case create: @@ -177,11 +177,11 @@ func (u *UI) initCardModal() { } } - u.pages.HidePage(cardModalPage) + u.pages.HidePage(cardFormPage) u.setColumnFocus() } - u.cardModal.setDoneFunc(doneFunc) + u.cardForm.setDoneFunc(doneFunc) } // initDeleteCardModal initialises the modal for deleting cards.