/// Layout items for PrayerTracker module PrayerTracker.Views.Layout open Giraffe.GiraffeViewEngine open PrayerTracker open PrayerTracker.ViewModels open System open System.Globalization /// Get the two-character language code for the current request let langCode () = match CultureInfo.CurrentCulture.Name.StartsWith "es" with true -> "es" | _ -> "en" /// Navigation items module Navigation = /// Top navigation bar let top m = let s = PrayerTracker.Views.I18N.localizer.Force () let menuSpacer = rawText "  " let leftLinks = [ match m.user with | Some u -> yield li [ _class "dropdown" ] [ a [ _class "dropbtn"; _role "button"; _aria "label" s.["Requests"].Value; _title s.["Requests"].Value ] [ icon "question_answer"; space; encLocText s.["Requests"]; space; icon "keyboard_arrow_down" ] div [ _class "dropdown-content"; _role "menu" ] [ a [ _href "/prayer-requests" ] [ icon "compare_arrows"; menuSpacer; encLocText s.["Maintain"] ] a [ _href "/prayer-requests/view" ] [ icon "list"; menuSpacer; encLocText s.["View List"] ] ] ] yield li [ _class "dropdown" ] [ a [ _class "dropbtn"; _role "button"; _aria "label" s.["Group"].Value; _title s.["Group"].Value ] [ icon "group"; space; encLocText s.["Group"]; space; icon "keyboard_arrow_down" ] div [ _class "dropdown-content"; _role "menu" ] [ a [ _href "/small-group/members" ] [ icon "email"; menuSpacer; encLocText s.["Maintain Group Members"] ] a [ _href "/small-group/announcement" ] [ icon "send"; menuSpacer; encLocText s.["Send Announcement"] ] a [ _href "/small-group/preferences" ] [ icon "build"; menuSpacer; encLocText s.["Change Preferences"] ] ] ] match u.isAdmin with | true -> yield li [ _class "dropdown" ] [ a [ _class "dropbtn"; _role "button"; _aria "label" s.["Administration"].Value; _title s.["Administration"].Value ] [ icon "settings"; space; encLocText s.["Administration"]; space; icon "keyboard_arrow_down" ] div [ _class "dropdown-content"; _role "menu" ] [ a [ _href "/churches" ] [ icon "home"; menuSpacer; encLocText s.["Churches"] ] a [ _href "/small-groups" ] [ icon "send"; menuSpacer; encLocText s.["Groups"] ] a [ _href "/users" ] [ icon "build"; menuSpacer; encLocText s.["Users"] ] ] ] | false -> () | None -> match m.group with | Some _ -> yield li [] [ a [ _href "/prayer-requests/view" _aria "label" s.["View Request List"].Value _title s.["View Request List"].Value ] [ icon "list"; space; encLocText s.["View Request List"] ] ] | None -> yield li [ _class "dropdown" ] [ a [ _class "dropbtn"; _role "button"; _aria "label" s.["Log On"].Value; _title s.["Log On"].Value ] [ icon "security"; space; encLocText s.["Log On"]; space; icon "keyboard_arrow_down" ] div [ _class "dropdown-content"; _role "menu" ] [ a [ _href "/user/log-on" ] [ icon "person"; menuSpacer; encLocText s.["User"] ] a [ _href "/small-group/log-on" ] [ icon "group"; menuSpacer; encLocText s.["Group"] ] ] ] yield li [] [ a [ _href "/prayer-requests/lists" _aria "label" s.["View Request List"].Value _title s.["View Request List"].Value ] [ icon "list"; space; encLocText s.["View Request List"] ] ] yield li [] [ a [ _href (sprintf "https://docs.prayer.bitbadger.solutions/%s" <| langCode ()) _aria "label" s.["Help"].Value; _title s.["View Help"].Value _target "_blank" ] [ icon "help"; space; encLocText s.["Help"] ] ] ] let rightLinks = match m.group with | Some _ -> [ match m.user with | Some _ -> yield li [] [ a [ _href "/user/password" _aria "label" s.["Change Your Password"].Value _title s.["Change Your Password"].Value ] [ icon "lock"; space; encLocText s.["Change Your Password"] ] ] | None -> () yield li [] [ a [ _href "/log-off"; _aria "label" s.["Log Off"].Value; _title s.["Log Off"].Value ] [ icon "power_settings_new"; space; encLocText s.["Log Off"] ] ] ] | None -> List.empty header [ _class "pt-title-bar" ] [ section [ _class "pt-title-bar-left" ] [ span [ _class "pt-title-bar-home" ] [ a [ _href "/"; _title s.["Home"].Value ] [ encLocText s.["PrayerTracker"] ] ] ul [] leftLinks ] section [ _class "pt-title-bar-center" ] [] section [ _class "pt-title-bar-right"; _role "toolbar" ] [ ul [] rightLinks ] ] /// Identity bar (below top nav) let identity m = let s = I18N.localizer.Force () header [ _id "pt-language" ] [ div [] [ yield span [ _class "u" ] [ encLocText s.["Language"]; rawText ": " ] match langCode () with | "es" -> yield encLocText s.["Spanish"] yield rawText "   •   " yield a [ _href "/language/en" ] [ encLocText s.["Change to English"] ] | _ -> yield encLocText s.["English"] yield rawText "   •   " yield a [ _href "/language/es" ] [ encLocText s.["Cambie a Español"] ] ] match m.group with | Some g -> [ match m.user with | Some u -> yield span [ _class "u" ] [ encLocText s.["Currently Logged On"] ] yield rawText "   " yield icon "person" yield strong [] [ encodedText u.fullName ] yield rawText "    " | None -> yield encLocText s.["Logged On as a Member of"] yield rawText "  " yield icon "group" yield space match m.user with | Some _ -> yield a [ _href "/small-group" ] [ strong [] [ encodedText g.name ] ] | None -> yield strong [] [ encodedText g.name ] yield rawText "  " ] | None -> [] |> div [] ] /// Content layouts module Content = /// Content layout that tops at 60rem let standard = div [ _class "pt-content" ] /// Content layout that uses the full width of the browser window let wide = div [ _class "pt-content pt-full-width" ] /// Separator for parts of the title let private titleSep = rawText " « " let private commonHead = [ meta [ _name "viewport"; _content "width=device-width, initial-scale=1" ] meta [ _name "generator"; _content "Giraffe" ] link [ _rel "stylesheet"; _href "https://fonts.googleapis.com/icon?family=Material+Icons" ] link [ _rel "stylesheet"; _href "/css/app.css" ] script [ _src "/js/app.js" ] [] ] /// Render the portion of the page let private htmlHead m pageTitle = let s = I18N.localizer.Force () head [] [ yield meta [ _charset "UTF-8" ] yield title [] [ encLocText pageTitle; titleSep; encLocText s.["PrayerTracker"] ] yield! commonHead for cssFile in m.style do yield link [ _rel "stylesheet"; _href (sprintf "/css/%s.css" cssFile); _type "text/css" ] for jsFile in m.script do yield script [ _src (sprintf "/js/%s.js" jsFile) ] [] ] /// Render a link to the help page for the current page let private helpLink link = let s = I18N.localizer.Force () sup [] [ a [ _href link _title s.["Click for Help on This Page"].Value _onclick (sprintf "return PT.showHelp('%s')" link) ] [ icon "help_outline" ] ] /// Render the page title, and optionally a help link let private renderPageTitle m pageTitle = h2 [ _id "pt-page-title" ] [ match m.helpLink with | Some link -> yield Help.fullLink (langCode ()) link |> helpLink | None -> () yield encLocText pageTitle ] /// Render the messages that may need to be displayed to the user let private messages m = let s = I18N.localizer.Force () m.messages |> List.map (fun msg -> table [ _class (sprintf "pt-msg %s" (msg.level.ToLower ())) ] [ tr [] [ td [] [ match msg.level with | "Info" -> () | lvl -> yield strong [] [ encLocText s.[lvl] ] yield rawText " » " yield rawText msg.text.Value match msg.description with | Some desc -> yield br [] yield div [ _class "description" ] [ rawText desc.Value ] | None -> () ] ] ]) /// Render the