Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Hiding a view in Region Manager, when another view is shown

I am using the Marionette region manager to manage my views. There are three main regions: 1] Top menu region 2] Sidebar region 3] Main region ( the actual page that keeps changing )

Depending on actions on the top menu and the sidebar i keep changing the view that is rendered in the Main regions using App.MainRegion.show(view).

Now there is one particular view(persistView) which once rendered should be not be closed unless the tab/browser is closed.

Naturally i cannot use the App.MainRegion.show(view) here for foll reasons:

  1. When the show(persistView) is called the first time everything is alright.
  2. If i navigate away the show(otherview) will call close() of persistView. Which is not required.

My current solution is:

  1. Have a new region called persistRegion just below the mainRegion.
  2. persistView will always be rendered in the persistRegion.
  3. In the onShow() of persistView, i hide the mainRegion and show the peristRegion

The above works but i think is very hackish. Also i am stuck when after step 3] the user navigates to any other view. Now how to i tell persistView that it should hide itself and show the mainRegion ?

Any help will be highly appreciated.

like image 946
CodeRain Avatar asked Jun 08 '12 09:06

CodeRain


2 Answers

I think your layout sounds fine, in terms of having a region to hold the "persistent" view vs the main view. But I wouldn't let those two regions know about each other or try to control each other's display. Instead, I would create a separate object that knows how to do this.

This object would be responsible for listening to the correct events from the various views and regions involved. Then it would determine what regions to show and hide.

The key is in how you show and hide the regions, though. You don't want to close the regions and remove the views in them - at least, not the persistRegion. What you can do instead, though, is hide() the region's el

persistRegion.$el.hide()

and

persistRegion.$el.show()

the region's $el attribute will be available after a view has been displayed within the region, or after you call region.ensureElement().

like image 170
Derick Bailey Avatar answered Oct 24 '22 06:10

Derick Bailey


I may suggest using the reset() method from marionette regions, instead of hiding and showing region's element. Here's a link to the doc http://marionettejs.com/docs/v2.4.4/marionette.region.html#reset-a-region =>A region can be reset at any time. This destroys any existing view being displayed, and deletes the cached el. The next time the region shows a view, the region's el is queried from the DOM.

myRegion.reset(); This is useful when regions are re-used across view instances, and in unit testing.

like image 36
David Fallas Avatar answered Oct 24 '22 06:10

David Fallas