ignite-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From akuznet...@apache.org
Subject ignite git commit: IGNITE-843 Preview with selection fade.
Date Thu, 03 Sep 2015 17:04:13 GMT
Repository: ignite
Updated Branches:
  refs/heads/ignite-843 5ec92e820 -> 7efb9c742


IGNITE-843 Preview with selection fade.


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

Branch: refs/heads/ignite-843
Commit: 7efb9c7429cb2f404912f92dd4da005f1372361e
Parents: 5ec92e82
Author: AKuznetsov <akuznetsov@gridgain.com>
Authored: Fri Sep 4 00:04:03 2015 +0700
Committer: AKuznetsov <akuznetsov@gridgain.com>
Committed: Fri Sep 4 00:04:03 2015 +0700

----------------------------------------------------------------------
 .../main/js/controllers/caches-controller.js    |   1 +
 .../main/js/controllers/clusters-controller.js  |   1 +
 .../src/main/js/controllers/common-module.js    | 133 +++++++++++++++----
 .../main/js/controllers/metadata-controller.js  |   1 +
 .../src/main/js/controllers/sql-controller.js   |   3 +
 .../main/js/controllers/summary-controller.js   |   3 +
 .../src/main/js/public/stylesheets/style.scss   |  66 ++++++++-
 .../src/main/js/views/includes/controls.jade    |   4 +-
 .../src/main/js/views/sql/sql.jade              |   5 +-
 9 files changed, 179 insertions(+), 38 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/ignite/blob/7efb9c74/modules/control-center-web/src/main/js/controllers/caches-controller.js
