Now that we have all of the layout completed, we need to connect up a data source and handle the appropriate interaction events. We start by importing the client email package used in the previous examples. Once imported, we set up a new test server and cache the current message (this will be changed later by clicking an item). As outlined before, we must save all state within the application code, not the user interface:

import "github.com/PacktPublishing/Hands-On-GUI-Application-Development-in-Go/client"

var server = client.NewTestServer()
var current = server.CurrentMessage()

Updating the email list group is as simple as wrapping the label creation in a for loop that iterates the range of server.ListMessages():

nk.NkGroupBegin(ctx, "Inbox", 1)
nk.NkLayoutRowDynamic(ctx,0, 1)
for _, email := range server.ListMessages() {
   nk.NkLabel(ctx, email.Subject, nk.TextAlignLeft)
}
nk.NkGroupEnd(ctx)

The content is loaded from the client.EmailMessage that we saved as current, as follows:

   nk.NkLabel(ctx, ui.current.Subject, nk.TextAlignLeft)
   ...
   nk.NkLabel(ctx, "From", nk.TextAlignRight)
   nk.NkLabel(ctx, string(ui.current.From), nk.TextAlignLeft)
   nk.NkLabel(ctx, "To", nk.TextAlignRight)
   nk.NkLabel(ctx, string(ui.current.To), nk.TextAlignLeft)
   nk.NkLabel(ctx, "Date", nk.TextAlignRight)
   nk.NkLabel(ctx, ui.current.DateString(), nk.TextAlignLeft)
   ...
   nk.NkLabel(ctx, ui.current.Content, nk.TextAlignLeft)

For the main interface, the last interaction is the menu and toolbar buttons; each of the relevant functions returns > 0 when the item has been activated. We can add a click handler to the menu items as we did with the Quit item earlier:

   if nk.NkMenuItemLabel(ctx, "Quit", nk.TextAlignLeft) > 0 {
      win.SetShouldClose(true)
   }

The same pattern can be used for toolbar buttons. For the New button, we set a compose window to appear when it's tapped. As we need to maintain all state locally, you'll see that the button tap here is setting a composeUI instance (a custom type for the compose state); this will be used in the following to decide whether we should open a compose window:

   if nk.NkButtonLabel(ctx, "New") > 0 {
      compose = newComposeUI(this)
   }

As the Nuklear backends typically don't support multiple native operating system windows, we need to load our compose window within the main GoMail user interface. After the main interface layout code has run, we can insert a new check for the compose value that we set before. When this value is nil, we have no compose window to show, but when it has been set, we'll create a second window within the first:

   ...
   nk.NkEnd(ctx)

   if compose != nil {
      drawCompose(ctx)
   }

   ...

The preceding code executes after the main window (marked by NkEnd()). If a compose state is set, we'll need to call the new drawCompose() function:

func (ui *mainUI) drawCompose(ctx *nk.Context) {
   bounds := nk.NkRect(20, 20, 400, 320)
   update := nk.NkBegin(ctx, "Compose", bounds, nk.WindowNoScrollbar | nk.WindowBorder | nk.WindowTitle | nk.WindowMovable | nk.WindowMinimizable)

   if update > 0 {
      compose.drawLayout(ctx, 296)
   }

   nk.NkEnd(ctx)
}

This new function sets up a sub-window and then calls the drawComposeLayout() that we defined earlier—now renamed drawLayout() within a new composeUI type. We need to encapsulate the compose state (the data buffers we declared earlier) in a separate type; this allows us to track changes made in multiple compose windows (as the compose window has no state).

To change email based on the selected item in the list, we can change NkLabel to NkSelectableLabel. This widget takes an additional parameter for whether or not it's selected and will return a non-zero value if the selection is changed to the specified item. The update list code should look like this (a little extra code is required to convert from bool into int32):

   for _, email := range ui.server.ListMessages() {
      var selected int32
      if email == ui.current {
         selected = 1
      }
      if nk.NkSelectableLabel(ctx, email.Subject, nk.TextAlignLeft, &selected) > 0 {
         ui.current = email
      }
   }

With all of our data loaded and the compose window opened from the New toolbar or menu item, we see something like the following: