Add frame based navigation

19 files changed, 111 insertions, 84 deletions

diff --git a/templates/about.tmpl b/templates/about.tmpl
index b3c9a49..d4761de 100644
--- a/templates/about.tmpl
+++ b/templates/about.tmpl
@@ -1,6 +1,5 @@
 {{with .Data}}
-{{template "header.tmpl" (WithContext .HeaderData $.Ctx)}}
-{{template "navigation.tmpl" (WithContext .NavbarData $.Ctx)}}
+{{template "header.tmpl" (WithContext .CommonData $.Ctx)}}
 <div class="page-title"> About </div>
 
 <div>
diff --git a/templates/emoji.tmpl b/templates/emoji.tmpl
index 2066afa..3e9f0f0 100644
--- a/templates/emoji.tmpl
+++ b/templates/emoji.tmpl
@@ -1,6 +1,5 @@
 {{with .Data}}
-{{template "header.tmpl" (WithContext .HeaderData $.Ctx)}}
-{{template "navigation.tmpl" (WithContext .NavbarData $.Ctx)}}
+{{template "header.tmpl" (WithContext .CommonData $.Ctx)}}
 <div class="page-title"> Emojis </div>
 
 <div class="emoji-list-container">
diff --git a/templates/error.tmpl b/templates/error.tmpl
index 0d6115a..fc925ca 100644
--- a/templates/error.tmpl
+++ b/templates/error.tmpl
@@ -1,11 +1,11 @@
 {{with .Data}}
-{{template "header.tmpl" (WithContext .HeaderData $.Ctx)}}
+{{template "header.tmpl" (WithContext .CommonData $.Ctx)}}
 <div class="page-title"> Error </div>
 
 <div class="error-text"> {{.Error}} </div>
 <div>
 	<a href="/timeline/home">Home</a>
-	<a href="/signin">Sign In</a>
+	<a href="/signin" target="_top">Sign In</a>
 </div>
 
 {{template "footer.tmpl"}}
diff --git a/templates/header.tmpl b/templates/header.tmpl
index 2889ead..76831f2 100644
--- a/templates/header.tmpl
+++ b/templates/header.tmpl
@@ -7,7 +7,10 @@
 	{{if .CSRFToken}}
 	<meta name="csrf_token" content="{{.CSRFToken}}">
 	{{end}}
-	<title>{{if gt .NotificationCount 0}}({{.NotificationCount}}) {{end}}{{.Title}}</title>
+	{{if .AutoRefresh}}
+	<meta http-equiv="refresh" content="30">
+	{{end}}
+	<title>{{.Title}}</title>
 	<link rel="stylesheet" href="/static/style.css">
 	{{if .CustomCSS}}
 	<link rel="stylesheet" href="{{.CustomCSS}}">
diff --git a/templates/likedby.tmpl b/templates/likedby.tmpl
index 00857c1..222254c 100644
--- a/templates/likedby.tmpl
+++ b/templates/likedby.tmpl
@@ -1,6 +1,5 @@
 {{with .Data}}
-{{template "header.tmpl" (WithContext .HeaderData $.Ctx)}}
-{{template "navigation.tmpl" (WithContext .NavbarData $.Ctx)}}
+{{template "header.tmpl" (WithContext .CommonData $.Ctx)}}
 <div class="page-title"> Liked By </div>
 
 {{template "userlist.tmpl" (WithContext .Users $.Ctx)}}
