feat(nav): Implement SPA navigation for main menu and rules

knockoutwhistweb/app/controllers/JavaScriptRoutingController.scala

@@ -17,8 +17,9 @@ class JavaScriptRoutingController  @Inject()(
     Ok(
       JavaScriptReverseRouter("jsRoutes")(
           routes.javascript.MainMenuController.createGame,
-          routes.javascript.IngameController.startGame,
           routes.javascript.MainMenuController.joinGame,
+          routes.javascript.MainMenuController.navSPA,
+          routes.javascript.IngameController.startGame,
           routes.javascript.IngameController.kickPlayer,
           routes.javascript.IngameController.leaveGame,
           routes.javascript.IngameController.playCard,

knockoutwhistweb/app/controllers/MainMenuController.scala

@@ -23,7 +23,7 @@ class MainMenuController @Inject()(
 
   // Pass the request-handling function directly to authAction (no nested Action)
   def mainMenu(): Action[AnyContent] = authAction { implicit request: AuthenticatedRequest[AnyContent] =>
-    Ok(views.html.main("KnockOutWhist")(views.html.mainmenu.creategame(Some(request.user))))
+    Ok(views.html.main("Knockout Whist - Create Game")(views.html.mainmenu.creategame(Some(request.user))))
   }
 
   def index(): Action[AnyContent] = authAction { implicit request: AuthenticatedRequest[AnyContent] =>
@@ -88,6 +88,29 @@ class MainMenuController @Inject()(
   }
 
   def rules(): Action[AnyContent] = authAction { implicit request: AuthenticatedRequest[AnyContent] =>
-    Ok(views.html.mainmenu.rules(Some(request.user)))
+    Ok(views.html.main("Knockout Whist - Rules")(views.html.mainmenu.rules(Some(request.user))))
   }
+
+  def navSPA(location: String) : Action[AnyContent] = authAction { implicit request: AuthenticatedRequest[AnyContent] =>
+    location match {
+      case "0" => // Main Menu
+        Ok(Json.obj(
+          "status" -> "success",
+          "redirectUrl" -> routes.MainMenuController.mainMenu().url,
+          "content" -> views.html.mainmenu.creategame(Some(request.user)).toString
+        ))
+      case "1" => // Rules
+        Ok(Json.obj(
+          "status" -> "success",
+          "redirectUrl" -> routes.MainMenuController.rules().url,
+          "content" -> views.html.mainmenu.rules(Some(request.user)).toString
+        ))
+      case _ =>
+        BadRequest(Json.obj(
+          "status" -> "failure",
+          "errorMessage" -> "Invalid form submission"
+        ))
+    }
+  }
+
 }

knockoutwhistweb/app/views/mainmenu/navbar.scala.html

@@ -13,14 +13,14 @@
                     <ul class="navbar-nav mb-2 mb-lg-0">
                         @if(user.isDefined) {
                             <li class="nav-item">
-                                <a class="nav-link active" aria-current="page" href="@routes.MainMenuController.mainMenu()">Create Game</a>
+                                <a class="nav-link active" aria-current="page" onclick="navSpa('0', 'Knockout Whist - Create Game'); return false;" href="@routes.MainMenuController.mainMenu()">Create Game</a>
                             </li>
                             <li class="nav-item">
                                 <a class="nav-link disabled" aria-disabled="true">Lobbies</a>
                             </li>
                         }
                         <li class="nav-item">
-                            <a class="nav-link active" href="@routes.MainMenuController.rules()">Rules</a>
+                            <a class="nav-link active" onclick="navSpa('1', 'Knockout Whist - Rules'); return false;" href="@routes.MainMenuController.rules()">Rules</a>
                         </li>
                     </ul>
                     <form class="navbar-nav me-auto mb-2 mb-lg-0" onsubmit="joinGame(); return false;">

knockoutwhistweb/app/views/mainmenu/rules.scala.html

@@ -1,6 +1,4 @@
 @(user: Option[model.users.User])
-
-@main("Rules") {
     @navbar(user)
 
     <main class="lobby-background flex-grow-1">
@@ -177,4 +175,3 @@
             </div>
         </div>
     </main>
-}