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.google.gwt.user.client.ui.Widget; 024 025//@formatter:off 026/** 027 * A {@link Navbar} that hides the contents of a {@link NavCollapse} whenever 028 * the width of the window is too small. 029 * <p> 030 * Only works when the Responsive Layout ist turned on. Create your own 031 * {@link Configurator} and let {@link Configurator#hasResponsiveDesign() 032 * hasResponsiveDesign()} return <code>true</code>. 033 * 034 * <p> 035 * <h3>UiBinder Usage:</h3> 036 * 037 * <pre> 038 * {@code 039 * <g:FlowPanel> 040 * <b:ResponsiveNavbar> 041 * <b:Brand>Bootstrap</b:Brand> 042 * <b:NavCollapse> 043 * <b:Nav> 044 * <b:NavLink>Link 1</b:NavLink> 045 * <b:NavLink>Link 2</b:NavLink> 046 * </b:Nav> 047 * <b:NavForm size="1" /> 048 * <b:Nav alignment="RIGHT"> 049 * <b:NavLink>Link 3</b:NavLink> 050 * </b:Nav> 051 * </b:NavCollapse> 052 * </b:ResponsiveNavbar> 053 * <b:Container> 054 * [...] 055 * </b:Container> 056 * </g:FlowPanel> 057 * } 058 * </pre> 059 * </p> 060 * 061 * @since 2.0.4.0 062 * 063 * @author Dominik Mayer 064 * @author Carlos Alexandro Becker 065 * 066 * @see <a href="http://getbootstrap.com/2.3.2/components.html#navbar">Bootstrap documentation</a> 067 */ 068//@formatter:on 069public class ResponsiveNavbar extends Navbar { 070 071 private final NavbarButton collapseButton = new NavbarButton(); 072 private final DivWidget navCollapse = new DivWidget(Constants.NAV_COLLAPSE); 073 074 /** 075 * Creates an empty widget. 076 */ 077 public ResponsiveNavbar() { 078 super(); 079 addCollapseButton(); 080 } 081 082 private void addCollapseButton() { 083 collapseButton.getElement().setAttribute(Constants.DATA_TOGGLE, 084 Constants.COLLAPSE); 085 collapseButton.getElement().setAttribute(Constants.DATA_TARGET, 086 Constants.NAV_COLLAPSE_TARGET); 087 collapseButton.add(new Icon(IconType.BAR)); 088 collapseButton.add(new Icon(IconType.BAR)); 089 collapseButton.add(new Icon(IconType.BAR)); 090 add(collapseButton); 091 } 092 093 /** 094 * {@inheritDoc} 095 */ 096 @Override 097 public void add(Widget child) { 098 if (child instanceof Nav) { 099 // without this, the order of elements in navbar will bug. 100 if (!getChildren().contains(navCollapse)) 101 super.add(navCollapse); 102 navCollapse.add(child); 103 } else 104 super.add(child); 105 } 106 107 /** 108 * {@inheritDoc} 109 */ 110 @Override 111 protected Container getContainer() { 112 return new FluidContainer(); 113 } 114}