movement\!

src/Server/Program.fs

@@ -22,6 +22,7 @@ open Game.Game
 let moveHandler (next: HttpFunc) (ctx: HttpContext) =
     task {
         let! cmd = ctx.BindJsonAsync<Command>()
+        printfn "%O" cmd |> ignore
         Current.cmd cmd |> ignore
         return! (json Current.JSON) next ctx
     }
@@ -32,6 +33,7 @@ let webApp =
             choose [
                 route "/" >=> htmlFile "WebRoot/index.html"
                 route "/map" >=> json Current.JSON
+                route "/test" >=> json (Move South)
             ]
         POST >=>
             choose [

src/Server/Server.fsproj

@@ -10,7 +10,7 @@
 
   <ItemGroup>
     <PackageReference Include="Microsoft.AspNetCore.App" Version="2.1.*" />
-    <PackageReference Include="Giraffe" Version="3.4.*" />
+    <PackageReference Include="Giraffe" Version="4.0.0" />
     <PackageReference Include="TaskBuilder.fs" Version="2.1.*" />
   </ItemGroup>
 

src/Server/WebRoot/index.html

@@ -9,7 +9,12 @@
         <h1>Dis my dumb game</h1>
         <div id="app">
             <div id="game"></div>
-            <button id="south" v-on:click="sendCommand('south')">South</button>
+            <div>
+                <button id="north" v-on:click="sendCommand('North')">North</button>
+                <button id="south" v-on:click="sendCommand('South')">South</button>
+                <button id="east" v-on:click="sendCommand('East')">East</button>
+                <button id="west" v-on:click="sendCommand('West')">West</button>
+            </div>
         </div>
     </body>
 </html>

src/Server/WebRoot/main.js

@@ -33,13 +33,11 @@ let app = new Vue({
         // sendCommand will be wired to the various keybinds
         // each binding should send the game command expected
         sendCommand: function (direction) {
-            if (direction == 'south') {
-                direction = {Case: 'South'}
-            }
-            axios.post("/cmd", direction)
+            let move = {"case": "Move", "fields": [{"case": direction}]}
+            axios.post("/cmd", move)
                 .then(resp => {
                     console.log("Got data from cmd:\n", resp)
-                    this.board = resp.data;
+                    this.state = resp.data;
                     this.draw()
                 })
                 .catch(err => this.err = err);