Add State Refs

book/guides/gui_macro.nim

@@ -147,4 +147,51 @@ block:
       Box:
         insert(childWidget) {.expand: false.}
 
+
+nbText: """
+## WidgetState references
+
+Some features require you to inform Widget A of another Widget B.
+In Owlkettle you can do this by sharing a `StateRef` object between Widget A and Widget B.
+A `StateRef` is an object that observes Widgets can subscribe to in order to get informed whenever its value changes.
+That way, the Widgets always share the same value and update themselves when changes occur.
+You can create it via `newStateRef` (typically as a field on a viewable or renderable state), let it get filled with a reference using the `as` syntax and then passing that reference to Widget B.
+
+See here where we pass SearchEntry a reference to the lower Box as keyCaptureRef.
+All keyboard events thrown while the Box is in focus will get forwarded to the SearchEntry widget.
+
+This also works as you would expect where adders or ather pragmas are concerned
+"""
+
+nbCode:
+  let boxRef = newStateRef()
+  let widget = gui:
+    Box():
+      SearchEntry():
+        keyCaptureRef = boxRef
+      Box as boxRef {.hAlign: AlignFill.}:
+        for value in 0..<3:
+          Label(text = $value)
+
+nbText: """
+  To get notified of any changes occurring to the reference inside `StateRef`, you can subscribe.
+"""
+
+nbCode:
+  let initialSubscriber = proc(state: WidgetState) {.closure.} = echo "Initial Subscriber says BoxRef state changed"
+  let boxRef2 = newStateRef(initialSubscriber)
+
+  let laterSubscriber = proc(state: WidgetState) {.closure.} = echo "Later Subscriber says BoxRef state changed"
+  boxRef2.subscribe(laterSubscriber)
+
+  let widget2 = gui:
+    Box():
+      SearchEntry():
+        keyCaptureRef = boxRef2
+      Box as boxRef2 {.hAlign: AlignFill.}:
+        for value in 0..<3:
+          Label(text = $value)
+
+  boxRef2.unsubscribe(initialSubscriber)
+  boxRef2.unsubscribe(laterSubscriber)
 nbSave

docs/widgets.md

