Skip to content

Commit

Permalink
Add frames to tzolkin selectors
Browse files Browse the repository at this point in the history
  • Loading branch information
@Release-Candidate
Release-Candidate committed Apr 17, 2021
1 parent 70208ea commit 45c56af
Show file tree
Hide file tree
Showing 6 changed files with 197 additions and 105 deletions.
7 changes: 7 additions & 0 deletions src/Tzolkin.Android/Resources/values/styles.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,5 +27,12 @@

<style name="AppCompatDialogStyle" parent="Theme.AppCompat.Light.Dialog">
<item name="colorAccent">#8B2A02</item>
<!--<item name="android:background">#F2D8B8</item>
<item name="android:textColorPrimary">#000000</item>
<item name="android:textColorPrimaryInverse">#000000</item>
<item name="android:textColorSecondary">#000000</item>
<item name="android:textColorSecondaryInverse">#000000</item>
<item name="android:textColorTertiary">#000000</item>
<item name="android:textColorTertiaryInverse">#000000</item>-->
</style>
</resources>
187 changes: 121 additions & 66 deletions src/Tzolkin/DateList.fs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,17 +11,95 @@ namespace TzolkinApp

open Fabulous
open System
open Xamarin.Forms
open System.Diagnostics
open System.Globalization
open Fabulous.XamarinForms

open RC.Maya
open Xamarin.Forms
open System.Diagnostics


/// View to pick a Tzolk’in date and display and filter a list of Gregorian dates with the same
/// Tzolk’in date.
[<AutoOpen>]
module DateList =

let dayFrame model dispatch =
View.Frame (
padding = Thickness 0.,
backgroundColor = backgroundBrownLight,
borderColor = backgroundBrownDark,
content =
View.Picker (
title = "día",
horizontalOptions = LayoutOptions.Start,
selectedIndex = model.Filter.Day,
items = "todos" :: [ for i in 1 .. 31 -> i.ToString () ],
selectedIndexChanged = (fun (i, item) -> dispatch (SetFilterDay i)),
fontSize = Style.normalFontSize,
textColor = foregroundLight,
backgroundColor = backgroundBrownLight,
width = 60.0,
ref = dayPicker
)
)

let monthFrame model dispatch =
View.Frame (
padding = Thickness 0.,
backgroundColor = backgroundBrownLight,
borderColor = backgroundBrownDark,
content =
View.Picker (
title = "mes",
horizontalOptions = LayoutOptions.Start,
selectedIndex = model.Filter.Month,
items = "todos" :: [ for i in 1 .. 12 -> i.ToString () ],
selectedIndexChanged = (fun (i, item) -> dispatch (SetFilterMonth i)),
fontSize = Style.normalFontSize,
textColor = foregroundLight,
backgroundColor = backgroundBrownLight,
width = 60.,
ref = monthPicker
)
)

let yearFrame model dispatch =
View.Frame (
padding = Thickness 0.,
backgroundColor = backgroundBrownLight,
borderColor = backgroundBrownDark,
content =
View.Entry (
text = "",
placeholder = "año",
textChanged = (fun text -> SetFilterYear text.NewTextValue |> dispatch),
completed = (fun text -> SetFilterYear text |> dispatch),
keyboard = Keyboard.Numeric,
fontSize = Style.normalFontSize,
width = 50.0,
textColor = foregroundLight,
backgroundColor = backgroundBrownLight,
ref = yearPicker
)
)

let getDateOrder model dispatch =
let currentDateString = DateTimeFormatInfo.CurrentInfo.ShortDatePattern
let dayIndex = currentDateString.IndexOf "d"
let monthIndex = currentDateString.IndexOf "M"
let yearIndex = currentDateString.IndexOf "y"
let dateList =
[ (dayIndex, dayFrame model dispatch)
(monthIndex, monthFrame model dispatch)
(yearIndex, yearFrame model dispatch) ]

dateList
|> List.sortBy (fun (idx, _) -> idx)
|> List.map (fun (_, frame) -> frame)



