001/* 002 * Copyright 2012 GWT-Bootstrap 003 * 004 * Licensed under the Apache License, Version 2.0 (the "License"); 005 * you may not use this file except in compliance with the License. 006 * You may obtain a copy of the License at 007 * 008 * http://www.apache.org/licenses/LICENSE-2.0 009 * 010 * Unless required by applicable law or agreed to in writing, software 011 * distributed under the License is distributed on an "AS IS" BASIS, 012 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 013 * See the License for the specific language governing permissions and 014 * limitations under the License. 015 */ 016package com.github.gwtbootstrap.client.ui; 017 018import com.github.gwtbootstrap.client.ui.base.DivWidget; 019import com.github.gwtbootstrap.client.ui.base.NavbarButton; 020import com.github.gwtbootstrap.client.ui.config.Configurator; 021import com.github.gwtbootstrap.client.ui.constants.Constants; 022import com.github.gwtbootstrap.client.ui.constants.IconType; 023import com.github.gwtbootstrap.client.ui.resources.Bootstrap; 024import com.google.gwt.user.client.ui.Widget; 025 026//@formatter:off 027/** 028 * A {@link Navbar} that hides the contents of a {@link NavCollapse} whenever 029 * the width of the window is too small. 030 * <p> 031 * Only works when the Responsive Layout ist turned on. Create your own 032 * {@link Configurator} and let {@link Configurator#hasResponsiveDesign() 033 * hasResponsiveDesign()} return <code>true</code>. 034 * 035 * <p> 036 * <h3>UiBinder Usage:</h3> 037 * 038 * <pre> 039 * {@code 040 * <g:FlowPanel> 041 * <b:ResponsiveNavbar> 042 * <b:Brand>Bootstrap</b:Brand> 043 * <b:NavCollapse> 044 * <b:Nav> 045 * <b:NavLink>Link 1</b:NavLink> 046 * <b:NavLink>Link 2</b:NavLink> 047 * </b:Nav> 048 * <b:NavForm size="1" /> 049 * <b:Nav alignment="RIGHT"> 050 * <b:NavLink>Link 3</b:NavLink> 051 * </b:Nav> 052 * </b:NavCollapse> 053 * </b:ResponsiveNavbar> 054 * <b:Container> 055 * [...] 056 * </b:Container> 057 * </g:FlowPanel> 058 * } 059 * </pre> 060 * </p> 061 * 062 * @since 2.0.4.0 063 * 064 * @author Dominik Mayer 065 * @author Carlos Alexandro Becker 066 * 067 * @see <a href="http://twitter.github.com/bootstrap/components.html#navbar">Bootstrap documentation</a> 068 */ 069//@formatter:on 070public class ResponsiveNavbar extends Navbar { 071 072 private final NavbarButton collapseButton = new NavbarButton(); 073 private final DivWidget navCollapse = new DivWidget("nav-collapse"); 074 075 /** 076 * Creates an empty widget. 077 */ 078 public ResponsiveNavbar() { 079 super(); 080 addCollapseButton(); 081 } 082 083 private void addCollapseButton() { 084 collapseButton.getElement().setAttribute(Constants.DATA_TOGGLE, 085 Bootstrap.collapse); 086 collapseButton.getElement().setAttribute(Bootstrap.data_target, 087 Bootstrap.nav_collapse_target); 088 collapseButton.add(new Icon(IconType.BAR)); 089 collapseButton.add(new Icon(IconType.BAR)); 090 collapseButton.add(new Icon(IconType.BAR)); 091 add(collapseButton); 092 } 093 094 /** 095 * {@inheritDoc} 096 */ 097 @Override 098 public void add(Widget child) { 099 if (child instanceof Nav) { 100 // without this, the order of elements in navbar will bug. 101 if (!getChildren().contains(navCollapse)) 102 super.add(navCollapse); 103 navCollapse.add(child); 104 } else 105 super.add(child); 106 } 107 108 /** 109 * {@inheritDoc} 110 */ 111 @Override 112 protected Container getContainer() { 113 return new FluidContainer(); 114 } 115}