williamngan/pts

space.resize() error

fractalhq opened this issue · 3 comments

My console is flooded with this message whenever I call space.resize(). I suspect it's linked to the mouse event listener.

Uncaught TypeError: Cannot read property 'clone' of undefined
    at CanvasSpace.get outerBound [as outerBound] (Space.js:107)
    at CanvasSpace._mouseAction (Space.js:189)
    at CanvasSpace._mouseOut (Space.js:243)

Is there a proper way to use space.resize() on a window event listener? I suspect I'm using it incorrectly.

If you add a resize callback when you add the player into the space, resizing should work automatically. There's no need to call space.resize directly.

space.add( {
  start: (bound, space) => { 
    // code for init 
  },
  animate: (time, ftime, space) => { 
    // code for animation 
  },
  action: (type, x, y, event) => { 
    // code for interaction 
  },
  resize: (size, event) => { 
    // code for resize 
  }
} );

See this guide for more.

Hey! It appears as though the resize callback only fires once during initialization. Just to clarify- should I be passing in an event listening attached to the window or canvas, like so:

resize: (newDimensions, myListener) => {
	// re-create grid to match new window size
	pts = Create.gridCells(space.innerBound, w / 40, h / 40)
}

or simply adding the callback like you suggested:

resize: (size, event) => {
	// re-create grid to match new window size
	pts = Create.gridCells(space.innerBound, w / 40, h / 40)
  }

The canvas is "resizing" as long as the width and height are set in CSS: min-width: 100vw. But there don't seem to be any events triggering when the window size changes.

I put together an example of what I'm trying to do in this REPL.

Thanks for the awesome library, and the prompt response :)

Hey @FractalHQ - Sorry I totally missed your reply, just saw it as I'm going through the issues.

To enable resize, you'd need to add {resize: true} in space.setup(...). See the doc here.

I'll update the guides to make it clearer. Thank you!