Abstract configuration requests, complete login flow

components/ConfigurationItem.xml

@@ -1,64 +1,50 @@
 <?xml version="1.0" encoding="utf-8" ?>
 <component name="ConfigItem" extends="Group">
   <children>
-    <Rectangle
-      id="selectionOutline"
-      translation="[0,0]"
-      color="#a2a2a2"
-      opacity="0"
-      width="196"
-      height="40"
-      />
-
-    <Rectangle
-      translation="[4, 4]"
-      color="#000b35"
-      opacity="1"
-      width="188"
-      height="32"
-      />
-
     <LayoutGroup
       layoutDirection="horiz"
       vertAlignment="center"
       itemSpacings="20"
       translation="[8,40]" >
-      <!-- above translation is itemspacings + item height / 2 + border-->
-      <Label id="itemName" horizAlign="left" width="196" height="60" />
-      <Label id="itemValue" horizAlign="left" width="196" height="60" />
+      <Label id="label"
+        horizAlign="left"
+        width="196"
+        height="60"
+        color="#666666" />
+      <Label id="value"
+        horizAlign="left"
+        width="196"
+        height="60"
+        color="#666666" />
     </LayoutGroup>
   </children>
 
   <interface>
     <field id="itemContent" type="node" onChange="itemContentChanged" />
-    <field id="focusPercent" type="float" onChange="focusChanged" />
-    <field id="itemHasFocus" type="bool" onChange="focusChanged" />
   </interface>
 
   <script type="text/brightscript">
   <![CDATA[
   sub Init()
-    m.itemName = m.top.findNode("itemName")
-    m.itemValue = m.top.findNode("itemValue")
-    m.selectedBox = m.top.findNode("selectionOutline")
+    m.name = m.top.findNode("label")
+    m.value = m.top.findNode("value")
   end sub
 
   sub itemContentChanged() as void
-    itemData = m.top.itemContent
+    data = m.top.itemContent
 
-    m.itemName.text = itemData.labelText
-    if itemData.valueText <> ""
-      m.itemValue.color = "#ffffff"
-      m.itemValue.text = itemData.valueText
+    m.name.text = data.label
+    if data.value = ""
+      m.value.color = "#444444"
+      m.value.text = "Enter a value..."
+    else if data.type = "password"
+      m.value.color = "#ffffff"
+      m.value.text = "********"
     else
-      m.itemValue.color = "#444444"
-      m.itemValue.text = "Enter a value..."  ' TODO - get a placeholder
+      m.value.color = "#ffffff"
+      m.value.text = data.value
     end if
   end sub
-
-  sub focusChanged() as void
-    m.selectedBox.opacity = m.top.focusPercent
-  end sub
   ]]>
   </script>
 

components/ConfigurationItemData.xml

@@ -1,7 +1,8 @@
 <?xml version="1.0" encoding="utf-8" ?>
 <component name="ConfigItemData" extends="ContentNode">
   <interface>
-    <field id="labelText" type="string" />
-    <field id="valueText" type="string" />
+    <field id="label" type="string" />
+    <field id="value" type="string" />
+    <field id="type" type="string" />
   </interface>
 </component>

components/ConfigurationList.xml

@@ -1,20 +1,15 @@
 <?xml version="1.0" encoding="utf-8" ?>
 <component name="ConfigList" extends="MarkupList">
