This is an automated email from the ASF dual-hosted git repository. pinal pushed a commit to branch branch-2.0 in repository https://gitbox.apache.org/repos/asf/atlas.git
The following commit(s) were added to refs/heads/branch-2.0 by this push: new 4c77b60 ATLAS-4532: #1 UI: Statistics button not working in new UI 4c77b60 is described below commit 4c77b60ed5160128b6dfa4aa2002aca1b9c684ce Author: prasad pawar <prasad.pa...@freestoneinfotech.com> AuthorDate: Thu Jan 13 20:28:43 2022 +0530 ATLAS-4532: #1 UI: Statistics button not working in new UI Signed-off-by: Pinal Shah <pinal.s...@freestoneinfotech.com> (cherry picked from commit 5374b38f5551314205380ede28b730e33256ff23) --- dashboardv2/public/js/migration.js | 106 +++++++++++++-- dashboardv2/public/js/views/site/Statistics.js | 2 +- dashboardv3/gruntfile.js | 4 +- dashboardv3/public/css/scss/migration-style.scss | 32 +++++ dashboardv3/public/css/scss/stats.scss | 52 +++++++ .../public/js/migration.js | 109 +++++++++++++-- .../js/templates/migration/MigrationView_tmpl.html | 17 +++ .../public/js/templates/site/Statistics_tmpl.html | 15 +- dashboardv3/public/js/utils/MigrationEnums.js | 32 +++++ dashboardv3/public/js/utils/UrlLinks.js | 3 + .../public/js/views/migration/MigrationView.js | 68 ++++++++++ dashboardv3/public/js/views/site/Statistics.js | 151 +++++++++++++++++---- dashboardv3/public/migration-status.html.tpl | 61 +++++++++ 13 files changed, 596 insertions(+), 56 deletions(-) diff --git a/dashboardv2/public/js/migration.js b/dashboardv2/public/js/migration.js index fca59ce..d6ed687 100644 --- a/dashboardv2/public/js/migration.js +++ b/dashboardv2/public/js/migration.js @@ -49,6 +49,13 @@ require.config({ 'deps': ['underscore', 'jquery'], 'exports': 'Backbone' }, + 'jquery-ui': { + 'deps': ['jquery'] + }, + 'asBreadcrumbs': { + 'deps': ['jquery'], + 'exports': 'asBreadcrumbs' + }, 'bootstrap': { 'deps': ['jquery'], 'exports': 'jquery' @@ -59,26 +66,79 @@ require.config({ 'marionette': { 'deps': ['backbone'] }, + 'backgrid': { + 'deps': ['backbone'], + 'exports': 'Backgrid' + }, + 'backgrid-paginator': { + 'deps': ['backbone', 'backgrid'] + }, + 'backgrid-filter': { + 'deps': ['backbone', 'backgrid'] + }, + 'backgrid-orderable': { + 'deps': ['backbone', 'backgrid'], + }, + 'backgrid-sizeable': { + 'deps': ['backbone', 'backgrid'], + }, + 'backgrid-select-all': { + 'deps': ['backbone', 'backgrid'] + }, + 'backgrid-columnmanager': { + 'deps': ['backbone', 'backgrid'], + }, 'hbs': { 'deps': ['underscore', 'handlebars'] }, + 'd3': { + 'exports': ['d3'] + }, + 'd3-tip': { + 'deps': ['d3'], + 'exports': ['d3-tip'] + }, + 'LineageHelper': { + 'deps': ['d3'], + }, + 'dagreD3': { + 'deps': ['d3'], + 'exports': ['dagreD3'] + }, + 'sparkline': { + 'deps': ['jquery'], + 'exports': ['sparkline'] + }, + 'pnotify': { + 'exports': ['pnotify'] + }, 'jquery-placeholder': { 'deps': ['jquery'] }, - 'jquery-ui': { + 'query-builder': { 'deps': ['jquery'] }, + 'daterangepicker': { + 'deps': ['jquery', 'moment'] + }, 'moment-timezone': { 'deps': ['moment'] }, 'moment': { 'exports': ['moment'] }, - 'pnotify': { - 'exports': ['pnotify'] + 'jstree': { + 'deps': ['jquery'] }, - 'd3': { - 'exports': ['d3'] + 'jquery-steps': { + 'deps': ['jquery'] + }, + 'DOMPurify': { + 'exports': 'DOMPurify' + }, + 'trumbowyg': { + 'deps': ['jquery'], + 'exports': 'trumbowyg' } }, @@ -90,20 +150,44 @@ require.config({ 'backbone.babysitter': 'libs/backbone.babysitter/lib/backbone.babysitter.min', 'marionette': 'libs/backbone-marionette/backbone.marionette.min', 'backbone.paginator': 'libs/backbone-paginator/backbone.paginator.min', + 'backbone.wreqr': 'libs/backbone-wreqr/backbone.wreqr.min', + 'backgrid': 'libs/backgrid/js/backgrid', + 'backgrid-filter': 'libs/backgrid-filter/js/backgrid-filter.min', + 'backgrid-orderable': 'libs/backgrid-orderable-columns/js/backgrid-orderable-columns', + 'backgrid-paginator': 'libs/backgrid-paginator/js/backgrid-paginator.min', + 'backgrid-sizeable': 'libs/backgrid-sizeable-columns/js/backgrid-sizeable-columns', + 'backgrid-columnmanager': 'external_lib/backgrid-columnmanager/js/Backgrid.ColumnManager', + 'asBreadcrumbs': 'libs/jquery-asBreadcrumbs/js/jquery-asBreadcrumbs.min', + 'd3': 'libs/d3/d3.min', + 'd3-tip': 'libs/d3/index', + 'LineageHelper': 'external_lib/atlas-lineage/dist/index', + 'dagreD3': 'libs/dagre-d3/dagre-d3.min', + 'sparkline': 'libs/sparkline/jquery.sparkline.min', 'tmpl': 'templates', 'requirejs.text': 'libs/requirejs-text/text', 'handlebars': 'external_lib/require-handlebars-plugin/js/handlebars', 'hbs': 'external_lib/require-handlebars-plugin/js/hbs', 'i18nprecompile': 'external_lib/require-handlebars-plugin/js/i18nprecompile', - 'jquery-placeholder': 'libs/jquery-placeholder/js/jquery.placeholder', - 'platform': 'libs/platform/platform', - 'pnotify': 'external_lib/pnotify/pnotify.custom.min', - 'pnotify.buttons': 'external_lib/pnotify/pnotify.custom.min', - 'pnotify.confirm': 'external_lib/pnotify/pnotify.custom.min', + 'select2': 'libs/select2/select2.full.min', + 'backgrid-select-all': 'libs/backgrid-select-all/backgrid-select-all.min', 'moment': 'libs/moment/js/moment.min', 'moment-timezone': 'libs/moment-timezone/moment-timezone-with-data.min', 'jquery-ui': 'external_lib/jquery-ui/jquery-ui.min', - 'd3': 'libs/d3/d3.min' + 'pnotify': 'external_lib/pnotify/pnotify.custom.min', + 'pnotify.buttons': 'external_lib/pnotify/pnotify.custom.min', + 'pnotify.confirm': 'external_lib/pnotify/pnotify.custom.min', + 'jquery-placeholder': 'libs/jquery-placeholder/js/jquery.placeholder', + 'platform': 'libs/platform/platform', + 'query-builder': 'libs/jQueryQueryBuilder/js/query-builder.standalone.min', + 'daterangepicker': 'libs/bootstrap-daterangepicker/js/daterangepicker', + 'table-dragger': 'libs/table-dragger/table-dragger', + 'jstree': 'libs/jstree/jstree.min', + 'jquery-steps': 'libs/jquery-steps/jquery.steps.min', + 'dropzone': 'libs/dropzone/js/dropzone-amd-module', + 'lossless-json': 'libs/lossless-json/lossless-json', + 'store': 'external_lib/idealTimeout/store.min', + 'DOMPurify': 'external_lib/dompurify/purify.min', + 'trumbowyg': 'external_lib/trumbowyg/trumbowyg' }, /** diff --git a/dashboardv2/public/js/views/site/Statistics.js b/dashboardv2/public/js/views/site/Statistics.js index 32a6669..c4d4ace 100644 --- a/dashboardv2/public/js/views/site/Statistics.js +++ b/dashboardv2/public/js/views/site/Statistics.js @@ -126,7 +126,7 @@ define(['require', success: function(data) { var data = _.first(data.toJSON()), migrationStatus = data.MigrationStatus || null, - operationStatus = migrationStatus.operationStatus, + operationStatus = migrationStatus ? migrationStatus.operationStatus : null, showProgress = true, totalProgress = 0, progressMessage = ""; diff --git a/dashboardv3/gruntfile.js b/dashboardv3/gruntfile.js index b1b7b59..37e4b32 100644 --- a/dashboardv3/gruntfile.js +++ b/dashboardv3/gruntfile.js @@ -214,6 +214,7 @@ module.exports = function(grunt) { build: { files: { [distPath + '/css/style.css']: modulesPath + 'css/scss/style.scss', + [distPath + '/css/migration-style.css']: modulesPath + 'css/scss/migration-style.scss', [distPath + '/css/login.css']: modulesPath + 'css/scss/login.scss' } } @@ -292,7 +293,8 @@ module.exports = function(grunt) { } }, files: { - [distPath + '/index.html']: [modulesPath + 'index.html.tpl'] + [distPath + '/index.html']: [modulesPath + 'index.html.tpl'], + [distPath + '/migration-status.html']: [modulesPath + 'migration-status.html.tpl'] } } } diff --git a/dashboardv3/public/css/scss/migration-style.scss b/dashboardv3/public/css/scss/migration-style.scss new file mode 100644 index 0000000..60c9758 --- /dev/null +++ b/dashboardv3/public/css/scss/migration-style.scss @@ -0,0 +1,32 @@ +/* + * 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. + */ + +@import "__mixin.scss"; +@import "__variable.scss"; +@import "common.scss"; +@import "table.scss"; +@import "form.scss"; +@import "panel.scss"; +@import "loader.scss"; +@import "theme.scss"; +@import "stats.scss"; +@import "override.scss"; + +.initialLoading { + left: 0px !important; +} \ No newline at end of file diff --git a/dashboardv3/public/css/scss/stats.scss b/dashboardv3/public/css/scss/stats.scss index e96ee56..7a83249 100644 --- a/dashboardv3/public/css/scss/stats.scss +++ b/dashboardv3/public/css/scss/stats.scss @@ -121,6 +121,58 @@ } } +.statistics-header { + height: 50px; + width: 100%; + display: flex; + justify-content: center; + align-items: center; + position: fixed; + z-index: 999; + top: 0px; + padding: 0px 15px; + background: #fff; + border-bottom: 1px #e8e9ee solid; + box-shadow: 0 2px 6px 0 rgba(0, 0, 0, .05); + + &>div { + margin: 0px 5px; + } + + pre { + width: 100%; + padding: 5px 10px; + margin: 0px 10px; + color: $gray; + + .color { + color: $color_jungle_green_approx; + font-weight: bold; + } + } + + .progress { + width: 100%; + margin-top: 7px; + margin-bottom: 0px; + + .progress-bar-success { + background-color: $color_jungle_green_approx; + } + } + + .refresh-container { + background: white; + border-radius: 23px; + + .btn { + margin: 0px; + border-radius: 23px; + padding: 10px 10px; + } + } +} + .statistics-time-list { padding-right: 0px; width: 230px; diff --git a/dashboardv2/public/js/migration.js b/dashboardv3/public/js/migration.js similarity index 63% copy from dashboardv2/public/js/migration.js copy to dashboardv3/public/js/migration.js index fca59ce..abb748f 100644 --- a/dashboardv2/public/js/migration.js +++ b/dashboardv3/public/js/migration.js @@ -49,6 +49,13 @@ require.config({ 'deps': ['underscore', 'jquery'], 'exports': 'Backbone' }, + 'jquery-ui': { + 'deps': ['jquery'] + }, + 'asBreadcrumbs': { + 'deps': ['jquery'], + 'exports': 'asBreadcrumbs' + }, 'bootstrap': { 'deps': ['jquery'], 'exports': 'jquery' @@ -59,26 +66,79 @@ require.config({ 'marionette': { 'deps': ['backbone'] }, + 'backgrid': { + 'deps': ['backbone'], + 'exports': 'Backgrid' + }, + 'backgrid-paginator': { + 'deps': ['backbone', 'backgrid'] + }, + 'backgrid-filter': { + 'deps': ['backbone', 'backgrid'] + }, + 'backgrid-orderable': { + 'deps': ['backbone', 'backgrid'], + }, + 'backgrid-sizeable': { + 'deps': ['backbone', 'backgrid'], + }, + 'backgrid-select-all': { + 'deps': ['backbone', 'backgrid'] + }, + 'backgrid-columnmanager': { + 'deps': ['backbone', 'backgrid'], + }, 'hbs': { 'deps': ['underscore', 'handlebars'] }, + 'd3': { + 'exports': ['d3'] + }, + 'd3-tip': { + 'deps': ['d3'], + 'exports': ['d3-tip'] + }, + 'LineageHelper': { + 'deps': ['d3'], + }, + 'dagreD3': { + 'deps': ['d3'], + 'exports': ['dagreD3'] + }, + 'sparkline': { + 'deps': ['jquery'], + 'exports': ['sparkline'] + }, + 'pnotify': { + 'exports': ['pnotify'] + }, 'jquery-placeholder': { 'deps': ['jquery'] }, - 'jquery-ui': { + 'query-builder': { 'deps': ['jquery'] }, + 'daterangepicker': { + 'deps': ['jquery', 'moment'] + }, 'moment-timezone': { 'deps': ['moment'] }, 'moment': { 'exports': ['moment'] }, - 'pnotify': { - 'exports': ['pnotify'] + 'jstree': { + 'deps': ['jquery'] }, - 'd3': { - 'exports': ['d3'] + 'jquery-steps': { + 'deps': ['jquery'] + }, + 'DOMPurify': { + 'exports': 'DOMPurify' + }, + 'trumbowyg': { + 'deps': ['jquery'], + 'exports': 'trumbowyg' } }, @@ -90,20 +150,44 @@ require.config({ 'backbone.babysitter': 'libs/backbone.babysitter/lib/backbone.babysitter.min', 'marionette': 'libs/backbone-marionette/backbone.marionette.min', 'backbone.paginator': 'libs/backbone-paginator/backbone.paginator.min', + 'backbone.wreqr': 'libs/backbone-wreqr/backbone.wreqr.min', + 'backgrid': 'libs/backgrid/js/backgrid', + 'backgrid-filter': 'libs/backgrid-filter/js/backgrid-filter.min', + 'backgrid-orderable': 'libs/backgrid-orderable-columns/js/backgrid-orderable-columns', + 'backgrid-paginator': 'libs/backgrid-paginator/js/backgrid-paginator.min', + 'backgrid-sizeable': 'libs/backgrid-sizeable-columns/js/backgrid-sizeable-columns', + 'backgrid-columnmanager': 'external_lib/backgrid-columnmanager/js/Backgrid.ColumnManager', + 'asBreadcrumbs': 'libs/jquery-asBreadcrumbs/js/jquery-asBreadcrumbs.min', + 'd3': 'libs/d3/d3.min', + 'd3-tip': 'libs/d3/index', + 'LineageHelper': 'external_lib/atlas-lineage/dist/index', + 'dagreD3': 'libs/dagre-d3/dagre-d3.min', + 'sparkline': 'libs/sparkline/jquery.sparkline.min', 'tmpl': 'templates', 'requirejs.text': 'libs/requirejs-text/text', 'handlebars': 'external_lib/require-handlebars-plugin/js/handlebars', 'hbs': 'external_lib/require-handlebars-plugin/js/hbs', 'i18nprecompile': 'external_lib/require-handlebars-plugin/js/i18nprecompile', - 'jquery-placeholder': 'libs/jquery-placeholder/js/jquery.placeholder', - 'platform': 'libs/platform/platform', - 'pnotify': 'external_lib/pnotify/pnotify.custom.min', - 'pnotify.buttons': 'external_lib/pnotify/pnotify.custom.min', - 'pnotify.confirm': 'external_lib/pnotify/pnotify.custom.min', + 'select2': 'libs/select2/select2.full.min', + 'backgrid-select-all': 'libs/backgrid-select-all/backgrid-select-all.min', 'moment': 'libs/moment/js/moment.min', 'moment-timezone': 'libs/moment-timezone/moment-timezone-with-data.min', 'jquery-ui': 'external_lib/jquery-ui/jquery-ui.min', - 'd3': 'libs/d3/d3.min' + 'pnotify': 'external_lib/pnotify/pnotify.custom.min', + 'pnotify.buttons': 'external_lib/pnotify/pnotify.custom.min', + 'pnotify.confirm': 'external_lib/pnotify/pnotify.custom.min', + 'jquery-placeholder': 'libs/jquery-placeholder/js/jquery.placeholder', + 'platform': 'libs/platform/platform', + 'query-builder': 'libs/jQueryQueryBuilder/js/query-builder.standalone.min', + 'daterangepicker': 'libs/bootstrap-daterangepicker/js/daterangepicker', + 'table-dragger': 'libs/table-dragger/table-dragger', + 'jstree': 'libs/jstree/jstree.min', + 'jquery-steps': 'libs/jquery-steps/jquery.steps.min', + 'dropzone': 'libs/dropzone/js/dropzone-amd-module', + 'lossless-json': 'libs/lossless-json/lossless-json', + 'store': 'external_lib/idealTimeout/store.min', + 'DOMPurify': 'external_lib/dompurify/purify.min', + 'trumbowyg': 'external_lib/trumbowyg/trumbowyg' }, /** @@ -118,7 +202,8 @@ require.config({ require([ 'marionette', 'utils/Helper', - 'bootstrap' + 'bootstrap', + 'select2' ], function(Marionette, Helper) { var that = this; var App = new Marionette.Application(); diff --git a/dashboardv3/public/js/templates/migration/MigrationView_tmpl.html b/dashboardv3/public/js/templates/migration/MigrationView_tmpl.html new file mode 100644 index 0000000..67572fa --- /dev/null +++ b/dashboardv3/public/js/templates/migration/MigrationView_tmpl.html @@ -0,0 +1,17 @@ +<!-- + * 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. +--> +<div id="r_statisticsView" style="padding-top:60px;"></div> \ No newline at end of file diff --git a/dashboardv3/public/js/templates/site/Statistics_tmpl.html b/dashboardv3/public/js/templates/site/Statistics_tmpl.html index 5bf0a9c..646e37f 100644 --- a/dashboardv3/public/js/templates/site/Statistics_tmpl.html +++ b/dashboardv3/public/js/templates/site/Statistics_tmpl.html @@ -14,7 +14,18 @@ * See the License for the specific language governing permissions and * limitations under the License. --> -<div class="panel-group server-stats-container statsContainer hide" id="accordion"> +<div class="statistics-header col-md-12 hide"> + <div class="progress hide"> + <div class="progress-bar progress-bar-success progress-bar-striped" role="progressbar" aria-valuemin="0" aria-valuemax="100" data-id="migrationProgressBar"> + <span data-id="migrationProgressBarValue"></span> + </div> + </div> + <pre class="successStatus hide">Migration is <span class="color">successful</span>. To exit form migration mode, please remove <span class="color">atlas.migration.data.filename</span> property and restart Atlas.</pre> + <div class="refresh-container statisticsRefresh" data-id="statisticsRefresh"> + <button type="button" class="btn fa fa-refresh pull-right btn-sm btn-action" title="Refresh Data"></button> + </div> +</div> +<div class="panel-group server-stats-container statsContainer hide col-md-12" id="accordion"> <div class="panel panel-default custom-panel expand_collapse_panel-icon" data-id="entity"> <div class="panel-heading" data-toggle="collapse" href="#entityCountCollapse" aria-expanded="true"> <h4 class="panel-title"> @@ -89,7 +100,7 @@ </div> </div> <div class="col-sm-12"> - <div class="card-container panel panel-primary"> + <div class="card-container panel panel-primary hide" data-id="notificationDetails"> <div class="panel-heading">Notification Details</div> <div class="panel-body"> <table data-id="offset-card" class="table stat-table notification-table table-striped "> diff --git a/dashboardv3/public/js/utils/MigrationEnums.js b/dashboardv3/public/js/utils/MigrationEnums.js new file mode 100644 index 0000000..c89b9da --- /dev/null +++ b/dashboardv3/public/js/utils/MigrationEnums.js @@ -0,0 +1,32 @@ +/** + * 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. + */ + +define(['require'], function(require) { + 'use strict'; + + var Enums = {}; + + Enums.migrationStatus = { + STARTED: "STARTED", + IN_PROGRESS: "IN_PROGRESS", + FAIL: "FAIL", + DONE: "DONE" + } + + return Enums; +}); \ No newline at end of file diff --git a/dashboardv3/public/js/utils/UrlLinks.js b/dashboardv3/public/js/utils/UrlLinks.js index 0d64ada..b9a9c81 100644 --- a/dashboardv3/public/js/utils/UrlLinks.js +++ b/dashboardv3/public/js/utils/UrlLinks.js @@ -64,6 +64,9 @@ define(['require', 'utils/Enums', 'utils/Utils', 'underscore'], function(require regitrydataDefApiUrl: function(name) { return this.baseUrlV2 + '/entity/getRegistryData'; }, + migrationStatusApiUrl: function() { + return this.baseUrl + '/admin/status' + }, rootEntityDefUrl: function(name) { return this.baseUrlV2 + '/types/entitydef/name/' + name; }, diff --git a/dashboardv3/public/js/views/migration/MigrationView.js b/dashboardv3/public/js/views/migration/MigrationView.js new file mode 100644 index 0000000..e7000f3 --- /dev/null +++ b/dashboardv3/public/js/views/migration/MigrationView.js @@ -0,0 +1,68 @@ +/** + * 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. + */ + +define(['require', + 'backbone', + 'hbs!tmpl/migration/MigrationView_tmpl' +], function(require, Backbone, MigrationViewTmpl) { + 'use strict'; + + var ProfileLayoutView = Backbone.Marionette.LayoutView.extend( + /** @lends ProfileLayoutView */ + { + _viewName: 'MigrationView', + + template: MigrationViewTmpl, + + /** Layout sub regions */ + regions: { + RStatisticsView: "#r_statisticsView", + }, + /** ui selector cache */ + ui: {}, + /** ui events hash */ + events: function() {}, + /** + * intialize a new ProfileLayoutView Layout + * @constructs + */ + initialize: function(options) { + this.apiBaseUrl = this.getBaseUrl(window.location.pathname); + }, + bindEvents: function() {}, + getBaseUrl: function(url) { + var path = url.replace(/\/[\w-]+.(jsp|html)|\/+$/ig, ''), + splitPath = path.split("/"); + if (splitPath && splitPath[splitPath.length - 1] === "n") { + splitPath.pop(); + return splitPath.join("/"); + } + return path; + }, + onRender: function() { + var that = this; + require(["views/site/Statistics", "collection/VTagList", "utils/UrlLinks"], function(Statistics, VTagList, UrlLinks) { + that.metricCollection = new VTagList(); + that.metricCollection.url = UrlLinks.metricsApiUrl(); + that.metricCollection.modelAttrName = "data"; + that.RStatisticsView.show(new Statistics({ metricCollection: that.metricCollection, isMigrationView: true })); + }) + } + }); + return ProfileLayoutView; +}); \ No newline at end of file diff --git a/dashboardv3/public/js/views/site/Statistics.js b/dashboardv3/public/js/views/site/Statistics.js index 9eb714d..c4d4ace 100644 --- a/dashboardv3/public/js/views/site/Statistics.js +++ b/dashboardv3/public/js/views/site/Statistics.js @@ -28,11 +28,12 @@ define(['require', 'collection/VTagList', 'utils/CommonViewFunction', 'utils/Enums', + 'utils/MigrationEnums', 'moment', 'utils/Utils', 'utils/Globals', 'moment-timezone' -], function(require, Backbone, StatTmpl, StatsNotiTable, TopicOffsetTable, EntityTable, Modal, VCommon, UrlLinks, VTagList, CommonViewFunction, Enums, moment, Utils, Globals) { +], function(require, Backbone, StatTmpl, StatsNotiTable, TopicOffsetTable, EntityTable, Modal, VCommon, UrlLinks, VTagList, CommonViewFunction, Enums, MigrationEnums, moment, Utils, Globals) { 'use strict'; var StatisticsView = Backbone.Marionette.LayoutView.extend( @@ -56,10 +57,22 @@ define(['require', osCard: "[data-id='os-card']", runtimeCard: "[data-id='runtime-card']", memoryCard: "[data-id='memory-card']", - memoryPoolUsage: "[data-id='memory-pool-usage-card']" + memoryPoolUsage: "[data-id='memory-pool-usage-card']", + statisticsRefresh: "[data-id='statisticsRefresh']", + notificationDetails: "[data-id='notificationDetails']", + migrationProgressBar: "[data-id='migrationProgressBar']", + migrationProgressBarValue: "[data-id='migrationProgressBarValue']" }, /** ui events hash */ - events: function() {}, + events: function() { + var events = {}; + events["click " + this.ui.statisticsRefresh] = function(e) { + this.showLoader(); + this.fetchMetricData(); + this.fetchStatusData(); + }; + return events; + }, /** * intialize a new AboutAtlasView Layout * @constructs @@ -68,28 +81,35 @@ define(['require', _.extend(this, options); var that = this; this.DATA_MAX_LENGTH = 25; - var modal = new Modal({ - title: 'Statistics', - content: this, - okCloses: true, - okText: "Close", - showFooter: true, - allowCancel: false, - width: "60%", - headerButtons: [{ - title: "Refresh Data", - btnClass: "fa fa-refresh", - onClick: function() { - modal.$el.find('.header-button .fa-refresh').tooltip('hide').prop('disabled', true).addClass('fa-spin'); - that.fetchMetricData({ update: true }); - } - }] - }); - modal.on('closeModal', function() { - modal.trigger('cancel'); - }); - this.modal = modal; - modal.open(); + this.loaderCount = 0; + if (this.isMigrationView) { + this.migrationImportStatus = new VTagList(); + this.migrationImportStatus.url = UrlLinks.migrationStatusApiUrl(); + } else { + var modal = new Modal({ + title: 'Statistics', + content: this, + okCloses: true, + okText: "Close", + showFooter: true, + allowCancel: false, + width: "60%", + headerButtons: [{ + title: "Refresh Data", + btnClass: "fa fa-refresh", + onClick: function() { + modal.$el.find('.header-button .fa-refresh').tooltip('hide').prop('disabled', true).addClass('fa-spin'); + that.fetchMetricData({ update: true }); + } + }] + }); + modal.on('closeModal', function() { + modal.trigger('cancel'); + }); + this.modal = modal; + modal.open(); + } + }, bindEvents: function() { var that = this; @@ -99,8 +119,54 @@ define(['require', }) } }, + fetchStatusData: function() { + var that = this; + ++this.loaderCount; + that.migrationImportStatus.fetch({ + success: function(data) { + var data = _.first(data.toJSON()), + migrationStatus = data.MigrationStatus || null, + operationStatus = migrationStatus ? migrationStatus.operationStatus : null, + showProgress = true, + totalProgress = 0, + progressMessage = ""; + if (migrationStatus) { + if (MigrationEnums.migrationStatus[operationStatus] === "DONE") { + showProgress = false; + } else if (MigrationEnums.migrationStatus[operationStatus] === "IN_PROGRESS" || MigrationEnums.migrationStatus[operationStatus] === "STARTED") { + var currentIndex = migrationStatus.currentIndex || 0, + totalCount = migrationStatus.totalCount || 0; + totalProgress = Math.ceil((migrationStatus.currentIndex / migrationStatus.totalCount) * 100) + progressMessage = totalProgress + "%"; + that.ui.migrationProgressBar.removeClass("progress-bar-danger"); + that.ui.migrationProgressBar.addClass("progress-bar-success"); + } else if (MigrationEnums.migrationStatus[operationStatus] === "FAIL") { + totalProgress = "100"; + progressMessage = "Failed"; + that.ui.migrationProgressBar.addClass("progress-bar-danger"); + that.ui.migrationProgressBar.removeClass("progress-bar-success"); + } + if (showProgress) { + that.$el.find(".statistics-header>.progress").removeClass("hide"); + that.$el.find(".statistics-header>.successStatus").addClass("hide"); + that.ui.migrationProgressBar.css({ width: totalProgress + '%' }); + that.ui.migrationProgressBarValue.text(progressMessage); + } else { + that.$el.find(".statistics-header>.progress").addClass("hide"); + that.$el.find(".statistics-header>.successStatus").removeClass("hide"); + } + } + + }, + complete: function() { + --that.loaderCount; + that.hideLoader(); + } + }); + }, fetchMetricData: function(options) { var that = this; + ++this.loaderCount; this.metricCollection.fetch({ success: function(data) { var data = _.first(data.toJSON()); @@ -108,19 +174,45 @@ define(['require', that.renderEntities({ data: data }); that.renderSystemDeatils({ data: data }); that.renderClassifications({ data: data }); - that.$('.statsContainer,.statsNotificationContainer').removeClass('hide'); - that.$('.statsLoader,.statsNotificationLoader').removeClass('show'); if (options && options.update) { - that.modal.$el.find('.header-button .fa-refresh').prop('disabled', false).removeClass('fa-spin'); + if (that.modal) { + that.modal.$el.find('.header-button .fa-refresh').prop('disabled', false).removeClass('fa-spin'); + } Utils.notifySuccess({ content: "Metric data is refreshed" }) } + }, + complete: function() { + --that.loaderCount; + that.hideLoader() } }); }, + hideLoader: function() { + if (this.loaderCount === 0) { + var className = ".statsContainer"; + if (this.isMigrationView) { + className += ",.statistics-header"; + } + this.$(className).removeClass('hide'); + this.$('.statsLoader').removeClass('show'); + } + }, + showLoader: function() { + var className = ".statsContainer"; + if (this.isMigrationView) { + className += ",.statistics-header"; + } + this.$(className).addClass('hide'); + this.$('.statsLoader').addClass('show'); + }, onRender: function() { this.bindEvents(); + if (this.isMigrationView) { + this.showLoader(); + this.fetchStatusData(); + } this.fetchMetricData(); }, closePanel: function(options) { @@ -276,7 +368,7 @@ define(['require', }); return tableBody; }; - if (data.Notification) { + if (!that.isMigrationView && data.Notification) { var tableCol = [{ label: "Total <br> (from " + (that.getValue({ "value": data.Server["startTimeStamp"], @@ -344,6 +436,7 @@ define(['require', } }) ) + that.ui.notificationDetails.removeClass('hide'); } if (data.Server) { diff --git a/dashboardv3/public/migration-status.html.tpl b/dashboardv3/public/migration-status.html.tpl new file mode 100644 index 0000000..1e7c991 --- /dev/null +++ b/dashboardv3/public/migration-status.html.tpl @@ -0,0 +1,61 @@ +<!DOCTYPE html> +<!-- + * 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. +--> +<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]--> +<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]--> +<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]--> +<!--[if gt IE 7]> + <script src="js/external_lib/es5-shim.min.js?bust=<%- bust %>"></script> + <script src="js/external_lib/respond.min.js?bust=<%- bust %>"></script> +<![endif]--> +<!--[if gt IE 8]><!--> +<html class="no-js"> +<!--<![endif]--> + +<head> + <meta charset="utf-8" /> + <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> + <meta http-equiv="Content-Type" content="text/html; charset=utf-8;" /> + <title>Atlas</title> + <meta name="description" content="" /> + <meta name="viewport" content="width=device-width" /> + <link rel="shortcut icon" href="img/favicon.ico?bust=<%- bust %>" type="image/x-icon" /> + <link rel="icon" href="img/favicon.ico?bust=<%- bust %>" type="image/x-icon" /> + <!-- Place favicon.ico and apple-touch-icon.png in the root directory --> + <link rel="stylesheet" type="text/css" href="css/animate.min.css?bust=<%- bust %>" /> + <link rel="stylesheet" href="js/libs/backgrid/css/backgrid.css?bust=<%- bust %>" /> + <link rel="stylesheet" href="js/libs/bootstrap/css/bootstrap.min.css?bust=<%- bust %>" /> + <link rel="stylesheet" href="css/googlefonts.css?bust=<%- bust %>" type="text/css" /> + <link href="js/libs/font-awesome/css/font-awesome.min.css?bust=<%- bust %>" rel="stylesheet" /> + <link href="css/migration-style.css?bust=<%- bust %>" rel="stylesheet" /> +</head> + +<body> + <div class="page-wrapper"> + <div class="initialLoading"></div> + </div> + <!-- build:js scripts/main.js --> + <script data-main="js/migration.js?bust=<%- bust %>" src="js/libs/requirejs/require.js?bust=<%- bust %>"></script> + <!-- endbuild --> + <script type="text/javascript"> + var getBustValue = function() { + return "<%- bust %>"; + }; + </script> +</body> + +</html> \ No newline at end of file