2025-07-28 01:05:33 -07:00

60 lines
2.1 KiB
Forth

namespace web_api_cookbook
open web_api_cookbook
open web_api_cookbook.Exercises
open WebSharper
open WebSharper.UI
open WebSharper.UI.Client
open WebSharper.UI.Html
[<JavaScript>]
module Exercise =
let private c = attr.``class``
let private showHide () =
let show = Var.Create false
let text =
function
| true -> "(Hide)"
| false -> "(Show)"
|> View.MapCached <| show.View
let toggle =
fun _ _ curr ->
Var.Set show (not curr)
|> on.clickView show.View
show.View, div [c "button button--text"; toggle] [textView text]
let doc title description content =
let expanded, showHide = showHide ()
div [c "exercise"] [
h2 [c "exercise__title"] [showHide; text title]
fun () ->
div [c "exercise__section"] [
div [c "exercise__description"] [text description]
div [c "exercise__content"] [content ()]
]
|> Doc.When expanded
]
[<JavaScript>]
module Client =
[<SPAEntryPoint>]
let Main () =
div [] [
h1 [] [text "Using Various Browser Web APIs via WebSharper (in F#)"]
p [] [
text "WebSharper is a web framework that provides a functional reactive programming '-ish' API for use in web development."
text "It supports a variety of applicative and monadic combinators that work natuarally with F#, making it a pleasure to use."]
p [] [text "On this page I've implemented code snippets that use various features using the browser's Web API, using WebSharper. The source code can be viewed "; a [] [text "here."]]
Exercise.doc
"Using requestAnimationFrame"
"Trying to use Request Animation Frame"
RequestAnimationFrame.doc
Exercise.doc
"Syncing LocalStorage Across Tabs"
"Using LocalStorage to keep data synced between tabs."
LocalStorageSync.doc
]
|> Doc.RunById "main"