diff --git a/templates/nav.tmpl b/templates/nav.tmpl
new file mode 100644
index 0000000..620643e
--- /dev/null
+++ b/templates/nav.tmpl
@@ -0,0 +1,34 @@
+{{with .Data}}
+{{template "header.tmpl" (WithContext .CommonData $.Ctx)}}
+<div class="user-info">
+	<div class="user-info-img-container">
+		<a class="img-link" href="/timeline/home" title="home" target="main">
+			<img class="user-info-img" src="{{.User.AvatarStatic}}" alt="profile-avatar" />
+		</a>
+	</div>
+	<div class="user-info-details-container">
+		<div>
+			<span class="status-dname"> {{EmojiFilter .User.DisplayName .User.Emojis}} </span>  
+			<a class="nav-link" href="/user/{{.User.ID}}" target="main">
+				<span class="status-uname"> {{.User.Acct}} </span>
+			</a>
+		</div>
+		<div>
+			<a class="nav-link" href="/timeline/home" target="main">home</a>
+			<a class="nav-link" href="/timeline/direct" target="main">direct</a>
+			<a class="nav-link" href="/timeline/local" target="main">local</a>
+			<a class="nav-link" href="/timeline/twkn" target="main">twkn</a>
+			<a class="nav-link" href="/search" target="main">search</a>
+			<a class="nav-link" href="/about" target="main">about</a>
+		</div>
+		<div>
+			<a class="nav-link" href="/settings" target="_top">settings</a>
+			<a class="nav-link" href="/signout" target="_top">sign out</a>
+		</div>
+	</div>
+</div>
+
+{{template "postform.tmpl" (WithContext .PostContext $.Ctx)}}
+
+{{template "footer.tmpl"}}
+{{end}}
diff --git a/templates/navigation.tmpl b/templates/navigation.tmpl
deleted file mode 100644
index a85f9fd..0000000
--- a/templates/navigation.tmpl
+++ /dev/null
@@ -1,30 +0,0 @@
-{{with .Data}}
-<div class="user-info">
-	<div class="user-info-img-container">
-		<a class="img-link" href="/timeline/home" title="home">
-			<img class="user-info-img" src="{{.User.AvatarStatic}}" alt="profile-avatar" />
-		</a>
-	</div>
-	<div class="user-info-details-container">
-		<div>
-			<span class="status-dname"> {{EmojiFilter .User.DisplayName .User.Emojis}} </span>  
-			<a class="nav-link" href="/user/{{.User.ID}}">
-				<span class="status-uname"> {{.User.Acct}} </span>
-			</a>
-		</div>
-		<div>
-			<a class="nav-link" href="/timeline/home">home</a>
-			<a class="nav-link" href="/notifications">notifications{{if gt .NotificationCount 0}}({{.NotificationCount}}){{end}}</a>
-			<a class="nav-link" href="/timeline/direct">direct</a>
-			<a class="nav-link" href="/timeline/local">local</a>
-			<a class="nav-link" href="/timeline/twkn">twkn</a>
-			<a class="nav-link" href="/search">search</a>
-			<a class="nav-link" href="/about">about</a>
-		</div>
-		<div>
-			<a class="nav-link" href="/settings">settings</a>
-			<a class="nav-link" href="/signout">sign out</a>
-		</div>
-	</div>
-</div>
-{{end}}
diff --git a/templates/notification.tmpl b/templates/notification.tmpl
index 51cc6e3..9e1854c 100644
--- a/templates/notification.tmpl
+++ b/templates/notification.tmpl
@@ -1,14 +1,25 @@
 {{with .Data}}
-{{template "header.tmpl" (WithContext .HeaderData $.Ctx)}}
-{{template "navigation.tmpl" (WithContext .NavbarData $.Ctx)}}
-<div class="page-title"> Notifications </div>
+{{template "header.tmpl" (WithContext .CommonData $.Ctx)}}
+<div class="notification-title-container">
+	<div class="notification-title">
+		Notifications
+		{{if gt .UnreadCount 0}}({{.UnreadCount }}){{end}}
+	</div>
+	<a class="notification-refresh" href="/notifications">refresh</a>
+	{{if .ReadID}}
+	<form action="/notifications/read?max_id={{.ReadID}}" method="post">
+		<input type="hidden" name="csrf_token" value="{{$.Ctx.CSRFToken}}">
+		<input type="submit" value="read" class="btn-link">
+	</form>
+	{{end}}
+</div>
 
 {{range .Notifications}}
 <div class="notification-container {{if .Pleroma}}{{if not .Pleroma.IsSeen}}unread{{end}}{{end}}">
 	{{if eq .Type "follow"}}
 	<div class="notification-follow-container">
 		<div class="status-profile-img-container">
-			<a class="img-link" href="/user/{{.Account.ID}}" >
+			<a class="img-link" href="/user/{{.Account.ID}}" target="main" >
 				<img class="status-profile-img" src="{{.Account.AvatarStatic}}" alt="profile-avatar" />
 			</a>
 		</div>
