Listening for Paper resize events

[alexandernst]

Hi!

I'm currently using the resize event in order to find out when my paper was resized either by calling setDimensions or because the PaperScroller decided it must resize it (autoResizePaper: true).

My problem is that when I zoom the paper (by calling PaperScroller.zoom) a resize event is triggered. I'm not expecting that, but I'm not sure if I'm understanding the docs incorrectly or if there is a bug in PaperScroller.

To my understanding, zooming doesn't change the paper dimensions, it only changes the scale. If my assumption is incorrect, how can I listen only for actual dimension changes?

[kumilingus]

Hi Alex,

It's not a bug. The resize is a low-level event that is triggered when the paper changes its size. When the PaperScroller zooms the paper it sets the new viewport transformation (scale and translate) and resizes the paper (resize).

The paper transformations and paper dimensions are independent paper's attributes (see this demo).

I don't think It's possible to distinguish this right now. You will have to override some of the PaperScroller methods for the time being. We might need to add higher-level events or allow passing flags along with paper events. e.g.:

paperScroller.on('zoom',  () => {});
paperScroller.on('auto-resize', () => {});

or

paper.on('resize', (width, height, flags) => {
  if (flags.autoResize) {
    /* */
  }
});

What action do you need to run when the paper is resized because of the content size and not when the PaperScroller zooms? I'd like to know some use-cases before we start implementing this.

Thanks!

[alexandernst]

Hey Roman!

I initialize the Paper's width and height with values pulled from user's settings. I'd like to be able to listen whenever the paper get's resized so that I can get the new size (dimension?) and store it in the user's settings.

[kumilingus]

What if you store the area of the paper (a rectangle from the top-left corner to the bottom-right corner in the graph coordinates) along with the zoom level. The paper area does not change when zoomed.

paper.on('resize', function() {
   console.log(paperScroller.zoom());
   console.log(paper.getArea());
});

[kumilingus]

Also I don't think I understand the use-case 😃

If the paper gets resized because of autoResizePaper: true why do you need to store the new values? The next time the diagram is open it will be resized to the same size automatically (because the graph content requires a larger canvas). What exactly do you use the width and height for? For Paper width and height? For PaperScroller baseWidth and baseHeight? Or something else?

Thanks for clarification!

[alexandernst]

I... 🤔... I think you're right. I'm trying to fix a non-existing problem. It doesn't make any sense to let the user specify the dimensions, because (as you said) the paper will autoresize to whatever it needs to resize. Scratch my question :)