Borderlayout skins in 0.40 svn don't show tabs or titles

**kjordan** · 30 Dec 2006 3:04 PM

So I checked out 0.40 and the first time a page comes up, the tabs and titles don't show up for borderlayout on anything but the center. The pin button still shows, and so if I contract them and then expand them, the tabs and titles show up.
Example:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
	<head>
		<link rel="stylesheet" type="text/css" href="/system/js/yui-ext-svn/resources/css/ytheme-ext.css" />
		<link rel="stylesheet" type="text/css" href="/system/js/yui-ext-svn/resources/css/layout.css" />
		<link rel="stylesheet" type="text/css" href="/system/js/yui-ext-svn/resources/css/tabs.css" />
		<link rel="stylesheet" type="text/css" href="/system/js/yui-ext-svn/resources/css/ytheme-gray.css" />
		<script src="/system/js/yui-testing/build/yahoo/yahoo-debug.js"></script>
		<script src="/system/js/yui-testing/build/dom/dom.js"></script>
		<script src="/system/js/yui-testing/build/event/event.js"></script>
		<script src="/system/js/yui-testing/build/connection/connection.js"></script>
		<script src="/system/js/yui-testing/build/animation/animation.js"></script>
		<script src="/system/js/yui-testing/build/autocomplete/autocomplete.js"></script>
		<script src="/system/js/yui-testing/build/dragdrop/dragdrop.js"></script>
		<script src="/system/js/yui-testing/build/slider/slider.js"></script>
		<script src="/system/js/yui-testing/examples/autocomplete/js/json.js"></script>
		<script src="/system/js/yui-testing/build/container/container.js"></script>
		<script src="/system/js/yui-ext-svn/yui-ext.js"></script>
		<script src="/system/js/yui-ext-svn/build/Element-min.js"></script>
		<script src="/system/js/yui-ext-svn/build/DomHelper-min.js"></script>
		<script src="/system/js/yui-ext-svn/build/EventManager-min.js"></script>
		<script src="/system/js/yui-ext-svn/build/widgets/BasicDialog-min.js"></script>
		<script src="/system/js/yui-ext-svn/build/layout/BorderLayout-min.js"></script>
		<script src="/system/js/yui-ext-svn/build/layout/ContentPanels-min.js"></script>
		<script src="/system/js/yui-ext-svn/build/layout/LayoutManager-min.js"></script>		
		<script type="text/javascript" src="layout.js" />
	</head>
	<body>
		<div id ="container">
			<div id="west" class="ylayout-inactive-content">
				West
			</div>
			<div id="west2" class="ylayout-inactive-content">
				West
			</div>
			<div id="west3" class="ylayout-inactive-content">
				West
			</div>
			<div id="west4" class="ylayout-inactive-content">
				West
			</div>
			<div id="north" class="ylayout-inactive-content">
                            North
			</div>
			<div id="south" class="ylayout-inactive-content">
				South
			</div>
			<div id="east" class="ylayout-inactive-content">
				East
			</div>
			<div id="center" class="ylayout-inactive-content">
				Center
			</div>
		</div>
	</body>
</html>

Javascript:

Code:

Example = function(){
	        var layout;
	        return {
	            init : function(){
	               layout = new YAHOO.ext.BorderLayout(document.body, {
	                    hideOnLayout: true,
	                    north: {
	                        titlebar: false
	                    },
	                    center: {
	                        titlebar: true,
	                        autoScroll:true,
							split:true,
							useShim:true
	                    },
						east: {
	                        titlebar: true,
							autoScroll:true,
							split:true,
							useShim:true,
							collapsible: true,
							animate:true,
							initialSize: 100,
							minSize: 100
	                    },
						west: {
	                        titlebar: true,
	                        autoScroll:true,
							split:true,
							useShim:true,
							collapsible: true,
							animate:true,
							initialSize: 200,
							minSize: 200,
							resizeTabs:true
	                    },
						south: {
	                        titlebar: true,
	                        autoScroll:true,
							split:true,
							useShim:true,
							collapsible: true,
							animate:true,
							initialSize: 50,
							minSize: 50
	                    }
	                });


                    layout.beginUpdate();
	                layout.add('north', new YAHOO.ext.ContentPanel('north', 'north'));
	                layout.add('east', new YAHOO.ext.ContentPanel('east', 'east'));
	                layout.add('center', new YAHOO.ext.ContentPanel('center', 'center'));
	                layout.add('west', new YAHOO.ext.ContentPanel('west', 'Navigation'));
	                layout.add('west', new YAHOO.ext.ContentPanel('west2', 'Actions'));
	                layout.add('west', new YAHOO.ext.ContentPanel('west3', 'Widgets'));
	                layout.add('west', new YAHOO.ext.ContentPanel('west4', 'Layout'));
	                layout.add('south', new YAHOO.ext.ContentPanel('south', 'south'));
	                layout.endUpdate();
	           }
	     }

	}();
	YAHOO.ext.EventManager.onDocumentReady(Example.init, Example, true);

**tryanDLS** · 30 Dec 2006 4:53 PM

I can confirm this using a more reasonable set of includes (e.g. just yui-ext.js and yui-ext.css).
Another issue related to this is resizing regions via border dragging. They're not resizable and the resize handle doesn't appear til after the region is collapsed/expanded.
It's an issue without or without using a theme.

**jack.slocum** · 31 Dec 2006 2:21 AM

It was a bug. Should be fixed in SVN.

**tryanDLS** · 31 Dec 2006 9:28 AM

Tested with the latest code - looks good now.

Borderlayout skins in 0.40 svn don't show tabs or titles

Thread Tools

Search Thread

Display

Borderlayout skins in 0.40 svn don't show tabs or titles

Borderlayout skins in 0.40 svn don't show tabs or titles

Similar Threads

BorderLayout and show div element

Tabs in BorderLayout

tab close images don't always show in IE6 for borderlayout

BorderLayout, show/hide panel