module Debate.Debate.Helpers exposing (..)

import Config.CardFormat exposing (..)
import Config.Colour exposing (..)
import Config.Format exposing (..)
import Config.Identity exposing (..)
import Debate.Arguments.Helpers exposing (..)
import Debate.Cuckery.Helpers exposing (..)
import Debate.Debate.Pages.Arguments exposing (debateArguments)
import Debate.Debate.Pages.Cucklist exposing (debateCuckList)
import Debate.Debate.Pages.Gibberish exposing (debateGibberish)
import Debate.Debate.Types exposing (..)
import Debate.Gibberish.Helpers exposing (..)
import Effect exposing (Effect)
import Element as E exposing (..)
import Element.Background as B exposing (..)
import Element.Border as D
import Element.Font as F
import Headers.Pages.Arguments exposing (argumentHeader)
import Headers.Pages.CuckList exposing (cuckListHeader)
import Headers.Pages.Gibberish exposing (gibberishHeader)
import Html.Attributes as H exposing (style)
import Layouts
import Page exposing (Page)
import Route exposing (Route)
import Shared
import View exposing (View)


desktopDebateMaker : Element msg
desktopDebateMaker =
    row
        topLevelBox
        [ cardMaker
            [ cardTitleMaker (String.toUpper pageNames.pageDebate)
            , cardFormatter
                [ cardContentSpacing
                    [ column
                        fieldSpacer
                        [ cardSubTitleMaker
                            [ column [ spacing 10 ]
                                [ desktopMakeArguments
                                , desktopMakeCuckList
                                , desktopMakeGibberish
                                ]
                            ]
                        ]
                    ]
                ]
            ]
        ]


mobileDebateMaker : Element msg
mobileDebateMaker =
    row
        topLevelBox
        [ cardMaker
            [ cardTitleMaker (String.toUpper pageNames.pageDebate)
            , cardFormatter
                [ cardContentSpacing
                    [ column
                        fieldSpacer
                        [ cardSubTitleMaker
                            [ column [ spacing 10 ]
                                [ mobileMakeArguments
                                , mobileMakeCuckList
                                , mobileMakeGibberish
                                ]
                            ]
                        ]
                    ]
                ]
            ]
        ]


desktopMakeDebateEntry :
    { name : String
    , body : String
    , url : String
    , list : String
    }
    -> Element msg
desktopMakeDebateEntry config =
    column
        [ spacing 3
        , paddingEach
            { top = 7
            , bottom = 0
            , left = 0
            , right = 0
            }
        ]
        [ row
            [ alignLeft
            ]
            [ column
                [ width <| px 130
                , paddingEach
                    { top = 0
                    , bottom = 0
                    , left = 0
                    , right = 10
                    }
                , height <| px 70
                , alignTop
                , alignLeft
                ]
                [ link
                    (paragraphBoldFormat
                        ++ [ F.size 18
                           , F.color colourTheme.textLightGrey
                           , B.color colourTheme.textDarkOrange
                           , paddingEach
                                { top = 25
                                , bottom = 25
                                , left = 0
                                , right = 0
                                }
                           , D.rounded 50
                           , height fill
                           , E.alignLeft
                           , transitionStyle
                           , width fill
                           , mouseOver
                                [ B.color colourTheme.textDeepDarkOrange
                                , F.color colourTheme.textDarkGrey
                                ]
                           , glow
                           ]
                    )
                    { url = config.url
                    , label = text config.name
                    }
                ]
            , column
                [ width fill ]
                [ column [ width fill ]
                    [ row
                        (paragraphBoldFormat
                            ++ [ F.size 17
                               , F.color colourTheme.textLightGrey
                               , E.alignLeft
                               ]
                        )
                        [ column []
                            [ paragraph [ F.color colourTheme.textLightOrange ]
                                [ if config.name == "Arguments" then
                                    text "Inferences: "

                                  else if config.name == "Cucklist" then
                                    text "Cucks: "

                                  else if config.name == "Gibberish" then
                                    text "Gibberations: "

                                  else
                                    text ""
                                ]
                            ]
                        , column
                            [ width fill
                            , paddingXY 3 0
                            ]
                            [ paragraph [ F.regular ] [ text config.list ] ]
                        ]
                    ]
                , row
                    [ E.width fill
                    , F.alignLeft
                    ]
                    [ paragraph
                        [ F.regular
                        , F.color colourTheme.textLightGrey
                        , F.alignLeft
                        , F.size 17
                        ]
                        [ text config.body
                        ]
                    ]
                ]
            ]
        ]


