mirror of
https://gitlab.com/upRootNutrition/website.git
synced 2025-06-16 04:25:11 -05:00
feat: slow refactor
This commit is contained in:
Nick
parent
903c16efed
commit
e6f3a09919
54 changed files with 1103 additions and 1128 deletions
|
|
@ -1,8 +1,17 @@
|
|||
module Pages.Debate.Arguments exposing (Model, Msg, page)
|
||||
|
||||
import Config.Data.Identity exposing (pageNames)
|
||||
import Config.Helpers.Cards.Helpers exposing (cardMaker)
|
||||
import Config.Helpers.Cards.Types as C
|
||||
import Config.Helpers.Cards.Inner.Helpers
|
||||
exposing
|
||||
( bodyFormat
|
||||
, detailBodyMaker
|
||||
, detailFormat
|
||||
, detailSpacing
|
||||
, detailTitleMaker
|
||||
, proofTreeButton
|
||||
)
|
||||
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
|
||||
|
|
@ -31,7 +40,13 @@ import Config.Pages.Debate.Arguments.List
|
|||
( argumentList
|
||||
)
|
||||
import Config.Pages.Debate.Arguments.Types exposing (..)
|
||||
import Config.Style.Colour exposing (colourTheme)
|
||||
import Config.Style.Colour.Helpers
|
||||
exposing
|
||||
( ThemeColor(..)
|
||||
, colourTheme
|
||||
, textLightGrey
|
||||
, textLightOrange
|
||||
)
|
||||
import Config.Style.Glow
|
||||
exposing
|
||||
( glowDeepDarkGrey
|
||||
|
|
@ -160,13 +175,13 @@ contentList device argument =
|
|||
, alignTop
|
||||
, paddingEach
|
||||
{ top = 0
|
||||
, right = 0
|
||||
, right = 10
|
||||
, bottom = 0
|
||||
, left = 10
|
||||
, left = 0
|
||||
}
|
||||
]
|
||||
<|
|
||||
imageSquareMaker device (imagePathMaker M.Argument argument.argumentImage) False size
|
||||
imageSquareMaker device (imagePathMaker M.Argument argument.argumentImage) True size
|
||||
in
|
||||
[ row
|
||||
[ width fill
|
||||
|
|
@ -186,276 +201,39 @@ contentList device argument =
|
|||
, left = 0
|
||||
}
|
||||
]
|
||||
[ column
|
||||
[ width fill
|
||||
, spacing 8
|
||||
]
|
||||
[ summaryMakerDesktop device argument
|
||||
, strengthBar device argument
|
||||
]
|
||||
, case ( device.class, device.orientation ) of
|
||||
( Phone, Portrait ) ->
|
||||
none
|
||||
[ detailFormat column
|
||||
[ detailFormat paragraph
|
||||
[ case ( device.class, device.orientation ) of
|
||||
( Phone, Portrait ) ->
|
||||
none
|
||||
|
||||
( Tablet, Portrait ) ->
|
||||
none
|
||||
( Tablet, Portrait ) ->
|
||||
none
|
||||
|
||||
_ ->
|
||||
image "Fatty"
|
||||
_ ->
|
||||
image "Fatty"
|
||||
, el ([ height fill ] ++ bodyFormat TextLightGrey) <| text argument.propositionSummary
|
||||
]
|
||||
, detailFormat row
|
||||
[ strengthMaker
|
||||
, barMaker getConfidenceTooltip argument.argumentCertainty
|
||||
]
|
||||
]
|
||||
]
|
||||
, tableMaker device argument
|
||||
, desktopFormalizationMaker argument
|
||||
, proofTreeButton argument.proofLink
|
||||
, formalizationMaker argument
|
||||
, proofTreeButton argument.proofLink "Proof Tree"
|
||||
]
|
||||
|
||||
|
||||
proofTreeButton : String -> Element msg
|
||||
proofTreeButton url =
|
||||
newTabLink
|
||||
[ alignTop
|
||||
, alignRight
|
||||
, paddingXY 0 5
|
||||
]
|
||||
{ url = url
|
||||
, label =
|
||||
el
|
||||
[ F.color colourTheme.textLightGrey
|
||||
, B.color colourTheme.textDarkOrange
|
||||
, D.rounded 10
|
||||
, paddingEach
|
||||
{ top = 6
|
||||
, bottom = 3
|
||||
, left = 10
|
||||
, right = 10
|
||||
}
|
||||
, mouseOver
|
||||
[ F.color colourTheme.textLightOrange
|
||||
, B.color colourTheme.textDeepDarkOrange
|
||||
]
|
||||
, transitionStyleSlow
|
||||
, headerFontSizeSmall
|
||||
, F.bold
|
||||
]
|
||||
<|
|
||||
text
|
||||
"Proof Tree"
|
||||
}
|
||||
|
||||
|
||||
infoSpacing =
|
||||
E.width <| px 100
|
||||
|
||||
|
||||
propositionMaker : Element msg
|
||||
propositionMaker =
|
||||
column
|
||||
[ E.alignTop, E.alignLeft ]
|
||||
[ paragraph
|
||||
[ F.color colourTheme.textLightGrey
|
||||
, paragraphSpacing
|
||||
, headerFontSizeSmall
|
||||
, F.bold
|
||||
, infoSpacing
|
||||
]
|
||||
[ el
|
||||
[ tooltip
|
||||
"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.textLightOrange ]
|
||||
]
|
||||
]
|
||||
|
||||
|
||||
propositionTitleMaker : Argument -> Element msg
|
||||
propositionTitleMaker argument =
|
||||
column
|
||||
[ E.width fill, E.alignLeft ]
|
||||
[ paragraph
|
||||
[ F.color colourTheme.textLightGrey
|
||||
, paragraphSpacing
|
||||
, headerFontSizeSmall
|
||||
, F.bold
|
||||
]
|
||||
[ text argument.propositionTitle
|
||||
|> el
|
||||
[ F.color colourTheme.textLightGrey
|
||||
, F.regular
|
||||
, paragraphFontSize
|
||||
]
|
||||
]
|
||||
]
|
||||
|
||||
|
||||
reductioMakerDesktop : Argument -> Element msg
|
||||
reductioMakerDesktop argument =
|
||||
case argument.propositionReductio of
|
||||
"" ->
|
||||
none
|
||||
|
||||
reductio ->
|
||||
row
|
||||
[]
|
||||
[ reductioMaker
|
||||
, reductioMakerTitle reductio
|
||||
]
|
||||
|
||||
|
||||
reductioMaker : Element msg
|
||||
reductioMaker =
|
||||
column
|
||||
[ E.alignTop, E.alignLeft ]
|
||||
[ paragraph
|
||||
[ F.color colourTheme.textLightGrey
|
||||
, paragraphSpacing
|
||||
, headerFontSizeSmall
|
||||
, F.bold
|
||||
, infoSpacing
|
||||
]
|
||||
[ el
|
||||
[ tooltip
|
||||
"This is the position from which the reductio ad absurdum is derived."
|
||||
]
|
||||
(text "Reductio:")
|
||||
|> el [ F.color colourTheme.textLightOrange ]
|
||||
]
|
||||
]
|
||||
|
||||
|
||||
reductioMakerTitle : String -> Element msg
|
||||
reductioMakerTitle reductio =
|
||||
column [ E.width fill, E.alignLeft ]
|
||||
[ paragraph
|
||||
[ F.color colourTheme.textLightGrey
|
||||
, paragraphSpacing
|
||||
, paragraphFontSize
|
||||
, spacing 3
|
||||
]
|
||||
[ text reductio ]
|
||||
]
|
||||
|
||||
|
||||
summaryMakerDesktop : Device -> Argument -> Element msg
|
||||
summaryMakerDesktop device argument =
|
||||
(case ( device.class, device.orientation ) of
|
||||
( Phone, Portrait ) ->
|
||||
column
|
||||
|
||||
( Tablet, Portrait ) ->
|
||||
column
|
||||
|
||||
_ ->
|
||||
row
|
||||
)
|
||||
[]
|
||||
[ summaryMaker
|
||||
, summaryMakerTitle argument
|
||||
]
|
||||
|
||||
|
||||
summaryMaker : Element msg
|
||||
summaryMaker =
|
||||
column
|
||||
[ E.alignTop
|
||||
, E.alignLeft
|
||||
]
|
||||
[ paragraph
|
||||
[ F.color colourTheme.textLightGrey
|
||||
, paragraphSpacing
|
||||
, paragraphFontSize
|
||||
, F.bold
|
||||
, infoSpacing
|
||||
, headerFontSizeSmall
|
||||
]
|
||||
[ el
|
||||
[ tooltip
|
||||
"The following information provides additional context and insight into the reasoning behind the argument."
|
||||
]
|
||||
(text "Summary:")
|
||||
|> el [ F.color colourTheme.textLightOrange ]
|
||||
]
|
||||
]
|
||||
|
||||
|
||||
summaryMakerTitle : Argument -> Element msg
|
||||
summaryMakerTitle argument =
|
||||
column
|
||||
[ E.width fill
|
||||
, E.alignLeft
|
||||
]
|
||||
[ paragraph
|
||||
[ F.color colourTheme.textLightGrey
|
||||
, paragraphSpacing
|
||||
, F.bold
|
||||
, spacing 3
|
||||
, headerFontSizeSmall
|
||||
]
|
||||
[ text argument.propositionSummary
|
||||
|> el
|
||||
[ F.color colourTheme.textLightGrey
|
||||
, F.regular
|
||||
, paragraphFontSize
|
||||
]
|
||||
]
|
||||
]
|
||||
|
||||
|
||||
strengthBar : Device -> Argument -> Element msg
|
||||
strengthBar device argument =
|
||||
(case ( device.class, device.orientation ) of
|
||||
( Phone, Portrait ) ->
|
||||
column
|
||||
|
||||
( Tablet, Portrait ) ->
|
||||
column
|
||||
|
||||
_ ->
|
||||
row
|
||||
)
|
||||
[ E.width fill ]
|
||||
[ strengthMaker
|
||||
, strengthMakerBar argument
|
||||
]
|
||||
|
||||
|
||||
strengthMaker : Element msg
|
||||
strengthMaker =
|
||||
column
|
||||
[ E.alignTop
|
||||
, E.alignLeft
|
||||
el
|
||||
[ tooltip
|
||||
"This represents my confidence in the soundness of the argument."
|
||||
]
|
||||
[ paragraph
|
||||
[ F.color colourTheme.textLightGrey
|
||||
, paragraphSpacing
|
||||
, paragraphFontSize
|
||||
, F.bold
|
||||
, E.width fill
|
||||
, headerFontSizeSmall
|
||||
]
|
||||
[ el
|
||||
[ tooltip
|
||||
"This represents my confidence in the soundness of the argument."
|
||||
]
|
||||
(el
|
||||
[ paddingEach
|
||||
{ top = 0
|
||||
, right = 5
|
||||
, bottom = 0
|
||||
, left = 0
|
||||
}
|
||||
]
|
||||
<|
|
||||
text "Confidence:"
|
||||
)
|
||||
|> el [ F.color colourTheme.textLightOrange ]
|
||||
]
|
||||
]
|
||||
|
||||
|
||||
strengthMakerBar : Argument -> Element msg
|
||||
strengthMakerBar argument =
|
||||
barPadding
|
||||
[ barMaker getConfidenceTooltip argument.argumentCertainty ]
|
||||
<|
|
||||
detailTitleMaker TextLightOrange "Confidence:"
|
||||
|
||||
|
||||
getConfidenceTooltip : Int -> String
|
||||
|
|
@ -510,12 +288,7 @@ tableMaker device argument =
|
|||
, E.width fill
|
||||
]
|
||||
[ el
|
||||
[ F.color colourTheme.textLightGrey
|
||||
, paragraphSpacing
|
||||
, paragraphFontSize
|
||||
, F.bold
|
||||
, E.alignLeft
|
||||
, E.width fill
|
||||
[ E.width fill
|
||||
, htmlAttribute <| H.style "position" "relative"
|
||||
]
|
||||
<|
|
||||
|
|
@ -552,15 +325,14 @@ tableMaker device argument =
|
|||
, E.width fill
|
||||
]
|
||||
<|
|
||||
el [ F.color colourTheme.textLightOrange ] <|
|
||||
text "Definiendum"
|
||||
detailTitleMaker
|
||||
TextLightOrange
|
||||
"Definiendum"
|
||||
, width = fill |> maximum 30
|
||||
, view =
|
||||
\definition ->
|
||||
el
|
||||
[ F.color colourTheme.textLightOrange
|
||||
, F.bold
|
||||
, D.widthEach
|
||||
[ D.widthEach
|
||||
{ bottom = 1
|
||||
, top = 0
|
||||
, left = 1
|
||||
|
|
@ -571,13 +343,16 @@ tableMaker device argument =
|
|||
, E.height fill
|
||||
]
|
||||
<|
|
||||
el [ centerX ] <|
|
||||
paragraph [] [ text definition.definiendum ]
|
||||
el
|
||||
[ centerX
|
||||
, centerY
|
||||
]
|
||||
<|
|
||||
paragraph [] [ detailTitleMaker TextLightOrange definition.definiendum ]
|
||||
}
|
||||
, { header =
|
||||
el
|
||||
[ F.bold
|
||||
, D.widthEach
|
||||
[ D.widthEach
|
||||
{ bottom = 1
|
||||
, top = 1
|
||||
, left = 0
|
||||
|
|
@ -588,17 +363,12 @@ tableMaker device argument =
|
|||
, E.width fill
|
||||
]
|
||||
<|
|
||||
el
|
||||
[ F.color colourTheme.textLightOrange ]
|
||||
<|
|
||||
text "Definiens"
|
||||
detailTitleMaker TextLightOrange "Definiens"
|
||||
, width = fill
|
||||
, view =
|
||||
\definition ->
|
||||
el
|
||||
[ F.color colourTheme.textLightGrey
|
||||
, F.regular
|
||||
, D.widthEach
|
||||
[ D.widthEach
|
||||
{ bottom = 1
|
||||
, top = 0
|
||||
, left = 0
|
||||
|
|
@ -610,25 +380,15 @@ tableMaker device argument =
|
|||
]
|
||||
<|
|
||||
el [] <|
|
||||
paragraph [] [ text definition.definiens ]
|
||||
paragraph [] [ detailBodyMaker TextLightGrey (text definition.definiens) ]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
|
||||
|
||||
argumentDesktopPadding : Attribute msg
|
||||
argumentDesktopPadding =
|
||||
paddingXY 40 3
|
||||
|
||||
|
||||
desktopFormalizationMaker : Argument -> Element msg
|
||||
desktopFormalizationMaker argument =
|
||||
formalizationMaker argument argumentDesktopPadding
|
||||
|
||||
|
||||
formalizationMaker : Argument -> Attribute msg -> Element msg
|
||||
formalizationMaker argument padding =
|
||||
formalizationMaker : Argument -> Element msg
|
||||
formalizationMaker argument =
|
||||
column
|
||||
[ centerX
|
||||
, E.width fill
|
||||
|
|
@ -637,57 +397,42 @@ formalizationMaker argument padding =
|
|||
(List.indexedMap
|
||||
(\index argumentEntry ->
|
||||
column
|
||||
[ F.color colourTheme.textLightGrey
|
||||
, paragraphSpacing
|
||||
, paragraphFontSize
|
||||
, spacing 3
|
||||
, centerX
|
||||
, E.width fill
|
||||
, padding
|
||||
[ paddingXY 40 3
|
||||
]
|
||||
(List.indexedMap
|
||||
(\entryIndex entryWithNotation ->
|
||||
column
|
||||
[ centerX
|
||||
, F.center
|
||||
, spacing 3
|
||||
, detailSpacing
|
||||
, E.width fill
|
||||
]
|
||||
[ paragraph
|
||||
[ F.color colourTheme.textLightOrange
|
||||
, F.bold
|
||||
, spacing 3
|
||||
, paragraphFontSize
|
||||
]
|
||||
[ text
|
||||
[ width fill ]
|
||||
[ detailTitleMaker
|
||||
TextLightOrange
|
||||
(if entryIndex < List.length argumentEntry.premises then
|
||||
"P" ++ String.fromInt (entryIndex + 1) ++ ") "
|
||||
|
||||
else
|
||||
"C) "
|
||||
)
|
||||
, text
|
||||
(if entryIndex < List.length argumentEntry.premises then
|
||||
entryWithNotation.premise
|
||||
, detailBodyMaker TextLightGrey
|
||||
(text
|
||||
(if entryIndex < List.length argumentEntry.premises then
|
||||
entryWithNotation.premise
|
||||
|
||||
else
|
||||
argumentEntry.conclusion
|
||||
else
|
||||
argumentEntry.conclusion
|
||||
)
|
||||
)
|
||||
|> el
|
||||
[ F.color colourTheme.textLightGrey
|
||||
, F.regular
|
||||
, E.width fill
|
||||
]
|
||||
[]
|
||||
]
|
||||
, paragraph
|
||||
[ centerX
|
||||
, F.center
|
||||
, spacing 3
|
||||
, E.width fill
|
||||
, F.color colourTheme.textLightOrange
|
||||
, F.bold
|
||||
]
|
||||
[ text
|
||||
[]
|
||||
[ detailTitleMaker
|
||||
TextLightOrange
|
||||
(if entryIndex < List.length argumentEntry.premises then
|
||||
"(" ++ entryWithNotation.notation ++ ")"
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue