module FocussedRow.View exposing (view)

import Html exposing (..)
import Html.Attributes exposing (..)
import Html.Events exposing (..)
import InputTable.Model exposing (..)
import InputTable.Messages exposing (..)
import List.Extra
import Dict
import SideBar.View


view : Row rowData -> TableState rowData sideRowData -> Html (TableMsg rowData focussedData)
view row tableState =
    let
        url =
            Maybe.withDefault "" row.rowFocusUrl

        rowIndex =
            tableState.rows
                |> List.Extra.findIndex (.id >> (==) row.id)
                |> Maybe.withDefault (-1)
                |> (+) 1
                |> toString

        rowCount =
            toString <| List.length tableState.rows

        title =
            Debug.log "titles" tableState.rowIdsToTitles
                |> Dict.get row.id
                |> Maybe.withDefault ""
    in
        div [ class "focussed-row-view" ]
            [ header [ class "nav" ]
                [ nav [ class "nav__links" ]
                    [ a [ class "nav__link button button--ghost", onClick BlurRow ]
                        [ text "Back to Table" ]
                    , span []
                        [ a [ class "", onClick FocusOnPrevious ]
                            [ i [ class "icon icon--previous icon--nav" ] [] ]
                        , span [ class "nav__numbers" ] [ text (rowIndex ++ " of " ++ rowCount) ]
                        , a
                            [ class "", onClick FocusOnNext ]
                            [ i [ class "icon icon--next icon--nav" ] [] ]
                        , a
                            [ class "nav__link" ]
                            [ text title ]
                        ]
                    ]
                ]
            , div [ class "row" ]
                [ div [ class "column column--wider" ]
                    [ div
                        [ class "card card--focussed-row-content" ]
                        [ iframe
                            [ src url, class "card__iframe-content" ]
                            []
                        ]
                    ]
                , div
                    [ class "column column--thinner" ]
                    [ SideBar.View.view
                        tableState
                        row.id
                        (List.length tableState.rows |> (<) 1)
                    ]
                ]
            ]