@@ -31,7 +42,7 @@
 
 	{{else if eq .Type "reblog"}}
 	<div class="retweet-info">
-		<a class="img-link" href="/user/{{.Account.ID}}">
+		<a class="img-link" href="/user/{{.Account.ID}}" target="main">
 			<img class="status-profile-img" src="{{.Account.AvatarStatic}}" alt="avatar" />
 		</a>
 		<span class="status-dname"> {{EmojiFilter .Account.DisplayName .Account.Emojis}} </span>  
@@ -44,7 +55,7 @@
 
 	{{else if eq .Type "favourite"}}
 	<div class="retweet-info">
-		<a class="img-link" href="/user/{{.Account.ID}}">
+		<a class="img-link" href="/user/{{.Account.ID}}" target="main">
 			<img class="status-profile-img" src="{{.Account.AvatarStatic}}" alt="avatar" />
 		</a>
 		<span class="status-dname"> {{EmojiFilter .Account.DisplayName .Account.Emojis}} </span>  
diff --git a/templates/postform.tmpl b/templates/postform.tmpl
index 51ac5e6..d5c1fb9 100644
--- a/templates/postform.tmpl
+++ b/templates/postform.tmpl
@@ -11,7 +11,7 @@
 		emoji list
 	</a>
 	<div class="post-form-content-container">
-		<textarea id="post-content" name="content" class="post-content" cols="50" rows="5">{{if .ReplyContext}}{{.ReplyContext.ReplyContent}}{{end}}</textarea>
+		<textarea id="post-content" name="content" class="post-content" cols="34" rows="5">{{if .ReplyContext}}{{.ReplyContext.ReplyContent}}{{end}}</textarea>
 	</div>
 	<div>
 		{{if gt (len .Formats) 0}}
diff --git a/templates/retweetedby.tmpl b/templates/retweetedby.tmpl
index ce0d337..9492ee6 100644
--- a/templates/retweetedby.tmpl
+++ b/templates/retweetedby.tmpl
@@ -1,6 +1,5 @@
 {{with .Data}}
-{{template "header.tmpl" (WithContext .HeaderData $.Ctx)}}
-{{template "navigation.tmpl" (WithContext .NavbarData $.Ctx)}}
+{{template "header.tmpl" (WithContext .CommonData $.Ctx)}}
 <div class="page-title"> Retweeted By </div>
 
 {{template "userlist.tmpl" (WithContext .Users $.Ctx)}}
diff --git a/templates/root.tmpl b/templates/root.tmpl
new file mode 100644
index 0000000..cd33139
--- /dev/null
+++ b/templates/root.tmpl
@@ -0,0 +1,17 @@
+{{with .Data}}
+<!DOCTYPE html>
+<html lang="en">
+<head>
+	<meta charset='utf-8'>
+	<meta content='width=device-width, initial-scale=1' name='viewport'>
+	<title>{{.Title}}</title>
+</head>
+<frameset cols="30%,*">
+	<frameset rows="316px,*">
+		<frame name="nav" class="nav-frame" src="/nav" /> 
+		<frame name="notification" class="notification-frame" src="/notifications" /> 
+	</frameset>
+	<frame name="main" class="main-frame" src="/timeline/home" /> 
+</frameset>
+</html>
+{{end}}
diff --git a/templates/search.tmpl b/templates/search.tmpl
index 96548b5..ede147e 100644
--- a/templates/search.tmpl
+++ b/templates/search.tmpl
@@ -1,6 +1,5 @@
 {{with .Data}}
-{{template "header.tmpl" (WithContext .HeaderData $.Ctx)}}
-{{template "navigation.tmpl" (WithContext .NavbarData $.Ctx)}}
+{{template "header.tmpl" (WithContext .CommonData $.Ctx)}}
 <div class="page-title"> Search </div>
 
 <form class="search-form" action="/search" method="GET">
diff --git a/templates/settings.tmpl b/templates/settings.tmpl
index e7d49e9..d8ede87 100644
--- a/templates/settings.tmpl
+++ b/templates/settings.tmpl
@@ -1,6 +1,5 @@
 {{with .Data}}
