From d2471592d23f592dfa484bc6e49ad73bc060bda6 Mon Sep 17 00:00:00 2001
From: Maximilian Hils <git@maximilianhils.com>
Date: Mon, 22 Dec 2014 23:40:24 +0100
Subject: highlight ui: complicated version

---
 web/src/js/components/flowtable.jsx.js | 19 ++++++++++++++++++-
 1 file changed, 18 insertions(+), 1 deletion(-)

(limited to 'web/src/js/components/flowtable.jsx.js')

diff --git a/web/src/js/components/flowtable.jsx.js b/web/src/js/components/flowtable.jsx.js
index 4b72dd29..00c2d4c1 100644
--- a/web/src/js/components/flowtable.jsx.js
+++ b/web/src/js/components/flowtable.jsx.js
@@ -8,8 +8,25 @@ var FlowRow = React.createClass({
         if (this.props.selected) {
             className += "selected";
         }
+
+        var highlight_count = flow._highlight.length;
+        if (highlight_count > 0) {
+            var background = "linear-gradient(90deg";
+            for(var i =0; i < highlight_count; i++){
+                var tag = flow._highlight[i];
+                var ps = (100 * i / highlight_count) + "%";
+                var pe = (100 * (i + 1) / highlight_count) + "%";
+                background += ("," + tag + " " + ps + "," + tag + " " + pe);
+            }
+            background += ")";
+        }
+
+        style = {
+            background: background
+        };
+
         return (
-            <tr className={className} onClick={this.props.selectFlow.bind(null, flow)}>
+            <tr className={className} onClick={this.props.selectFlow.bind(null, flow)} style={style}>
                 {columns}
             </tr>);
     },
-- 
cgit v1.2.3