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 */
016 package com.github.gwtbootstrap.client.ui;
017
018 import com.github.gwtbootstrap.client.ui.base.DivWidget;
019 import com.github.gwtbootstrap.client.ui.base.NavbarButton;
020 import com.github.gwtbootstrap.client.ui.config.Configurator;
021 import com.github.gwtbootstrap.client.ui.constants.Constants;
022 import com.github.gwtbootstrap.client.ui.constants.IconType;
023 import com.github.gwtbootstrap.client.ui.resources.Bootstrap;
024 import 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
070 public 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 }