Collapse() event click/move detect

[PlippiePlop]

Hi there,

I am investigating the use of split and its functions. One of the api calls is .collapse(panelID) this is to collapse one of the panels to its initial size. The most logical thing to do is to trigger it on the handle (gutter) so I did just that. Do a click event on the gutter and in the event call .collapse().

Great it works, until you try to drag the gutter. After inspecting the code i come to the conclusion that the collapse function does not account for a 'when mousemove do not trigger click' handling.

My request is to extend the collapse function so it:

1. detect click/move event on the gutter click to collapse panel
2. detects the clicked element which launched the collapse() function (be it from gutter or another button)
3. an option to overrule the initial set size. In case you want to collapse the panel to zero.

You can see a fix for (1) on my jsbin test example where i detect click/move event on the gutter click on the west/east panel. So it close the east panel on click of the gutter and if you move it it will move the gutter without launching a collapse() call.

[nathancahill]

Thanks for the suggestions. This seems like a common use case. Let's see what we can do here.

[PlippiePlop]

Hi, i suggest to add an extra div 'button' centered inside the gutter div with class "open-close-panel" and prevent bubbling on click event to the gutter. This way we can make a click open/close event, which collapse the panel to 0 or if it's set to 0 opens it to initial set set size. It's much easier than my example which need to detect the drag and prevent click on drag.