diff --git a/src/Game/Library.fs b/src/Game/Library.fs index 360ad48..0923ea6 100644 --- a/src/Game/Library.fs +++ b/src/Game/Library.fs @@ -14,7 +14,26 @@ type env = | Floor | Trap | Player + +type cast = { + spell: string + direction: direction +} +type command = + | Move of direction + | Refresh + | Cast of cast +type location = + { + x: int + y: int + } +type state = + { + board: string + playerLocation: location + } let envToString e = match e with diff --git a/src/Server/Controllers.fs b/src/Server/Controllers.fs new file mode 100644 index 0000000..fe38679 --- /dev/null +++ b/src/Server/Controllers.fs @@ -0,0 +1,2 @@ +module Server.Controllers + diff --git a/src/Server/Program.fs b/src/Server/Program.fs index 46a92fb..c476c7e 100644 --- a/src/Server/Program.fs +++ b/src/Server/Program.fs @@ -1,5 +1,7 @@ module Server.App +open Views + open System open System.IO open Microsoft.AspNetCore.Builder @@ -7,77 +9,41 @@ open Microsoft.AspNetCore.Cors.Infrastructure open Microsoft.AspNetCore.Hosting open Microsoft.Extensions.Logging open Microsoft.AspNetCore.Http -open FSharp.Control.Tasks.V2.ContextInsensitive open Microsoft.Extensions.DependencyInjection +open FSharp.Control.Tasks.V2.ContextInsensitive open Giraffe open Game.Game -// --------------------------------- -// Models -// --------------------------------- - -type Message = - { - Text: string - } - -// --------------------------------- -// Views -// --------------------------------- - -module Views = - open GiraffeViewEngine - - let layout (content: XmlNode list) = - html [] [ - head [] [ - title [] [ encodedText "Server" ] - link [ _rel "stylesheet" - _type "text/css" - _href "/main.css" ] - script [ _src "//cdnjs.cloudflare.com/ajax/libs/rot.js/0.6.0/rot.js" ] [] - script [ _src "//unpkg.com/vue" ] [] - script [ _src "//unpkg.com/axios/dist/axios.min.js" ] [] - script [ _src "/main.js"; _async ] [] - ] - body [] content - ] - - let partial() = - h1 [] [ encodedText "Dis my dumb game" ] - - let display() = - div [ _id "game" ] [] - - let index () = - [ - partial() - display() - ] |> layout - // --------------------------------- // Web app // --------------------------------- let indexHandler (name: string) = - let view = Views.index () + let view = Views.index() htmlView view -type mapResponse = - { - view: string - } - let mapHandler() = let floor = [ [ Wall Corner; Wall EW; Wall EW; Wall EW; Wall Corner ]; [ Wall NS; Floor; Floor; Floor; Wall NS ]; - [ Wall NS; Floor; Player; Floor; Wall NS ]; + [ Wall NS; Floor; Floor; Floor; Wall NS ]; [ Wall NS; Floor; Floor; Floor; Wall NS ]; [ Wall Corner; Wall EW; Wall EW; Wall EW; Wall Corner ] ] - json (floorToString floor) + let state = { + board = floorToString floor + playerLocation = { x = 1; y = 1 } + } + json state + +type Direction = string + +let moveHandler (next: HttpFunc) (ctx: HttpContext) = + task { + let! direction = ctx.BindJsonAsync() + return! (mapHandler()) next ctx + } let webApp = choose [ @@ -87,6 +53,10 @@ let webApp = routef "/hello/%s" indexHandler route "/map" >=> mapHandler() ] + POST >=> + choose [ + route "/move" >=> moveHandler + ] setStatusCode 404 >=> text "Not Found" ] // --------------------------------- diff --git a/src/Server/Server.fsproj b/src/Server/Server.fsproj index e4eb9b3..1840246 100644 --- a/src/Server/Server.fsproj +++ b/src/Server/Server.fsproj @@ -15,6 +15,8 @@ + + diff --git a/src/Server/Views.fs b/src/Server/Views.fs new file mode 100644 index 0000000..4b9492c --- /dev/null +++ b/src/Server/Views.fs @@ -0,0 +1,38 @@ +namespace Server + +open Giraffe +open GiraffeViewEngine + +// --------------------------------- +// Views +// --------------------------------- + +module Views = + let layout (content: XmlNode list) = + html [] [ + head [] [ + title [] [ encodedText "Server" ] + link [ _rel "stylesheet" + _type "text/css" + _href "/main.css" ] + script [ _src "//cdnjs.cloudflare.com/ajax/libs/rot.js/0.6.0/rot.js" ] [] + script [ _src "//unpkg.com/vue" ] [] + script [ _src "//unpkg.com/axios/dist/axios.min.js" ] [] + script [ _src "/main.js"; _async ] [] + ] + body [] content + ] + + let partial() = + h1 [] [ encodedText "Dis my dumb game" ] + + let display() = + div [ _id "app" ] [ + div [ _id "game" ] [] + ] + + let index() = + [ + partial() + display() + ] |> layout \ No newline at end of file diff --git a/src/Server/WebRoot/main.js b/src/Server/WebRoot/main.js index 8d3abb1..a07ecbe 100644 --- a/src/Server/WebRoot/main.js +++ b/src/Server/WebRoot/main.js @@ -1,32 +1,45 @@ let app = new Vue({ - el: "#game" , + el: "#app", data: { display: null, - board: [], + state: {board: ""}, err: "" }, mounted() { let options = { - forceSquareRatio:true + forceSquareRatio: true }; this.display = new ROT.Display(options); - document.getElementById("game").appendChild(this.display.getContainer()); + document.getElementById("game").replaceWith(this.display.getContainer()); this.getData(); }, methods: { - draw: function(board) { + draw: function (board) { console.log("drawing board:\n", this.board); - // let str = "Using a regular grid\n@....%b{blue}#%b{}##.%b{red}.%b{}.$$$"; - this.display.drawText(0, 0, this.board); + this.display.drawText(0, 0, this.state.board); + if (this.state.playerLocation) { + this.display.drawText(this.state.playerLocation.x, this.state.playerLocation.y, "@") + } }, - getData: function() { + getData: function () { axios.get("/map") .then(resp => { console.log("Got data:\n", resp); - this.board = resp.data; + this.state = resp.data; this.draw(); }) .catch(err => this.err = err); + }, + // sendCommand will be wired to the various keybinds + // each binding should send the game command expected + sendCommand: function (cmd) { + axios.post("/cmd") + .then(resp => { + console.log("Got data from cmd:\n", resp) + this.board = resp.data; + this.draw() + }) + .catch(err => this.err = err); } } });