let dateLabelFormat (tzolkindate:TzolkinDate.T) (date:DateTime) =
View.FormattedString (
[ View.Span(text = (sprintf "%s%s " (TzolkinNumber.toUnicode tzolkindate.Number)
Expand All @@ -41,12 +119,14 @@ module DateList =

])

let dateLabel tzolkindate (date:DateTime) =
View.Label(formattedText = dateLabelFormat tzolkindate date,
let dateLabelF labelFormat tzolkindate (date:DateTime) =
View.Label(formattedText = labelFormat tzolkindate date,
lineBreakMode = LineBreakMode.WordWrap,
horizontalOptions = LayoutOptions.Center
)

let dateLabel = dateLabelF dateLabelFormat

let fullFilterList model dateList =
let filterDay dateList =
match model.Filter.Day with
Expand Down Expand Up @@ -82,69 +162,46 @@ module DateList =

/// Select a Tzolk’in date.
let tzolkinSelector model dispatch =
[ View.Picker (
title = "número",
horizontalOptions = LayoutOptions.Start,
selectedIndex = modelNumToInt model,
items = numberPickList,
selectedIndexChanged = (fun (i, item) -> dispatch (SetListNumber i)),
width = 60.,
fontSize = Style.normalFontSize,
textColor = Style.foregroundColor model.IsDarkMode,
backgroundColor = Style.backgroundColor model.IsDarkMode,
horizontalTextAlignment = TextAlignment.End
[ View.Frame (
padding = Thickness 0.,
backgroundColor = backgroundBrownLight,
borderColor = backgroundBrownDark,
content =
View.Picker (
title = "número",
horizontalOptions = LayoutOptions.Start,
selectedIndex = modelNumToInt model,
items = numberPickList,
selectedIndexChanged = (fun (i, item) -> dispatch (SetListNumber i)),
width = 60.,
fontSize = Style.normalFontSize,
textColor = foregroundLight,
backgroundColor = backgroundBrownLight,
horizontalTextAlignment = TextAlignment.End
)
)

View.Picker (
title = "glifo",
horizontalOptions = LayoutOptions.Start,
selectedIndex = modelGlyphToInt model,
items = glyphPickList,
fontSize = Style.normalFontSize,
textColor = Style.foregroundColor model.IsDarkMode,
backgroundColor = Style.backgroundColor model.IsDarkMode,
selectedIndexChanged = (fun (i, item) -> dispatch (SetListGlyph i)),
width = 90.
View.Frame (
padding = Thickness 0.,
backgroundColor = backgroundBrownLight,
borderColor = backgroundBrownDark,
content =
View.Picker (
title = "glifo",
horizontalOptions = LayoutOptions.Start,
selectedIndex = modelGlyphToInt model,
items = glyphPickList,
fontSize = Style.normalFontSize,
textColor = foregroundLight,
backgroundColor = backgroundBrownLight,
selectedIndexChanged = (fun (i, item) -> dispatch (SetListGlyph i)),
width = 90.
)
) ]

/// The Filter section
let tzolkinFilter (model: Model) dispatch =
[ View.Picker (
title = "día",
horizontalOptions = LayoutOptions.Start,
selectedIndex = model.Filter.Day,
items = "todos" :: [ for i in 1 .. 31 -> i.ToString () ],
selectedIndexChanged = (fun (i, item) -> dispatch (SetFilterDay i)),
fontSize = Style.normalFontSize,
textColor = Style.foregroundColor model.IsDarkMode,
backgroundColor = Style.backgroundColor model.IsDarkMode,
width = 60.0,
ref = dayPicker
)
View.Picker (
title = "mes",
horizontalOptions = LayoutOptions.Start,
selectedIndex = model.Filter.Month,
items = "todos" :: [ for i in 1 .. 12 -> i.ToString () ],
selectedIndexChanged = (fun (i, item) -> dispatch (SetFilterMonth i)),
fontSize = Style.normalFontSize,
textColor = Style.foregroundColor model.IsDarkMode,
backgroundColor = Style.backgroundColor model.IsDarkMode,
width = 60.,
ref = monthPicker
)
View.Entry (
text = "",
placeholder = "año",
textChanged = (fun text -> SetFilterYear text.NewTextValue |> dispatch),
completed = (fun text -> SetFilterYear text |> dispatch),
keyboard = Keyboard.Numeric,
fontSize = Style.normalFontSize,
width = 65.0,
textColor = Style.foregroundColor model.IsDarkMode,
backgroundColor = Style.backgroundColor model.IsDarkMode,
ref = yearPicker
) ]
getDateOrder model dispatch

let dateViewLayout = GridItemsLayout (ItemsLayoutOrientation.Vertical)

Expand All @@ -162,19 +219,17 @@ module DateList =
[
View.StackLayout(
orientation = StackOrientation.Horizontal,
children = (tzolkinSelector model dispatch)
@ (tzolkinFilter model dispatch)
children = (tzolkinSelector model dispatch) @
(tzolkinFilter model dispatch)
)

View.CollectionView(
ref = dateListView,
remainingItemsThreshold = 4,
remainingItemsThreshold = 10,
remainingItemsThresholdReachedCommand = (
fun () -> dispatch NewDateViewItemsNeeded),
itemsLayout = dateViewLayout,
items = fillListViewFilter model
)


]
)

0 comments on commit 45c56af

Please sign in to comment.