From 44fa9fbfc212d4a3eaaf4a596930b56fd4105124 Mon Sep 17 00:00:00 2001 From: Joris Guyonvarch Date: Sat, 7 Mar 2015 15:15:18 +0100 Subject: Decomposition of view into two files: page and game --- src/View/Page.elm | 100 ++++-------------------------------------------------- 1 file changed, 6 insertions(+), 94 deletions(-) (limited to 'src/View/Page.elm') diff --git a/src/View/Page.elm b/src/View/Page.elm index ed0dceb..6d6c54d 100644 --- a/src/View/Page.elm +++ b/src/View/Page.elm @@ -1,34 +1,26 @@ module View.Page - ( page + ( pageView ) where import List -import Graphics.Collage (..) -import Graphics.Element (Element) -import Color (..) -import Text (..) -import Text import Html (..) import Html.Attributes (..) import Html.Attributes as A import Json.Encode (string) -import Model.Vec2 (Vec2) -import Model.Player (..) import Model.Game (Game) -import Model.Point (..) -import Model.Board (boardSize) -import Model.Config (..) -page : Game -> Html -page game = +import View.Game (gameView) + +pageView : Game -> Html +pageView game = div [] [ h1 [] [ text "cAtchVoid" ] , div [ id "game" ] - [ fromElement << displayGame <| game ] + [ fromElement << gameView <| game ] , p [] [ text "Catch the points of your color, avoid the other points." ] @@ -52,83 +44,3 @@ page game = ] ] -displayGame : Game -> Element -displayGame {time, score, player, cloud, bestScore} = - let whitePointForms = List.map (pointForm time (configColor White)) (cloud.points White) - blackPointForms = List.map (pointForm time (configColor Black)) (cloud.points Black) - forms = boardForms - ++ playerForms player - ++ whitePointForms - ++ blackPointForms - ++ scoreForms score - ++ bestScoreForms bestScore - in collage (truncate boardSize.x) (truncate boardSize.y) forms - -boardForms : List Form -boardForms = [filled boardColor (rect boardSize.x boardSize.y)] - -boardColor : Color -boardColor = rgb 103 123 244 - -playerForms : Player -> List Form -playerForms player = - let playerColor = configColor player.config - in [circleForm player.pos playerSize playerColor] - -playerColor : Color -playerColor = rgb 224 224 224 - -pointForm : Float -> Color -> Point -> Form -pointForm time color point = - let pos = pointMove point time - in circleForm pos pointSize color - -configColor : Config -> Color -configColor config = - case config of - White -> rgb 240 240 240 - Black -> rgb 14 17 33 - -circleForm : Vec2 -> Float -> Color -> Form -circleForm pos size color = - let outline = circle size - |> filled outlineColor - inside = circle (size - 1) - |> filled color - in group [outline, inside] - |> move (pos.x, pos.y) - -outlineColor : Color -outlineColor = rgb 34 34 34 - -scoreForms : Int -> List Form -scoreForms score = - let text = (toString score) - scorePos = { x = 0.0, y = boardSize.y / 2 - 30 } - in [textForm text scorePos centered] - -bestScoreForms : Int -> List Form -bestScoreForms bestScore = - if(bestScore > 0) then - let text = "Record: " ++ (toString bestScore) - pos = - { x = -boardSize.x / 2 + 100 - , y = -boardSize.y / 2 + 30 - } - in [textForm text pos leftAligned] - else [] - -textForm : String -> Vec2 -> (Text -> Element) -> Form -textForm content pos alignment = - let textElement = fromString content - |> Text.height 30 - |> typeface ["calibri", "arial"] - |> Text.color textColor - |> bold - |> alignment - in textElement - |> toForm - |> move (pos.x, pos.y) - -textColor : Color -textColor = rgb 14 17 33 -- cgit v1.2.3