-{{template "header.tmpl" (WithContext .HeaderData $.Ctx)}}
-{{template "navigation.tmpl" (WithContext .NavbarData $.Ctx)}}
+{{template "header.tmpl" (WithContext .CommonData $.Ctx)}}
 <div class="page-title"> Settings </div>
 
 <form id="settings-form" action="/settings" method="POST">
@@ -24,11 +23,15 @@
 	</div>
 	<div class="settings-form-field">
 		<input id="mask-nsfw" name="mask_nsfw" type="checkbox" value="true" {{if .Settings.MaskNSFW}}checked{{end}}>
-		<label for="mask-nsfw"> Mask NSFW Attachments </label>
+		<label for="mask-nsfw"> Mask NSFW attachments </label>
+	</div>
+	<div class="settings-form-field">
+		<input id="auto-refresh-notifications" name="auto_refresh_notifications" type="checkbox" value="true" {{if .Settings.AutoRefreshNotifications}}checked{{end}}>
+		<label for="auto-refresh-notifications"> Auto refresh notifications </label>
 	</div>
 	<div class="settings-form-field">
 		<input id="fluoride-mode" name="fluoride_mode" type="checkbox" value="true" {{if .Settings.FluorideMode}}checked{{end}}>
-		<label for="fluoride-mode"> Enable Fluoride Mode </label>
+		<label for="fluoride-mode"> Enable fluoride mode </label>
 	</div>
 	<div class="settings-form-field">
 		<input id="dark-mode" name="dark_mode" type="checkbox" value="true" {{if .Settings.DarkMode}}checked{{end}}>
diff --git a/templates/signin.tmpl b/templates/signin.tmpl
index a199948..069572b 100644
--- a/templates/signin.tmpl
+++ b/templates/signin.tmpl
@@ -1,5 +1,5 @@
 {{with .Data}}
-{{template "header.tmpl" (WithContext .HeaderData $.Ctx)}}
+{{template "header.tmpl" (WithContext .CommonData $.Ctx)}}
 <div class="page-title"> Signin </div>
 
 <form class="signin-form" action="/signin" method="post">
diff --git a/templates/status.tmpl b/templates/status.tmpl
index 95dee20..c4f2e5f 100644
--- a/templates/status.tmpl
+++ b/templates/status.tmpl
@@ -2,7 +2,7 @@
 <div id="status-{{.ID}}" class="status-container-container">
 	{{if .Reblog}}
 	<div class="retweet-info">
-		<a class="img-link" href="/user/{{.Account.ID}}">
+		<a class="img-link" href="/user/{{.Account.ID}}" target="main">
 			<img class="status-profile-img" src="{{.Account.AvatarStatic}}" alt="avatar" />
 		</a>
 		<span class="status-dname"> {{EmojiFilter .Account.DisplayName .Account.Emojis}} </span>  
@@ -14,39 +14,39 @@
 	{{with $s := .Data}}
 	<div class="status-container status-{{.ID}}" data-id="{{.ID}}">
 		<div class="status-profile-img-container">
-			<a class="img-link" href="/user/{{.Account.ID}}">
+			<a class="img-link" href="/user/{{.Account.ID}}" target="main">
 				<img class="status-profile-img" src="{{.Account.AvatarStatic}}" alt="avatar" />
 			</a>
 		</div>
 		<div class="status"> 
 			<div class="status-name">
 				<span class="status-dname"> {{EmojiFilter .Account.DisplayName .Account.Emojis}} </span> 
-				<a href="/user/{{.Account.ID}}" >
+				<a href="/user/{{.Account.ID}}"  target="main">
 					<span class="status-uname"> {{.Account.Acct}} </span>
 				</a>
-				<div class="more-container" title="more">
+				<div class="more-container">
 					<div class="remote-link">
 						{{.Visibility}}
 					</div>
 					<div class="more-content">
-						<a class="more-link" href="{{.URL}}" target="_blank" title="source">
+						<a class="more-link" href="{{.URL}}" target="_blank">
 							source
 						</a>
 						{{if .Muted}}
 						<form action="/unmuteconv/{{.ID}}" method="post">
 							<input type="hidden" name="csrf_token" value="{{$.Ctx.CSRFToken}}">