-  <children>
-    <Button
-      id="submit"
-      text="Submit"
-      translation="[0, 500]"
-      />
-  </children>
+  <interface>
+    <function name="setData" />
+  </interface>
   <script type="text/brightscript" uri="pkg:/source/config.brs" />
   <script type="text/brightscript">
   <![CDATA[
   sub init()
     m.top.itemComponentName = "ConfigItem"
-    m.top.content = getData()
 
-    m.top.drawFocusFeedback = false  ' We're going to draw our own focus
+    m.top.drawFocusFeedback = True
     m.top.vertFocusAnimationStyle = "floatingFocus"
 
     m.top.observeField("itemSelected", "onItemSelected")
@@ -23,21 +18,17 @@
 
   end sub
 
-  function getData()
+  function setData(items)
     data = CreateObject("roSGNode", "ContentNode")
 
-    items = [
-      {"field": "server", "label": "Host"},
-      {"field": "port", "label": "Port"}
-    ]
-
     for each item in items
       config = data.CreateChild("ConfigItemData")
-      config.labelText = item["label"]
-      config.valueText = get_setting(item["field"])
-
+      config.label = item["label"]
+      config.value = get_setting(item["field"])
+      config.type = item["type"]
     end for
-    return data
+
+    m.top.content = data
   end function
 
   function onItemSelected()
@@ -53,7 +44,7 @@
     button_text = d.buttons[d.buttonSelected]
 
     if button_text = "OK"
-      m.configField.valueText = d.text
+      m.configField.value = d.text
       dismiss_dialog()
       return true
     else if button_text = "Cancel"
@@ -66,11 +57,11 @@
   sub show_dialog(configField)
     dialog = createObject("roSGNode", "KeyboardDialog")
     m.configField = configField
-    dialog.title = "Enter the " + configField.labelText
+    dialog.title = "Enter the " + configField.label
     dialog.buttons = ["OK", "Cancel"]
 
-    if configField.valueText <> "" then
-      dialog.text = configField.valueText
+    if configField.value <> "" then
+      dialog.text = configField.value
     end if
 
     m.top.getparent().dialog = dialog
@@ -82,14 +73,6 @@
   sub dismiss_dialog()
     m.dialog.close = true
   end sub
-
-  function submit()
-    ' TODO - get proper field names, and set_setting
-    for each content in  m.top.content.getchildren(-1, 0)
-      print content.labelText + ": " + content.valueText
-      'set_setting(?field_name, content.valueText)
-    end for
-  end function
   ]]>
   </script>
 </component>

components/ConfigurationScene.brs

@@ -5,12 +5,30 @@ sub init()
     m.top.setFocus(true)
 end sub
 
+function onKeyEvent(key as String, press as Boolean) as Boolean
+  if not press then return false
+  list = m.top.findNode("configOptions")
+  button = m.top.findNode("submit")
+  if key = "down" and button.focusedChild = invalid
+    limit = list.content.getChildren(-1, 0).count() - 1
+
+    if limit = list.itemFocused
+      m.top.setFocus(false)
+      button.setFocus(true)
+      return true
+    end if
+  else if key = "up" and button.focusedChild <> invalid
+    list.setFocus(true)
+    return true
+  end if
+  return false
+end function
+
 function onDialogButton()
   d = m.top.dialog
   button_text = d.buttons[d.buttonSelected]
 
   if button_text = "OK"
-    ' TODO - pick right field
     m.focused_item.text = d.text
     dismiss_dialog()
     return true
@@ -38,9 +56,3 @@ end sub
 sub dismiss_dialog()
   m.top.dialog.close = true
 end sub
-
-
-function submit()
-  set_setting("server", m.hostname)
-  set_setting("port", m.port)
-end function

components/ConfigurationScene.xml

@@ -1,7 +1,8 @@
 <?xml version="1.0" encoding="utf-8" ?>
-<component name="ServerSelection" extends="scene">
+<component name="ConfigScene" extends="Scene">
   <children>
-    <label text="Connect to Server"
+    <label text="Enter Configuration"
+      id="prompt"
       height="70"
       font="font:MediumBoldSystemFont"
       translation="[150, 150]" />
@@ -11,12 +12,12 @@
       itemSize="[440, 40]"
       itemSpacing="[0, 20]"
       numRows="12" />
+    <Button
+      id="submit"
+      text="Submit"
+      showFocusFootprint="false"
+      translation="[150, 350]"
+      />
   </children>
-
-  <interface>
-    <field id="itemSelected" type="intarray"
-      alias="configOptions.itemSelected" />
-  </interface>
-
-  <script type="text/brightscript" uri="pkg:/components/ServerScene.brs"/>
+  <script type="text/brightscript" uri="pkg:/components/ConfigurationScene.brs"/>
 </component>

