cloudstack-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From bfede...@apache.org
Subject git commit: updated refs/heads/master to e65d6bd
Date Fri, 28 Mar 2014 17:17:20 GMT
Repository: cloudstack
Updated Branches:
  refs/heads/master a7d7fee0c -> e65d6bd3a


CLOUDSTACK-6227 (Add copy-paste support for detail view fields):

DetailView widget now supports bool isCopyPaste property that can be set
for fields. If this is set to true, the text of this field is displayed
using ellipsis formatting* and a copy-paste icon is available right next
to it. On clicking this icon, the full text is displayed

*: tooltip is also enabled showing the original non-ellipsed value


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

Branch: refs/heads/master
Commit: e65d6bd3a8e893280a0d14a68940ce45cd40b616
Parents: a7d7fee
Author: Gabor Apati-Nagy <gabor.apati-nagy@citrix.com>
Authored: Fri Mar 28 14:18:10 2014 +0000
Committer: Brian Federle <brian.federle@citrix.com>
Committed: Fri Mar 28 10:15:19 2014 -0700

----------------------------------------------------------------------
 ui/css/cloudstack3.css              |  52 +++++++++++++++++++++++++++++++
 ui/images/sprites.png               | Bin 212064 -> 194105 bytes
 ui/scripts/accounts.js              |   6 ++--
 ui/scripts/ui/widgets/detailView.js |  37 ++++++++++++++++++++--
 4 files changed, 91 insertions(+), 4 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/cloudstack/blob/e65d6bd3/ui/css/cloudstack3.css
----------------------------------------------------------------------
diff --git a/ui/css/cloudstack3.css b/ui/css/cloudstack3.css
index 9789eda..bcb82d3 100644
--- a/ui/css/cloudstack3.css
+++ b/ui/css/cloudstack3.css
@@ -1835,6 +1835,58 @@ div.list-view td.state.off span {
   float: left;
   width: 245px;
 }
+.detail-group .main-groups table td.value > span.copypasteenabledvalue {
+  text-overflow: ellipsis;
+  -o-text-overflow: ellipsis;
+  overflow: hidden;
+  white-space: nowrap;
+}
+
+.detail-group .main-groups table td.value > .copypasteactive {
+  display: auto;
+  white-space: nowrap;
+  overflow: none;
+}
+
+div.copypasteicon {
+  background: url("../images/sprites.png") no-repeat scroll -271px -65px;
+  float: left;
+  height: 21px;
+  margin-left: 6px;
+  margin-top: 0px;
+  width: 18px;
+}
+
+div.copypasteicon:hover {
+  background: url("../images/sprites.png") no-repeat scroll -271px -646px;
+}
+
+.detail-group .main-groups table td.value > span.copypasteenabledvalue {
+  text-overflow: ellipsis;
+  -o-text-overflow: ellipsis;
+  overflow: hidden;
+  white-space: nowrap;
+}
+
+.detail-group .main-groups table td.value > .copypasteactive {
+  display: auto;
+  white-space: nowrap;
+  overflow: none;
+}
+
+div.copypasteicon {
+  background: url("../images/sprites.png") no-repeat scroll -271px -65px;
+  float: left;
+  height: 21px;
+  margin-left: 6px;
+  margin-top: 0px;
+  width: 18px;
+}
+
+div.copypasteicon:hover {
+  background: url("../images/sprites.png") no-repeat scroll -271px -646px;
+}
+
 
 .detail-group .main-groups table td.value > span select {
   width: 100% !important;

http://git-wip-us.apache.org/repos/asf/cloudstack/blob/e65d6bd3/ui/images/sprites.png
----------------------------------------------------------------------
diff --git a/ui/images/sprites.png b/ui/images/sprites.png
old mode 100644
new mode 100755
index ee64047..1a6eaa5
Binary files a/ui/images/sprites.png and b/ui/images/sprites.png differ

http://git-wip-us.apache.org/repos/asf/cloudstack/blob/e65d6bd3/ui/scripts/accounts.js
----------------------------------------------------------------------
diff --git a/ui/scripts/accounts.js b/ui/scripts/accounts.js
index aff780e..2b83f1a 100644
--- a/ui/scripts/accounts.js
+++ b/ui/scripts/accounts.js
@@ -1375,10 +1375,12 @@
                                         label: 'label.state'
                                     },
                                     apikey: {
-                                        label: 'label.api.key'
+                                        label: 'label.api.key',
+                                        isCopyPaste: true
                                     },
                                     secretkey: {
-                                        label: 'label.secret.key'
+                                        label: 'label.secret.key',
+                                        isCopyPaste: true
                                     },
                                     account: {
                                         label: 'label.account.name'

http://git-wip-us.apache.org/repos/asf/cloudstack/blob/e65d6bd3/ui/scripts/ui/widgets/detailView.js
----------------------------------------------------------------------
diff --git a/ui/scripts/ui/widgets/detailView.js b/ui/scripts/ui/widgets/detailView.js
index 4c5aeea..e083878 100644
--- a/ui/scripts/ui/widgets/detailView.js
+++ b/ui/scripts/ui/widgets/detailView.js
@@ -456,6 +456,13 @@
                 tooltip: '.tooltip-box'
             });
 
