From 88d7ef7d368d31182c1a11cc4df20fe8a23df931 Mon Sep 17 00:00:00 2001
From: Mark Schouten <mark@tuxis.nl>
Date: Wed, 11 Mar 2015 12:30:29 +0100
Subject: [PATCH] Change the displayContent() function so that a the zonename
 is a bit faded, so we can see the names of the labels better. Closes #28

---
 css/base.css |  3 +++
 index.php    | 14 +++++++++++---
 2 files changed, 14 insertions(+), 3 deletions(-)

diff --git a/css/base.css b/css/base.css
index 333dd5c..38ef03d 100644
--- a/css/base.css
+++ b/css/base.css
@@ -5,6 +5,9 @@ body, html {
     background:#ffffff;
 }
 
+.lightgrey {
+    opacity: .6;
+}
 #wrap {
 }
 #menu {
diff --git a/index.php b/index.php
index 1570661..7d9f41c 100644
--- a/index.php
+++ b/index.php
@@ -196,9 +196,17 @@ function displayExportIcon(zone) {
     return $img;
 }
 
-function displayContent(fieldName) {
+function displayContent(fieldName, zone) {
     return function(data) {
-        return $('<span>').text(data.record[fieldName]);
+        if (typeof(zone) != 'undefined') {
+            var rexp = new RegExp("(.*)"+zone);
+            var label = rexp.exec(data.record[fieldName]);
+            var lspan = $('<span>').text(label[1]);
+            var zspan = $('<span class="lightgrey">').text(zone);
+            return lspan.add(zspan);
+        } else {
+            return $('<span>').text(data.record[fieldName]);
+        }
     }
 }
 
@@ -545,7 +553,7 @@ $(document).ready(function () {
                                         title: 'Label',
                                         width: '7%',
                                         create: true,
-                                        display: displayContent('name'),
+                                        display: displayContent('name', zone.record.name),
                                         inputClass: 'name',
                                         listClass: 'name'
                                     },