-- https://gizra.github.io/elm-keyboard-event/Document.html
-- keyboard handling using subscriptions 
-- https://stackoverflow.com/questions/44383764/how-to-listen-for-both-keypress-and-keydown-events-in-elm
-- https://github.com/lenards/elm-example-key-decoding/
-- https://gist.github.com/JoelQ/916c1e4fe96408b4057d36908c779c90


-- https://package.elm-lang.org/packages/elm-explorations/test/latest/
-- https://elmprogramming.com/easy-to-test.html
-- https://elm-lang.org/docs/syntax
-- https://dennisreimann.de/articles/elm-functions.html
-- https://elmprogramming.com/subscriptions.html

module Elmtris exposing (main)

import Array exposing (Array)
import Browser
import Bucket exposing(..)
import Model exposing(..)

import Browser
import Browser.Events exposing (onKeyDown)
import Html exposing (..)
import Html.Attributes exposing (class)
import Html.Events exposing (keyCode, on)
-- import Json.Decode as Decode
-- import Keyboard
-- import Keyboard.Arrows
import Task exposing (..)
import Time exposing (..)

import Random
-- import Keyboard.Events exposing (KeyboardEvent, decodeKeyboardEvent)

import Html exposing (Html, text, div, table, tr, td, button)
import Html.Attributes exposing (class)
import Html.Events exposing (onClick)
import RenderHTML exposing (..)
import RenderSVG exposing (..)


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


type Msg
    = Score Int
    | Lines Int
    | DrawTetromino     -- TODO x y 
    | DrawBrick
    | Tick Time.Posix
    -- | KeyMsg Keyboard.RawKey


height : number
height = 20

width : number
width = 10


init : () -> ( Model, Cmd Msg )
init _ = (
         { score = 0
         , lines = 0
         , bucket = createBucket width height
         , preview = createBucket 4 4
         },
         Cmd.none
         )


update : Msg -> Model -> ( Model, Cmd Msg )
update msg model = 
    case msg of
        Score score -> 
            ( { model | score = score + 10 }
            , Cmd.none
            )

        Lines lines -> 
            ( { model | lines = lines + 10 }
            , Cmd.none
            )

        DrawTetromino ->
            ({ model | bucket = drawTetromino model.bucket [{ x = 10, y = 5}] }
            , Cmd.none
            )

        DrawBrick ->
            ({ model | bucket = draw2d model.bucket 5 10 }
            , Cmd.none
            )

        Tick tick ->
            ({ model | score = 1 }
            , Cmd.none
            )


view : Model -> Html Msg
view model =
    div [ class "tetris" ]
        [
          button [ onClick DrawBrick ] [ text "DrawBrick" ]
        , button [ onClick DrawTetromino ] [ text "DrawTetromino" ]
        -- , renderHTML model.bucket
        , renderSVG model
        ]


subscriptions : Model -> Sub Msg
subscriptions model =
    Sub.batch
        [ Time.every 500 Tick
        -- , Keyboard.downs KeyMsg
        ]