First release version of top10

app/routes.py

@@ -8,6 +8,7 @@ import toml
 from flask import render_template, send_from_directory, request, Response
 from app import app
 
+import km3pipe as kp
 from km3modules.common import LocalDBService
 
 CONFIG_PATH = "pipeline.toml"
@@ -184,20 +185,25 @@ def top10():
             "FROM event_selection ORDER BY {cat} DESC LIMIT 10".format(
                 cat=category))
         if len(raw_data) > 0:
-            print(raw_data)
             top10[category_names[category]] = [{
                 "plot_filename":
                 r[0],
                 "meta": {
-                    "Number of hits (triggered)": "{} ({})".format(r[1], r[2]),
+                    "Hits (triggered)": "{} ({})".format(r[1], r[2]),
                     "Overlays": r[3],
                     "Detector ID": r[4],
                     "Run": r[5],
                     "Frame index": r[6],
                     "Trigger counter": r[7],
-                    "Date": datetime.utcfromtimestamp(r[8]).strftime("%c")
                 },
-                "is_recent": (time.time() - r[8]) < 60 * 60 * 24
+                "is_recent": (time.time() - r[8]) < 60 * 60 * 24,
+                "date":
+                "{} UTC".format(
+                    datetime.utcfromtimestamp(r[8]).strftime("%c")),
+                "irods_path":
+                kp.tools.irods_filepath(r[4], r[5]),
+                "xrootd_path":
+                kp.tools.xrootd_path(r[4], r[5])
             } for r in raw_data]
     return render_template('top10.html', top10=top10)
 

app/static/css/main.css

@@ -37,3 +37,45 @@ img.plot {
 #plot img {
     margin: 0 auto
 }
+
+#top10 h3 {
+    min-width: 180px;
+}
+#top10 h3.rank {
+    font-size: 60px;
+    font-weight: 500;
+    color: #438bd9;
+    border-bottom: 3px dotted #ddd;
+}
+
+#top10 span.recent {
+    font-size: 30px;
+    /* color: red; */
+    font-style: italic;
+    background: #FAAC00;
+    background: -moz-linear-gradient(top, #FAAC00 0%, #FF2685 79%, #CC0A36 100%);
+    background: -webkit-linear-gradient(top, #FAAC00 0%, #FF2685 79%, #CC0A36 100%);
+    background: linear-gradient(to bottom, #FAAC00 0%, #FF2685 79%, #CC0A36 100%);
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+}
+#top10 table {
+    font-size: 12px;
+    min-width: 180px;
+}
+#top10 table td {
+    vertical-align: top
+}
+#top10 table td.meta-key {
+    font-weight: bold;
+}
+#top10 table td.meta-value {
+    text-align: right;
+}
+#top10 h4.date {
+    font-size: 12px;
+}
+#top10 .filepath {
+    color: #999;
+    font-size: 10px;
+}

app/templates/top10.html

@@ -14,6 +14,7 @@
                                 <span class="recent">NEW!</span>
                             {% endif %}
                         </h3>
+                        <h4 class="date">{{ event.date }}</h4>
                         <table class="top10">
                         {% for key, value in event.meta.items() %}
                             <tr>
@@ -34,6 +35,12 @@
                         &nbsp;
                     </div>
                 </div>
+                <div class="row">
+                    <div class="col-md-12" style="vertical-align: middle">
+                        <p class="filepath"><b>iRODS</b>: {{ event.irods_path }}</p>
+                        <p class="filepath"><b>xrootd</b>: {{ event.xrootd_path }}</p>
+                    </div>
+                </div>
             {% endfor %}
         </div>
     {% endfor %}