Jadelet Example Garden

Animation End

Jadelet can also bind to animation events. Behold with wonder!

button.animated(click=@sayHello @animationend)= @text
{Observable} = Jadelet

buttonElement = Template
  text: Observable "Spinning!"
  animationend: ->
    @text "Ended"
  sayHello: ->
    alert "heyy"
@keyframes party
  0%
    transform: rotate(0deg)
    left:0px
  25%
    transform: rotate(20deg)
    left:0px
  50%
    transform: rotate(0deg)
    left:500px
  55%
    transform: rotate(0deg)
    left: 500px
  70%
    transform: rotate(0deg)
    left:500px
    background: #1ec7e6
  100% 
    transform: rotate(-360deg)
    left:0px

button.animated
  animation: party 5s 1