Merge pull request #144 from jsperhac/chart-dialog-list-improvements

Load Chart drop-down menu: cosmetic improvements
ubccr · May 18, 2017 · 3ab5059 · 3ab5059
2 parents 58b2bb8 + a049d16
commit 3ab5059
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 4 deletions.
diff --git a/html/gui/css/MetricExplorer.css b/html/gui/css/MetricExplorer.css
@@ -0,0 +1,6 @@
+/* MetricExplorer.css */
+
+.metric-explorer-dirty-chart-record {
+    background: url(/gui/images/exclamation.png) no-repeat 2px 1px;
+    padding-left: 16px;
+}
diff --git a/html/gui/js/modules/metric_explorer/MetricExplorer.js b/html/gui/js/modules/metric_explorer/MetricExplorer.js
@@ -4959,15 +4959,31 @@ Ext.extend(XDMoD.Module.MetricExplorer, XDMoD.PortalModule, {
                 header: 'Chart Name',
                 id: 'name',
                 dataIndex: 'name',
-                editor: new Ext.form.TextField({}),
+                renderer: function (name, metaData/* record, rowIndex, colIndex, store */) {
+                    // if the name is (~arbitrarily) long, place it in a tooltip. This length is relative
+                    // to the width of the GridPanel.
+                    if (name.length > 73) {
+                        /* eslint-disable no-param-reassign */
+                        metaData.attr += 'ext:qtip="' + name + '"';
+                        /* eslint-enable no-param-reassign */
+                    }
+                    return name;
+                },
                 sortable: true
             }, {
                 header: 'Last Modified',
-                width: 180,
+                width: 140,
                 dataIndex: 'ts',
+                align: 'center',
                 renderer: function(ts, metaData, record /*, rowIndex, colIndex, store*/ ) {
-                    var saveText = record.stack && !record.stack.isMarked() ? " - <b>Unsaved</b>" : "";
-                    return Ext.util.Format.date(new Date(ts * 1000).toString(), 'Y-m-d H:i:s') + saveText;
+                    // if unsaved chart record, display icon and tooltip:
+                    if (record.stack && !record.stack.isMarked()) {
+                        /* eslint-disable no-param-reassign */
+                        metaData.css = 'metric-explorer-dirty-chart-record';
+                        metaData.attr += 'ext:qtip="Unsaved Chart"';
+                        /* eslint-enable no-param-reassign */
+                    }
+                    return Ext.util.Format.date(new Date(ts * 1000).toString(), 'Y-m-d H:i:s');
                 },
                 sortable: true
             }], //columns

diff --git a/html/index.php b/html/index.php
@@ -225,6 +225,7 @@ function isReferrer($referrer)
       <script type="text/javascript" src="gui/js/ContainerMask.js"></script>
        <script type="text/javascript" src="gui/js/ContainerBodyMask.js"></script>
 
+      <link rel="stylesheet" type="text/css" href="gui/css/MetricExplorer.css" />
       <link rel="stylesheet" type="text/css" href="gui/css/common.css" />
       <!--[if lte IE 9]>
       <link rel="stylesheet" type="text/css" href="gui/css/common_ie9.css" />