williamngan / pts

A library for visualization and creative-coding
https://ptsjs.org
Apache License 2.0
5.16k stars 182 forks source link

UIDragger.onDrag() not triggering in Firefox and Safari #221

Open leoxiong opened 2 months ago

leoxiong commented 2 months ago

The ui.track demo does not seem to work on Firefox and Safari on macOS. Dragging on the red circles do not move them.

macOS Sonoma 14.5 Firefox 127.0.1 Safari 17.5

Another test script I wrote also doesn't log any messages.

    <div id="canvas"></div>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/pts/0.12.9/pts.min.js"></script>
    <script>
        Pts.namespace(this)

        const rects = []

        new CanvasSpace('#canvas').setup({bgcolor: 'transparent', retina: true}).add({
            start: (bound, space) => {
                const rect = UIDragger.fromRectangle([[100, 100], [0, 0]])
                rect.onDrag((target, pt) => {
                    console.log('ondrag')
                })
                rects.push(rect)
            },
            animate: (time, ftime, space) => {
                const form = space.getForm()

                form.fillOnly('#0c6')
                rects.forEach((rect) => {
                    rect.render(group => form.rect(group))
                })
            },
            action: (type, x, y, event) => {
                UI.track(rects, type, new Pt(x, y), event)
            },
        }).bindMouse().play()
    </script>

However using .on('drag', ...) does work.

const rect = UI.fromRectangle([[100, 100], [0, 0]])
rect.on('drag', (target, pt, type, event) => {
    console.log('drag')
})