AW: [fusion-users] Using fusion with Tabs (Jx.Button.Tab, etc.)

[Paul Spencer]

Um, I just tried this in the fusion/templates/mapserver/ template and  
it worked fine.  javascript errors without the css, no errors with the  
css:

<style>
.tabContent {
   display: block !important;
   visibility: hidden !important;
}
.tabContentActive {
   visibility: visible !important;
}
</style>

I added the above css at the end of the head section.

I modified new Jx.Splitter to change 'Map' for 'TabbedArea' and added  
a new TabBox to contain an empty tab (active) and a map tab:

     new Jx.Splitter(mainPanel.content, {
        elements: ['PanelPane', 'TabbedArea'],
        containerOptions: [{width: 200}, {}]
     });

     new Jx.Layout('Map');
     var tb = new Jx.TabBox().addTo('TabbedArea');
     tb.add(
       new Jx.Button.Tab({label: 'another tab'}),
       new Jx.Button.Tab({label: 'Map Tab', content: 'Map'})
     );

and I modified the HTML to put a div called TabbedArea around the

<div id="TabbedArea">
   <div id="Map"><div id="Navigator"></div>
</div>

Cheers

Paul

On 12-Jun-09, at 9:47 AM, Bernhard Schneider wrote:

>
> Thank you for your very fast reply!
>
> I tested your suggestion, but it didn't work. I think the reason is  
> the effect of the visibility:hidden on child nodes. The setting  
> display:none prevents all children of the div element from being  
> shown, whatever their display and visibility settings are. I suspect  
> that this is not the case for visibility:hidden, some of the div's  
> children are still shown.
>
> I wonder whether I should set display:block of the tab with the  
> Fusion map before Fusion is initialized, and put display back to  
> none after Fusion initalization. This however would cause the map to  
> appear briefly. To prevent this, I could move the map's parent div  
> out of the way by setting top:10000 and left:10000, but all of this  
> is kind of ugly.
>
> Is it OpenLayers that retrieves the map size from the clientWidth  
> and clientHeight attributes? Or is it Fusion? Are there any reasons  
> for not using the regular width and height attributes of the map's  
> parent div?
>
> I'll keep working on it...
> Bernhard
>
>
>
> -----Ursprüngliche Nachricht-----
> Von: Paul Spencer [mailto:pspencer at dmsolutions.ca]
> Gesendet: Freitag, 12. Juni 2009 14:31
> An: Bernhard Schneider
> Cc: fusion-users at lists.osgeo.org
> Betreff: Re: [fusion-users] Using fusion with Tabs (Jx.Button.Tab,  
> etc.)
>
> Tough one!  Ideally, the tabs would be set to display: block;
> visibility: hidden; .  You can try this (untested)
>
> <style>
> .tabContent {
>   display: block;
>   visibility: hidden;
> }
>
> .tabContentActive {
>   visibility: visible;
> }
> </style>
>
> and include that AFTER the jxlib theme file <link> in your page.  If
> that doesn't work, check in firebug to see which styles are getting
> used for tab content areas, if it is still .tabContent from the theme
> file then try adding !important before the ; on each line above (i.e.
> display: block !important;)
>
> Cheers
>
> Paul
>
> On 12-Jun-09, at 8:18 AM, Bernhard Schneider wrote:
>
>> Hello Fusion users and expert,
>> We are trying to use Fusion (2 beta) in combination with Tabs
>> (Jx.Button.Tab, Jx.TabSet). We encounter the following problem when
>> loading Fusion in a tab that is currently not active: If a tab is
>> inactive, some of the tab's div-elements are not visible
>> (display=none). Because of this, all requests to div-
>> element.clientWidth and ..clientHeight return 0 (instead of the
>> actual element's size). This in turn is bad for the map widget
>> because it needs these div attributes to determine its size. When
>> the user clicks the tab with the Fusion map, the damage is already
>> done, a generic max extent is used instead of the predefined one,
>> and the overview map does not show at all.
>> As it turns out, we only manage to successfully load Fusion in
>> active tabs.
>> Does anyone have experience in loading Fusion in tabs? Any
>> suggestions on how to load Fusion in inactive tabs?
>> Thank you in advance
>> Bernhard
>>
>> _______________________________________________
>> fusion-users mailing list
>> fusion-users at lists.osgeo.org
>> http://lists.osgeo.org/mailman/listinfo/fusion-users
>
>
> __________________________________________
>
>    Paul Spencer
>    Chief Technology Officer
>    DM Solutions Group Inc
>    http://research.dmsolutions.ca/
>


__________________________________________

    Paul Spencer
    Chief Technology Officer
    DM Solutions Group Inc
    http://research.dmsolutions.ca/