Repository: incubator-eagle Updated Branches: refs/heads/master 7848680d3 -> 6385174ed
[EAGLE-706] Policy UI adv mode support sql highlight Add ace editor to make policy edit page sql highlight Author: zombieJ <smith3...@gmail.com> Closes #587 from zombieJ/highlight. Project: http://git-wip-us.apache.org/repos/asf/incubator-eagle/repo Commit: http://git-wip-us.apache.org/repos/asf/incubator-eagle/commit/6385174e Tree: http://git-wip-us.apache.org/repos/asf/incubator-eagle/tree/6385174e Diff: http://git-wip-us.apache.org/repos/asf/incubator-eagle/diff/6385174e Branch: refs/heads/master Commit: 6385174eda387f821ae05f26ebbf497ae22e6c5e Parents: 7848680 Author: zombieJ <smith3...@gmail.com> Authored: Mon Oct 31 17:44:19 2016 +0800 Committer: zombieJ <smith3...@gmail.com> Committed: Mon Oct 31 17:44:19 2016 +0800 ---------------------------------------------------------------------- eagle-server/src/main/webapp/app/dev/index.html | 2 + .../app/dev/partials/alert/policyDetail.html | 5 +- .../partials/alert/policyEdit/advancedMode.html | 3 +- .../src/main/webapp/app/dev/public/css/main.css | 15 +++- .../app/dev/public/js/components/editor.js | 79 ++++++++++++++++++++ .../app/dev/public/js/ctrls/alertEditCtrl.js | 6 +- eagle-server/src/main/webapp/app/package.json | 1 + 7 files changed, 103 insertions(+), 8 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/incubator-eagle/blob/6385174e/eagle-server/src/main/webapp/app/dev/index.html ---------------------------------------------------------------------- diff --git a/eagle-server/src/main/webapp/app/dev/index.html b/eagle-server/src/main/webapp/app/dev/index.html index d889237..4b134a5 100644 --- a/eagle-server/src/main/webapp/app/dev/index.html +++ b/eagle-server/src/main/webapp/app/dev/index.html @@ -235,6 +235,7 @@ <script src="../node_modules/moment-timezone/builds/moment-timezone-with-data.min.js"></script> <script src="../node_modules/echarts/dist/echarts.min.js"></script> <script src="../node_modules/admin-lte/dist/js/app.min.js"></script> + <script src="../node_modules/ace-builds/src-min-noconflict/ace.js"></script> <script src="../node_modules/angular/angular.min.js"></script> <script src="../node_modules/angular-resource/angular-resource.min.js"></script> <script src="../node_modules/angular-route/angular-route.min.js"></script> @@ -269,6 +270,7 @@ <script src="public/js/components/chart.js" type="text/javascript" charset="utf-8"></script> <script src="public/js/components/widget.js" type="text/javascript" charset="utf-8"></script> <script src="public/js/components/staticInclude.js" type="text/javascript" charset="utf-8"></script> + <script src="public/js/components/editor.js" type="text/javascript" charset="utf-8"></script> <!-- Controllers --> <script src="public/js/ctrls/main.js" type="text/javascript" charset="utf-8"></script> http://git-wip-us.apache.org/repos/asf/incubator-eagle/blob/6385174e/eagle-server/src/main/webapp/app/dev/partials/alert/policyDetail.html ---------------------------------------------------------------------- diff --git a/eagle-server/src/main/webapp/app/dev/partials/alert/policyDetail.html b/eagle-server/src/main/webapp/app/dev/partials/alert/policyDetail.html index 7ec5f39..5173d65 100644 --- a/eagle-server/src/main/webapp/app/dev/partials/alert/policyDetail.html +++ b/eagle-server/src/main/webapp/app/dev/partials/alert/policyDetail.html @@ -22,7 +22,10 @@ <li><a href="#definition" data-toggle="tab">Definition</a></li> <li><a href="#publisher" data-toggle="tab">Publisher</a></li> - <li class="pull-right"> + <li class="pull-right tab-sm"> + <a class="fa fa-edit" ui-sref="policyEdit({name: policy.name})"></a> + </li> + <li class="pull-right tab-xs"> <a> <span class="label" ng-class="{'label-default': policy.policyStatus !== 'ENABLED', 'label-success': policy.policyStatus === 'ENABLED'}"> {{policy.policyStatus}} http://git-wip-us.apache.org/repos/asf/incubator-eagle/blob/6385174e/eagle-server/src/main/webapp/app/dev/partials/alert/policyEdit/advancedMode.html ---------------------------------------------------------------------- diff --git a/eagle-server/src/main/webapp/app/dev/partials/alert/policyEdit/advancedMode.html b/eagle-server/src/main/webapp/app/dev/partials/alert/policyEdit/advancedMode.html index 55ce0fa..63129ef 100644 --- a/eagle-server/src/main/webapp/app/dev/partials/alert/policyEdit/advancedMode.html +++ b/eagle-server/src/main/webapp/app/dev/partials/alert/policyEdit/advancedMode.html @@ -108,7 +108,8 @@ <div class="form-group" ng-class="{'has-error': !!definitionMessage}"> <label>* Definition</label> - <textarea class="form-control" ng-model="policy.definition.value" rows="10" ng-change="checkDefinition()" ng-disabled="policyLock"></textarea> + <div editor ng-model="policy.definition.value" ng-change="checkDefinition()"></div> + <!--textarea class="form-control" ng-model="policy.definition.value" rows="10" ng-change="checkDefinition()" ng-disabled="policyLock"></textarea--> <p class="text-danger">{{definitionMessage}}</p> </div> http://git-wip-us.apache.org/repos/asf/incubator-eagle/blob/6385174e/eagle-server/src/main/webapp/app/dev/public/css/main.css ---------------------------------------------------------------------- diff --git a/eagle-server/src/main/webapp/app/dev/public/css/main.css b/eagle-server/src/main/webapp/app/dev/public/css/main.css index 8f65c69..daea5b6 100644 --- a/eagle-server/src/main/webapp/app/dev/public/css/main.css +++ b/eagle-server/src/main/webapp/app/dev/public/css/main.css @@ -266,9 +266,9 @@ ul.stepGuide li > .title { color: #666; } - /* ======================================================================== - * = Tab = - * ======================================================================== */ +/* ======================================================================== + * = Tab = + * ======================================================================== */ .tab-content.keepContent > .tab-pane { display: block; } @@ -278,6 +278,15 @@ ul.stepGuide li > .title { overflow: hidden; } +.nav-tabs-custom .nav-tabs .tab-sm a { + padding-left: 8px; + padding-right: 8px; +} +.nav-tabs-custom .nav-tabs .tab-xs a { + padding-left: 0; + padding-right: 0; +} + /* ======================================================================== * = Modal = * ======================================================================== */ http://git-wip-us.apache.org/repos/asf/incubator-eagle/blob/6385174e/eagle-server/src/main/webapp/app/dev/public/js/components/editor.js ---------------------------------------------------------------------- diff --git a/eagle-server/src/main/webapp/app/dev/public/js/components/editor.js b/eagle-server/src/main/webapp/app/dev/public/js/components/editor.js new file mode 100644 index 0000000..1975441 --- /dev/null +++ b/eagle-server/src/main/webapp/app/dev/public/js/components/editor.js @@ -0,0 +1,79 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one + * or more contributor license agreements. See the NOTICE file + * distributed with this work for additional information + * regarding copyright ownership. The ASF licenses this file + * to you under the Apache License, Version 2.0 (the + * "License"); you may not use this file except in compliance + * with the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +(function() { + 'use strict'; + + var eagleComponents = angular.module('eagle.components'); + + eagleComponents.directive('editor', function() { + return { + restrict: 'AE', + require: 'ngModel', + + link: function($scope, $element, $attrs, $ctrl) { + $element.innerHeight(21 * Number($attrs.rows || 10)); + + var updateId; + function updateScope(value) { + clearTimeout(updateId); + + updateId = setTimeout(function () { + $ctrl.$setViewValue(value); + }, 0); + } + + var editLock = false; + + var editor = ace.edit($element[0]); + var session = editor.getSession(); + editor.container.style.lineHeight = 1.5; + editor.setOptions({ + fontSize: "14px" + }); + editor.setTheme("ace/theme/tomorrow"); + editor.$blockScrolling = Infinity; + editor.getSession().on('change', function(event) { + editLock = true; + + var value = session.getValue(); + updateScope(value); + + }); + session.setUseWorker(false); + session.setUseWrapMode(true); + session.setMode("ace/mode/sql"); + + $scope.$watch($attrs.ngModel, function (newValue) { + if(editLock) { + editLock = false; + return; + } + + session.setValue(newValue || ""); + }); + + $scope.$on('$destroy', function() { + editor.destroy(); + }); + }, + template: '<div class="form-control"></div>', + replace: true + }; + }); +})(); http://git-wip-us.apache.org/repos/asf/incubator-eagle/blob/6385174e/eagle-server/src/main/webapp/app/dev/public/js/ctrls/alertEditCtrl.js ---------------------------------------------------------------------- diff --git a/eagle-server/src/main/webapp/app/dev/public/js/ctrls/alertEditCtrl.js b/eagle-server/src/main/webapp/app/dev/public/js/ctrls/alertEditCtrl.js index 989ce0f..c06d63d 100644 --- a/eagle-server/src/main/webapp/app/dev/public/js/ctrls/alertEditCtrl.js +++ b/eagle-server/src/main/webapp/app/dev/public/js/ctrls/alertEditCtrl.js @@ -54,11 +54,11 @@ policyEditController.apply(this, newArgs); } - eagleControllers.controller('policyCreateCtrl', function ($scope, $q, $wrapState, $timeout, PageConfig, Entity) { + eagleControllers.controller('policyCreateCtrl', function ($scope, $q, $wrapState, $timeout, $element, PageConfig, Entity) { PageConfig.title = "Define Policy"; connectPolicyEditController({}, arguments); }); - eagleControllers.controller('policyEditCtrl', function ($scope, $q, $wrapState, $timeout, PageConfig, Entity) { + eagleControllers.controller('policyEditCtrl', function ($scope, $q, $wrapState, $timeout, $element, PageConfig, Entity) { PageConfig.title = "Edit Policy"; var args = arguments; @@ -79,7 +79,7 @@ }); }); - function policyEditController(policy, $scope, $q, $wrapState, $timeout, PageConfig, Entity) { + function policyEditController(policy, $scope, $q, $wrapState, $timeout, $element, PageConfig, Entity) { $scope.publisherTypes = publisherTypes; $scope.policy = policy; http://git-wip-us.apache.org/repos/asf/incubator-eagle/blob/6385174e/eagle-server/src/main/webapp/app/package.json ---------------------------------------------------------------------- diff --git a/eagle-server/src/main/webapp/app/package.json b/eagle-server/src/main/webapp/app/package.json index 0bf2968..a2d0dab 100644 --- a/eagle-server/src/main/webapp/app/package.json +++ b/eagle-server/src/main/webapp/app/package.json @@ -12,6 +12,7 @@ }, "license": "Apache-2.0", "dependencies": { + "ace-builds": "^1.2.5", "admin-lte": "2.3.2", "angular": "1.5.0", "angular-animate": "1.5.0",