2 files changed, 43 insertions, 11 deletions

diff --git a/hyperkitty/static/css/hyperkitty-message.css b/hyperkitty/static/css/hyperkitty-message.css
index 3e43e3d..3525aed 100644
--- a/hyperkitty/static/css/hyperkitty-message.css
+++ b/hyperkitty/static/css/hyperkitty-message.css
@@ -88,15 +88,22 @@
     margin-right: 2em;
 }
 
-.favorite a {
+#thread-overview-info form.favorite {
+    margin-bottom: 0;
+}
+#thread-overview-info .favorite a {
     color: rgb(167, 169, 172);
 }
-.favorite a.saved,
-.favorite a.notsaved {
+#thread-overview-info .favorite a.saved,
+#thread-overview-info .favorite a.notsaved {
     /* Will be shown via Javascript */
     display: none;
 }
 
+#thread-overview-info .unread {
+    margin: 0 2px 0 2px;
+}
+
 /* Tags */
 #tags {
     color: rgb(167, 169, 172);
@@ -261,3 +268,23 @@
     border-left: 2px solid rgb(55, 113, 200);
     padding-left: 0.2em;
 }
+
+
+/*
+ * Navigation for unread messages
+ */
+#unreadnavbar {
+    position: fixed;
+    bottom: 0;
+    right: 0;
+    text-align: right;
+    padding-right: 2em;
+    display: none;
+}
+#unreadnavbar div {
+    width: auto;
+    padding: 0.2em 1em;
+    border: 1px solid #888;
+    border-bottom: none;
+    background-color: #eee;
+}
diff --git a/hyperkitty/static/js/hyperkitty.js b/hyperkitty/static/js/hyperkitty.js
index 4b64b91..e43f766 100644
--- a/hyperkitty/static/js/hyperkitty.js
+++ b/hyperkitty/static/js/hyperkitty.js
@@ -263,14 +263,15 @@ function setup_replies(baseElem) {
     }).change();
 }
 
-function setup_navkeys() {
+function setup_unreadnavbar(element) {
+    element = $(element);
+    if (element.length === 0) {
+        return;
+    }
     var current_index;
-    function scroll(e) {
-        var inc;
+    function scroll(inc) {
         var unreads = $(".email.unread");
         if (unreads.length == 0) { return; }
-        if (e.data == "j") { inc = 1; }
-        if (e.data == "k") { inc = -1; }
         if (typeof current_index == "undefined") {
             if (inc == 1) { current_index = -1; }
             if (inc == -1) { current_index = unreads.length; }
@@ -278,14 +279,18 @@ function setup_navkeys() {
         current_index = current_index + inc;
         if (current_index < 0) { current_index = unreads.length - 1; }
         if (current_index >= unreads.length) { current_index = 0; }
+        element.find(".unreadindex").text(current_index + 1);
         // compensate for the fixed banner at the top
         var target = unreads.eq(current_index).offset().top - 70;
-        $("html,body").animate({
+        $("html,body").stop(true, false).animate({
             scrollTop: target
         }, 500);
     }
-    $(document).bind("keydown", "j", scroll);
-    $(document).bind("keydown", "k", scroll);
+    element.find(".nextunread").click(function(e) { e.preventDefault(); scroll(1); });
+    element.find(".prevunread").click(function(e) { e.preventDefault(); scroll(-1); });
+    $(document).bind("keydown", "j", function(e) { scroll(1); });
+    $(document).bind("keydown", "k", function(e) { scroll(-1); });
+    element.animate({height: "show"}, 700);
 }