I2PSnark: Add status icons, refine css.

apps/i2psnark/java/src/org/klomp/snark/web/I2PSnarkServlet.java

@@ -243,8 +243,9 @@ public class I2PSnarkServlet extends Default {
         out.write(" title=\"");
         out.write(_("Torrent Status"));
         out.write("\">");
+        out.write(_("Status"));
         if (_manager.util().connected() && !snarks.isEmpty()) {
-            out.write(" &raquo; <a href=\"");
+            out.write("<a href=\"");
             out.write(req.getRequestURI());
             if (peerParam != null) {
                 out.write("\">");
@@ -633,8 +634,8 @@ public class I2PSnarkServlet extends Default {
         return rv;
     }
 
-    private static final int MAX_DISPLAYED_FILENAME_LENGTH = 42;
+    private static final int MAX_DISPLAYED_FILENAME_LENGTH = 44;
-    private static final int MAX_DISPLAYED_ERROR_LENGTH = 40;
+    private static final int MAX_DISPLAYED_ERROR_LENGTH = 6;
     private void displaySnark(PrintWriter out, Snark snark, String uri, int row, long stats[], boolean showPeers, boolean showDebug) throws IOException {
         String filename = snark.torrent;
         File f = new File(filename);
@@ -692,50 +693,57 @@ public class I2PSnarkServlet extends Default {
         String statusString = _("Unknown");
         if (err != null) {
             if (isRunning && curPeers > 0 && !showPeers)
-                statusString = "<a title=\"" + err + "\">" + _("TrackerErr") + "</a> &raquo; " +
+                statusString = "<img border=\"0\" src=\"/themes/snark/ubergine/images/trackererror.png\" title=\"" + _("Tracker Error") +
-                               "<a href=\"" + uri + "?p=" + Base64.encode(snark.meta.getInfoHash()) + "\">" +
+                               "\"><a href=\"" + uri + "?p=" + Base64.encode(snark.meta.getInfoHash()) + "\">" +
                                curPeers + '/' +
                                ngettext("1 peer", "{0} peers", knownPeers) + "</a>";
             else if (isRunning)
-                statusString = "<a title=\"" + err + "\">" + _("TrackerErr") + " &raquo; " + curPeers + '/' +
+                statusString = "<img border=\"0\" src=\"/themes/snark/ubergine/images/trackererror.png\" title=\"" + _("Tracker Error") +
-                               ngettext("1 peer", "{0} peers", knownPeers);
+                               "\">" + curPeers + '/' +
+                               ngettext("1 peer", "{0} peers", knownPeers) + "</a>";
             else {
                 if (err.length() > MAX_DISPLAYED_ERROR_LENGTH)
                     err = err.substring(0, MAX_DISPLAYED_ERROR_LENGTH) + "&hellip;";
-                statusString = _("TrackerErr") + "<br>(" + err + ")";
+                statusString = "<img border=\"0\" src=\"/themes/snark/ubergine/images/trackererror.png\" title=\"" + _("Tracker Error") +
+                "\">" + err + "</a>";
             }
         } else if (remaining <= 0) {
             if (isRunning && curPeers > 0 && !showPeers)
-                statusString = _("Seeding") + " &raquo; " +
+                statusString = "<img border=\"0\" src=\"/themes/snark/ubergine/images/seeding.png\" title=\"" + _("Seeding") + "\">" +
                                "<a href=\"" + uri + "?p=" + Base64.encode(snark.meta.getInfoHash()) + "\">" +
                                curPeers + '/' +
                                ngettext("1 peer", "{0} peers", knownPeers) + "</a>";
             else if (isRunning)
-                statusString = _("Seeding") + " &raquo; " + curPeers + "/" +
+                statusString = "<img border=\"0\" src=\"/themes/snark/ubergine/images/seeding.png\" title=\"" + _("Seeding") + "\">" + 
-                               ngettext("1 peer", "{0} peers", knownPeers);
+                               curPeers + "/" +
+                               ngettext("1 peer", "{0} peers", knownPeers)  + "</a>";
             else
-                statusString = _("Complete");
+                statusString = "<img border=\"0\" src=\"/themes/snark/ubergine/images/complete.png\" title=\"" + _("Complete") + "\">" + _("Not Seeding");
         } else {
             if (isRunning && curPeers > 0 && downBps > 0 && !showPeers)
-                statusString = _("OK") + " &raquo; " +
+                statusString = "<img border=\"0\" src=\"/themes/snark/ubergine/images/downloading.png\" title=\"" + _("Downloading") + "\">" +
                                "<a href=\"" + uri + "?p=" + Base64.encode(snark.meta.getInfoHash()) + "\">" +
                                curPeers + "/" +
                                ngettext("1 peer", "{0} peers", knownPeers) + "</a>";
             else if (isRunning && curPeers > 0 && downBps > 0)
-                statusString = _("OK") + " (" + curPeers + "/" +
+                statusString = "<img border=\"0\" src=\"/themes/snark/ubergine/images/downloading.png\" title=\"" + _("Downloading") + "\">" +
-                               ngettext("1 peer", "{0} peers", knownPeers) + ')';
+  " (" + curPeers + "/" +
+                               ngettext("1 peer", "{0} peers", knownPeers);
             else if (isRunning && curPeers > 0 && !showPeers)
-                statusString = _("Stalled") + " &raquo; " +
+                statusString = "<img border=\"0\" src=\"/themes/snark/ubergine/images/stalled.png\" title=\"" + _("Stalled") + "\">" +
                                "<a href=\"" + uri + "?p=" + Base64.encode(snark.meta.getInfoHash()) + "\">" +
                                curPeers + '/' +
                                ngettext("1 peer", "{0} peers", knownPeers) + "</a>";
             else if (isRunning && curPeers > 0)
-                statusString = _("Stalled") + " &raquo; " + curPeers + '/' +
+                statusString = "<img border=\"0\" src=\"/themes/snark/ubergine/images/stalled.png\" title=\"" + _("Stalled") + "\">" + 
+                               curPeers + '/' +
                                ngettext("1 peer", "{0} peers", knownPeers);
             else if (isRunning)
-                statusString = _("No Peers") + " &raquo; 0/" + knownPeers;
+                statusString = "<img border=\"0\" src=\"/themes/snark/ubergine/images/nopeers.png\" title=\"" + _("No Peers") + "\">" + 
+                               curPeers + "/" +
+                               ngettext("1 peer", "{0} peers", knownPeers);
             else
-                statusString = _("Stopped");
+                statusString = "<img border=\"0\" src=\"/themes/snark/ubergine/images/stopped.png\" title=\"" + _("Stopped") + "\">" + _("Stopped");
         }
         
         String rowClass = (row % 2 == 0 ? "snarkTorrentEven" : "snarkTorrentOdd");
@@ -782,7 +790,7 @@ public class I2PSnarkServlet extends Default {
                 baseURL = baseURL.substring(e + 1);
                 out.write("&nbsp;<a href=\"" + baseURL + "details.php?dllist=1&filelist=1&info_hash=");
                 out.write(TrackerClient.urlencode(snark.meta.getInfoHash()));
-                out.write("\" title=\"" + name + ' ' + _("Tracker") + "\" target=\"_blank\">");
+                out.write("\" title=\"" + name +  _("Tracker") + "\" target=\"_blank\">");
                 out.write("<img border=\"0\" src=\"/themes/snark/ubergine/images/details.png\">");
                 out.write("</a>");
                 break;

installer/resources/themes/snark/ubergine/snark.css

@@ -16,7 +16,7 @@ body {
 .snarkRefresh:link,.snarkRefresh:visited {
      text-decoration: none !important;
      text-transform: uppercase !important;
-     padding: 2px 16px 3px !important;
+     padding: 4px 16px 5px !important;
 	 margin: -5px -7px -5px 0 !important;
      letter-spacing: 0.05em;
      font-weight: bold;
@@ -118,7 +118,7 @@ table {
      padding: 0px;
      border-spacing: 0px;
      border-collapse: collapse;
-	 color: #323 url("/themes/snark/ubergine/images/hat.png");
+	 color: #323;
 	 width: 100%;
 	 opacity: 1 !important;
 }
@@ -141,17 +141,19 @@ thead {
 }
 
 th {
-     padding: 4px 2px 1px 4px;
+     padding: 4px 2px 4px 4px;
      font-size: 9pt;
      border-top: 1px outset #001;
      border-bottom: 1px inset #101;
 	 color: #ddd;
      whitespace: nowrap;
+     font-variant: small-caps !important;
+     letter-spacing: 0.05em;
 }
 
 th:first-child {
      text-align: left !important;
-	 padding-left: 3px;
+	 padding-left: 2px;
 	 max-width: 120px;
 }
 
@@ -161,11 +163,11 @@ tfoot td:first-child {
 }
 
 th:first-child img {
-     margin: 1px 2px 3px 1px;
+     margin: 1px 1px 3px 1px !important;
 }
 
 th:nth-child(2) img {
-     margin: 1px 7px 3px 2px;
+     margin: 1px 7px 3px 2px !important;
 }
 
 tfoot th {
@@ -244,15 +246,37 @@ td:first-child {
 
 .snarkTorrentStatus:first-child {
      text-align: left !important;
-	 font-style: italic;
+     font-style: italic;
-	 padding-left: 8px;
+     padding-left: 0px;
+     min-width: 92px;
+     font-weight: bold;
+     font-size: 7pt !important;
+     color: #dd9 !important;
+}
+
+.snarkTorrentStatus:first-child img {
+     margin-right: 0px !important;
 }
 
 .snarkTorrentRate, .snarkTorrentDownloaded, .snarkTorrentUploaded {
      font-size: 8pt;
      font-weight: bold;
+     padding: 0 3px;
 }
 
+.snarkTorrentDownloaded {
+     color: #76a !important;
+}
+
+.snarkTorrentUploaded {
+     color: #b9b !important;
+}
+
+.snarkTorrentRate {
+     color: #d9d !important;
+}
+
+
 .snarkTorrentOdd {
      background: #656;
      background: #351933;
@@ -325,7 +349,7 @@ td:first-child {
 .page {
      background: #323 url('/themes/snark/ubergine/images/tile2.png');
      color: #310;
-     min-width: 820px !important;
+     min-width: 880px !important;
      margin: 5px 0 0 0;
      padding: 10px 10px 0px 10px;
      -moz-border-radius: 4px;
@@ -447,12 +471,12 @@ textarea {
      -moz-border-radius: 4px;
      -khtml-border-radius: 4px;
      border-radius: 4px;
-	 border: 1px inset #000;
+     border: 1px inset #000;
 }
 
 img {
      border: none;
-     margin: 1px 3px 3px 4px;
+     margin: 0 3px 1px 3px;
      vertical-align: middle;
      opacity: 1.0;
      line-height: 100%;
@@ -460,7 +484,6 @@ img {
 
 img: hover {
      border: none;
-     margin: 5px 5px 0px 5px;
      opacity: 0.5;
      line-height: 100%;
 }
@@ -576,7 +599,7 @@ code {
 }
 .snarknavbar {
      margin: -10px 0 5px 0 !important;
-     padding: 9px 10px 10px;
+     padding: 11px 10px 12px;
      border: 1px solid #101;
      -moz-border-radius: 0 0 8px 8px;
      -khtml-border-radius: 0 0 4px 4px;
@@ -597,7 +620,7 @@ code {
 
  .snarknavbar img {
      border: 0;
-	 margin: 0 -2px 0 -3px;
+     margin: 0 -6px 0 -2px;
      padding: 1px 0 0px !important;
-	 vertical-align: top;
+     vertical-align: top;
 }