User:CapitalR/Navbox/test

From Wikipedia, the free encyclopedia

This is a demonstration page for the new Navbox suite. The new Navbox template can be seen at: User:CapitalR/Navbox. It is meant to replace the existing code for the {{Navbox}} template. It should not have any significant effect on existing instances of the Navbox, but does add additional features for future Navboxes. In addition, the {{Navbox with columns}} code will be updated to {{Navbox with columns/sandbox}} and a new template, {{Navbox with collapsible sections}} will be introduced to replace {{Navigation with collapsible groups}}. All three of these templates share common parameter names, look and feel, and are compatible to be used as sub-templates in each other (in fact, the other two both just use {{Navbox}} internally to guarantee consistency).

Please feel free to edit any of the Navbox related pages in CapitalR's userpages.

The advantages of the new {{Navbox}} design are as follows:

• Displays the same results in all browsers that I have tested (IE 6/7, Firefox, Safari, and Opera, all on Vista and XP)
• Corrects a bug in IE where extra spaces are shown when the navbox is in the collapsed mode, and there are multiple groups/lists and an image.
• Corrects differences in apparent font size between Firefox and IE.
• Allows an unlimited number of lists/groups
• Allows all groups/lists to be individually styled
• Provides a parameter called "basestyle" that sets the style for the title, above, below, and group fields all at once. This is convenient for wanting to change the basic color of the navbox and not have to set all the style fields one at a time.
• Allows subgroups, which are just nested navboxes with the "border" parameter set to "subgroup". There is no need for a separate "Navbox subgroup" template.
• Allows nested navboxes (see numerous examples below) for multiple show/hide boxes in a single container
• Post-expand size is very low, at only about 10kb for the basic box; on average, the post-expand is smaller than the current design, making the new one more efficient.
• All parameters are optional and no display errors result from missing parameters (this includes optional title, and all lists/groups are optional)
• Obsoletes the {{Navbox/core}} template and gets all the code in one place.
• Provides 0.25em left and right padding inside the list area to make it easier to read. The padding can be disabled by setting "listpadding=0" (once mw:Extension:StringFunctions are enabled with the resolution of bugzilla:6455 this parameter can be obsoleted by just using "liststyle = padding:0;", but until then it is a necessary evil).
• Imageleft is now allowed when groups are present.
• Allows striping to be inverted (by setting "evenodd = swap", which is useful for correcting striping errors with subgroups.
• There is more control over padding in the title when the navbar or show/hide button are not displayed.
• When two navboxes are adjacent to each other on a page, there is now only a 1px border between them instead of a 2px border (except in IE6, which doesn't support the necessary CSS to do this, but that's okay).
• Full support for CSS skinning.

Contents 1 New Navbox parameters 2 CSS 3 Known effects 4 Integration plan 5 Basic tests 6 Subgroup tests 7 Container tests 8 Style tests 9 Group width tests 10 Navbar and state tests 11 Titlegroup tests 12 Missing parameter tests 13 Row striping tests 14 Additional tests 15 Using Navbox with columns / Navbox with collapsible sections 16 Tests of actual Navboxes

[edit] New Navbox parameters

These are the parameters for the new {{Navbox}} template design. Parameters in magenta are common to all three Navbox suite templates. The remaining parameters are specific to {{Navbox}}. {{Navbox with columns}} and {{Navbox with collapsible sections}} have their own specific parameters, which are not listed on this doc page.

• Setup fields
  • name: used for the VDE bar. Is a required parameter, unless one of the following is true: no title is specified, border is set to "subgroup", state is set to "plain" or "off", navbar is set to "plain" or "off"
  • state: [autocollapse, uncollapsed, collapsed, plain, off], the usual choices, with the addition of "plain" and "off", which doesn't display show/hide at all; if set to "plain", then padding is used in place of the show/hide button to keep the title centered.
  • navbar: [BLANK, plain, off], if set to "plain" or "off" then VDE is not displayed; if set to "plain" then padding is used in place of the VDE buttons to keep the title centered.
  • border: [BLANK, subgroup, none], if set to "subgroup", then the border is hidden and the navbox can be nested inside of another navbox; if set to "none", then the border is hidden and the navbox can be used in a stand-alone fashion inside of another container.

• Information fields
  • title: same as always
  • above: same as always
  • below: same as always
  • imageleft: same as always
  • image: same as always
  • group[1-20]: same as always
  • list[1-20]: same as always
  • titlegroup: adds a group on the same line as the title; for example, use in {{US state navigation box}} for the flag. The titlegroup parameter and imageleft parameter cannot both be used at the same time.

• Style fields
  • style: same as always
  • imageleftstyle: style for the imageleft cell in the table
  • imagestyle: style for the image cell in the table
  • titlestyle: same as always
  • basestyle: sets the titlestyle, abovestyle, belowstyle, and groupstyle all at once
  • abovestyle: same as always
  • belowstyle: same as always
  • groupstyle: same as always
  • liststyle: same as always
  • evenstyle: same as always
  • oddstyle: same as always
  • group[1-20]style: set the style for a specific group
  • list[1-20]style: set the style for a specific list

• Advanced style fields
  • listpadding: sets the padding inside the list area. Set to 0 to eliminate the default 0.25em left and right padding on the lists. Due to complex technical reasons, simply setting "liststyle=padding:0px;" will not set the padding to 0. This extra parameter can be used in the very rare case that the padding needs to be eliminated. This parameter is meant for only advanced users who want to design a complex Navbox and not follow the default design styles.
  • evenodd: [BLANK, swap, even, odd, off]: controls whether automatic row striping of even and odd rows (currently #f9f9f9 for even rows and nothing for odd rows) is swapped (i.e. even rows get odd striping and odd rows get even striping). Setting to to "off" removes automatic striping altogether. Setting to "even" or "odd" applies that automatic striping style to all rows. This parameter has no effect on evenstyle or oddstyle (if you want to swap those, you have to do it with your own code; this is because swapping user even/odd styles is probably a very rare event, and in order to keep the code size down, this is not an included feature).

• Deprecated parameters
  • body: does the exact same thing as list1; only used by a small number of templates. Should be advised against for consistent coding.
  • category: this is a completely pointless parameter, but someone added it to the existing Navbox design, so it's supported here for backward compatibility. It's use should be strongly advised against, because it's pointless and confusing (I'd recommend not even listing it as a parameter on the doc page to avoid having people use it).

[edit] CSS

These examples uses new CSS code that was recently added to MediaWiki:Common.css. If the examples look funny to you, then you probably need to bypass your cache, or click this link.

[edit] Known effects

While a vast majority of instances of the Navbox will be not be changed by this new implementation, a few will see slight differences.

• One known issue is caused by the default left and right padding added to the list areas (set at 0.25em). A few current Navbox instances (about 100 or so) are designed with the expectation that the padding is 0 (as it is in the current Navbox design), and will show minor differences once the new padding is added. Those templates can be easily identified (I already ran a database dump scan to find any that are affected) and updated as soon as the new changes go into effect. The problem is relatively minor, and no one will really notice anyways, so I'm not too worried about it. I've also added a new parameter called "listpadding" which, when set to any non blank value, will cause the list padding to be set to that value instead of the 0.25em default.
• The second issue is with {{Navbox subgroup}}. Again, due to the default list padding, there will be a big gap before the subgroups. This can temporarily be fixed with a table margin change to the subgroup templates. After that, all instances of Navbox subgroup (and all of the other subgroup templates hanging around) can be converted to just a Navbox, with "border = subgroup" set. Following that, Navbox subgroup can be deprecated. Again, I've got a tool ready to make these changes quickly upon the new Navbox code going live.

[edit] Integration plan

The main plan for getting this code in the live navbox template is as follows:

1. Test it fully to fix any bugs, add additional features as needed, and ensure backward compatability.
2. Get CSS into MediaWiki:Common.css and wait at least 31 days (done, waiting until May 1, 2008).
3. Agree on an exact time when the new code will be added to the live navbox template; this is so that I (User:CapitalR) and others can be on hand to immediately identify and fix any problems with the code, and to fix any instances that might need tweaking (for example, all "Navbox subgroup" instances will be immediately converted to just "Navbox" with border=subgroup set; also, instances of Navbox that use "navbar=plain" or "state=plain" will need to be checked to ensure that title padding is okay).
4. At the agreed upon time, add the code to the live navbox template, and update the CSS table.navbox class to have padding go from 2px to 1px (this must be done at the same time as the navbox code update, instead of being done a month ahead of time like the other changes).

[edit] Basic tests

Simple Group/List Test
Above
Group1	List1
Group2	List2
Group3	List3
Below

Simple List Only Test
Above
List1
List2
List3
Below

Simple 1 List Only Test
List1

Mixed Groups/Lists Test
Above
Group1	List1
List2
Group3	List3
Below

Image Test
Above
Group1	List1
Group2	List2
Group3	List3
Below

Image No Groups Test
Above
List1
List2
List3
Below

Left Image Test
Above
Group1	List1
Group2	List2
Group3	List3
Below

Left Image, No Groups Test
Above
List1
List2
List3
Below

Both Images Test
Above
Group1	List1
Group2	List2
Group3	List3
Below

Both Images, No Groups Test
Above
List1
List2
List3
Below

[edit] Subgroup tests

Simple Subgroup Test
Above
Group1	List1
Group2	{{{title}}} Group1 List1 Group2 List2 Group3 List3
Group3	List3
Below

Subgroup without all Groups Test
Above
Group1	List1
Group2	{{{title}}} List1 Group2 List2 Group3 List3 List4 List5
Group3	List3
Below

Multiple Subgroup Test
Above
Group1	List1
Group2	{{{title}}} Group1 List1 Group2 List2 Group3 List3
Group3	{{{title}}} Group1 List1 Group2 List2 Group3 List3
Below

NestedSubgroup Test
Above
Group1	List1
Group2	{{{title}}} Group1 List1 Group2 {{{title}}} Group1 List1 Group2 List2 Group3 List3 Group3 List3
Group3	{{{title}}} Group1 List1 Group2 List2 Group3 List3
Below

Nested Collapsible Subgroup Test
Above
Group1	List1
Group2	Nested Subgroup Group1 List1 Group2 List2 Group3 List3 Group4 List4
Group3	List3
Below

Nested Collapsible Subgroup with Image and VDE Test
Above
Group1	List1
Group2	Nested Subgroup Group1 List1 Group2 List2 Group3 List3 Group4 List4
Group3	{{{title}}} Group1 List1 Group2 List2 Group3 List3
Below

Test title
Above
Group1	List1
Group2	List2
Group3	Title Above Group3.1 List3.1 Group3.1 List3.1 Group3.2 {{{title}}} Group3.2.1 List3.2.1 Group3.2.2 List3.2.2 Group3.2.3 List3.2.3 Below
Group4	List4
Group5	{{{title}}} Group5.1 List5.1 Group5.2 List5.2 Group5.3 List5.3
Below

[edit] Container tests

Container test
Test title1 Group1 List1 Group2 List2 Group3 List3
Test title2 Group1 List1 Group2 List2 Group3 List3
Test title3 Group1 List1 Group2 List2 Group3 List3

Container test 2
Test title1 Above Group1 List1 Group2 List2 Group3 List3 Below
Test title2 Above Group1 List1 Group2 List2 Group3 List3 Below
Test title3 List1 List2 List3

French overseas empire
Former	{{{title}}} Former French colonies in Africa and the Indian Ocean Mahgreb Algeria · Morocco (Arguin Island) · Tunisia French West Africa Côte d'Ivoire · Dahomey · French Sudan · Guinea · Mauritania · Niger · Senegal · Upper Volta   French Togoland · James Island French Equatorial Africa Chad · Gabon · Middle Congo · Oubangui-Chari Comoros Anjouan · Grande Comore · Mohéli Former French colonies in the Americas New France  (Acadia • Louisiana • Canada • Terre Neuve) 1655 – 1763 Inini · Berbice · Saint-Domingue (Haiti) · Tobago · Virgin Islands · France Antarctique · France Équinoxiale French West India Company Former French colonies in Asia and Oceania French India Chandernagor · Coromandel Coast · Madras · Malabar · Mahé · Pondichéry · Karaikal · Yanaon French Indochina Cambodia · Laos · Vietnam (Annam • Cochinchina • Tonkin) Other Asian Alaouites · Alexandretta-Hatay · Ceylon · Kwangchowan Oceania New Hebrides (Vanuatu) French East India Company
Present	Overseas departments and territories of France Overseas departments1 French Guiana · Guadeloupe · Martinique · Réunion Overseas collectivities French Polynesia · Mayotte2 · Saint Barthélemy · Saint Martin · Saint Pierre and Miquelon · Wallis and Futuna Special status New Caledonia Uninhabited lands Clipperton Island · French Southern and Antarctic Lands (Île Amsterdam • Île Saint-Paul • Crozet Islands • Kerguelen Islands • Adélie Land • Scattered islands in the Indian Ocean: Bassas da India3 • Europa Island3 • Glorioso Islands2, 3, 4 • Juan de Nova Island3 • Tromelin Island5) 1 Also known as overseas regions. 2 Claimed by Comoros. 3 Claimed by Madagascar. 4 Claimed by Seychelles. 5 Claimed by Mauritius.

[edit] Style tests

Test title
Above
Group1	List1
Group2	List2
Group3	{{{title}}} Group3.1 List3.1 Group3.2 List3.2 Group3.3 Title 3.3 Above 3.3 Group3.3.1 List3.3.1 Group3.3.2 List3.3.2 Below 3.3
Group4	List4
Group5	Test title Group5.1 List5.1 Group5.2 List5.2 Group5.3 List5.3
Below

All Styles Test
Above
Group1	List1
Group2	List2
Group3	List3
Group4	List4
Group5	List5
Below

"basestyle = background:red;color:white;" Test
Above
Group1	List1
Group2	List2
Group3	List3
Below

[edit] Group width tests

Groupwidth = 10em Test
Above
Group1	List1, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test
Group2	List2
Group3	List3
Below

Groupwidth = 10em Test
Above
Group1	List1, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test
Group2	List2
Group3	List3
Below

Groupwidth = 10em Test
Above
Group1	List1, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test
Group2	List2
Group3	List3
Below

Groupwidth = 10em Test
Above
Group1	List1, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test
Group2	List2
Group3	List3
Below

Multiple subgroups with "groupwidth = 7em"
Above
Group1	{{{title}}} Group1 List1, test, test, test, test, test, test Group2 List2, test, test, test, test, test, test Group3 List3, test, test, test, test, test, test
Group2	List2
Group3	{{{title}}} Group1 List1, test, test, test, test, test, test Group2 List2, test, test, test, test, test, test Group3 List3, test, test, test, test, test, test
Group4	List4
Below

[edit] Navbar and state tests

"state = plain" Test
Above
Group1	List1
Group2	List2
Group3	List3
Below

"navbar = plain" Test
Above
Group1	List1
Group2	List2
Group3	List3
Below

"state = plain" and "navbar = plain" Test
Above
Group1	List1
Group2	List2
Group3	List3
Below

"state = off" Test
Above
Group1	List1
Group2	List2
Group3	List3
Below

"navbar = off" Test
Above
Group1	List1
Group2	List2
Group3	List3
Below

"state = off" and "navbar = plain" Test
Above
Group1	List1
Group2	List2
Group3	List3
Below

"state = plain" and "navbar = off" Test
Above
Group1	List1
Group2	List2
Group3	List3
Below

"state = off" and "navbar = off" Test
Above
Group1	List1
Group2	List2
Group3	List3
Below

Missing "name" parameter
Above
Group1	List1
Group2	List2
Group3	List3
Below

[edit] Titlegroup tests

Simple Titlegroup Test
Above
Group1	List1
Group2	List2
Group3	List3
Below

Titlegroup Test with Image
Above
Group1	List1
Group2	List2
Group3	List3
Below

Titlegroup, group width = 10em, with Centered Title
Above
Group1	List1, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test, test
Group2	List2
Group3	List3
Below

[edit] Missing parameter tests

Missing List1 Test
Above
Group2	List2
Group3	List3
Below

Missing List1 and List2 Test
Above
Group3	List3
Below

No Groups/Lists
Above
Below

{{{title}}}
No title (this is the Above pane)
Group1	List1
Group2	List2
Group3	List3
Below

{{{title}}}
No Groups/Lists/Title (this is the Above pane)
Below

Nothing but title

[edit] Row striping tests

Striping Test with "evenodd = swap"
Above
Group1	List1
Group2	List2
Group3	{{{title}}} Group3.1 List3.1 Group3.2 List3.2 Group4.3 List4.3
Group4	{{{title}}} Group4.1 List4.1 Group4.2 List4.2 Group4.3 List4.3
Group5	List5
Below

Striping Test 2
Above
Group1	List1
Group2	List2
Group3	{{{title}}} Group3.1 {{{title}}} Group3.1.1 Group3.1.1 Group3.1.2 Group3.1.2 Group3.1.3 List3.1.3 Group3.2 {{{title}}} Group3.2.1 Group3.2.1 Group3.2.2 Group3.2.2 Group3.2.3 List3.2.3 Group3.3.1 List3.3.1
Group4	{{{title}}} Group4.1 {{{title}}} Group4.1.1 Group4.1.1 Group4.1.2 Group4.1.2 Group4.1.3 List4.1.3 Group4.2 {{{title}}} Group4.2.1 Group4.2.1 Group4.2.2 Group4.2.2 Group4.2.3 List4.2.3 Group4.3.1 List4.3.1 Group4.4.1 List4.4.1
Below

[edit] Additional tests

Unlimited Groups/Lists test
Above
Group1	List1
Group2	List2
Group3	List3
Group4	List4
Group5	List5
Below

[edit] Using Navbox with columns / Navbox with collapsible sections

Navbox with columns simple test
Col1 Col2 Col3 Col4 Col5 Col6 Col7

Navbox with columns, single header test
Col1Header (span=2) Col3Header Col4Header (span=3) Col7Header Col1 Col2 Col3 Col4 Col5 Col6 Col7

Navbox with columns, multi-level header test
Col1Header Col3Header Col4Header Col7Header Col1Header2 Col2Header2 Col4Header2 Col5Header2 Col6Header2 Col1 Col2 Col3 Col4 Col5 Col6 Col7

Navbox with columns nested in itself
Col1Header Col2Header Col3Header Col4Header Col1.1Header Col1.2Header Col1.1 Col1.2 Col2 Col3.1Header Col3.2Header Col3.3Header Col3.1 Col3.2 Col3.3 Col4

Navbox with collapsible sections (conversion of Template:Scouting)
The Scouting Movement Scouting · Scouting for Boys · Scout method · Scout Law · Scout Promise · Scout Motto · Wood Badge · Age groups in Scouting and Guiding · Cub Scout · Boy Scout · Rover Scout · Brownie · Girl Guiding and Girl Scouting · Ranger (Girl Guide) · Jamboree · Scout Leader · WOSM · WAGGGS · Non-aligned organisations · Scouting controversy and conflict · Scouting in popular culture · List of Scouts · List of highest awards in Scouting
Scouting in the United States Scouting in the United States · Girl Scouts of the USA · GSUSA Local Councils · Girl Scout levels (USA) · Boy Scouts of America · Cub Scouting · Boy Scouting · Varsity Scouting · Venturing BSA · Sea Scouting · Order of the Arrow · BSA Advancement & recognition · Eagle Scout · Notable Eagle Scouts · History of merit badges · History of the BSA · BSA Uniform & insignia · Boy Scout Handbook · BSA Local Councils · BSA membership controversies
Scouting in the United Kingdom The Scout Association · Girlguiding UK · Beaver Scouts · Cub Section (UK) · Venture Scout · Explorer Scouts · Brownie (Girl Guides) · Ranger (Girl Guide) · Rainbow (Girl Guides) · Scout Network · Chief Scout (United Kingdom) · Scout Counties · Scout District · Scout Section (UK) · Scout Activity Centre · Young Leaders
Founders, pioneers, and notable leaders Robert Baden-Powell · Olave Baden-Powell · Agnes Baden-Powell · Daniel Carter Beard · William D. Boyce · Frederick Russell Burnham · George Thomas Coker · David Cossgrove · Olga Drahonowska-Małkowska · Charles Eastman · Arthur Rose Eldred · William Hillcourt · Andrzej Małkowski  · Ernest Thompson Seton · William A. Smith · James E. West · J. S. Wilson
Prominent places Baden-Powell House · Brownsea Island · Edith Macy Conference Center · Foxlease · Gilwell Park · Kandersteg · Our Cabaña · Our Chalet · Pax Hill · Pax Lodge · Philmont · Sangam

Navbox, Navbox with columns, and Navbox with collapsible sections together
The Scouting Movement Scouting · Scouting for Boys · Scout method · Scout Law · Scout Promise · Scout Motto · Wood Badge · Age groups in Scouting and Guiding · Cub Scout · Boy Scout · Rover Scout · Brownie · Girl Guiding and Girl Scouting · Ranger (Girl Guide) · Jamboree · Scout Leader · WOSM · WAGGGS · Non-aligned organisations · Scouting controversy and conflict · Scouting in popular culture · List of Scouts · List of highest awards in Scouting
Former French colonies in Africa and the Indian Ocean Mahgreb Algeria · Morocco (Arguin Island) · Tunisia French West Africa Côte d'Ivoire · Dahomey · French Sudan · Guinea · Mauritania · Niger · Senegal · Upper Volta   French Togoland · James Island French Equatorial Africa Chad · Gabon · Middle Congo · Oubangui-Chari Comoros Anjouan · Grande Comore · Mohéli
Scouting in the United Kingdom The Scout Association · Girlguiding UK · Beaver Scouts · Cub Section (UK) · Venture Scout · Explorer Scouts · Brownie (Girl Guides) · Ranger (Girl Guide) · Rainbow (Girl Guides) · Scout Network · Chief Scout (United Kingdom) · Scout Counties · Scout District · Scout Section (UK) · Scout Activity Centre · Young Leaders
Navbox with columns nested in itself Col1Header Col2Header Col3Header Col4Header Col1.1Header Col1.2Header Col1.1 Col1.2 Col2 Col3.1Header Col3.2Header Col3.3Header Col3.1 Col3.2 Col3.3 Col4

[edit] Tests of actual Navboxes

• Even more tests can be found at the following locations. These templates are actual instances of Navbox, where the template code has been substituted and the Navbox call has been replaced by a call to User:CapitalR/Navbox.
  • User:CapitalR/Test1
  • User:CapitalR/Test2
  • User:CapitalR/Test3