module RandomNums2 exposing (main)

import Browser
import Browser.Events
import Json.Decode as Decode
import Html exposing (Html)
import Html.Attributes as Attr
import Random exposing (Seed)


-- MAIN

main : Program Flags Model Msg
main =
  Browser.element
    { init = init
    , view = view
    , update = update
    , subscriptions = subscriptions
    }


-- MODEL

type alias Model =
  { seed : Seed
  , randomNumbers : List Int
  }

type alias Flags =
  ()

init : Flags -> (Model, Cmd Msg)
init () =
  (initModel, Cmd.none)

initModel =
  { seed = Random.initialSeed 17
  , randomNumbers = []
  }


-- UPDATE

type Msg
  = MouseDown
  | EscapeKeyDown
  | OtherKeyDown

update : Msg -> Model -> (Model, Cmd Msg)
update msg model =
  case msg of
    EscapeKeyDown ->
      (initModel, Cmd.none)
    OtherKeyDown ->
      (model, Cmd.none)
    MouseDown ->
      let
        (i, seed) =
          Random.step (Random.int 1 10) model.seed
        randomNumbers =
          i :: model.randomNumbers
      in
        ({ seed = seed, randomNumbers = randomNumbers }, Cmd.none)


-- VIEW

view : Model -> Html Msg
view model =
    -- https://css-tricks.com/quick-css-trick-how-to-center-an-object-exactly-in-the-center/
    let
      styles =
        [ ("position", "fixed")
        , ("top", "50%")
        , ("left", "50%")
        , ("transform", "translate(-50%, -50%)")
        ]
      display =
        Html.text (Debug.toString (List.reverse model.randomNumbers))
    in
      Html.div (List.map (\(k, v) -> Attr.style k v) styles) [display]


-- SUBSCRIPTIONS

-- https://github.com/elm/browser/blob/1.0.0/notes/keyboard.md
keyDecoder : Decode.Decoder String
keyDecoder =
  Decode.field "key" Decode.string

subscriptions : Model -> Sub Msg
subscriptions model =
  Sub.batch
    [ Browser.Events.onMouseDown
        (Decode.succeed MouseDown)
    , Browser.Events.onKeyDown
        (Decode.map
          (\key -> if key == "Escape" then EscapeKeyDown else OtherKeyDown)
          keyDecoder)
    ]