@@ -911,6 +911,7 @@ renderable SearchEntry of BaseWidget
 
 - All fields from [BaseWidget](#BaseWidget)
 - `text: string`
+- `keyCaptureRef: StateRef`
 - `searchDelay: uint = 100` Determines the minimum time after a `searchChanged` event occurred before the next can be emitted. Since: `GtkMinor >= 8`
 - `placeholderText: string = "Search"` Since: `GtkMinor >= 10`
 

examples/widgets/search_entry.nim

@@ -30,7 +30,7 @@ viewable App:
   sensitive: bool = true
   tooltip: string = ""
   sizeRequest: tuple[x, y: int] = (-1, -1)
-
+  keyCaptureRef: StateRef = newStateRef(proc(state: WidgetState){.closure.} = echo "Key Capture Ref was filled")
   items: seq[string] = mapIt(0..<100, "Item " & $it)
   filteredItems: seq[string] = mapIt(0..<100, "Item " & $it)
   selected: int = 0
@@ -41,9 +41,10 @@ method view(app: AppState): Widget =
     Window():
       defaultSize = (600, 400)
       HeaderBar() {.addTitlebar.}:
-        insert(app.toAutoFormMenu(ignoreFields = @["filteredItems"])) {.addRight.}
+        insert(app.toAutoFormMenu(ignoreFields = @["filteredItems", "keyCapureRef", "dummyRef"])) {.addRight.}
 
         SearchEntry() {.addTitle, expand: true.}:
+          keyCaptureRef = app.keyCaptureRef
           margin = Margin(top:0, left: 48, bottom:0, right: 48)
           text = app.text
           searchDelay = app.searchDelay
@@ -73,7 +74,7 @@ method view(app: AppState): Widget =
             app.text = ""
             app.filteredItems = app.items
 
-      ScrolledWindow:
+      ScrolledWindow as app.keyCaptureRef:
         ListBox:
           selectionMode = SelectionSingle
           if app.selected < app.filteredItems.len:
@@ -86,8 +87,7 @@ method view(app: AppState): Widget =
               app.selected = num
 
           for index, item in app.filteredItems:
-            Box():
-              Label(text = item, margin = 6) {.hAlign: AlignStart, expand: false.}
-
+            ListBoxRow() {.addRow.}:
+              Label(text = item, margin = 6)
 
 adw.brew(gui(App()))

owlkettle/guidsl.nim

@@ -45,6 +45,7 @@ type
       of NodeWidget:
         widget: seq[string]
         adder: Adder
+        stateRef: NimNode
       of NodeField:
         name: string
         value: NimNode
@@ -82,7 +83,7 @@ proc parseAdder(node: NimNode): Adder =
 
 proc parseGui(node: NimNode): Node =
   case node.kind:
-    of nnkCallKinds:
+    of nnkCallKinds - {nnkInfix}:
       if node[0].unwrapName().eqIdent("insert"):
         if node.len != 2:
           error("The insert statement must have exactly one argument", node)
@@ -93,6 +94,35 @@ proc parseGui(node: NimNode): Node =
         result = node[0].parseGui()
       for it in 1..<node.len:
         result.children.add(node[it].parseGui())
+    of nnkInfix: # For expressions like "<Widget> as <stateRefVariable>"
+      let isRefAssignmentExpression = node[0].eqIdent("as")
+      if not isRefAssignmentExpression:
+        error("You can only use infix for assigning stateReferences. That must be done via '<Widget> as <stateRefVariable>' syntax")
+      let widgetName = case node[1].kind:
+        of nnkIdent: node[1]
+        of nnkCall: node[1][0]
+        else: 
+          error("Tried to use 'as' with invalid syntax", node)
+          newEmptyNode() # Forces the compiler to acknowlege that all branches of the case statement return a NimNode
+
+      let stateRefVar = case node[2].kind:
+        of nnkPragmaExpr: node[2][0]
+        else: node[2]
+      let widgetContent = node[3]
+
+      if widgetName.isQualifiedName:
+        result = Node(
+          kind: NodeWidget, 
+          widget: widgetName.qualifiedName, 
+          lineInfo: widgetContent,
+          stateRef: stateRefVar
+        )
+      else:
+        result = widgetName.parseGui()
+
+      for it in 3..<node.len: # Parse content of Widget. Ignore NimNodes for "as", widgetName and stateRefVar
+        result.children.add(node[it].parseGui())
+
     of nnkPragmaExpr:
       if node[0].isQualifiedName:
         result = Node(kind: NodeWidget, widget: node[0].qualifiedName, lineInfo: node)
@@ -220,6 +250,13 @@ proc gen(node: Node, stmts, parent: NimNode) =
       body.add(newLetStmt(name, newCall(widgetTyp)))
       for child in node.children:
         child.gen(body, name)
+
+      if not node.stateRef.isNil():
+        let refVar = node.stateRef
+        let refAssignment = quote do:
+          `name`.stateRef = `refVar`
+        body.add(refAssignment)
+
       if not parent.isNil:
         body.add(node.adder.gen(name, parent))
       else:

owlkettle/playground.nim

@@ -292,10 +292,16 @@ proc toFormField(state: Viewable, field: ptr[auto], fieldName: string): Widget =
 
   when hasFields:
     var subFieldWidgets: Table[string, Widget] = initTable[string, Widget]()
-    for subFieldName, subFieldValue in field[].getIterator():      
-      let subField: ptr = subFieldValue.addr
-      let subFieldWidget = state.toFormField(subField, subFieldName)
-      subFieldWidgets[subFieldName] = subFieldWidget
+    let hasFieldValue = when field.typeOf() is ptr ref:
+        field[].isNil()
+      else:
+        true
+
+    if hasFieldValue:
+      for subFieldName, subFieldValue in field[].getIterator():
+        let subField: ptr = subFieldValue.addr
+        let subFieldWidget = state.toFormField(subField, subFieldName)
+        subFieldWidgets[subFieldName] = subFieldWidget
 
     return gui:
       ExpanderRow:
@@ -314,8 +320,9 @@ proc toAutoFormMenu*[T](app: T, sizeRequest: tuple[x,y: int] = (400, 700), ignor
   ## `sizeRequest` defines the requested size for the popover. 
   ## Displays a dummy widget if there is no `toFormField` implementation for a field with a custom type.
   var fieldWidgets: seq[Widget] = @[]
+  const privateGeneralFields = ["app", "viewed", "stateRef"]
   for name, value in app[].fieldPairs:
-    when name notin ["app", "viewed"] and name notin ignoreFields:
+    when name notin privateGeneralFields and name notin ignoreFields:
       let field: ptr = value.addr
       let fieldWidget = app.toFormField(field, name)
       fieldWidgets.add(fieldWidget)

owlkettle/widgetdef.nim

@@ -22,7 +22,7 @@
 
 # Macros used to define new widgets
 
-import std/[macros, strutils, tables]
+import std/[macros, strutils, tables, sets]
 when defined(nimPreviewSlimSystem):
   import std/assertions
 import common
@@ -31,7 +31,8 @@ import bindings/gtk
 type
   Widget* = ref object of RootObj
     app*: Viewable
-
+    stateRef*: StateRef
+
   WidgetState* = ref object of RootObj
     app*: Viewable
 
@@ -49,6 +50,10 @@ type
 
   Event*[T] = ref EventObj[T]
 
+  StateRef* = ref object
+    state: WidgetState
+    observers: HashSet[proc(state: WidgetState)]
+
 method build*(widget: Widget): WidgetState {.base.} = discard
 method update*(widget: Widget, state: WidgetState): WidgetState {.base.} = discard
 method view*(viewable: Viewable): Widget {.base.} = discard
@@ -82,6 +87,38 @@ proc redraw*(viewable: Viewable): bool =
     viewable.viewed = newWidget
     result = true
 
+proc hasRef*(stateRef: StateRef): bool = stateRef.state.isNil()
+
+proc newStateRef*(subscribers: varargs[proc(state: WidgetState) {.closure.}]): StateRef = 
+  var observers = initHashSet[proc(state: WidgetState)]()
+  for subscriber in subscribers:
+    observers.incl(subscriber)
+  return StateRef(observers: observers)
+
+proc unwrapInternalWidget*(stateRef: StateRef): GtkWidget =
+  if not stateRef.hasRef():
+    return nil.GtkWidget
+
+  return stateRef.state.unwrapInternalWidget()
+
+proc setRef*(stateRef: StateRef, state: WidgetState) =
+  let isStateChange = stateRef.state != state
+  if not isStateChange:
+    return
+
+  stateRef.state = state
+  for observer in stateRef.observers:
+    observer(stateRef.state)
+
+proc subscribe*(stateRef: StateRef, observer: proc(state: WidgetState)) =
+  stateRef.observers.incl(observer)
+  if stateRef.hasRef():
+    observer(stateRef.state)
+
+proc unsubscribe*(stateRef: StateRef, observer: proc(state: WidgetState)) =
+  stateRef.observers.excl(observer)
+
+
 type
   WidgetKind = enum WidgetRenderable, WidgetViewable
 
@@ -487,6 +524,11 @@ proc genBuildState(def: WidgetDef): NimNode =
     body = result
   )
 
+proc genStateRef(widget: NimNode, state: NimNode): NimNode =
+  return quote:
+    if not `widget`.stateRef.isNil():
+      `widget`.stateRef.setRef(`state`)
+
 proc genBuild(def: WidgetDef): NimNode =
   let (state, widget) = (ident("state"), ident("widget"))
   result = newStmtList(newVarStmt(state, newCall(ident(def.stateName))))
@@ -511,6 +553,8 @@ proc genBuild(def: WidgetDef): NimNode =
   for body in def.hooks[HookAfterBuild]:
     result.add(body)
 
+  result.add: genStateRef(widget, state)
+
   result.add(newTree(nnkReturnStmt, state))
   result = newProc(
     procType=nnkMethodDef,
@@ -566,6 +610,8 @@ proc genUpdateState(def: WidgetDef): NimNode =
         ])
       ]))
 
+  result.add: genStateRef(widget, state)
+
   for event in def.events:
     result.add(newAssignment(
       newDotExpr(state, event.name),

owlkettle/widgets.nim

@@ -2241,7 +2241,7 @@ renderable ModelButton of BaseWidget:
 
 renderable SearchEntry of BaseWidget:
   text: string
-  # child: GtkWidget # This is currently not supported
+  keyCaptureRef: StateRef
   searchDelay {.since: GtkMinor >= 8.}: uint = 100 ## Determines the minimum time after a `searchChanged` event occurred before the next can be emitted.
   placeholderText {.since: GtkMinor >= 10.}: string = "Search"
 
@@ -2277,10 +2277,44 @@ renderable SearchEntry of BaseWidget:
       # state.internalWidget.disconnect(state.searchStarted) # Currently not supported
       state.internalWidget.disconnect(state.stopSearch)
 
-  # hooks child:
-  #   property:
-  #     gtk_search_entry_set_key_capture_widget(state.internalWidget, state.child.pointer)
-
+  hooks keyCaptureRef:
+    build:
+      if widget.hasKeyCaptureRef and widget.valKeyCaptureRef.hasRef():
+        proc observer(childState: WidgetState) =
+          if childState.isNil():
+            return
+
+          let childWidget = childState.unwrapInternalWidget()
+          if not childWidget.isNil():
+            gtk_search_entry_set_key_capture_widget(state.internalWidget, childWidget)
+
+        widget.valKeyCaptureRef.subscribe(observer)
+        state.keyCaptureRef = widget.valKeyCaptureRef        
+
+    update:
+      let isChangeFromNoneToSome = state.keyCaptureRef.isNil() and widget.hasKeyCaptureRef
+      let isChangeFromSomeToNone = not state.keyCaptureRef.isNil() and not widget.hasKeyCaptureRef
+      let isRefChange = isChangeFromNoneToSome or isChangeFromSomeToNone or state.keyCaptureRef != widget.valKeyCaptureRef 
+      if isRefChange:
+        proc observer(childState: WidgetState) =
+          let childWidget = childState.unwrapInternalWidget()
+          if not childWidget.isNil():
+            gtk_search_entry_set_key_capture_widget(state.internalWidget, childWidget)
+
+        # Remove observer from old keyCaptureRef
+        let oldKeyCaptureRef = state.keyCaptureRef
+        oldKeyCaptureRef.unsubscribe(observer)
+
+        # Add observer to new keyCaptureRef
+        let hasNewKeyCaptureRef = widget.hasKeyCaptureRef
+        let newKeyCaptureRef = if hasNewKeyCaptureRef:
+            widget.valKeyCaptureRef.subscribe(observer)
+            widget.valKeyCaptureRef        
+          else:
+            nil
+
+        state.keyCaptureRef = newKeyCaptureRef
+
   hooks text:
     property:
       gtk_editable_set_text(state.internalWidget, state.text.cstring)