+            var removeCopyPasteIcons = function() {
+                $detailView.find('.copypasteactive').removeClass('copypasteactive').addClass('copypasteenabledvalue');
+                $detailView.find('td.value .copypasteicon').hide();
+            };
+
+            removeCopyPasteIcons();
+
             var convertInputs = function($inputs) {
                 // Save and turn back into labels
                 $inputs.each(function() {
@@ -606,11 +613,12 @@
                             return false;
                         }
                     }
+                    restoreCopyPasteIcons();
                     applyEdits($inputs, $editButton);
                 } else { // Cancel
+                    restoreCopyPasteIcons();
                     cancelEdits($inputs, $editButton);
                 }
-
                 return true;
             });
 
@@ -625,6 +633,9 @@
                 tooltip: '.tooltip-box'
             });
 
+            var restoreCopyPasteIcons = function() {
+                $detailView.find('td.value .copypasteicon').show();
+            };
 
             $detailView.find('td.value span').each(function() {
                 var name = $(this).closest('tr').data('detail-view-field');
@@ -931,7 +942,6 @@
 
         $(fields).each(function() {
             var fieldGroup = this;
-
             var $detailTable = $('<tbody></tbody>').appendTo(
                 $('<table></table>').appendTo(
                     $('<div></div>').addClass('detail-group').appendTo($detailGroups.find('.main-groups'))
@@ -979,10 +989,33 @@
 
                 $name.html(_l(value.label));
                 $value.html(_s(content));
+                $value.attr('title', _s(content));
 
                 // Set up validation metadata
                 $value.data('validation-rules', value.validation);
 
+                //add copypaste icon
+                if (value.isCopyPaste) {
+                    var $copyicon = $('<div>').addClass('copypasteicon').insertAfter($value);
+                    $value.addClass('copypasteenabledvalue');
+
+                    //set up copypaste eventhandler
+                    $copyicon.click(function() {
+                        //reset other values' formatting
+                        $(this).closest('table').find('span.copypasteactive').removeClass('copypasteactive').addClass('copypasteenabledvalue');
+                        //find the corresponding value
+                        var $correspValue = $(this).closest('tr').find('.value').find('span');
+                        $value.removeClass("copypasteenabledvalue").addClass("copypasteactive");
+                        var correspValueElem = $correspValue.get(0);
+                        //select the full value
+                        var range = document.createRange();
+                        range.selectNodeContents(correspValueElem);
+                        var selection = window.getSelection();
+                        selection.removeAllRanges();
+                        selection.addRange(range);
+                    });
+                }
+
                 // Set up editable metadata
                 if (typeof(value.isEditable) == 'function')
                     $value.data('detail-view-is-editable', value.isEditable(context));


Mime
View raw message