----------------------------------------------------------------------
diff --git a/modules/control-center-web/src/main/js/controllers/caches-controller.js b/modules/control-center-web/src/main/js/controllers/caches-controller.js
index e3e4010..b6b6e31 100644
--- a/modules/control-center-web/src/main/js/controllers/caches-controller.js
+++ b/modules/control-center-web/src/main/js/controllers/caches-controller.js
@@ -48,6 +48,7 @@ controlCenterModule.controller('cachesController', [
             $scope.tablePairSave = $table.tablePairSave;
             $scope.tablePairSaveVisible = $table.tablePairSaveVisible;
 
+            $scope.previewInit = $preview.previewInit;
             $scope.previewChanged = $preview.previewChanged;
 
             $scope.formChanged = $common.formChanged;

http://git-wip-us.apache.org/repos/asf/ignite/blob/7efb9c74/modules/control-center-web/src/main/js/controllers/clusters-controller.js
----------------------------------------------------------------------
diff --git a/modules/control-center-web/src/main/js/controllers/clusters-controller.js b/modules/control-center-web/src/main/js/controllers/clusters-controller.js
index 2ccf9fc..44f39ff 100644
--- a/modules/control-center-web/src/main/js/controllers/clusters-controller.js
+++ b/modules/control-center-web/src/main/js/controllers/clusters-controller.js
@@ -43,6 +43,7 @@ controlCenterModule.controller('clustersController', ['$scope', '$controller',
'
         $scope.tableSimpleDown = $table.tableSimpleDown;
         $scope.tableSimpleDownVisible = $table.tableSimpleDownVisible;
 
+        $scope.previewInit = $preview.previewInit;
         $scope.previewChanged = $preview.previewChanged;
 
         $scope.formChanged = $common.formChanged;

http://git-wip-us.apache.org/repos/asf/ignite/blob/7efb9c74/modules/control-center-web/src/main/js/controllers/common-module.js
----------------------------------------------------------------------
diff --git a/modules/control-center-web/src/main/js/controllers/common-module.js b/modules/control-center-web/src/main/js/controllers/common-module.js
index 056b5d1..042e86d 100644
--- a/modules/control-center-web/src/main/js/controllers/common-module.js
+++ b/modules/control-center-web/src/main/js/controllers/common-module.js
@@ -957,11 +957,40 @@ controlCenterModule.service('$table', ['$common', '$focus', function
($common, $
 }]);
 
 // Preview support service.
-controlCenterModule.service('$preview', ['$timeout', function ($timeout) {
+controlCenterModule.service('$preview', ['$timeout', '$interval', function ($timeout, $interval)
{
     var Range = require('ace/range').Range;
 
     var previewPrevContent = [];
 
+    var animation = {editor: null, stage: 0, start: 0, stop: 0};
+
+    function _clearSelection(editor) {
+        _.forEach(editor.session.getMarkers(false), function (marker) {
+            editor.session.removeMarker(marker.id);
+        });
+    }
+
+    function _animate() {
+        animation.stage = animation.stage + 1;
+
+        animation.editor.session.addMarker(new Range(animation.start, 0, animation.stop,
0),
+            'preview-highlight-' + animation.stage, 'line', false);
+    }
+
+    function _fade(editor, start, stop) {
+        var promise = editor.animatePromise;
+
+        if (promise) {
+            $interval.cancel(promise);
+
+            _clearSelection(editor);
+        }
+
+        animation = {editor: editor, stage: 0, start: start, stop: stop};
+
+        editor.animatePromise = $interval(_animate, 100, 10, false);
+    }
+
     function previewChanged (ace) {
         var content = ace[0];
 
@@ -976,51 +1005,101 @@ controlCenterModule.service('$preview', ['$timeout', function ($timeout)
{
         // Do not mark the text changes for special marker value: ' '.
         else if (previewPrevContent.length > 0 && previewNewContent.length >
0 && previewNewContent[0] != ' '
             && previewPrevContent[0] != ' ') {
-            if (clearPromise)
+            if (clearPromise) {
                 $timeout.cancel(clearPromise);
 
-            var start = -1;
-            var end = -1;
-            var prevLen = previewPrevContent.length;
-            var newLen = previewNewContent.length;
+                _clearSelection(editor);
+            }
+
+            var newIx = 0;
+            var prevIx = 0;
 
-            // Find an index of a first line with different text.
-            for (var i = 0; (i < newLen || i < prevLen) && start < 0; i++)
{
-                if (previewNewContent[i] != previewPrevContent[i]) {
-                    start = i;
+            var prevLen = previewPrevContent.length - (previewPrevContent[previewPrevContent.length
- 1] == '' ? 1 : 0);
+            var newLen = previewNewContent.length - (previewNewContent[previewNewContent.length
- 1] == '' ? 1 : 0);
 
-                    break;
-                }
-            }
+            var selected = false;
+            var scrollTo = -1;
 
-            if (start >= 0) {
-                // Find an index of a last line with different text by checking last string
of old and new content in reverse order.
-                for (i = 1; (i <= newLen || i <= prevLen) && end < 0; i++)
{
-                    // Also check when difference added in end of content.
-                    if (previewNewContent[newLen - i] != previewPrevContent[prevLen - i]
|| prevLen - i < start) {
-                        end = newLen - i + 1;
+            while (newIx < newLen || prevIx < prevLen) {
+                var start = -1;
+                var end = -1;
+
+                // Find an index of a first line with different text.
+                for (; (newIx < newLen || prevIx < prevLen) && start < 0;
newIx++, prevIx++) {
+                    if (previewNewContent[newIx] != previewPrevContent[prevIx]) {
+                        start = newIx;
 
                         break;
                     }
                 }
 
-                if (end < 0)
-                    end = start + 1;
+                if (start >= 0) {
+                    // Find an index of a last line with different text by checking last
string of old and new content in reverse order.
+                    for (var i = start; i < newLen && end < 0; i ++) {
+                        for (var j = prevIx; j < prevLen && end < 0; j ++)
{
+                            if (previewNewContent[i] == previewPrevContent[j]) {
+                                end = i;
 
-                if (start <= end) {
-                    editor.selection.setSelectionRange(new Range(start, 0, end, 0), false);
+                                newIx = i;
+                                prevIx = j;
 
-                    editor.clearPromise = $timeout(function () {
-                        editor.clearSelection();
+                                break;
+                            }
+                        }
+                    }
+
+                    if (end < 0) {
+                        end = newLen;
+
+                        newIx = newLen;
+                        prevIx = prevLen;
+                    }
 
-                        editor.clearPromise = null;
-                    }, 3000);
+                    if (start <= end) {
+                        _fade(editor, start, end);
+
+                        if (!selected)
+                            scrollTo = start;
+
+                        selected = true;
+                    }
                 }
             }
 
+            // Run clear selection one time.
+            if (selected) {
+                editor.clearPromise = $timeout(function () {
+                    _clearSelection(editor);
+
+                    editor.clearPromise = null;
+                }, 4000);
+
+                editor.scrollToRow(scrollTo)
+            }
+
             previewPrevContent = [];
         }
     }
+
+    return {
+        previewInit: function (editor) {
+            editor.setReadOnly(true);
+            editor.setOption('highlightActiveLine', false);
+            editor.setAutoScrollEditorIntoView(true);
+            editor.$blockScrolling = Infinity;
+
+            var renderer = editor.renderer;
+
+            renderer.setHighlightGutterLine(false);
+            renderer.setShowPrintMargin(false);
+            renderer.setOption('fontSize', '10px');
+            renderer.setOption('minLines', '3');
+            renderer.setOption('maxLines', '50');
+
+            editor.setTheme('ace/theme/chrome');
+        },
+        previewChanged: previewChanged
+    }
 }]);
 
 // Filter to decode name using map(value, label).

http://git-wip-us.apache.org/repos/asf/ignite/blob/7efb9c74/modules/control-center-web/src/main/js/controllers/metadata-controller.js
----------------------------------------------------------------------
diff --git a/modules/control-center-web/src/main/js/controllers/metadata-controller.js b/modules/control-center-web/src/main/js/controllers/metadata-controller.js
index baef67d..9e418bf 100644
--- a/modules/control-center-web/src/main/js/controllers/metadata-controller.js
+++ b/modules/control-center-web/src/main/js/controllers/metadata-controller.js
@@ -56,6 +56,7 @@ controlCenterModule.controller('metadataController', [
             $scope.tablePairSave = $table.tablePairSave;
             $scope.tablePairSaveVisible = $table.tablePairSaveVisible;
 
+            $scope.previewInit = $preview.previewInit;
             $scope.previewChanged = $preview.previewChanged;
 
             $scope.formChanged = $common.formChanged;

http://git-wip-us.apache.org/repos/asf/ignite/blob/7efb9c74/modules/control-center-web/src/main/js/controllers/sql-controller.js
----------------------------------------------------------------------
diff --git a/modules/control-center-web/src/main/js/controllers/sql-controller.js b/modules/control-center-web/src/main/js/controllers/sql-controller.js
index 7b3335b..4b205e9 100644
--- a/modules/control-center-web/src/main/js/controllers/sql-controller.js
+++ b/modules/control-center-web/src/main/js/controllers/sql-controller.js
@@ -40,6 +40,7 @@ controlCenterModule.controller('sqlController', ['$scope', '$window','$controlle
     ];
 
     $scope.aceInit = function (editor) {
+        editor.setAutoScrollEditorIntoView(true);
         editor.$blockScrolling = Infinity;
 
         var renderer = editor.renderer;
@@ -47,6 +48,8 @@ controlCenterModule.controller('sqlController', ['$scope', '$window','$controlle
         renderer.setHighlightGutterLine(false);
         renderer.setShowPrintMargin(false);
         renderer.setOption('fontSize', '14px');
+        renderer.setOption('minLines', '3');
+        renderer.setOption('maxLines', '15');
 
         editor.setTheme('ace/theme/chrome');
     };

http://git-wip-us.apache.org/repos/asf/ignite/blob/7efb9c74/modules/control-center-web/src/main/js/controllers/summary-controller.js
----------------------------------------------------------------------
diff --git a/modules/control-center-web/src/main/js/controllers/summary-controller.js b/modules/control-center-web/src/main/js/controllers/summary-controller.js
index 256534a..2f1cec1 100644
--- a/modules/control-center-web/src/main/js/controllers/summary-controller.js
+++ b/modules/control-center-web/src/main/js/controllers/summary-controller.js
@@ -53,6 +53,7 @@ controlCenterModule.controller('summaryController', ['$scope', '$http',
'$common
     $scope.aceInit = function (editor) {
         editor.setReadOnly(true);
         editor.setOption('highlightActiveLine', false);
+        editor.setAutoScrollEditorIntoView(true);
         editor.$blockScrolling = Infinity;
 
         var renderer = editor.renderer;
@@ -60,6 +61,8 @@ controlCenterModule.controller('summaryController', ['$scope', '$http',
'$common
         renderer.setHighlightGutterLine(false);
         renderer.setShowPrintMargin(false);
         renderer.setOption('fontSize', '14px');
+        renderer.setOption('minLines', '3');
+        renderer.setOption('maxLines', '50');
 
         editor.setTheme('ace/theme/chrome');
     };

http://git-wip-us.apache.org/repos/asf/ignite/blob/7efb9c74/modules/control-center-web/src/main/js/public/stylesheets/style.scss
----------------------------------------------------------------------
diff --git a/modules/control-center-web/src/main/js/public/stylesheets/style.scss b/modules/control-center-web/src/main/js/public/stylesheets/style.scss
index 3bf8d22..3b8ffc1 100644
--- a/modules/control-center-web/src/main/js/public/stylesheets/style.scss
+++ b/modules/control-center-web/src/main/js/public/stylesheets/style.scss
@@ -1124,11 +1124,9 @@ a {
     opacity: 0;
 }
 
-.ace_editor, #ace_document {
+.ace_editor {
     margin: 0.85em 0 0 0;
 
-    height: 400px;
-
     .ace_gutter {
         background: transparent !important;
         border: 1px $ignite-border-color;
@@ -1142,13 +1140,71 @@ a {
 }
 
 .sql-editor {
-    height: 200px;
-
     .ace_cursor {
         opacity: 1;
     }
 }
 
+.preview-highlight-1 {
+    position: absolute;
+    background-color: #f7faff;
+    z-index: 20;
+}
+
+.preview-highlight-2 {
+  position: absolute;
+  background-color: #f0f6ff;
+  z-index: 21;
+}
+
+.preview-highlight-3 {
+  position: absolute;
+  background-color: #e8f2ff;
+  z-index: 22;
+}
+
+.preview-highlight-4 {
+  position: absolute;
+  background-color: #e1eeff;
+  z-index: 23;
+}
+
+.preview-highlight-5 {
+  position: absolute;
+  background-color: #DAEAFF;
+  z-index: 24;
+}
+
+.preview-highlight-6 {
+    position: absolute;
+    background-color: #D2E5FF;
+    z-index: 25;
+}
+
+.preview-highlight-7 {
+  position: absolute;
+  background-color: #CBE1FF;
+  z-index: 26;
+}
+
+.preview-highlight-8 {
+  position: absolute;
+  background-color: #C3DDFF;
+  z-index: 27;
+}
+
+.preview-highlight-9 {
+  position: absolute;
+  background-color: #BCD9FF;
+  z-index: 28;
+}
+
+.preview-highlight-10 {
+  position: absolute;
+  background-color: #B5D5FF;
+  z-index: 29;
+}
+
 .preview-panel {
     margin-top: 10px;
     margin-left: 20px;

http://git-wip-us.apache.org/repos/asf/ignite/blob/7efb9c74/modules/control-center-web/src/main/js/views/includes/controls.jade
----------------------------------------------------------------------
diff --git a/modules/control-center-web/src/main/js/views/includes/controls.jade b/modules/control-center-web/src/main/js/views/includes/controls.jade
index 08df361..ecb6bcf 100644
--- a/modules/control-center-web/src/main/js/views/includes/controls.jade
+++ b/modules/control-center-web/src/main/js/views/includes/controls.jade
@@ -461,11 +461,9 @@ mixin advanced-options-bottom
 
 mixin preview-content(preview, state, mode)
     -var previewState = preview + 'State'
-    -var rendererOptions = 'rendererOptions: {showPrintMargin: false, highlightGutterLine:
false, fontSize: 10}'
-    -var advancedOptions = 'advanced: {readOnly: true, highlightActiveLine: false, autoScrollEditorIntoView:
true, minLines: 3, maxLines: 50}'
 
     .preview-content(ng-if='!preview[#{preview}].allDefaults && #{previewState} ==
#{state}' id='#{id}'
-        ui-ace='{onChange: previewChanged, mode: "#{mode}", #{rendererOptions}, #{advancedOptions}}'
ng-model='preview[#{preview}].#{mode}')
+        ui-ace='{onLoad: previewInit, onChange: previewChanged, mode: "#{mode}"}' ng-model='preview[#{preview}].#{mode}')
 
 mixin preview(preview, id)
     -var previewState = preview + 'State'

http://git-wip-us.apache.org/repos/asf/ignite/blob/7efb9c74/modules/control-center-web/src/main/js/views/sql/sql.jade
----------------------------------------------------------------------
diff --git a/modules/control-center-web/src/main/js/views/sql/sql.jade b/modules/control-center-web/src/main/js/views/sql/sql.jade
index ac708ff..fc02427 100644
--- a/modules/control-center-web/src/main/js/views/sql/sql.jade
+++ b/modules/control-center-web/src/main/js/views/sql/sql.jade
@@ -68,9 +68,8 @@ block container
                                 .panel-body(ng-show='paragraph.editor')
                                     .row
                                         .col-xs-8.col-sm-9(style='border-right: 1px solid
#eee')
-                                            .sql-editor(ui-ace='{ onLoad: aceInit, theme:
"chrome", mode: "sql",' +
-                                                'require: ["ace/ext/language_tools"],' +
-                                                'advanced: {enableSnippets: false, enableBasicAutocompletion:
true, enableLiveAutocompletion: true, autoScrollEditorIntoView: true, minLines: 3, maxLines:
15}}'
+                                            .sql-editor(ui-ace='{onLoad: aceInit, theme:
"chrome", mode: "sql", require: ["ace/ext/language_tools"],' +
+                                                'advanced: {enableSnippets: false, enableBasicAutocompletion:
true, enableLiveAutocompletion: true}}'
                                             ng-model='paragraph.query'
                                             ng-class='{"disable": paragraph.status == "RUNNING"
|| paragraph.status == "PENDING" }')
                                         .col-xs-4.col-sm-3


Mime
View raw message