git commit: updated refs/heads/master to 231c4b5

[bf...@apache.org]

Updated Branches:
  refs/heads/master 2f2bb6b31 -> 231c4b5b1


CLOUDSTACK-2716: Truncate long values

For cases such as in global setting values, truncate long text if new
option 'truncate: true' is specified in field properties. This will
reduce td's max-width and add ellipses. Edit field on truncate: true
columns will overflow into action column, to prevent input area from
being too cramped.


Project: http://git-wip-us.apache.org/repos/asf/cloudstack/repo
Commit: http://git-wip-us.apache.org/repos/asf/cloudstack/commit/231c4b5b
Tree: http://git-wip-us.apache.org/repos/asf/cloudstack/tree/231c4b5b
Diff: http://git-wip-us.apache.org/repos/asf/cloudstack/diff/231c4b5b

Branch: refs/heads/master
Commit: 231c4b5b10849edfc06a884bfb8d4f6cc7453536
Parents: 2f2bb6b
Author: Brian Federle <br...@citrix.com>
Authored: Tue Jun 18 15:16:32 2013 -0700
Committer: Brian Federle <br...@citrix.com>
Committed: Tue Jun 18 15:16:35 2013 -0700

----------------------------------------------------------------------
 ui/css/cloudstack3.css            | 19 ++++++++++++++++++-
 ui/scripts/globalSettings.js      |  2 +-
 ui/scripts/ui/widgets/listView.js |  4 ++++
 3 files changed, 23 insertions(+), 2 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/cloudstack/blob/231c4b5b/ui/css/cloudstack3.css
----------------------------------------------------------------------
diff --git a/ui/css/cloudstack3.css b/ui/css/cloudstack3.css
index e145603..7113dbc 100644
--- a/ui/css/cloudstack3.css
+++ b/ui/css/cloudstack3.css
@@ -140,6 +140,17 @@ table tbody td.loading {
   border-top: 1px solid #FBFBFB;
 }
 
+table tbody td.truncated {
+  overflow: visible;
+  max-width: 88px;
+}
+
+table tbody td.truncated > span {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
 /** Actions table cell*/
 table tbody td.actions {
   width: 130px;
@@ -441,7 +452,7 @@ body.login {
 div.list-view table tbody td span {
   display: block;
   float: left;
-  max-width: 100%;
+  max-width: 89%;
   word-wrap: break-word;
   text-indent: 0;
   margin-left: 12px;
@@ -3457,6 +3468,12 @@ div.view table td.editable div.edit {
   top: 0px;
 }
 
+div.view table td.truncated.editable div.edit {
+  top: 1px;
+  width: 285px;
+  left: 1px;
+}
+
 div.view table td.editable div.edit input {
   float: left;
   width: 66%;

http://git-wip-us.apache.org/repos/asf/cloudstack/blob/231c4b5b/ui/scripts/globalSettings.js
----------------------------------------------------------------------
diff --git a/ui/scripts/globalSettings.js b/ui/scripts/globalSettings.js
index 2687fca..1ae73b7 100644
--- a/ui/scripts/globalSettings.js
+++ b/ui/scripts/globalSettings.js
@@ -57,7 +57,7 @@
           fields: {
             name: { label: 'label.name', id: true },
             description: { label: 'label.description' },
-            value: { label: 'label.value', editable: true }
+            value: { label: 'label.value', editable: true, truncate: true }
           },
           dataProvider: function(args) {
             var data = {

http://git-wip-us.apache.org/repos/asf/cloudstack/blob/231c4b5b/ui/scripts/ui/widgets/listView.js
----------------------------------------------------------------------
diff --git a/ui/scripts/ui/widgets/listView.js b/ui/scripts/ui/widgets/listView.js
index 8dbc2f6..bc68a72 100644
--- a/ui/scripts/ui/widgets/listView.js
+++ b/ui/scripts/ui/widgets/listView.js
@@ -949,6 +949,10 @@
               .appendTo($tr);
         var content = dataItem[key];
 
+        if (field.truncate) {
+          $td.addClass('truncated');
+        }
+
         if (field.indicator) {
           $td.addClass('state').addClass(field.indicator[content]);