<div class="navbar row-fluid">
  <div class="navbar-inner center">
  	<div class="span3">
  		<img src="./js/themes/goa/img/aoos-logo.png" />
  		<header>Gulf of Alaska <br/> Data Portal</header>
  	</div>
  	<div class="span4">
  		<form id="search" class="navbar-search span12">
  		<div class="input-append span12">
  			<input id="search_txt" class="search-query-input span8" autocomplete="off" data-provide="typeahead" size="16" type="search" value="">
  			<button id="search_btn" type="button" class="btn submit"><i class="icon-search"></i></button>
  			<!--  <button type="button" class="btn clear"><i class="icon-remove"></i></button> -->
  		</div>
  		</form>
  	</div>
  	<div class="span5">
	  	<div class="btn-group">	
			  <a class="btn btn-primary launch_ocean_portal" href="http://data.aoos.org/maps/modular-oikos/?portal_id=8&amp;lg=" target="_blank">
			  	<i class="icon-globe icon-white"></i> Launch Ocean Portal
			 </a>
			  <button class="btn btn-inverse dropdown-toggle" id="layer_count_button" data-toggle="dropdown" style="display: none;"><span id="layer_count"><strong>0</strong></span> layers <span class="caret icon-white"></span></button>
			  <ul class="dropdown-menu" id="queued_layers">
			    <li><p style="padding:20px">Explore data and add to layer queue. Then use Launch Ocean Portal to load all layers in portal.</p></li> 
				<li class="divider"></li> 
			  </ul>	
		</div>
	    <ul class="nav">
	    	<li class="dropdown">
	        	<a class="dropdown-toggle" data-toggle="dropdown">Data Portal</a>
	        	<ul class="dropdown-menu">
	        		<li><a class="show-new-search" href="#data">Search</a></li>
	        		<li><a href="#profile">Summary</a></li>
	        	</ul>
        	</li>
	        
	        <% if (loggedIn) { 
	        	print(
	        	'<li class="dropdown">',
					'<a href="#" class="dropdown-toggle" data-toggle="dropdown">',
						'<i class="icon-user"></i><b class="icon-caret-down"></b>',
					'</a>',
					'<ul class="dropdown-menu">',
						'<li>', formattedName, '</li>',
						'<li class="divider"></li>',  
						'<li><a href="#data/my-data">My packages</a></li>',
						//'<li><a href="#">My account</a></li>',
						'<li class="divider"></li>',
						'<li><a href="#signout">Sign out</a></li>',
					'</ul>',
				'</li>'
	        	);
	        }
	        else{ %>
	        	<li><a href="#share">Sign in</a></li>
	        <% } %>
	        	
	      </ul>
	  </div>
  </div><!-- /.navbar-inner -->
</div><!-- /.navbar -->
