move <header> and <nav> tag into nav.tpl. add notification popup items template

1 files changed, 29 insertions, 24 deletions

diff --git a/view/nav.tpl b/view/nav.tpl
index 3a458b193..454d7ebd0 100644
--- a/view/nav.tpl
+++ b/view/nav.tpl
@@ -1,59 +1,64 @@
-{# $langselector #}
-
-<div id="site-location">$sitelocation</div>
-
-
-<div id="nav">
-	<div id="nav-user-menu-wrapper">
-		<div class="left nav-menu-icon"><a href="#" rel="#nav-user-menu" title="$sitelocation"><img src="http://localhost/~fabio/friendika/photo/profile/4.jpg"></a>
+<header>
+	{# $langselector #}
+
+	<div id="site-location">$sitelocation</div>
+</header>
+<nav>
+	<ul>
+		<li id="nav-user-link" class="nav-menu-icon"><a href="#" rel="#nav-user-menu" title="$sitelocation"><img src="http://localhost/~fabio/friendika/photo/52728a08b979618a787e43664bfbae98-6.jpg" alt="User"></a>
 			<ul id="nav-user-menu" class="menu-popup">
 				<li><a href="profile">Profile</a></li>
 				<li><a href="photos">Photos</a></li>
 				{{ if $nav.notifications }}<li><a class="$nav.notifications.2" href="$nav.notifications.0" title="$nav.notifications.3" >$nav.notifications.1</a></li>{{ endif }}
 				{{ if $nav.messages }}<li><a class="$nav.messages.2" href="$nav.messages.0" title="$nav.messages.3" >$nav.messages.1</a></li>{{ endif }}
 			</ul>
-		</div>
+		</li>
 		
 		{{ if $nav.community }}
-			<div id="nav-community-link" class="left nav-menu">
+			<li id="nav-community-link" class="nav-menu">
 				<a class="$nav.community.2" href="$nav.community.0" title="$nav.community.3" >$nav.community.1</a>
-			</div>
+			</li>
 		{{ endif }}
 		
 		{{ if $nav.network }}
-			<div id="nav-network-link" class="left nav-menu">
+			<li id="nav-network-link" class="nav-menu">
 				<a class="$nav.network.2" href="$nav.network.0" title="$nav.network.3" >$nav.network.1</a>
-				<span id="net-update" class="nav-notify">12</span>
-			</div>
+				<span id="net-update" class="nav-notify"></span>
+			</li>
 		{{ endif }}
 		{{ if $nav.network }}
-			<div id="nav-home-link" class="left nav-menu selected">
+			<li id="nav-home-link" class="nav-menu">
 				<a class="$nav.home.2" href="$nav.home.0" title="$nav.home.3" >$nav.home.1</a>
-				<span id="home-update" class="nav-notify">2</span>
-			</div>
+				<span id="home-update" class="nav-notify"></span>
+			</li>
 		{{ endif }}
 		
 		{{ if $nav.notifications }}
-			<div class="left nav-menu-icon"><a href="#" rel="#nav-notifications-menu" title=""><span class="icon s22 notify_off"></span></a>
+			<li  id="nav-notifications-link" class="nav-menu-icon"><a href="#" rel="#nav-notifications-menu" title="$nav.notifications.1"><span class="icon s22 notify">$nav.notifications.1</span></a>
+				<span id="notify-update" class="nav-notify"></span>
 				<ul id="nav-notifications-menu" class="menu-popup">
 				</ul>
-			</div>		
+			</li>		
 		{{ endif }}
+		<ul id="nav-notifications-template" style="display:none;" rel="template">
+			<li><a href="{0}"><img src="{1}">{2} <span class="notif-when">{3}</span></a></li>
+		</ul>
+
 		
 		
 		
-		<div class="right nav-menu-icon"><a href="#" rel="#nav-site-menu"><img src="http://localhost/~fabio/friendika/images/icons/gear_22.png"></a>
-			<ul id="nav-site-menu" class="menu-popup" ">
+		<li id="nav-site-link" class="nav-menu-icon"><a href="#" rel="#nav-site-menu"><span class="icon s22 gear">Site</span></a>
+			<ul id="nav-site-menu" class="menu-popup">
 				{{ if $nav.settings }}<li><a class="$nav.settings.2" href="$nav.settings.0" title="$nav.settings.3">$nav.settings.1</a></li>{{ endif }}
 				{{ if $nav.admin }}<li><a class="$nav.admin.2" href="$nav.admin.0" title="$nav.admin.3" >$nav.admin.1</a></li>{{ endif }}
 
 				{{ if $nav.logout }}<li><a class="menu-sep $nav.logout.2" href="$nav.logout.0" title="$nav.logout.3" >$nav.logout.1</a></li>{{ endif }}
 				{{ if $nav.login }}<li><a class="$nav.login.2" href="$nav.login.0" title="$nav.login.3" >$nav.login.1</a><li>{{ endif }}
 			</ul>		
-		</div>
-	</div>
+		</li>
+	</ul>
 
-</div>
+</nav>
 
 
 {#