module Pages.Debate.Arguments exposing (Model, Msg, page) import Config.Data.Identity exposing (pageNames) import Config.Helpers.Cards.Inner.Helpers exposing ( argumentButton , bodyFormat , detailBodyMaker , detailFormat , detailSpacing , detailTitleMaker ) import Config.Helpers.Cards.Outer.Helpers exposing (cardMaker) import Config.Helpers.Cards.Outer.Types as C import Config.Helpers.Converters exposing (toTitleCase) import Config.Helpers.Format exposing ( headerFontSizeSmall , paragraphFontSize , paragraphSpacing ) import Config.Helpers.Headers.Helpers exposing (..) import Config.Helpers.Headers.Records exposing (argumentHeader) import Config.Helpers.Headers.Types as R exposing (..) import Config.Helpers.ImageFolders as M exposing (..) import Config.Helpers.Response exposing ( pageList , topLevelContainer ) import Config.Helpers.StrengthBar exposing ( barMaker , barPadding ) import Config.Helpers.ToolTip exposing (tooltip) import Config.Helpers.Viewport exposing (resetViewport) import Config.Pages.Debate.Arguments.List exposing ( argumentList ) import Config.Pages.Debate.Arguments.Types exposing (..) import Config.Style.Colour.Helpers exposing ( ThemeColor(..) , colourTheme ) import Config.Style.Glow exposing ( glowDeepDarkGrey , glowDeepDarkOrange ) import Config.Style.Images exposing (imageSquareMaker) import Config.Style.Transitions exposing (transitionStyleSlow) import Effect exposing (Effect) import Element as E exposing (..) import Element.Background as B import Element.Border as D import Element.Font as F import Html exposing (div, hr) import Html.Attributes as H exposing (style, title, wrap) import Layouts import Page exposing (Page) import Route exposing (Route) import Route.Path as Path import Shared import View exposing (View) page : Shared.Model -> Route () -> Page Model Msg page shared route = Page.new { init = init , update = update , subscriptions = subscriptions , view = view shared } |> Page.withLayout toLayout toLayout : Model -> Layouts.Layout Msg toLayout model = Layouts.Navbar {} -- INIT type alias Model = {} init : () -> ( Model, Effect Msg ) init () = ( {} , Effect.batch [ Effect.map (\_ -> NoOp) (Effect.sendCmd resetViewport) , Effect.none ] ) -- UPDATE type Msg = NoOp update : Msg -> Model -> ( Model, Effect Msg ) update msg model = case msg of NoOp -> ( model , Effect.none ) -- SUBSCRIPTIONS subscriptions : Model -> Sub Msg subscriptions model = Sub.none -- VIEW view : Shared.Model -> Model -> View Msg view shared model = { title = "debate (" ++ pageNames.pageArguments ++ ")" , attributes = [] , element = debateContainer shared } debateContainer : Shared.Model -> Element msg debateContainer shared = topLevelContainer (debateList shared) debateList : Shared.Model -> Element msg debateList shared = column (case ( shared.device.class, shared.device.orientation ) of _ -> pageList shared.device ) <| List.concat [ [ headerMaker (R.Arguments argumentHeader) ] , List.map (\argument -> cardMaker shared.device (C.Argument argument) (contentList shared argument) ) argumentList ] contentList : Shared.Model -> Argument -> List (Element msg) contentList shared argument = let image : String -> Element msg image size = el [ alignLeft , alignTop , paddingEach { top = 0 , right = 10 , bottom = 0 , left = 0 } ] <| imageSquareMaker shared.device (imagePathMaker M.Argument argument.argumentImage) True size in [ row [ width fill , paddingEach { top = case ( shared.device.class, shared.device.orientation ) of ( Phone, Portrait ) -> 8 ( Tablet, Portrait ) -> 8 _ -> 0 , right = 0 , bottom = 0 , left = 0 } ] [ detailFormat column [ detailFormat paragraph [ case ( shared.device.class, shared.device.orientation ) of ( Phone, Portrait ) -> none ( Tablet, Portrait ) -> none _ -> image "Big" , el ([ height fill ] ++ bodyFormat TextLightGrey) <| text argument.propositionSummary ] , detailFormat row [ strengthMaker shared , barMaker getConfidenceTooltip argument.argumentCertainty ] ] ] , tableMaker shared.device argument , formalizationMaker shared.device argument , el [ alignRight ] <| row [ width fill, spacing 20 ] [ argumentButton (Path.toString Path.Contact_Criticism) "Reject Premise" , argumentButton argument.proofLink "Proof Tree" ] ] strengthMaker : Shared.Model -> Element msg strengthMaker shared = el (if not shared.isNavbarExpanded then [ tooltip "This represents my confidence in the soundness of the argument." ] else [] ) <| detailTitleMaker TextLightOrange "Confidence:" getConfidenceTooltip : Int -> String getConfidenceTooltip num = case num of 0 -> "Extremely low. Speculative reasoning." 1 -> "Very low. Extremely weak reasoning." 2 -> "Low. Weak reasoning." 3 -> "Kinda low. Somewhat weak reasoning." 4 -> "Below average. More weak than strong." 5 -> "Moderate. OK reasoning." 6 -> "Above average. More strong than weak." 7 -> "Kinda high. Somewhat strong reasoning." 8 -> "High. Robust reasoning." 9 -> "Very high. Extremely robust reasoning." 10 -> "Extremely high. Air tight reasoning." _ -> "Confidence level out of expected range." tableMaker : Device -> Argument -> Element msg tableMaker device argument = let cellPadding : Attribute msg cellPadding = paddingXY 10 5 in column [ centerX , E.width fill ] [ el [ E.width fill , htmlAttribute <| H.style "position" "relative" ] <| E.table ([ D.rounded 10 , D.width 2 , D.color colourTheme.textDarkGrey , clip ] ++ (case ( device.class, device.orientation ) of ( Phone, Portrait ) -> [ B.color colourTheme.backgroundSpreadsheet ] ( Tablet, Portrait ) -> [ B.color colourTheme.backgroundSpreadsheet ] _ -> [] ) ) { data = argument.definitionTable , columns = [ { header = el [ F.bold , D.widthEach { bottom = 1 , top = 1 , left = 1 , right = 1 } , D.color colourTheme.textDarkGrey , cellPadding , E.width fill ] <| detailTitleMaker TextLightOrange "Definiendum" , width = fill |> maximum 30 , view = \definition -> el [ D.widthEach { bottom = 1 , top = 0 , left = 1 , right = 1 } , D.color colourTheme.textDarkGrey , cellPadding , E.height fill ] <| el [ centerX , centerY ] <| paragraph [] [ detailTitleMaker TextLightOrange definition.definiendum ] } , { header = el [ D.widthEach { bottom = 1 , top = 1 , left = 0 , right = 1 } , D.color colourTheme.textDarkGrey , cellPadding , E.width fill ] <| detailTitleMaker TextLightOrange "Definiens" , width = fill , view = \definition -> el [ D.widthEach { bottom = 1 , top = 0 , left = 0 , right = 1 } , D.color colourTheme.textDarkGrey , cellPadding , E.height fill ] <| el [] <| paragraph [] [ detailBodyMaker TextLightGrey (text definition.definiens) ] } ] } ] formalizationMaker : Device -> Argument -> Element msg formalizationMaker device argument = column [ centerX , E.width fill , spacing 10 ] (List.indexedMap (\index argumentEntry -> column [ paddingXY (case ( device.class, device.orientation ) of ( Phone, Portrait ) -> 0 ( Tablet, Portrait ) -> 0 _ -> 40 ) 3 ] (List.indexedMap (\entryIndex entryWithNotation -> column [ centerX , F.center , detailSpacing , E.width fill ] [ paragraph [ width fill ] [ detailTitleMaker TextLightOrange (if entryIndex < List.length argumentEntry.premises then "P" ++ String.fromInt (entryIndex + 1) ++ ") " else "C) " ) , detailBodyMaker TextLightGrey (text (if entryIndex < List.length argumentEntry.premises then entryWithNotation.premise else argumentEntry.conclusion ) ) |> el [] ] , paragraph [] [ detailTitleMaker TextLightOrange (if entryIndex < List.length argumentEntry.premises then "(" ++ entryWithNotation.notation ++ ")" else "(∴" ++ argumentEntry.conclusionNotation ++ ")" ) ] ] ) (argumentEntry.premises ++ [ { premise = argumentEntry.conclusion, notation = argumentEntry.conclusionNotation } ]) ) ) argument.argumentFormalization )