mirror of
https://gitlab.com/upRootNutrition/website.git
synced 2025-06-16 04:25:11 -05:00
312 lines
12 KiB
Elm
Executable file
312 lines
12 KiB
Elm
Executable file
module Debate.Helpers exposing (..)
|
|
|
|
import Config.CardFormat exposing (..)
|
|
import Config.Colour as T exposing (..)
|
|
import Config.Format as O exposing (..)
|
|
import Config.StrengthBar exposing (..)
|
|
import Debate.Types exposing (..)
|
|
import Effect exposing (Effect)
|
|
import Element as E exposing (..)
|
|
import Element.Background as B exposing (..)
|
|
import Element.Border as D exposing (..)
|
|
import Element.Events as V exposing (..)
|
|
import Element.Font as F exposing (..)
|
|
import Html exposing (div, hr)
|
|
import Html.Attributes as H exposing (style, title, wrap)
|
|
import Json.Decode exposing (field)
|
|
import Layouts
|
|
import Page exposing (Page)
|
|
import Route exposing (Route)
|
|
import Shared
|
|
import View exposing (View)
|
|
|
|
|
|
argumentMaker : Argument -> Element msg
|
|
argumentMaker argument =
|
|
row
|
|
topLevelBox
|
|
[ cardImageMaker (argumentImage argument)
|
|
, cardMaker
|
|
[ cardTitleMaker (argumentTitle argument)
|
|
, cardFormatter
|
|
[ cardContentSpacing
|
|
[ column
|
|
[ fieldSpacer
|
|
]
|
|
[ propositionMaker argument
|
|
, reductioMaker argument
|
|
, summaryMaker argument
|
|
, strengthMaker argument
|
|
, tableMaker argument
|
|
, proofTreeMaker argument
|
|
]
|
|
]
|
|
]
|
|
]
|
|
]
|
|
|
|
|
|
argumentImage : Argument -> { src : String, description : String }
|
|
argumentImage argument =
|
|
{ src = "arguments/" ++ argument.argumentImage ++ ".png"
|
|
, description = argument.argumentTitle
|
|
}
|
|
|
|
|
|
argumentTitle : Argument -> String
|
|
argumentTitle argument =
|
|
argument.argumentTitle
|
|
|
|
|
|
propositionMaker : Argument -> Element msg
|
|
propositionMaker argument =
|
|
row []
|
|
[ column
|
|
[ E.alignTop, E.alignLeft ]
|
|
[ paragraph (paragraphBoldFormat ++ [ F.size 18, E.width <| px 100 ])
|
|
[ el [ tooltip below (myTooltip "A proposition is a declarative statement that can be evaluated as either true or false, and which serves as the basis for debate.") ] (text "Proposition:") |> el [ F.color colourTheme.highlightText ] ]
|
|
]
|
|
, column
|
|
[ E.width fill, E.alignLeft ]
|
|
[ paragraph (paragraphBoldFormat ++ [ F.size 18 ]) [ text argument.propositionTitle |> el [ F.color colourTheme.nonHighlightedText, F.regular, F.size 16 ] ] ]
|
|
]
|
|
|
|
|
|
reductioMaker : Argument -> Element msg
|
|
reductioMaker argument =
|
|
case argument.propositionReductio of
|
|
"" ->
|
|
none
|
|
|
|
reductio ->
|
|
row [ paddingEach { top = 10, right = 0, bottom = 0, left = 0 } ]
|
|
[ column
|
|
[ E.alignTop, E.alignLeft ]
|
|
[ paragraph (paragraphBoldFormat ++ [ F.size 18, E.width <| px 100 ])
|
|
[ el [ tooltip below (myTooltip "This is the position from which the reductio ad absurdum is derived.") ] (text "Reductio:") |> el [ F.color colourTheme.highlightText ]
|
|
]
|
|
]
|
|
, column [ E.width fill, E.alignLeft ]
|
|
[ paragraph (paragraphFormat ++ [ F.size 18, spacing 3 ])
|
|
[ text reductio ]
|
|
]
|
|
]
|
|
|
|
|
|
summaryMaker : Argument -> Element msg
|
|
summaryMaker argument =
|
|
row []
|
|
[ column
|
|
[ E.alignTop, E.alignLeft ]
|
|
[ paragraph (paragraphBoldFormat ++ [ F.size 18, E.width <| px 100 ])
|
|
[ el [ tooltip below (myTooltip "The following information provides additional context and insight into the reasoning behind the argument") ] (text "Summary:") |> el [ F.color colourTheme.highlightText ]
|
|
]
|
|
]
|
|
, column
|
|
[ E.width fill, E.alignLeft ]
|
|
[ paragraph (paragraphBoldFormat ++ [ F.size 18, spacing 3 ]) [ text argument.propositionSummary |> el [ F.color colourTheme.nonHighlightedText, F.regular, F.size 16 ] ] ]
|
|
]
|
|
|
|
|
|
strengthMaker : Argument -> Element msg
|
|
strengthMaker argument =
|
|
row [ E.width fill ]
|
|
[ column
|
|
[ E.alignTop, E.alignLeft ]
|
|
[ paragraph (paragraphBoldFormat ++ [ F.size 18, E.width <| px 100 ])
|
|
[ el [ tooltip below (myTooltip "This represents my confidence in the soundness of the argument.") ] (text "Confidence:") |> el [ F.color colourTheme.highlightText ] ]
|
|
]
|
|
, column
|
|
[ E.width fill, E.alignLeft, centerY ]
|
|
[ barMaker getConfidenceTooltip argument.argumentCertainty ]
|
|
]
|
|
|
|
|
|
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 : Argument -> Element msg
|
|
tableMaker argument =
|
|
let
|
|
formalizationMaker : List (Element msg)
|
|
formalizationMaker =
|
|
let
|
|
argumentFormatting : List (Attribute msg)
|
|
argumentFormatting =
|
|
[ centerX, F.center, spacing 3 ]
|
|
in
|
|
List.indexedMap
|
|
(\index argumentEntry ->
|
|
column (paragraphFormat ++ [ spacing 3, centerX, E.width <| px 500, paddingEach { top = 10, right = 0, bottom = 0, left = 0 } ])
|
|
(List.indexedMap
|
|
(\premiseIndex premiseWithNotation ->
|
|
column argumentFormatting
|
|
[ paragraph paragraphHightlightedBoldText
|
|
[ text ("P" ++ String.fromInt (premiseIndex + 1) ++ ")")
|
|
, text premiseWithNotation.premise
|
|
|> el [ F.color colourTheme.nonHighlightedText, F.regular, paddingEach { top = 0, right = 0, bottom = 0, left = 5 } ]
|
|
]
|
|
, paragraph argumentFormatting
|
|
[ text ("(" ++ premiseWithNotation.notation ++ ")")
|
|
|> el [ F.color colourTheme.highlightText, F.bold ]
|
|
]
|
|
]
|
|
)
|
|
argumentEntry.premises
|
|
++ [ column argumentFormatting
|
|
[ paragraph paragraphHightlightedBoldText
|
|
[ text "C)"
|
|
, text argumentEntry.conclusion
|
|
|> el [ F.color colourTheme.nonHighlightedText, F.regular, paddingEach { top = 0, right = 0, bottom = 0, left = 5 } ]
|
|
]
|
|
, paragraph argumentFormatting
|
|
[ text ("(∴" ++ argumentEntry.conclusionNotation ++ ")")
|
|
|> el [ F.color colourTheme.highlightText, F.bold ]
|
|
]
|
|
]
|
|
]
|
|
)
|
|
)
|
|
argument.argumentFormalization
|
|
in
|
|
column [ centerX, E.width <| px 600 ]
|
|
[ wrappedRow (paragraphBoldFormat ++ [ E.alignLeft, E.width fill ])
|
|
[ E.table
|
|
[ spacing 0
|
|
, D.rounded 10
|
|
, D.width 2
|
|
, D.color colourTheme.nonHighlightedDarkText
|
|
, clip
|
|
]
|
|
{ data = argument.definitionTable
|
|
, columns =
|
|
[ { header =
|
|
el
|
|
[ F.bold
|
|
, D.widthEach { bottom = 1, top = 1, left = 1, right = 1 }
|
|
, D.color colourTheme.nonHighlightedDarkText
|
|
, padding 8
|
|
]
|
|
(text "Definiendum" |> el [ F.color colourTheme.highlightText ])
|
|
, width = fill |> maximum 50
|
|
, view =
|
|
\definition ->
|
|
row
|
|
[ F.color colourTheme.highlightText
|
|
, F.bold
|
|
, D.widthEach { bottom = 1, top = 0, left = 1, right = 1 }
|
|
, D.color colourTheme.nonHighlightedDarkText
|
|
, padding 8
|
|
, E.height fill
|
|
]
|
|
[ row [ centerX ]
|
|
[ paragraph [] [ text definition.definiendum ]
|
|
]
|
|
]
|
|
}
|
|
, { header =
|
|
el
|
|
[ F.bold
|
|
, D.widthEach { bottom = 1, top = 1, left = 0, right = 1 }
|
|
, D.color colourTheme.nonHighlightedDarkText
|
|
, padding 8
|
|
]
|
|
(text "Definiens" |> el [ F.color colourTheme.highlightText ])
|
|
, width = fill
|
|
, view =
|
|
\definition ->
|
|
paragraph
|
|
[ F.color colourTheme.nonHighlightedText
|
|
, F.regular
|
|
, D.widthEach { bottom = 1, top = 0, left = 0, right = 1 }
|
|
, D.color colourTheme.nonHighlightedDarkText
|
|
, padding 8
|
|
, E.height fill
|
|
]
|
|
[ row []
|
|
[ paragraph [] [ text definition.definiens ]
|
|
]
|
|
]
|
|
}
|
|
]
|
|
}
|
|
]
|
|
, column [ centerX ] formalizationMaker
|
|
]
|
|
|
|
|
|
proofTreeMaker : Argument -> Element msg
|
|
proofTreeMaker argument =
|
|
row [ paddingEach { top = 10, right = 0, bottom = 10, left = 0 }, centerX, E.width fill ]
|
|
[ column [ E.alignRight ]
|
|
[ newTabLink
|
|
(paragraphBoldFormat
|
|
++ [ F.size 18
|
|
, F.color colourTheme.nonHighlightedText
|
|
, B.color colourTheme.highlightTextHover
|
|
, paddingEach { top = 6, bottom = 2, left = 12, right = 12 }
|
|
, D.rounded 10
|
|
, E.width <| px 105
|
|
, F.center
|
|
, E.alignRight
|
|
, transitionStyle
|
|
, mouseOver
|
|
[ B.color colourTheme.highlightTextHover
|
|
, F.color colourTheme.nonHighlightedText
|
|
, D.color colourTheme.highlightTextHover
|
|
]
|
|
]
|
|
)
|
|
{ url = argument.proofLink
|
|
, label = text "Proof Tree"
|
|
}
|
|
]
|
|
]
|
|
|
|
|
|
basicDivider =
|
|
el
|
|
[ E.width fill
|
|
, centerX
|
|
, D.widthEach { bottom = 1, top = 0, left = 0, right = 0 }
|
|
, D.color (rgb255 200 200 200)
|
|
, paddingEach { top = 40, bottom = 0, left = 0, right = 0 }
|
|
]
|
|
none
|