diff --git a/src/Main.elm b/src/Main.elm index c62a123..003f9f9 100644 --- a/src/Main.elm +++ b/src/Main.elm @@ -1,5 +1,82 @@ module Main exposing (main) -import Html exposing (text) +import Browser +import Browser.Events as Events +import Element exposing (..) +import Element.Background as Background +import Element.Font as Font +import Html exposing (Html) -main = text "Hello, world!" + +main : Program Flags Model Msg +main = + Browser.document { init = init, update = update, subscriptions = subscribe, view = view } + + +type alias Model = + { w : Int, h : Int } + + +type alias Flags = + ( Int, Int ) + + +init : Flags -> ( Model, Cmd Msg ) +init flags = + case flags of + ( width, height ) -> + ( { w = width, h = height }, Cmd.none ) + + +type Msg + = Resize Int Int + + +update : Msg -> Model -> ( Model, Cmd Msg ) +update msg model = + case msg of + Resize width height -> + ( { model | w = width, h = height }, Cmd.none ) + + +subscribe : Model -> Sub Msg +subscribe _ = + Events.onResize Resize + + +htmlify : List (Element Msg) -> List (Html Msg) +htmlify = + List.map (Element.layout []) + + +vw : Model -> Float -> Float +vw model percent = + Basics.toFloat model.w * percent / 100 + + +vh : Model -> Float -> Float +vh model percent = + Basics.toFloat model.h * percent / 100 + + +view : Model -> Browser.Document Msg +view model = + { title = "MacGregor House" + , body = + htmlify + [ el + [ width fill + , height fill + , Background.color (rgb255 0 0 0) + ] + (el + [ alignLeft + , alignTop + , moveRight (vw model 10) + , moveDown (vh model 50) + , Font.color (rgb255 255 255 255) + ] + (text "MacGregor House") + ) + ] + }