Skip to content

Instantly share code, notes, and snippets.

@AttilaVM
Last active January 12, 2018 02:22
Show Gist options
  • Save AttilaVM/5a2721685c57d60251166396bff8069e to your computer and use it in GitHub Desktop.
Save AttilaVM/5a2721685c57d60251166396bff8069e to your computer and use it in GitHub Desktop.
Get initial window size with elm
<html>
<head>
<style>
/* you can style your program here */
</style>
</head>
<body>
<script>
var app = Elm.Main.fullscreen()
// you can use ports and stuff here
</script>
</body>
</html>
-- https://ellie-app.com/npWNPSCdNa1/6
module Main exposing (main)
import Element exposing (..)
import Element.Attributes exposing (..)
import Element.Events as Events
import Html
import Json.Decode as Json
import Style exposing (..)
import Task
import Time
import Window
type alias Model =
{ started : Bool
, wSize : Window.Size
}
type Msg
= NewSize Window.Size
| PageLoad
main =
Html.program
{ init = init
, update = update
, view = view
, subscriptions = subscriptions
}
init: (Model, Cmd Msg)
init =
( Model False (Window.Size 1920 1080), initWindowSize )
initWindowSize =
Task.perform NewSize Window.size
update : Msg -> Model -> ( Model, Cmd Msg )
update msg model =
case msg of
NewSize newSize ->
( { model
| wSize = newSize
}
, Cmd.none
)
PageLoad ->
( model
, Task.perform NewSize Window.size
)
subscriptions : Model -> Sub Msg
subscriptions model =
Sub.batch
[ Window.resizes
(\{ width, height } ->
NewSize (Window.Size width height)
)
]
type Styles
= None
| Data
stylesheet : StyleSheet elem variation
stylesheet =
Style.styleSheet []
view : Model -> Html.Html Msg
view model =
Element.layout stylesheet <|
column None
[]
[ el None [ Events.onClick PageLoad ] (text "width - height")
, el None [] (text <| toString model.wSize)
]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment