Эх сурвалжийг харах

[notebook] Improved move widget UX

Enrico Berti 10 жил өмнө
parent
commit
a546226

+ 5 - 0
desktop/core/src/desktop/static/desktop/css/hue3.css

@@ -2215,3 +2215,8 @@ div.navigator .pull-right .nav {
 .jobs-overlay:hover {
   opacity: 1;
 }
+
+.dragging-pre {
+  border-left: none;
+  background: transparent;
+}

+ 9 - 3
desktop/libs/notebook/src/notebook/templates/editor_components.mako

@@ -273,15 +273,17 @@ ${ require.config() }
             'placeholder': 'snippet-move-placeholder',
             'greedy': true,
             'stop': function(event, ui) {
-              $('.snippet-body').slideDown('fast', function () { $(window).scrollTop(lastWindowScrollPosition); });
+              var $element = $(event.target);
+              $element.find('.snippet-body').slideDown('fast', function () { $(window).scrollTop(lastWindowScrollPosition); });
             },
             'helper': function(event) {
               lastWindowScrollPosition = $(window).scrollTop();
-              $('.snippet-body').slideUp('fast', function () {
+              var $element = $(event.target);
+              $element.find('.snippet-body').slideUp('fast', function () {
                 $('.sortable-snippets').sortable('refreshPositions')
               });
-              var $element = $(event.target);
               var _par = $('<div>')
+                .css('overflow', 'hidden')
                 .addClass('card-widget snippet-move-helper')
                 .width($element.parents('.snippet').width());
               $('<h2>')
@@ -290,6 +292,10 @@ ${ require.config() }
                 .appendTo(_par)
                 .find('.hover-actions')
                 .removeClass('hover-actions');
+              $('<pre>')
+                .addClass('dragging-pre muted')
+                .html(ko.dataFor($element.parents('.card-widget')[0]).statement())
+                .appendTo(_par);
               _par.css('height', '100px');
               return _par;
             }