frontend/src/main/scala/industries/sunshine/planningpoker/FrontendMain.scala

@@ -27,7 +27,7 @@ object Main {
   def appElement(): Element = {
     div(
       className := "w-screen h-screen flex flex-col justify-center items-center",
-      Header.render(loggedIn.writer, loggedIn.signal),
+      Header.render(loggedIn.writer),
       child <-- loggedIn.signal.map(if (_) emptyNode else JoinRoomComponent.render(loggedIn.writer)),
       child <-- loggedIn.signal.map(
         if (_) RoomView.renderRoom(loggedIn.writer) else emptyNode

frontend/src/main/scala/industries/sunshine/planningpoker/Header.scala

@@ -10,22 +10,20 @@ import scala.scalajs.js.Dynamic.{global => g}
 import concurrent.ExecutionContext.Implicits.global
 
 object Header {
-  def render(loggedInObserver: Observer[Boolean], loggedInSignal: Signal[Boolean]): Element = {
+  def render(loggedIn: Observer[Boolean]): Element = {
     val (responsesStream, responseReceived) = EventStream.withCallback[FetchResponse[String]]
 
     val logoutButton = button(
-      "Leave Room",
+      "Logout",
-      className := "border border-black m-2 p-2 absolute right-2",
       onClick.flatMap(_ => Fetch.get("/api/logout").text) --> responseReceived,
       responsesStream --> Observer(resp => g.console.info(s"${resp.toString()}")),
-      responsesStream.collect { case resp if resp.ok => false } --> loggedInObserver
+      responsesStream.collect { case resp if resp.ok => false } --> loggedIn
     )
-    val cachedEmpty = emptyNode
 
     div(
       className := "h-24 w-full flex flex-for justify-center items-center bg-green-200",
-      p(className := "text-2xl", "Planning Poker Grargh (nonpretty prealpha version)"),
+      p(className := "text-2xl", "Here be header"),
-      child <-- loggedInSignal.map(if (_) logoutButton else cachedEmpty)
+      logoutButton
     )
   }
 }

frontend/src/main/scala/industries/sunshine/planningpoker/JoinRoomComponent.scala

@@ -9,6 +9,7 @@ import io.laminext.fetch.circe._
 import scala.util.Failure
 import scala.util.Success
 
+
 import concurrent.ExecutionContext.Implicits.global
 
 object JoinRoomComponent {
@@ -40,18 +41,18 @@ object JoinRoomComponent {
     )
   )
 
-  val roomNameVar = Var("")
+  val roomNameVar = Var("testroom")
-  val roomPassVar = Var("")
+  val roomPassVar = Var("password")
-  val nicknameVar = Var("")
+  val nicknameVar = Var("me")
-  val nicknamePass = Var("")
+  val nicknamePass = Var("nickpass")
 
   val (responsesStream, responseReceived) = EventStream.withCallback[FetchResponse[String]]
 
+
   def render(loggedIn: Observer[Boolean]): Element = {
 
     val submitButton = button(
       "Join room",
-      className := "m-1 border-2 rounded-full border-green-400 bg-green-200 shadow-inner shadow-green-400 active:shadow-yellow-400 duration-100 ease-linear",
       onClick
         .mapTo {
           (roomNameVar.now(), roomPassVar.now(), nicknameVar.now(), nicknamePass.now())
@@ -67,8 +68,7 @@ object JoinRoomComponent {
                 nicknamePass
               )
             )
-            .text
+            .text.map { response =>
-            .map { response =>
               if (response.ok) {
                 loggedIn.onNext(true)
                 response
@@ -77,7 +77,6 @@ object JoinRoomComponent {
         } --> responseReceived
     )
     val newRoomButton = button(
-      className := "m-1 border-2 rounded-full border-yellow-400 bg-yellow-200 shadow-inner shadow-yellow-400 active:shadow-red-400 duration-100 ease-linear",
       "Create new room",
       onClick
         .mapTo {
@@ -94,8 +93,7 @@ object JoinRoomComponent {
                 nicknamePass
               )
             )
-            .text
+            .text.map { response =>
-            .map { response =>
               if (response.ok) {
                 loggedIn.onNext(true)
                 response
@@ -104,25 +102,25 @@ object JoinRoomComponent {
         } --> responseReceived
     )
 
+
     div(
-      className := "bg-green-50 w-full h-full flex justify-center",
+      className := "flex flex-col h-full justify-center",
+      "Logging in:",
+      nameInput(roomNameVar, "Enter room name:"),
+      passInput(roomPassVar, "room password"),
+      nameInput(nicknameVar, "Enter your nickname:"),
+      passInput(nicknamePass, "nickname pass:"),
+      submitButton,
+      newRoomButton,
       div(
-        className := "w-60 flex flex-col justify-center",
-        "Logging in:",
-        nameInput(roomNameVar, "Enter room name:"),
-        passInput(roomPassVar, "room password"),
-        nameInput(nicknameVar, "Enter your nickname:"),
-        passInput(nicknamePass, "nickname pass:"),
-        submitButton,
-        newRoomButton,
         div(
-          div(
+          code("received:")
-            code("error log:")
+        ),
-          ),
+        div(
-          div(
+          cls := "flex flex-col space-y-4 p-4 max-h-96 overflow-auto bg-gray-900",
-            cls := "flex flex-col space-y-4 p-4 max-h-96 overflow-auto bg-gray-900",
+          children.command <-- responsesStream.recoverToTry.map {
-            children.command <-- responsesStream.recoverToTry.map {
+            case Success(response) =>
-              case Success(response) => {
+              {
                 CollectionCommand.Append(
                   div(
                     div(
@@ -137,18 +135,17 @@ object JoinRoomComponent {
                   )
                 )
               }
-              case Failure(exception) =>
+            case Failure(exception) =>
-                CollectionCommand.Append(
+              CollectionCommand.Append(
+                div(
                   div(
-                    div(
+                    cls := "flex space-x-2 items-center",
-                      cls := "flex space-x-2 items-center",
+                    code(cls := "text-red-500", "Error: "),
-                      code(cls := "text-red-500", "Error: "),
+                    code(cls := "text-red-300", exception.getMessage)
-                      code(cls := "text-red-300", exception.getMessage)
-                    )
                   )
                 )
-            }
+              )
-          )
+          }
         )
       )
     )