source/JellyfinAPI.brs

@@ -90,7 +90,6 @@ function get_token(user as String, password as String)
   set_setting("active_user", json.User.id)
   set_user_setting("id", json.User.id)  ' redundant, but could come in handy
   set_user_setting("token", json.AccessToken)
-  set_user_setting("response", json)
   return json
 end function
 

source/Main.brs

@@ -1,23 +1,25 @@
 sub Main()
+  keepalive = CreateObject("roSGScreen")
+  keepalive.show()
+
   ' First thing to do is validate the ability to use the API
 
+  start_login:
   if get_setting("server") = invalid then
     print "Get server details"
-    ' TODO - be able to submit server info
     ShowServerSelect()
   end if
 
   if get_setting("active_user") = invalid then
     print "Get user login"
-    ' TODO - be able to submit user info
-    ' ShowSigninSelect()
+    ShowSigninSelect()
   end if
 
   ' Confirm the configured server and user work
   m.user = AboutMe()
   if m.user.id <> get_setting("active_user")
-    ' TODO - proper handling of the scenario where things have gone wrong
-    print "OH NO!"
+    print "Login failed, restart flow"
+    goto start_login
   end if
 
   ShowLibrarySelect()
@@ -27,16 +29,77 @@ sub ShowServerSelect()
   port = CreateObject("roMessagePort")
   screen = CreateObject("roSGScreen")
   screen.setMessagePort(port)
-  scene = screen.CreateScene("ServerSelection")
-
+  scene = screen.CreateScene("ConfigScene")
   screen.show()
 
+  scene.findNode("prompt").text = "Connect to Serviette"
+
+  config = scene.findNode("configOptions")
+  items = [
+    {"field": "server", "label": "Host", "type": "string"},
+    {"field": "port", "label": "Port", "type": "string"}
+  ]
+  config.callfunc("setData", items)
+
+  button = scene.findNode("submit")
+  button.observeField("buttonSelected", port)
+
+
+  server_hostname = config.content.getChild(0)
+  server_port = config.content.getChild(1)
+
   while(true)
     msg = wait(0, port)
-    if msg.isScreenClosed() then
+    if type(msg) = "roSGScreenEvent" and msg.isScreenClosed()
       return
-    else
-      print(msgType)
+    else if type(msg) = "roSGNodeEvent"
+      node = msg.getNode()
+      if node = "submit"
+        set_setting("server", server_hostname.value)
+        set_setting("port", server_port.value)
+        return
+      end if
+    end if
+  end while
+end sub
+
+sub ShowSignInSelect()
+  port = CreateObject("roMessagePort")
+  screen = CreateObject("roSGScreen")
+  screen.setMessagePort(port)
+  scene = screen.CreateScene("ConfigScene")
+  screen.show()
+
+  scene.findNode("prompt").text = "Sign In"
+
+  config = scene.findNode("configOptions")
+  items = [
+    {"field": "username", "label": "Username", "type": "string"},
+    {"field": "password", "label": "Password", "type": "password"}
+  ]
+  config.callfunc("setData", items)
+
+  button = scene.findNode("submit")
+  button.observeField("buttonSelected", port)
+
+  config = scene.findNode("configOptions")
+
+  username = config.content.getChild(0)
+  password = config.content.getChild(1)
+
+  while(true)
+    msg = wait(0, port)
+    if type(msg) = "roSGScreenEvent" and msg.isScreenClosed()
+      return
+    else if type(msg) = "roSGNodeEvent"
+      node = msg.getNode()
+      if node = "submit"
+        get_token(username.value, password.value)
+        if get_setting("active_user") <> invalid
+          return
+        end if
+        print "Login attempt failed..."
+      end if
     end if
   end while
 end sub
@@ -64,7 +127,7 @@ sub ShowLibrarySelect()
       if target.libraryType = "movies"
         ShowMovieOptions(target.libraryID)
       else
-        print "NOT YET IMPLEMENTED"
+        print "Library type is not yet implemented"
       end if
     end if
   end while