[Rt-commit] rt branch, 4.6/inline-edit, updated. rt-4.4.1-165-g6d500ea

Shawn Moore shawn at bestpractical.com
Tue Sep 20 13:02:20 EDT 2016


The branch, 4.6/inline-edit has been updated
       via  6d500eabd8e0822a3d3c5408b9445568999cc4c4 (commit)
       via  bf87f1247b7909e99755393b0183e064295b1f32 (commit)
       via  d7fbced6112d1e6c07603272e5ddb47fa90edd88 (commit)
      from  4882552baa77f894fc2bbd60235e6f3f22e86d81 (commit)

Summary of changes:
 share/html/Elements/CollectionAsTable/Row |  2 +-
 share/static/css/base/inline-edit.css     | 39 ++++++++++++++++++++++++-------
 share/static/js/util.js                   |  3 +++
 3 files changed, 34 insertions(+), 10 deletions(-)

- Log -----------------------------------------------------------------
commit d7fbced6112d1e6c07603272e5ddb47fa90edd88
Author: Shawn M Moore <shawn at bestpractical.com>
Date:   Tue Sep 20 16:18:55 2016 +0000

    Improve transition from cancellable to loading

diff --git a/share/html/Elements/CollectionAsTable/Row b/share/html/Elements/CollectionAsTable/Row
index e29900a..8f252fd 100644
--- a/share/html/Elements/CollectionAsTable/Row
+++ b/share/html/Elements/CollectionAsTable/Row
@@ -168,7 +168,7 @@ foreach my $column (@Format) {
         $m->out('<form method="POST" action="'.RT->Config->Get('WebPath').'/Helpers/TicketUpdate?id='.$record->id.'" class="editor">');
         $m->out($attrs{edit});
         $m->out('<a href="#" class="cancel"><img src="'.RT->Config->Get('WebPath').'/static/images/close.png" alt="'.loc('Cancel').'" title="'.loc('Cancel').'" /></a>');
-        $m->out('<img class="loading" src="'.RT->Config->Get('WebPath').'/static/images/loading.gif" alt="'.loc('Loading').'" title="'.loc('Loading').'" />');
+        $m->out('<span class="loading"><img src="'.RT->Config->Get('WebPath').'/static/images/loading.gif" alt="'.loc('Loading').'" title="'.loc('Loading').'" /></span>');
         $m->out('</form><div class="value">');
     }
 
diff --git a/share/static/css/base/inline-edit.css b/share/static/css/base/inline-edit.css
index ef248ee..b2c40b0 100644
--- a/share/static/css/base/inline-edit.css
+++ b/share/static/css/base/inline-edit.css
@@ -2,9 +2,12 @@ td.editable > .value {
     padding-top: 0;
 }
 
-td.editable > form.editor > img.loading {
-    height: 1em;
-    width: 1em;
+td.editable > form.editor > .loading > img,
+td.editable > form.editor > .cancel > img {
+    height: 1.5em;
+    width: 1.5em;
+    margin: .25em;
+    border-style: none;
 }
 
 td.editable.error {
@@ -46,14 +49,16 @@ tbody.list-item.refreshing {
     opacity: 0.5;
 }
 
-td.editable > form.editor > a.cancel {
-    display: inline-block;
+td.editable > form.editor > .cancel,
+td.editable > form.editor > .loading {
     height: 100%;
     vertical-align: middle;
 }
 
-td.editable > form.editor > a.cancel > img {
-    height: 1.5em;
-    margin: .25em;
-    border-style: none;
+td.editable > form.editor > .cancel {
+    display: inline-block;
+}
+
+td.editable.loading > form.editor > .cancel {
+    display: none;
 }

commit bf87f1247b7909e99755393b0183e064295b1f32
Author: Shawn M Moore <shawn at bestpractical.com>
Date:   Tue Sep 20 16:58:49 2016 +0000

    Begin indicating inline editability on cursor hover

diff --git a/share/static/css/base/inline-edit.css b/share/static/css/base/inline-edit.css
index b2c40b0..33d3c53 100644
--- a/share/static/css/base/inline-edit.css
+++ b/share/static/css/base/inline-edit.css
@@ -1,3 +1,13 @@
+td.editable .value {
+    border: 1px dashed transparent;
+}
+
+td.editable .value:hover {
+    background-color: #ffd;
+    border-color: black;
+    cursor: pointer;
+}
+
 td.editable > .value {
     padding-top: 0;
 }

commit 6d500eabd8e0822a3d3c5408b9445568999cc4c4
Author: Shawn M Moore <shawn at bestpractical.com>
Date:   Tue Sep 20 16:59:34 2016 +0000

    When already inline editing, don't show editable UI for other fields

diff --git a/share/static/css/base/inline-edit.css b/share/static/css/base/inline-edit.css
index 33d3c53..8ee2483 100644
--- a/share/static/css/base/inline-edit.css
+++ b/share/static/css/base/inline-edit.css
@@ -8,6 +8,12 @@ td.editable .value:hover {
     cursor: pointer;
 }
 
+body.inline-editing td.editable .value:hover {
+    background-color: inherit;
+    border-color: transparent;
+    cursor: inherit;
+}
+
 td.editable > .value {
     padding-top: 0;
 }
diff --git a/share/static/js/util.js b/share/static/js/util.js
index cec4463..335ca03 100644
--- a/share/static/js/util.js
+++ b/share/static/js/util.js
@@ -605,6 +605,7 @@ jQuery(function () {
         var height = cell.height();
 
         cell.addClass('editing');
+        jQuery('body').addClass('inline-editing');
 
         if (editor.find('textarea').length || editor[0].clientWidth > cell[0].clientWidth) {
             cell.attr('height', height);
@@ -645,6 +646,7 @@ jQuery(function () {
         inlineEditingDate = false;
         cell.removeClass('editing').removeAttr('height');
         editor.removeClass('wide');
+        jQuery('body').removeClass('inline-editing');
 
         cell.find('form').replaceWith(inlineEditPristineForm);
         inlineEditPristineForm = null;
@@ -681,6 +683,7 @@ jQuery(function () {
 
         editor.find(':input').attr('disabled', 'disabled');
         cell.removeClass('editing').addClass('loading');
+        jQuery('body').removeClass('inline-editing');
         tbody.addClass('refreshing');
         inlineEditPristineForm = null;
 

-----------------------------------------------------------------------


More information about the rt-commit mailing list