mobileMakeDebateEntry :
    { name : String
    , body : String
    , url : String
    , list : String
    }
    -> Element msg
mobileMakeDebateEntry config =
    column
        [ spacing 3
        , paddingEach
            { top = 7
            , bottom = 0
            , left = 0
            , right = 0
            }
        ]
        [ column
            [ alignLeft
            , spacing 8
            ]
            [ column
                [ width <| px 130
                , paddingEach
                    { top = 0
                    , bottom = 0
                    , left = 0
                    , right = 10
                    }
                , alignTop
                , alignLeft
                ]
                [ link
                    (paragraphBoldFormat
                        ++ [ F.size 18
                           , F.color colourTheme.textLightGrey
                           , B.color colourTheme.textDarkOrange
                           , paddingEach
                                { top = 8
                                , bottom = 5
                                , left = 0
                                , right = 0
                                }
                           , D.rounded 10
                           , height fill
                           , E.alignLeft
                           , transitionStyle
                           , width fill
                           , mouseOver
                                [ B.color colourTheme.textDeepDarkOrange
                                , F.color colourTheme.textDarkGrey
                                ]
                           , glow
                           ]
                    )
                    { url = config.url
                    , label = text config.name
                    }
                ]
            , column
                [ width fill ]
                [ column [ width fill ]
                    [ row
                        (paragraphBoldFormat
                            ++ [ F.size 17
                               , F.color colourTheme.textLightGrey
                               , E.alignLeft
                               ]
                        )
                        [ column []
                            [ paragraph [ F.color colourTheme.textLightOrange ]
                                [ if config.name == "Arguments" then
                                    text "Inferences: "

                                  else if config.name == "Cucklist" then
                                    text "Cucks: "

                                  else if config.name == "Gibberish" then
                                    text "Gibberations: "

                                  else
                                    text ""
                                ]
                            ]
                        , column
                            [ width fill
                            , paddingXY 3 0
                            ]
                            [ paragraph [ F.regular ] [ text config.list ] ]
                        ]
                    ]
                , row
                    [ E.width fill
                    , F.alignLeft
                    ]
                    [ paragraph
                        [ F.regular
                        , F.color colourTheme.textLightGrey
                        , F.alignLeft
                        , F.size 17
                        ]
                        [ text config.body
                        ]
                    ]
                ]
            ]
        ]


argumentData : { name : String, body : String, url : String, list : String }
argumentData =
    { name = Headers.Pages.Arguments.argumentHeader.headerName
    , body = Headers.Pages.Arguments.argumentHeader.headerBody
    , url = Config.Identity.url ++ String.toLower Headers.Pages.Arguments.argumentHeader.headerName
    , list = String.fromInt argumentListNumber
    }


cuckListData : { name : String, body : String, url : String, list : String }
cuckListData =
    { name = Headers.Pages.CuckList.cuckListHeader.headerName
    , body = Headers.Pages.CuckList.cuckListHeader.headerBody
    , url = Config.Identity.url ++ String.toLower Headers.Pages.CuckList.cuckListHeader.headerName
    , list = String.fromInt cuckListNumber
    }


gibberishData : { name : String, body : String, url : String, list : String }
gibberishData =
    { name = Headers.Pages.Gibberish.gibberishHeader.headerName
    , body = Headers.Pages.Gibberish.gibberishHeader.headerBody
    , url = Config.Identity.url ++ String.toLower Headers.Pages.Gibberish.gibberishHeader.headerName
    , list = String.fromInt gibberishListNumber
    }


desktopMakeArguments : Element msg
desktopMakeArguments =
    desktopMakeDebateEntry
        argumentData


desktopMakeCuckList : Element msg
desktopMakeCuckList =
    desktopMakeDebateEntry
        cuckListData


desktopMakeGibberish : Element msg
desktopMakeGibberish =
    desktopMakeDebateEntry
        gibberishData


mobileMakeArguments : Element msg
mobileMakeArguments =
    mobileMakeDebateEntry
        argumentData


mobileMakeCuckList : Element msg
mobileMakeCuckList =
    mobileMakeDebateEntry
        cuckListData


mobileMakeGibberish : Element msg
mobileMakeGibberish =
    mobileMakeDebateEntry
        gibberishData
