diff options
author | Hayleigh Thompson <me@hayleigh.dev> | 2023-09-19 23:40:03 +0100 |
---|---|---|
committer | Hayleigh Thompson <me@hayleigh.dev> | 2023-09-19 23:40:03 +0100 |
commit | 92e8596b78982885803994b50c6b35f73f7a403e (patch) | |
tree | 13428243987317da540495215ed4d9e3938fb5cb /compat/lustre_animation/test/example_two_independent.gleam | |
parent | 985a9b0aa469cbe94fb95c433c97e2b321014341 (diff) | |
download | lustre-92e8596b78982885803994b50c6b35f73f7a403e.tar.gz lustre-92e8596b78982885803994b50c6b35f73f7a403e.zip |
:recycle: So long monorepo.
Diffstat (limited to 'compat/lustre_animation/test/example_two_independent.gleam')
-rw-r--r-- | compat/lustre_animation/test/example_two_independent.gleam | 103 |
1 files changed, 0 insertions, 103 deletions
diff --git a/compat/lustre_animation/test/example_two_independent.gleam b/compat/lustre_animation/test/example_two_independent.gleam deleted file mode 100644 index 61e687d..0000000 --- a/compat/lustre_animation/test/example_two_independent.gleam +++ /dev/null @@ -1,103 +0,0 @@ -import lustre -import lustre/animation.{Animations} -import lustre/attribute.{style} -import lustre/effect.{Effect} -import lustre/element.{text} -import lustre/element/html.{button, div, h3, span} -import lustre/event.{on_click} -import gleam/float - -pub type Msg { - Left - Right - Top - Bottom - Tick(time_offset: Float) -} - -pub type Model { - Model(x: Float, y: Float, animations: Animations) -} - -pub fn main() { - lustre.application(init, update, render) - |> lustre.start("#root", Nil) -} - -fn init(_) { - #(Model(0.5, 0.5, animation.new()), effect.none()) -} - -pub fn update(model: Model, msg: Msg) -> #(Model, Effect(Msg)) { - let m = case msg { - Left -> { - let new_animations = - animation.add(model.animations, "x", model.x, 0.0, 2.5) - Model(..model, animations: new_animations) - } - Right -> { - let new_animations = - animation.add(model.animations, "x", model.x, 1.0, 2.5) - Model(..model, animations: new_animations) - } - Top -> { - let new_animations = - animation.add(model.animations, "y", model.y, 0.0, 2.5) - Model(..model, animations: new_animations) - } - Bottom -> { - let new_animations = - animation.add(model.animations, "y", model.y, 1.0, 2.5) - Model(..model, animations: new_animations) - } - Tick(time_offset) -> { - let new_animations = animation.tick(model.animations, time_offset) - let x = animation.value(new_animations, "x", model.x) - let y = animation.value(new_animations, "y", model.y) - Model(x: x, y: y, animations: new_animations) - } - } - #(m, animation.effect(m.animations, Tick)) -} - -pub fn render(model: Model) { - let sp = span([], []) - let to_s = float.to_string - div( - [ - style([ - #("display", "grid"), - #("grid-template-rows", "1fr auto"), - #("width", "100%"), - #("height", "100%"), - ]), - ], - [ - div( - [ - style([ - #("display", "grid"), - #( - "grid-template-rows", - to_s(model.y) <> "fr auto " <> to_s(1.0 -. model.y) <> "fr", - ), - #( - "grid-template-columns", - to_s(model.x) <> "fr auto " <> to_s(1.0 -. model.x) <> "fr", - ), - ]), - ], - [sp, sp, sp, sp, h3([], [text("Move me around")]), sp, sp, sp, sp], - ), - div( - [], - [ - button([on_click(Left)], [text("Move to the Left")]), - button([on_click(Right)], [text("Move to the Right")]), - button([on_click(Top)], [text("Move to the Top")]), - button([on_click(Bottom)], [text("Move to the Bottom")]), - ], - ), - ], - ) -} |