https://github.com/epost/purescript-halogen-svg-sandbox
https://github.com/epost/purescript-halogen-svg-sandbox
Last synced: 6 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/epost/purescript-halogen-svg-sandbox
- Owner: epost
- Created: 2018-10-25T18:50:50.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2018-10-25T19:09:52.000Z (over 7 years ago)
- Last Synced: 2025-02-08T07:12:07.061Z (over 1 year ago)
- Language: PureScript
- Size: 55.7 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.org
Awesome Lists containing this project
README
#+title:Halogen Sandbox
* Problem with SVG ~animateMotion~
** Description:
I generate some SVG containing a horizontal grey line. Upon pressing the
~animate~ button, the ball should start moving along the line from left to
right. Unfortunately, it doesn't. :(
However, when I copy the SVG into another div, and press the button again, the
animation /does/ start there.
It seems like there is something going on around Halogen that prevents the SVG
animation from working, but I have no clue what or how to diagnose it, other
than looking at possibly problematic event handlers in the browser dev tools,
which has been inconclusive.
** To reproduce:
1) ~npm install~
1) ~npm run build~
1) Open ~dist/index.html~ with your browser.
1) Follow instructions on the web page.
** Some details
- I tested this on Chrome and Firefox on Mac.
- The SVG code is adapted from https://github.com/kettlebell/purescript-halogen-svg, which is a fork of https://github.com/kwohlfahrt/purescript-halogen-svg.