-							<input type="submit" value="unmute" class="btn-link more-link" title="unmute">
+							<input type="submit" value="unmute" class="btn-link more-link">
 						</form>
 						{{else}}
 						<form action="/muteconv/{{.ID}}" method="post">
 							<input type="hidden" name="csrf_token" value="{{$.Ctx.CSRFToken}}">
-							<input type="submit" value="mute" class="btn-link more-link" title="mute">
+							<input type="submit" value="mute" class="btn-link more-link">
 						</form>
 						{{end}}
 						{{if eq $.Ctx.UserID .Account.ID}}
 						<form action="/delete/{{.ID}}" method="post">
 							<input type="hidden" name="csrf_token" value="{{$.Ctx.CSRFToken}}">
-							<input type="submit" value="delete" class="btn-link more-link" title="delete">
+							<input type="submit" value="delete" class="btn-link more-link">
 						</form>
 						{{end}}
 					</div>
@@ -55,7 +55,7 @@
 			<div class="status-reply-container">
 				{{if .InReplyToID}}
 				<div class="status-reply-to">
-					<a class="status-reply-to-link" href="{{if not .ShowReplies}}/thread/{{.InReplyToID}}{{end}}#status-{{.InReplyToID}}"> 
+					<a class="status-reply-to-link" href="{{if not .ShowReplies}}/thread/{{.InReplyToID}}{{end}}#status-{{.InReplyToID}}" target="main"> 
 						 reply to {{.Pleroma.InReplyToAccountAcct}} 
 					</a>
 				</div>
@@ -139,16 +139,16 @@
 			{{end}}
 			<div class="status-action-container"> 
 				<div class="status-action">
-					<a href="/thread/{{.ID}}?reply=true#status-{{.ID}}" title="reply"> 
+					<a href="/thread/{{.ID}}?reply=true#status-{{.ID}}" target="main"> 
 						reply
 					</a>
-					<a class="status-reply-count" href="/thread/{{.ID}}#status-{{.ID}}" {{if $.Ctx.ThreadInNewTab}}target="_blank"{{end}}>
+					<a class="status-reply-count" href="/thread/{{.ID}}#status-{{.ID}}" target="{{if $.Ctx.ThreadInNewTab}}_blank{{else}}main{{end}}">
 						{{if .RepliesCount}} ({{DisplayInteractionCount .RepliesCount}}) {{end}}
 					</a>
 				</div>
 				<div class="status-action">
 					{{if or (eq .Visibility "private") (eq .Visibility "direct")}}
-					<a class="status-retweet" title="this status cannot be retweeted"> 
+					<a class="status-retweet" href="" title="this status cannot be retweeted" target="main"> 
 						retweet
 					</a>
 					{{else}}
@@ -156,17 +156,17 @@
 					<form class="status-retweet" data-action="unretweet" action="/unretweet/{{.ID}}" method="post">
 						<input type="hidden" name="csrf_token" value="{{$.Ctx.CSRFToken}}">
 						<input type="hidden" name="retweeted_by_id" value="{{.RetweetedByID}}">
-						<input type="submit" value="unretweet" class="btn-link" title="unretweet">
+						<input type="submit" value="unretweet" class="btn-link">
 					</form>
 					{{else}}
 					<form class="status-retweet" data-action="retweet" action="/retweet/{{.ID}}" method="post">
 						<input type="hidden" name="csrf_token" value="{{$.Ctx.CSRFToken}}">
 						<input type="hidden" name="retweeted_by_id" value="{{.RetweetedByID}}">
-						<input type="submit" value="retweet" class="btn-link" title="retweet">
+						<input type="submit" value="retweet" class="btn-link">
 					</form>
 					{{end}}
 					{{end}}
-					<a class="status-retweet-count" href="/retweetedby/{{.ID}}" title="click to see the the list"> 
+					<a class="status-retweet-count" href="/retweetedby/{{.ID}}" title="click to see the the list" target="main"> 
 						{{if .ReblogsCount}} ({{DisplayInteractionCount .ReblogsCount}}) {{end}}
 					</a>
 				</div>
@@ -175,22 +175,22 @@
 					<form class="status-like" data-action="unlike" action="/unlike/{{.ID}}" method="post">
 						<input type="hidden" name="csrf_token" value="{{$.Ctx.CSRFToken}}">
 						<input type="hidden" name="retweeted_by_id" value="{{.RetweetedByID}}">
-						<input type="submit" value="unlike" class="btn-link" title="unlike">
+						<input type="submit" value="unlike" class="btn-link">
 					</form>
 					{{else}}
 					<form class="status-like" data-action="like" action="/like/{{.ID}}" method="post">
 						<input type="hidden" name="csrf_token" value="{{$.Ctx.CSRFToken}}">
 						<input type="hidden" name="retweeted_by_id" value="{{.RetweetedByID}}">
-						<input type="submit" value="like" class="btn-link" title="like">
+						<input type="submit" value="like" class="btn-link">
 					</form>
 					{{end}}
-					<a class="status-like-count" href="/likedby/{{.ID}}" title="click to see the the list"> 
+					<a class="status-like-count" href="/likedby/{{.ID}}" title="click to see the the list" target="main"> 
 						{{if .FavouritesCount}} ({{DisplayInteractionCount .FavouritesCount}}) {{end}}
 					</a>
 				</div>
 				<div class="status-action">
 					<a class="status-time" href="{{if not .ShowReplies}}/thread/{{.ID}}{{end}}#status-{{.ID}}" 
-						{{if $.Ctx.ThreadInNewTab}}target="_blank"{{end}}> 
+						target="{{if $.Ctx.ThreadInNewTab}}_blank{{else}}main{{end}}"> 
 						<time datetime="{{FormatTimeRFC3339 .CreatedAt}}" title="{{FormatTimeRFC822 .CreatedAt}}"> 
 							{{TimeSince .CreatedAt}}
 						</time> 
diff --git a/templates/thread.tmpl b/templates/thread.tmpl
index 2927ee4..8cf9ead 100644
--- a/templates/thread.tmpl
+++ b/templates/thread.tmpl
@@ -1,6 +1,5 @@
 {{with $s := .Data}}
-{{template "header.tmpl" (WithContext .HeaderData $.Ctx)}}
-{{template "navigation.tmpl" (WithContext .NavbarData $.Ctx)}}
+{{template "header.tmpl" (WithContext .CommonData $.Ctx)}}
 <div class="page-title"> Thread </div>
 
 {{range .Statuses}}
diff --git a/templates/timeline.tmpl b/templates/timeline.tmpl
index 0321c7f..82b624d 100644
--- a/templates/timeline.tmpl
+++ b/templates/timeline.tmpl
@@ -1,10 +1,7 @@
 {{with .Data}}
-{{template "header.tmpl" (WithContext .HeaderData $.Ctx)}}
-{{template "navigation.tmpl" (WithContext .NavbarData $.Ctx)}}
+{{template "header.tmpl" (WithContext .CommonData $.Ctx)}}
 <div class="page-title"> {{.Title}} </div>
 
-{{template "postform.tmpl" (WithContext .PostContext $.Ctx)}}
-
 {{range .Statuses}}
 {{template "status.tmpl" (WithContext . $.Ctx)}}
 {{end}}
diff --git a/templates/user.tmpl b/templates/user.tmpl
index de2b5c4..6ea79f7 100644
--- a/templates/user.tmpl
+++ b/templates/user.tmpl
@@ -1,6 +1,5 @@
 {{with .Data}}
-{{template "header.tmpl" (WithContext .HeaderData $.Ctx)}}
-{{template "navigation.tmpl" (WithContext .NavbarData $.Ctx)}}
+{{template "header.tmpl" (WithContext .CommonData $.Ctx)}}
 <div class="page-title"> User </div>
 
 <div class="user-info-container">
diff --git a/templates/usersearch.tmpl b/templates/usersearch.tmpl
index 8e19fd1..ca99b4c 100644
--- a/templates/usersearch.tmpl
+++ b/templates/usersearch.tmpl
@@ -1,6 +1,5 @@
 {{with .Data}}
-{{template "header.tmpl" (WithContext .HeaderData $.Ctx)}}
-{{template "navigation.tmpl" (WithContext .NavbarData $.Ctx)}}
+{{template "header.tmpl" (WithContext .CommonData $.Ctx)}}
 <div class="page-title"> Search {{EmojiFilter .User.DisplayName .User.Emojis}}'s statuses </div>
 
 <form class="search-form" action="/usersearch/{{.User.ID}}" method="GET">