Resize window question when panel is maximized

[whittssg]

Hello,

Is there a way to keep the panel responsive (when maximized) while resizing the window?

I am listening to the window resize event and can get it to resize correctly if i minimize it then maximize it (which looks strange) but not by just by calling the maximize function.

Thanks,

[whittssg]

I am aware that i can do it by setting the actual width and height but just thought there might be a built in way:

   if (currentPanel.option.setstatus == "maximize") {
                        currentPanel.resize(function () {
                            return $(window).width() - 10
                        }, function () {
                            return $(window).height() - 10
                        });
                    }

[Flyer53]

I already had the one or the other idea concerning the kind of responsiveness you propose but couldn't make up my mind yet on what is really a good idea and what is not. If you have ideas ... don't hesitate to share them :)

Meanwhile you could do a "remaximize" after a window resize a little bit easier if you're willing to do a little change to the js: Remove line 2187 from jquery.jspanel.js and/or line 2052 from jquery.jspanel-compiled.js (For some reason I blocked the maximized method for a panel that's already maximized. Doesn't make that much sense I guess ...) After removing those 2 lines of code you can do something like:

var test = $.jsPanel().maximize();

window.onresize = function() {
    test.maximize();
}

Checked this only in FF. Works fine and even resizes the panel while resizing the window with mouse

[whittssg]

I will give it a go.. thanks +1:

[Flyer53]

@whittssg With version 3.1.0 there is now need to remove the above mentioned lines of code.

Example code:

var panel = $.jsPanel();

window.onresize = function () {
  if (panel.data('status') === 'maximized') {
    panel.maximize();
  }
};

[Flyer53]

Currently I'm experimenting with a new option to optionally make a panel to some degree responsive to window.resize events

• if maximized panel will adjust its size automatically to match new dimensions of the parent container after a window.resize event
• if normalized or smallified panel will reposition according to option.position after a window.resize event (a centered panel would remain centered on window.resize for example)

Any thoughts/ideas about that or additional responsiveness features??

[whittssg]

That sounds good.. Any chance you could add an option like "maximizeOnMobile" where if the device being used is a mobile then the size of the panel is overridden (imagine i had it centered 50% width on desktop) and the panel goes full screen?

Thanks

[Flyer53]

@whittssg I don't think I'm going to implement a device detection and default behaviours for different devices. The ideas what should happen on what device in what situation are heavily dependent on the individual developers needs and I can't predict those needs. Furthermore there are already libs for device detection out there you could include. Some people might already have a device detection on the server side they want to continue to use .... I'm not even sure whether I want to include the responsiveness features I proposed above. It doesn't need more code to implement them individually ... and maybe it's better to simply provide a number of esxamples for various "responsiveness ideas". Still thinking ....

[Flyer53]

As of jsPanel version 3.2.0 there is an option.onwindowresize http://jspanel.de/api/#option/onwindowresize