[NO ISSUE] Asterixdb-dashboard baseline: - New design, with multiple input queries. - Visual query plans, and optimized query plans - Metadata inspector redesigned. - Data output applying nested data and big data navigation principles
Change-Id: I560911173486b0063fb4ffe9612a2ae2f1307c81 Reviewed-on: https://asterix-gerrit.ics.uci.edu/2755 Sonar-Qube: Jenkins <jenk...@fulliautomatix.ics.uci.edu> Tested-by: Jenkins <jenk...@fulliautomatix.ics.uci.edu> Integration-Tests: Jenkins <jenk...@fulliautomatix.ics.uci.edu> Reviewed-by: Ian Maxon <ima...@apache.org> Project: http://git-wip-us.apache.org/repos/asf/asterixdb/repo Commit: http://git-wip-us.apache.org/repos/asf/asterixdb/commit/3e5815a7 Tree: http://git-wip-us.apache.org/repos/asf/asterixdb/tree/3e5815a7 Diff: http://git-wip-us.apache.org/repos/asf/asterixdb/diff/3e5815a7 Branch: refs/heads/master Commit: 3e5815a7e35d46d43578e79e1d2e38bb62aa8740 Parents: a6bd8d1 Author: Emilio Jose Coronado Lopez <emilio.mob...@gmail.com> Authored: Fri Jul 13 15:02:30 2018 -0700 Committer: Ian Maxon <ima...@apache.org> Committed: Mon Jul 16 11:12:07 2018 -0700 ---------------------------------------------------------------------- .../api/http/server/QueryServiceServlet.java | 10 +- .../asterix/test/common/TestExecutor.java | 1 + .../src/node/.angular-cli.json | 69 --- .../asterix-dashboard/src/node/angular.json | 141 +++++ .../asterix-dashboard/src/node/karma.conf.js | 10 +- .../asterix-dashboard/src/node/package.json | 88 ++-- .../src/node/src/app/app-config.service.ts | 102 ++-- .../src/node/src/app/app.component.scss | 2 +- .../src/node/src/app/app.component.ts | 15 +- .../src/node/src/app/app.module.ts | 127 ++--- .../src/app/dashboard/appbar.component.html | 50 +- .../src/app/dashboard/appbar.component.scss | 72 +-- .../node/src/app/dashboard/appbar.component.ts | 12 +- .../src/app/dashboard/apptab.component.html | 11 +- .../src/app/dashboard/apptab.component.scss | 30 +- .../node/src/app/dashboard/apptab.component.ts | 11 +- .../metadata/codemirror-metadata.component.scss | 27 - .../metadata/codemirror-metadata.component.ts | 244 --------- .../dataset-create-dialog.component.html | 14 - .../dataset-create-dialog.component.scss | 18 - .../dataset-drop-dialog.component.html | 26 - .../dataset-drop-dialog.component.scss | 18 - .../datasets-collection/datasets.component.html | 112 ---- .../datasets-collection/datasets.component.scss | 415 --------------- .../datasets-collection/datasets.component.ts | 231 --------- .../datatype-create-dialog.component.html | 14 - .../datatype-create-dialog.component.scss | 18 - .../datatype-drop-dialog.component.html | 26 - .../datatype-drop-dialog.component.scss | 18 - .../datatypes.component.html | 70 --- .../datatypes.component.scss | 267 ---------- .../datatypes-collection/datatypes.component.ts | 220 -------- .../dataverses-create-dialog.component.html | 27 - .../dataverses-create-dialog.component.scss | 18 - .../dataverses-drop-dialog.component.html | 26 - .../dataverses-drop-dialog.component.scss | 18 - .../dataverses.component.html | 77 --- .../dataverses.component.scss | 259 ---------- .../dataverses.component.ts | 234 --------- .../index-create-dialog.component.html | 14 - .../index-create-dialog.component.scss | 18 - .../index-drop-dialog.component.html | 26 - .../index-drop-dialog.component.scss | 18 - .../indexes-collection/indexes.component.html | 94 ---- .../indexes-collection/indexes.component.scss | 398 --------------- .../indexes-collection/indexes.component.ts | 230 --------- .../metadata/input-metadata.component.html | 31 -- .../metadata/input-metadata.component.scss | 78 --- .../metadata/input-metadata.component.ts | 111 ---- .../metadata/metadata-container.component.html | 36 -- .../metadata/metadata-container.component.scss | 56 -- .../metadata/metadata-container.component.ts | 41 -- .../dashboard/query/codemirror.component.scss | 23 - .../app/dashboard/query/codemirror.component.ts | 237 --------- .../app/dashboard/query/input.component.html | 61 ++- .../app/dashboard/query/input.component.scss | 131 +++-- .../src/app/dashboard/query/input.component.ts | 416 ++++++++++++--- .../query/metadata-inspector.component.html | 22 + .../query/metadata-inspector.component.scss | 30 ++ .../app/dashboard/query/metadata.component.html | 81 +-- .../app/dashboard/query/metadata.component.scss | 123 +++-- .../app/dashboard/query/metadata.component.ts | 331 ++++++------ .../src/app/dashboard/query/ouput.component.ts | 278 ---------- .../app/dashboard/query/output.component.html | 66 +-- .../app/dashboard/query/output.component.scss | 161 +----- .../src/app/dashboard/query/output.component.ts | 91 ++++ .../query/plan-node-svg.component.html | 81 +++ .../query/plan-node-svg.component.scss | 230 +++++++++ .../dashboard/query/plan-node-svg.component.ts | 196 +++++++ .../dashboard/query/plan-view.component.html | 37 ++ .../dashboard/query/plan-view.component.scss | 98 ++++ .../app/dashboard/query/plan-view.component.ts | 113 ++++ .../query/query-container.component.html | 18 +- .../query/query-container.component.scss | 57 +-- .../query/query-container.component.ts | 73 +-- .../dashboard/query/tree-node.component.html | 40 ++ .../dashboard/query/tree-node.component.scss | 63 +++ .../app/dashboard/query/tree-node.component.ts | 104 ++++ .../dashboard/query/tree-view.component.html | 62 +++ .../dashboard/query/tree-view.component.scss | 141 +++++ .../app/dashboard/query/tree-view.component.ts | 332 ++++++++++++ .../asterix-dashboard/src/node/src/app/db.ts | 23 - .../src/node/src/app/material.module.ts | 125 ++--- .../node/src/app/shared/actions/app.actions.ts | 22 +- .../src/app/shared/actions/dataset.actions.ts | 77 ++- .../src/app/shared/actions/datatype.actions.ts | 71 ++- .../src/app/shared/actions/dataverse.actions.ts | 79 +-- .../src/app/shared/actions/index.actions.ts | 71 ++- .../src/app/shared/actions/metadata.actions.ts | 46 -- .../src/app/shared/actions/query.actions.ts | 69 ++- .../node/src/app/shared/effects/app.effects.ts | 24 + .../src/app/shared/effects/dataset.effects.ts | 22 +- .../src/app/shared/effects/datatype.effects.ts | 69 ++- .../src/app/shared/effects/dataverse.effects.ts | 34 +- .../src/app/shared/effects/index.effects.ts | 67 ++- .../src/app/shared/effects/metadata.effects.ts | 41 -- .../src/app/shared/effects/query.effects.ts | 51 +- .../src/app/shared/models/asterixDB.model.ts | 112 ---- .../src/node/src/app/shared/pipes/keys.pipe.ts | 25 - .../app/shared/pipes/objectArrayType.pipe.ts | 23 - .../src/app/shared/pipes/objectType.pipe.ts | 21 - .../node/src/app/shared/reducers/app.reducer.ts | 77 ++- .../src/app/shared/reducers/dataset.reducer.ts | 291 ++++++----- .../src/app/shared/reducers/datatype.reducer.ts | 255 +++++----- .../app/shared/reducers/dataverse.reducer.ts | 272 +++++----- .../src/app/shared/reducers/index.reducer.ts | 252 +++++---- .../src/node/src/app/shared/reducers/index.ts | 33 +- .../src/app/shared/reducers/metadata.reducer.ts | 56 -- .../shared/reducers/query-metadata.reducer.ts | 123 +++-- .../src/app/shared/reducers/query.reducer.ts | 172 ++++--- .../src/app/shared/services/app-core.service.ts | 38 -- .../shared/services/async-metadata.service.ts | 120 ----- .../app/shared/services/async-query.service.ts | 351 +++++++------ .../src/node/src/assets/feather.png | Bin 0 -> 138140 bytes .../src/node/src/assets/tree.svg | 16 + .../node/src/environments/environment.prod.ts | 2 +- .../src/node/src/environments/environment.ts | 2 +- .../asterix-dashboard/src/node/src/index.html | 14 +- .../asterix-dashboard/src/node/src/main.scss | 10 +- .../asterix-dashboard/src/node/src/main.ts | 4 +- .../asterix-dashboard/src/node/src/polyfills.ts | 2 +- .../src/node/src/styles/_constants.scss | 4 +- .../src/node/src/styles/_general.scss | 81 ++- .../asterix-dashboard/src/node/src/test.ts | 6 +- .../src/node/src/tsconfig.app.json | 24 +- .../src/node/src/tsconfig.spec.json | 37 +- .../asterix-dashboard/src/node/src/typings.d.ts | 4 +- .../asterix-dashboard/src/node/tslint.json | 1 - .../licenses/templates/3rdpartylicenses.txt | 509 ++++++++++--------- 129 files changed, 4589 insertions(+), 7234 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/asterixdb/blob/3e5815a7/asterixdb/asterix-app/src/main/java/org/apache/asterix/api/http/server/QueryServiceServlet.java ---------------------------------------------------------------------- diff --git a/asterixdb/asterix-app/src/main/java/org/apache/asterix/api/http/server/QueryServiceServlet.java b/asterixdb/asterix-app/src/main/java/org/apache/asterix/api/http/server/QueryServiceServlet.java index 714bb53..29da286 100644 --- a/asterixdb/asterix-app/src/main/java/org/apache/asterix/api/http/server/QueryServiceServlet.java +++ b/asterixdb/asterix-app/src/main/java/org/apache/asterix/api/http/server/QueryServiceServlet.java @@ -130,8 +130,9 @@ public class QueryServiceServlet extends AbstractQueryApiServlet { @Override protected void options(IServletRequest request, IServletResponse response) throws Exception { - response.setHeader("Access-Control-Allow-Origin", - "http://" + hostName + ":" + appCtx.getExternalProperties().getQueryWebInterfacePort()); + if (request.getHeader("Origin") != null) { + response.setHeader("Access-Control-Allow-Origin", request.getHeader("Origin")); + } response.setHeader("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept"); response.setStatus(HttpResponseStatus.OK); } @@ -520,8 +521,9 @@ public class QueryServiceServlet extends AbstractQueryApiServlet { optionalParams = optionalParamProvider.apply(request); } // CORS - response.setHeader("Access-Control-Allow-Origin", - "http://" + hostName + ":" + appCtx.getExternalProperties().getQueryWebInterfacePort()); + if (request.getHeader("Origin") != null) { + response.setHeader("Access-Control-Allow-Origin", request.getHeader("Origin")); + } response.setHeader("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept"); response.setStatus(execution.getHttpStatus()); executeStatement(statementsText, sessionOutput, resultProperties, stats, param, execution, optionalParams); http://git-wip-us.apache.org/repos/asf/asterixdb/blob/3e5815a7/asterixdb/asterix-app/src/test/java/org/apache/asterix/test/common/TestExecutor.java ---------------------------------------------------------------------- diff --git a/asterixdb/asterix-app/src/test/java/org/apache/asterix/test/common/TestExecutor.java b/asterixdb/asterix-app/src/test/java/org/apache/asterix/test/common/TestExecutor.java index 80048bd..b7fa3bb 100644 --- a/asterixdb/asterix-app/src/test/java/org/apache/asterix/test/common/TestExecutor.java +++ b/asterixdb/asterix-app/src/test/java/org/apache/asterix/test/common/TestExecutor.java @@ -594,6 +594,7 @@ public class TestExecutor { HttpUriRequest method = jsonEncoded ? constructPostMethodJson(str, uri, "statement", newParams) : constructPostMethodUrl(str, uri, "statement", newParams); // Set accepted output response type + method.setHeader("Origin", uri.getScheme() + uri.getAuthority()); method.setHeader("Accept", OutputFormat.CLEAN_JSON.mimeType()); HttpResponse response = executeHttpRequest(method); if (responseCodeValidator != null) { http://git-wip-us.apache.org/repos/asf/asterixdb/blob/3e5815a7/asterixdb/asterix-dashboard/src/node/.angular-cli.json ---------------------------------------------------------------------- diff --git a/asterixdb/asterix-dashboard/src/node/.angular-cli.json b/asterixdb/asterix-dashboard/src/node/.angular-cli.json deleted file mode 100755 index 7e41979..0000000 --- a/asterixdb/asterix-dashboard/src/node/.angular-cli.json +++ /dev/null @@ -1,69 +0,0 @@ -{ - "$schema": "./node_modules/@angular/cli/lib/config/schema.json", - "project": { - "name": "asterixdb-web-console" - }, - "apps": [ - { - "root": "src", - "outDir": "static", - "assets": [ - "assets", - "favicon.ico" - ], - "index": "index.html", - "main": "main.ts", - "polyfills": "polyfills.ts", - "test": "test.ts", - "tsconfig": "tsconfig.app.json", - "testTsconfig": "tsconfig.spec.json", - "prefix": "app", - "styles": [ - "main.scss", - "../node_modules/codemirror/lib/codemirror.css", - "../node_modules/codemirror/theme/monokai.css", - "../node_modules/primeng/resources/themes/omega/theme.css", - "../node_modules/primeng/resources/primeng.min.css" - ], - "scripts": [ - "../node_modules/codemirror/lib/codemirror.js" - ], - "environmentSource": "environments/environment.ts", - "environments": { - "dev": "environments/environment.ts", - "prod": "environments/environment.prod.ts" - } - } - ], - "e2e": { - "protractor": { - "config": "./protractor.conf.js" - } - }, - "lint": [ - { - "project": "src/tsconfig.app.json", - "exclude": "**/node_modules/**" - }, - { - "project": "src/tsconfig.spec.json", - "exclude": "**/node_modules/**" - }, - { - "project": "e2e/tsconfig.e2e.json", - "exclude": "**/node_modules/**" - } - ], - "test": { - "karma": { - "config": "./karma.conf.js" - } - }, - "defaults": { - "styleExt": "css", - "class": { - "spec": false - }, - "component": {} - } -} http://git-wip-us.apache.org/repos/asf/asterixdb/blob/3e5815a7/asterixdb/asterix-dashboard/src/node/angular.json ---------------------------------------------------------------------- diff --git a/asterixdb/asterix-dashboard/src/node/angular.json b/asterixdb/asterix-dashboard/src/node/angular.json new file mode 100644 index 0000000..5d9679a --- /dev/null +++ b/asterixdb/asterix-dashboard/src/node/angular.json @@ -0,0 +1,141 @@ +{ + "$schema": "./node_modules/@angular/cli/lib/config/schema.json", + "version": 1, + "newProjectRoot": "projects", + "projects": { + "asterixdb-web-console": { + "root": "", + "sourceRoot": "src", + "projectType": "application", + "architect": { + "build": { + "builder": "@angular-devkit/build-angular:browser", + "options": { + "outputPath": "static", + "index": "src/index.html", + "main": "src/main.ts", + "tsConfig": "src/tsconfig.app.json", + "polyfills": "src/polyfills.ts", + "assets": [ + "src/assets", + "src/favicon.ico" + ], + "styles": [ + "node_modules/codemirror/lib/codemirror.css", + "src/main.scss" + ], + "scripts": [ + "node_modules/codemirror/lib/codemirror.js" + ] + }, + "configurations": { + "production": { + "optimization": true, + "outputHashing": "all", + "sourceMap": false, + "extractCss": true, + "namedChunks": false, + "aot": true, + "extractLicenses": true, + "vendorChunk": false, + "buildOptimizer": true, + "fileReplacements": [ + { + "replace": "src/environments/environment.ts", + "with": "src/environments/environment.prod.ts" + } + ] + } + } + }, + "serve": { + "builder": "@angular-devkit/build-angular:dev-server", + "options": { + "browserTarget": "asterixdb-web-console:build" + }, + "configurations": { + "production": { + "browserTarget": "asterixdb-web-console:build:production" + } + } + }, + "extract-i18n": { + "builder": "@angular-devkit/build-angular:extract-i18n", + "options": { + "browserTarget": "asterixdb-web-console:build" + } + }, + "test": { + "builder": "@angular-devkit/build-angular:karma", + "options": { + "main": "src/test.ts", + "karmaConfig": "./karma.conf.js", + "polyfills": "src/polyfills.ts", + "tsConfig": "src/tsconfig.spec.json", + "scripts": [ + "node_modules/codemirror/lib/codemirror.js" + ], + "styles": [ + "node_modules/codemirror/lib/codemirror.css", + "src/main.scss" + ], + "assets": [ + "src/assets", + "src/favicon.ico" + ] + } + }, + "lint": { + "builder": "@angular-devkit/build-angular:tslint", + "options": { + "tsConfig": [ + "src/tsconfig.app.json", + "src/tsconfig.spec.json" + ], + "exclude": [ + "**/node_modules/**" + ] + } + } + } + }, + "asterixdb-web-console-e2e": { + "root": "", + "sourceRoot": "e2e", + "projectType": "application", + "architect": { + "e2e": { + "builder": "@angular-devkit/build-angular:protractor", + "options": { + "protractorConfig": "./protractor.conf.js", + "devServerTarget": "asterixdb-web-console:serve" + } + }, + "lint": { + "builder": "@angular-devkit/build-angular:tslint", + "options": { + "tsConfig": [ + "e2e/tsconfig.e2e.json" + ], + "exclude": [ + "**/node_modules/**" + ] + } + } + } + } + }, + "defaultProject": "asterixdb-web-console", + "schematics": { + "@schematics/angular:class": { + "spec": false + }, + "@schematics/angular:component": { + "prefix": "app", + "styleext": "css" + }, + "@schematics/angular:directive": { + "prefix": "app" + } + } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/asterixdb/blob/3e5815a7/asterixdb/asterix-dashboard/src/node/karma.conf.js ---------------------------------------------------------------------- diff --git a/asterixdb/asterix-dashboard/src/node/karma.conf.js b/asterixdb/asterix-dashboard/src/node/karma.conf.js index c9da2c5..2812405 100755 --- a/asterixdb/asterix-dashboard/src/node/karma.conf.js +++ b/asterixdb/asterix-dashboard/src/node/karma.conf.js @@ -18,24 +18,22 @@ limitations under the License. module.exports = function (config) { config.set({ basePath: '', - frameworks: ['jasmine', '@angular/cli'], + frameworks: ['jasmine', '@angular-devkit/build-angular'], plugins: [ require('karma-jasmine'), require('karma-chrome-launcher'), require('karma-jasmine-html-reporter'), require('karma-coverage-istanbul-reporter'), - require('@angular/cli/plugins/karma') + require('@angular-devkit/build-angular/plugins/karma') ], client:{ clearContext: false // leave Jasmine Spec Runner output visible in browser }, coverageIstanbulReporter: { - reports: [ 'html', 'lcovonly' ], + dir: require('path').join(__dirname, 'coverage'), reports: [ 'html', 'lcovonly' ], fixWebpackSourcePaths: true }, - angularCli: { - environment: 'dev' - }, + reporters: ['progress', 'kjhtml'], port: 9876, colors: true, http://git-wip-us.apache.org/repos/asf/asterixdb/blob/3e5815a7/asterixdb/asterix-dashboard/src/node/package.json ---------------------------------------------------------------------- diff --git a/asterixdb/asterix-dashboard/src/node/package.json b/asterixdb/asterix-dashboard/src/node/package.json index 051f182..d7a11ff 100755 --- a/asterixdb/asterix-dashboard/src/node/package.json +++ b/asterixdb/asterix-dashboard/src/node/package.json @@ -6,57 +6,57 @@ "ng": "ng", "start": "ng serve --proxy-config proxy.config.js --host 0.0.0.0", "build": "ng build --prod", - "mavenbuild": "node node_modules/.bin/ng build --prod -op static/ -d dashboard/", + "mavenbuild": "node node_modules/.bin/ng build --prod --output-path static/ --base-href /dashboard/", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e" }, "private": true, "dependencies": { - "@angular-devkit/core": "^0.6.1", - "@angular/animations": "^5.0.3", - "@angular/cdk": "^5.0.0-rc.2", - "@angular/common": "^5.0.3", - "@angular/compiler": "^5.0.3", - "@angular/core": "^5.0.3", - "@angular/forms": "^5.0.3", - "@angular/http": "^5.0.3", - "@angular/material": "^5.0.0-rc.2", - "@angular/platform-browser": "^5.0.3", - "@angular/platform-browser-dynamic": "^5.0.3", - "@angular/router": "^5.0.3", - "@ngrx/db": "^2.0.2", - "@ngrx/effects": "^4.1.0", - "@ngrx/entity": "^4.1.0", - "@ngrx/store": "^4.1.0", - "@ngrx/store-devtools": "^4.0.0", - "codemirror": "^5.31.0", - "core-js": "^2.4.1", - "file-saver": "^1.3.3", - "hammerjs": "^2.0.8", - "primeng": "^4.3.0", - "rxjs": "^5.5.2", - "zone.js": "^0.8.18" + "@angular-devkit/core": "0.6.8", + "@angular/animations": "6.0.7", + "@angular/cdk": "6.3.3", + "@angular/common": "6.0.7", + "@angular/compiler": "6.0.7", + "@angular/core": "6.0.7", + "@angular/forms": "6.0.7", + "@angular/http": "6.0.7", + "@angular/material": "6.3.3", + "@angular/platform-browser": "6.0.7", + "@angular/platform-browser-dynamic": "6.0.7", + "@angular/router": "6.0.7", + "@ngrx/effects": "6.0.0", + "@ngrx/entity": "6.0.0", + "@ngrx/store": "6.0.0", + "@ngrx/store-devtools": "6.0.0", + "codemirror": "5.31.0", + "core-js": "2.4.1", + "file-saver": "1.3.3", + "hammerjs": "2.0.8", + "rxjs": "6.2.1", + "rxjs-compat": "6.2.1", + "zone.js": "0.8.26" }, "devDependencies": { - "@angular/cli": "1.5.4", - "@angular/compiler-cli": "^5.0.3", - "@angular/language-service": "^5.0.0", - "@types/file-saver": "^1.3.0", - "@types/jasmine": "~2.5.53", - "@types/jasminewd2": "~2.0.2", - "@types/node": "~6.0.60", - "jasmine-core": "~2.6.2", - "jasmine-spec-reporter": "~4.1.0", - "karma": "~1.7.0", - "karma-chrome-launcher": "~2.1.1", - "karma-cli": "~1.0.1", - "karma-coverage-istanbul-reporter": "^1.2.1", - "karma-jasmine": "~1.1.0", - "karma-jasmine-html-reporter": "^0.2.2", - "protractor": "~5.1.2", - "ts-node": "^3.2.2", - "tslint": "^5.7.0", - "typescript": "^2.4.2" + "@angular/cli": "6.0.8", + "@angular/compiler-cli": "6.0.7", + "@angular/language-service": "6.0.7", + "@types/file-saver": "1.3.0", + "@types/jasmine": "2.5.53", + "@types/jasminewd2": "2.0.2", + "@types/node": "6.0.60", + "jasmine-core": "2.6.2", + "jasmine-spec-reporter": "4.1.0", + "karma": "1.7.0", + "karma-chrome-launcher": "2.1.1", + "karma-cli": "1.0.1", + "karma-coverage-istanbul-reporter": "1.2.1", + "karma-jasmine": "1.1.0", + "karma-jasmine-html-reporter": "0.2.2", + "protractor": "5.1.2", + "ts-node": "3.2.2", + "tslint": "5.7.0", + "typescript": "2.7.2", + "@angular-devkit/build-angular": "0.6.8" } } http://git-wip-us.apache.org/repos/asf/asterixdb/blob/3e5815a7/asterixdb/asterix-dashboard/src/node/src/app/app-config.service.ts ---------------------------------------------------------------------- diff --git a/asterixdb/asterix-dashboard/src/node/src/app/app-config.service.ts b/asterixdb/asterix-dashboard/src/node/src/app/app-config.service.ts index 87a0c2b..5227227 100755 --- a/asterixdb/asterix-dashboard/src/node/src/app/app-config.service.ts +++ b/asterixdb/asterix-dashboard/src/node/src/app/app-config.service.ts @@ -1,3 +1,5 @@ + +import {throwError as observableThrowError, Observable } from 'rxjs'; /* Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. @@ -12,64 +14,58 @@ See the License for the specific language governing permissions and limitations under the License. */ import { Injectable } from '@angular/core'; -import { Observable } from 'rxjs/Observable'; -import { - Http, - Headers, - RequestOptions -} from '@angular/http'; +import { Http, Headers, RequestOptions } from '@angular/http'; +import 'rxjs/add/operator/map'; +import 'rxjs/add/operator/catch'; @Injectable() export class ConfigService { - private config: Object - private env: Object - - constructor(private http: Http) {} - - /** - * Loads the environment config file first. Reads the environment variable from the file - * and based on that loads the appropriate configuration file - development or production - */ - load() { - return new Promise((resolve, reject) => { - let headers = new Headers({ 'Accept': 'application/json', 'Content-Type': 'application/json', 'DataType': 'application/json' }); - let options = new RequestOptions({ headers: headers }); - - this.http.get('/config/env.json') - .map(res => res.json()) - .subscribe((env_data) => { - this.env = env_data; + private config: Object + private env: Object - this.http.get('/config/' + env_data.env + '.json') - .map(res => res.json()) - .catch((error: any) => { - return Observable.throw(error.json().error || 'Server error'); - }) - .subscribe((data) => { - this.config = data; - resolve(true); - }); - }); + constructor(private http: Http) {} + /** + * Loads the environment config file first. Reads the environment variable from the file + * and based on that loads the appropriate configuration file - development or production + */ + load() { + return new Promise((resolve, reject) => { + let headers = new Headers({ 'Accept': 'application/json', 'Content-Type': 'application/json', 'DataType': 'application/json' }); + let options = new RequestOptions({ headers: headers }); + this.http.get('/config/env.json') + .map(res => res.json()) + .subscribe((env_data) => { + this.env = env_data; - }); - } + this.http.get('/config/' + env_data.env + '.json') + .map(res => res.json()) + .catch((error: any) => { + return observableThrowError(error.json().error || 'Server error'); + }) + .subscribe((data) => { + this.config = data; + resolve(true); + }); + }); + }); + } - /** - * Returns environment variable based on given key - * - * @param key - */ - getEnv(key: any) { - return this.env[key]; - } + /** + * Returns environment variable based on given key + * + * @param key + */ + getEnv(key: any) { + return this.env[key]; + } - /** - * Returns configuration value based on given key - * - * @param key - */ - get(key: any) { - return this.config[key]; - } -} + /** + * Returns configuration value based on given key + * + * @param key + */ + get(key: any) { + return this.config[key]; + } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/asterixdb/blob/3e5815a7/asterixdb/asterix-dashboard/src/node/src/app/app.component.scss ---------------------------------------------------------------------- diff --git a/asterixdb/asterix-dashboard/src/node/src/app/app.component.scss b/asterixdb/asterix-dashboard/src/node/src/app/app.component.scss index b01fcf5..7ce2d58 100755 --- a/asterixdb/asterix-dashboard/src/node/src/app/app.component.scss +++ b/asterixdb/asterix-dashboard/src/node/src/app/app.component.scss @@ -11,4 +11,4 @@ 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. */ -// Place holder for future expansion \ No newline at end of file +// Place holder for future expansion http://git-wip-us.apache.org/repos/asf/asterixdb/blob/3e5815a7/asterixdb/asterix-dashboard/src/node/src/app/app.component.ts ---------------------------------------------------------------------- diff --git a/asterixdb/asterix-dashboard/src/node/src/app/app.component.ts b/asterixdb/asterix-dashboard/src/node/src/app/app.component.ts index a913109..6cd84a9 100755 --- a/asterixdb/asterix-dashboard/src/node/src/app/app.component.ts +++ b/asterixdb/asterix-dashboard/src/node/src/app/app.component.ts @@ -12,20 +12,19 @@ See the License for the specific language governing permissions and limitations under the License. */ import { Component } from '@angular/core'; -import { AppCoreService } from './shared/services/app-core.service' /* * Root component * Defines AsterixDB Dashboard application's layout */ @Component({ - selector: 'awc-root', - templateUrl: './app.component.html', - styleUrls: ['./app.component.scss'] + selector: 'awc-root', + templateUrl: './app.component.html', + styleUrls: ['./app.component.scss'] }) + export class AppComponent { - title = 'Asterix DB Web Console'; + title = 'Asterix DB Web Console'; - constructor(private appCoreService: AppCoreService) { - } -} + constructor() {} +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/asterixdb/blob/3e5815a7/asterixdb/asterix-dashboard/src/node/src/app/app.module.ts ---------------------------------------------------------------------- diff --git a/asterixdb/asterix-dashboard/src/node/src/app/app.module.ts b/asterixdb/asterix-dashboard/src/node/src/app/app.module.ts index 11c8602..e49d8e2 100755 --- a/asterixdb/asterix-dashboard/src/node/src/app/app.module.ts +++ b/asterixdb/asterix-dashboard/src/node/src/app/app.module.ts @@ -11,6 +11,9 @@ 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 { NgModule } from '@angular/core'; +import { AppComponent } from './app.component'; +import { AppEffects } from './shared/effects/app.effects'; import { BrowserModule } from '@angular/platform-browser'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { HttpClientModule } from '@angular/common/http'; @@ -20,102 +23,54 @@ import { DatasetEffects } from './shared/effects/dataset.effects'; import { DatatypeEffects } from './shared/effects/datatype.effects'; import { IndexEffects } from './shared/effects/index.effects'; import { SQLQueryEffects } from './shared/effects/query.effects'; -import { MetadataEffects } from './shared/effects/metadata.effects'; -import { AppComponent } from './app.component'; import { AppBarComponent } from './dashboard/appbar.component'; -import { DataverseCollection } from './dashboard/metadata/dataverses-collection/dataverses.component'; -import { DatasetCollection } from './dashboard/metadata/datasets-collection/datasets.component'; -import { DatatypeCollection } from './dashboard/metadata/datatypes-collection/datatypes.component'; -import { CodemirrorComponent } from './dashboard/query/codemirror.component'; -import { CodemirrorMetadataComponent } from './dashboard/metadata/codemirror-metadata.component'; -import { IndexCollection } from './dashboard/metadata/indexes-collection/indexes.component'; -import { MetadataContainerComponent } from './dashboard/metadata/metadata-container.component'; -import { MetadataComponent } from './dashboard/query/metadata.component'; +import { DialogMetadataInspector, MetadataComponent } from './dashboard/query/metadata.component'; import { QueryContainerComponent } from './dashboard/query/query-container.component'; import { InputQueryComponent } from './dashboard/query/input.component'; -import { InputQueryMetadataComponent } from './dashboard/metadata/input-metadata.component'; -import { QueryOutputComponent, SafeHtmlPipe } from './dashboard/query/ouput.component'; +import { QueryOutputComponent } from './dashboard/query/output.component'; import { AppTabComponent } from './dashboard/apptab.component'; -import { KeysPipe } from './shared/pipes/keys.pipe'; -import { ObjectTypePipe } from './shared/pipes/objectType.pipe'; -import { ObjectArrayTypePipe } from './shared/pipes/objectArrayType.pipe'; import { reducers } from './shared/reducers'; import { SQLService } from './shared/services/async-query.service' -import { AppCoreService } from './shared/services/app-core.service' -import { MetadataService } from './shared/services/async-metadata.service' -import { DBModule } from '@ngrx/db'; import { FormsModule } from '@angular/forms'; import { MaterialModule } from './material.module'; -import { NgModule } from '@angular/core'; import { StoreModule, } from '@ngrx/store'; import { StoreDevtoolsModule } from '@ngrx/store-devtools'; -import { schema } from './db'; -import { DataTableModule, SharedModule } from 'primeng/primeng'; -import { TreeModule, TreeNode} from 'primeng/primeng'; -import { DialogCreateDataverse, DialogDropDataverse } from './dashboard/metadata/dataverses-collection/dataverses.component'; -import { DialogCreateDataset, DialogDropDataset } from './dashboard/metadata/datasets-collection/datasets.component'; -import { DialogCreateDatatype, DialogDropDatatype } from './dashboard/metadata/datatypes-collection/datatypes.component'; -import { DialogCreateIndex, DialogDropIndex } from './dashboard/metadata/indexes-collection/indexes.component'; - - +import { PlanViewComponent } from './dashboard/query/plan-view.component'; +import { PlanNodeSVGComponent } from './dashboard/query/plan-node-svg.component'; +import { TreeNodeComponent } from './dashboard/query/tree-node.component'; +import { TreeViewComponent } from './dashboard/query/tree-view.component'; @NgModule({ - declarations: [ - AppComponent, - AppBarComponent, - InputQueryComponent, - InputQueryMetadataComponent, - QueryOutputComponent, - CodemirrorComponent, - CodemirrorMetadataComponent, - DataverseCollection, - DatasetCollection, - DatatypeCollection, - IndexCollection, - KeysPipe, - MetadataContainerComponent, - MetadataComponent, - QueryContainerComponent, - AppTabComponent, - ObjectTypePipe, - ObjectArrayTypePipe, - DialogCreateDataverse, - DialogDropDataverse, - DialogCreateDataset, - DialogDropDataset, - DialogCreateDatatype, - DialogDropDatatype, - DialogCreateIndex, - DialogDropIndex, - SafeHtmlPipe - ], - imports: [ - TreeModule, - DataTableModule, - SharedModule, - FormsModule, - BrowserModule, - BrowserAnimationsModule, - DBModule.provideDB(schema), - EffectsModule.forRoot([MetadataEffects, DataverseEffects, DatasetEffects, DatatypeEffects, IndexEffects, SQLQueryEffects]), - HttpClientModule, - MaterialModule, - StoreModule.forRoot(reducers), - StoreDevtoolsModule.instrument({ - maxAge: 10 - }) - ], - entryComponents: [ - DialogCreateDataverse, - DialogDropDataverse, - DialogCreateDataset, - DialogDropDataset , - DialogCreateDatatype, - DialogDropDatatype, - DialogCreateIndex, - DialogDropIndex - ], - providers: [AppCoreService, SQLService, MetadataService], - bootstrap: [AppComponent] + declarations: [ + AppComponent, + AppBarComponent, + InputQueryComponent, + QueryOutputComponent, + MetadataComponent, + QueryContainerComponent, + AppTabComponent, + DialogMetadataInspector, + PlanNodeSVGComponent, + PlanViewComponent, + TreeNodeComponent, + TreeViewComponent, + ], + imports: [ + FormsModule, + BrowserModule, + BrowserAnimationsModule, + EffectsModule.forRoot([AppEffects, DataverseEffects, DatasetEffects, DatatypeEffects, IndexEffects, SQLQueryEffects]), + HttpClientModule, + MaterialModule, + StoreModule.forRoot(reducers), + StoreDevtoolsModule.instrument({ + maxAge: 10 + }) + ], + entryComponents: [ + DialogMetadataInspector + ], + providers: [SQLService], + bootstrap: [AppComponent] }) -export class AppModule { } +export class AppModule {} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/asterixdb/blob/3e5815a7/asterixdb/asterix-dashboard/src/node/src/app/dashboard/appbar.component.html ---------------------------------------------------------------------- diff --git a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/appbar.component.html b/asterixdb/asterix-dashboard/src/node/src/app/dashboard/appbar.component.html index 3662c54..290fd55 100755 --- a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/appbar.component.html +++ b/asterixdb/asterix-dashboard/src/node/src/app/dashboard/appbar.component.html @@ -12,34 +12,28 @@ See the License for the specific language governing permissions and limitations under the License. */ --> <header class="awc-navbar"> + <mat-divider [vertical]="true"></mat-divider> + <a routerLink="/" aria-label="AsterixDB Web Console"> + <img class="awc-asterixDB-logo" src="./assets/asterixdb_tm.png" alt="AsterixDB"> + </a> + <div class="flex-spacer"></div> <nav class="awc-navbar-header"> - <a mat-button class="awc-button" routerLink="/" aria-label="AsterixDB Web Console"> - <img class="awc-asterixDB-logo" - src="dashboard/assets/asterixdb_tm.png" - alt="AsterixDB"> - <span>Administration Console</span> - </a> - <div class="flex-spacer"></div> - <a mat-button class="awc-button awc-navbar-hide-small" href="https://asterixDB.apache.org" - aria-label="WEBSITE"> - WEBSITE - </a> - <a mat-button class="awc-button awc-navbar-hide-small" href="https://issues.apache.org/jira/browse/ASTERIXDB" - aria-label="FILE ISSUES"> - FILE ISSUES - </a> - <a mat-button class="awc-button awc-navbar-hide-small" href="https://ci.apache.org/projects/asterixdb/index.html" - aria-label="DOCUMENTATION"> - DOCUMENTATION - </a> - <a mat-button class="awc-button docs-navbar-hide-small" href="https://asterixdb.apache.org/community.html" - aria-label="CONTACT"> - CONTACT - </a> - - <a mat-button class="awc-button docs-navbar-hide-small" href="https://github.com/apache/asterixdb/" - aria-label="GITHUB"> - GITHUB - </a> + <div class="menu"> + <a mat-button class="menu awc-button awc-navbar-hide-small" href="https://asterixDB.apache.org" aria-label="WEBSITE"> + WEBSITE + </a> + <a mat-button class="menu awc-button awc-navbar-hide-small" href="https://issues.apache.org/jira/browse/ASTERIXDB" aria-label="FILE ISSUES"> + FILE ISSUES + </a> + <a mat-button class="menu awc-button awc-navbar-hide-small" href="https://ci.apache.org/projects/asterixdb/index.html" aria-label="DOCUMENTATION"> + DOCUMENTATION + </a> + <a mat-button class="menu awc-button docs-navbar-hide-small" href="https://asterixdb.apache.org/community.html" aria-label="CONTACT"> + CONTACT + </a> + <a mat-button class="menu awc-button docs-navbar-hide-small" href="https://github.com/apache/asterixdb/" aria-label="GITHUB"> + GITHUB + </a> + </div> </nav> </header> http://git-wip-us.apache.org/repos/asf/asterixdb/blob/3e5815a7/asterixdb/asterix-dashboard/src/node/src/app/dashboard/appbar.component.scss ---------------------------------------------------------------------- diff --git a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/appbar.component.scss b/asterixdb/asterix-dashboard/src/node/src/app/dashboard/appbar.component.scss index 8a764e6..288bdb9 100755 --- a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/appbar.component.scss +++ b/asterixdb/asterix-dashboard/src/node/src/app/dashboard/appbar.component.scss @@ -11,52 +11,64 @@ 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. */ + .awc-navbar { - a { - //color: #f0f0f0; - text-decoration: none; - } + a { + text-decoration: none; + } + display: flex; + flex-flow: row; + justify-content: space-between; + border-bottom: 1px solid hsla(0, 0%, 0%, .10); + margin: 0px; + height: 50px; + width: 100%; + padding: 5px; + background-color : white; +} - border-bottom: 1px solid hsla(0,0%,0%,.10); - overflow: hidden; +.menu { + font-size: 13px; } .awc-navbar-header { - display: flex; - flex-wrap: wrap; - align-items: center; - padding: 8px 16px; - - > .mat-button { - &:last-child { - margin-left: auto; - } - } + display: flex; + align-items: center; + margin: 0; + padding: 0; } .flex-spacer { - flex-grow: 1; + flex: 1 1 40%; } .awc-asterixDB-logo { - height: 26px; - margin: 0 4px 3px 0; - vertical-align: middle; + height: 26px; + margin: 0 4px 3px 0; + margin-left: 15px; + margin-top: 10px; } .awc-github-logo { - height: 21px; - margin: 0 7px 2px 0; - vertical-align: middle; + height: 21px; + margin: 0 7px 2px 0; + vertical-align: middle; } .awc-navbar-link { - text-decoration: inherit; - flex: 1; + text-decoration: inherit; + flex: 1; } -/* -* Rules for when the device is detected to be a small screen. -* Moves content two rows instead of one. -*/ -//@media (max-width: 720px) {} +.menu { + /deep/ .mat-tab-label { + font-size: 0.80rem !important; + font-weight: 500 !important; + } +} + +.menu-icon { + margin: 0; + margin-right: 15px; + margin-left: 5px; +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/asterixdb/blob/3e5815a7/asterixdb/asterix-dashboard/src/node/src/app/dashboard/appbar.component.ts ---------------------------------------------------------------------- diff --git a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/appbar.component.ts b/asterixdb/asterix-dashboard/src/node/src/app/dashboard/appbar.component.ts index 563ed11..7df060a 100755 --- a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/appbar.component.ts +++ b/asterixdb/asterix-dashboard/src/node/src/app/dashboard/appbar.component.ts @@ -14,12 +14,10 @@ limitations under the License. import { Component } from '@angular/core'; @Component({ - moduleId: module.id, - selector: 'awc-bar', - templateUrl: 'appbar.component.html', - styleUrls: ['appbar.component.scss'] + moduleId: module.id, + selector: 'awc-bar', + templateUrl: 'appbar.component.html', + styleUrls: ['appbar.component.scss'] }) -export class AppBarComponent { - constructor() {} -} +export class AppBarComponent {} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/asterixdb/blob/3e5815a7/asterixdb/asterix-dashboard/src/node/src/app/dashboard/apptab.component.html ---------------------------------------------------------------------- diff --git a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/apptab.component.html b/asterixdb/asterix-dashboard/src/node/src/app/dashboard/apptab.component.html index bd5c963..4514ea2 100755 --- a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/apptab.component.html +++ b/asterixdb/asterix-dashboard/src/node/src/app/dashboard/apptab.component.html @@ -11,13 +11,4 @@ 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 class="content"> - <mat-tab-group class="menu"> - <mat-tab label=">_ QUERY"> - <awc-query-container></awc-query-container> - </mat-tab> - <mat-tab label="METADATA"> - <awc-metadata-container></awc-metadata-container> - </mat-tab> - </mat-tab-group> -</div> +<awc-query-container></awc-query-container> \ No newline at end of file http://git-wip-us.apache.org/repos/asf/asterixdb/blob/3e5815a7/asterixdb/asterix-dashboard/src/node/src/app/dashboard/apptab.component.scss ---------------------------------------------------------------------- diff --git a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/apptab.component.scss b/asterixdb/asterix-dashboard/src/node/src/app/dashboard/apptab.component.scss index 4d6fb7b..e827432 100755 --- a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/apptab.component.scss +++ b/asterixdb/asterix-dashboard/src/node/src/app/dashboard/apptab.component.scss @@ -11,16 +11,28 @@ 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. */ -.content { - width:95%; - margin: 0 auto; -} -.menu { - /deep/ .mat-tab-label { - font-size: 0.80rem !important; - font-weight: 500 !important; - } +.query-tab { + display: flex; + flex-flow: column; + width: 100%; + min-height: 900px; + margin: 0; + margin-bottom: 5px; + padding: 0; + background-color: gainsboro; + color: white; } +.flex-spacer { + flex: 1 1 40%; +} +.menu { + /deep/ .mat-tab-label { + font-size: 0.80rem !important; + font-weight: 500 !important; + color: white; + } + background-color: blue; +} http://git-wip-us.apache.org/repos/asf/asterixdb/blob/3e5815a7/asterixdb/asterix-dashboard/src/node/src/app/dashboard/apptab.component.ts ---------------------------------------------------------------------- diff --git a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/apptab.component.ts b/asterixdb/asterix-dashboard/src/node/src/app/dashboard/apptab.component.ts index b4db7f4..db53f55 100755 --- a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/apptab.component.ts +++ b/asterixdb/asterix-dashboard/src/node/src/app/dashboard/apptab.component.ts @@ -12,14 +12,13 @@ See the License for the specific language governing permissions and limitations under the License. */ import { Component } from '@angular/core'; -import { Store } from '@ngrx/store'; @Component({ - selector: 'awc-tab', - templateUrl: 'apptab.component.html', - styleUrls: ['apptab.component.scss'] + selector: 'awc-tab', + templateUrl: 'apptab.component.html', + styleUrls: ['apptab.component.scss'] }) export class AppTabComponent { - constructor(private store: Store<any>) {}; -} + constructor() {}; +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/asterixdb/blob/3e5815a7/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/codemirror-metadata.component.scss ---------------------------------------------------------------------- diff --git a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/codemirror-metadata.component.scss b/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/codemirror-metadata.component.scss deleted file mode 100755 index 9812ecb..0000000 --- a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/codemirror-metadata.component.scss +++ /dev/null @@ -1,27 +0,0 @@ -/* -Licensed 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. -*/ -.textarea-metadata { - background-color: red !important; - border: 1px solid black !important; - padding: 0; - margin: 0; -} - -codemirror-metadata { - border: 1px solid #eee; - height: auto; - background-color: blue !important; - padding: 0; - margin: 0; -} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/asterixdb/blob/3e5815a7/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/codemirror-metadata.component.ts ---------------------------------------------------------------------- diff --git a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/codemirror-metadata.component.ts b/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/codemirror-metadata.component.ts deleted file mode 100755 index aed6ddf..0000000 --- a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/codemirror-metadata.component.ts +++ /dev/null @@ -1,244 +0,0 @@ -/* -Licensed 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. -*/ -/** - * Integrating codemirror (using ng2-codemirror) with our application - * - * component from "https://runkit.com/npm/ng2-codemirror" - * "https://www.npmjs.com/package/ng2-codemirror" - * copy component from /src/codemirror.component.ts - * and modified for custom mode (asterix aql, sql++ code hilighting) - * - * therefore, actually we don't need to "npm install ng2-codemirror" - * - * Because on the outside of this component, - * It was hard to access the codemirror instance that 'ng-codemirror' use - * So, we copied the component in our application and modified it - * - * 'codemirror.js(^5.23.0)' is included in the 'index.html' - * And in this component(codemirror.component.ts) - * add statement like "declare var CodeMirror: any;" - * - * I don't know whether this is right way - * - * ref 1) usage : https://embed.plnkr.co/8e9gxss9u10VeFrv29Zt/ - * ref 2) custom mode : http://jsfiddle.net/TcqAf/99/ - * ref 3) integrating : http://stackoverflow.com/questions/37092142/integrating-codemirror-with-angular2-typescript - * ref 3) integrating : https://medium.com/@s_eschweiler/using-external-libraries-with-angular-2-87e06db8e5d1#.8ok74uvwg - */ -import { - Component, - Input, - Output, - ElementRef, - ViewChild, - EventEmitter, - forwardRef, - AfterViewInit, - OnDestroy, - ChangeDetectionStrategy - } from '@angular/core'; - import { NG_VALUE_ACCESSOR } from '@angular/forms'; - import * as CodeMirrorMetadata from 'codemirror'; - - /** - * CodeMirror component - * Usage : - * <codemirror [(ngModel)]="data" [config]="{...}"></codemirror> - */ - @Component({ - moduleId: module.id, - selector: 'codemirror-metadata', - providers: [ - { - provide: NG_VALUE_ACCESSOR, - useExisting: forwardRef(() => CodemirrorMetadataComponent), - multi: true - } - ], - styleUrls: ['codemirror-metadata.component.scss'], - template: `<textarea class="textarea-metadata" #hostMetadata></textarea>`,//, - }) - -export class CodemirrorMetadataComponent implements AfterViewInit, OnDestroy { - @Input() config; - @Output() change = new EventEmitter(); - @Output() focus = new EventEmitter(); - @Output() blur = new EventEmitter(); - @Output() instance = null; - @ViewChild('hostMetadata') hostMetadata; - _value = ''; - - /** - * Constructor - */ - constructor(){ - /** - * Custom mode for AsterixDB - */ - CodeMirrorMetadata.defineMode("asterix", function(){ - var KEYWORD_MATCH = [ - // AQL - "drop", "dataverse", "dataset", - "if", "exists", "create", - "use", "type", "as", "closed", - "primary", "key", "hints", "cardinality", - "index", "on", "btree", "rtree", "keyword", - "for", "in", "Metadata", "Dataset", - "return", "Index", "load", "using", "localfs", "path", "format", - // Query (not perfect) - "from", "in", "with", "group", "by", "select", - "let", "where", "order", "asc", "desc", "limit", - "keeping", "offset", "distinct", "or", "and", - // Built in functions (TODO) - // Built in functions (TODO) - // Built in functions (TODO) - // Asterix Data Model - // Primitive type - "boolean", - "tinyint", "smallint", "integer", "bigint", - "float", "double", - "string", - "binary", "hex", "base64", - "point", "line", "rectangle", "circle", "polygon", - "date", "time", "datetime", "duration", "interval", "uuid", - // Incomplete information type - "null", "missing", - // Derived type - // object {}, array [], multiset {{}} - // SQL++ - "DROP", "DATAVERSE", "IF", "EXISTS", "CREATE", "USE", "TYPE", "AS", "DATASET", "PRIMARY", "KEY", - "INDEX", "SELECT", "VALUE", "INSERT", "INTO", "FROM", "WHERE", "AND", "SOME", "IN", "SATISFIES", "IS", "UNKNOWN", "NOT", "EVERY", - "GROUP", "BY", "ORDER", "DESC", "LIMIT", "OR", "SET", "DELETE", "LOAD", "USING", - ]; - - //"(", ")","{{", "}}", "[", "]", "{", "}", ";", ",", ":","?", "=", - var VAR_MATCH = /[$][a-zA-Z]+(\d*)/; - var DOT_MATCH = /[.](\S)*/; - var DOUBLE_QUOTE_MATCH = /["].*["]/; - var SINGLE_QUOTE_MATCH = /['].*[']/; - var BREAK_POINT = /(\s)/; - - return { - startState: function() {return {inString: false};}, - token: function(stream, state) { - if (state.newLine == undefined)state.newLine = true; - - //match variable reference - if (stream.match(VAR_MATCH)) { - return "variable"; - } - - if (stream.match(DOT_MATCH)) { - return "dot-variable"; - } - - //string variable match - if (stream.match(DOUBLE_QUOTE_MATCH)) { - return "string"; - } - if (stream.match(SINGLE_QUOTE_MATCH)) { - return "string"; - } - - //keyword match - for (var i in KEYWORD_MATCH){ - if (state.newLine && stream.match(KEYWORD_MATCH[i])){ - return "keyword"; - } - } - - if (stream.peek() === " " || stream.peek() === null){ - state.newLine = true; - }else{ - state.newLine = false; - } - stream.next(); - return null; - } - }; - }); - } - - get value() { return this._value; }; - - @Input() set value(v) { - if (v !== this._value) { - this._value = v; - this.onChange(v); - } - } - - /** - * On component destroy - */ - ngOnDestroy() {} - - /** - * On component view init - */ - ngAfterViewInit() { - this.config = this.config || {}; - this.codemirrorInit(this.config); - } - - /** - * Initialize codemirror - */ - codemirrorMetadataConfig = { mode: "asterix", - //lineNumbers: true, - lineWrapping: true, - showCursorWhenSelecting: true, - autofocus: true - }; - - codemirrorInit(config){ - this.instance = CodeMirrorMetadata.fromTextArea(this.hostMetadata.nativeElement, this.codemirrorMetadataConfig); - this.instance.setSize("100%" , "100px"); - this.instance.on('change', () => { - this.updateValue(this.instance.getValue()); - }); - - this.instance.on('focus', () => { - this.focus.emit(); - }); - - this.instance.on('blur', () => { - this.blur.emit(); - }); - } - - /** - * Value update process - */ - updateValue(value){ - this.value = value; - this.onTouched(); - this.change.emit(value); - } - - /** - * Implements ControlValueAccessor - */ - writeValue(value){ - this._value = value || ''; - if (this.instance) { - this.instance.setValue(this._value); - } - } - - onChange(_) {} - onTouched() {} - registerOnChange(fn){this.onChange = fn;} - registerOnTouched(fn){this.onTouched = fn;} -} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/asterixdb/blob/3e5815a7/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datasets-collection/dataset-create-dialog.component.html ---------------------------------------------------------------------- diff --git a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datasets-collection/dataset-create-dialog.component.html b/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datasets-collection/dataset-create-dialog.component.html deleted file mode 100755 index ef88719..0000000 --- a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datasets-collection/dataset-create-dialog.component.html +++ /dev/null @@ -1,14 +0,0 @@ -<!--/* -Licensed 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. -*/--> -<!-- Place holder for future expansion --> http://git-wip-us.apache.org/repos/asf/asterixdb/blob/3e5815a7/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datasets-collection/dataset-create-dialog.component.scss ---------------------------------------------------------------------- diff --git a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datasets-collection/dataset-create-dialog.component.scss b/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datasets-collection/dataset-create-dialog.component.scss deleted file mode 100755 index c969489..0000000 --- a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datasets-collection/dataset-create-dialog.component.scss +++ /dev/null @@ -1,18 +0,0 @@ -/* -Licensed 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. -*/ -.dataset-dialog { - font-family: "Roboto Mono", monospace; - font-size: 0.80rem; - font-weight: 500; -} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/asterixdb/blob/3e5815a7/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datasets-collection/dataset-drop-dialog.component.html ---------------------------------------------------------------------- diff --git a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datasets-collection/dataset-drop-dialog.component.html b/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datasets-collection/dataset-drop-dialog.component.html deleted file mode 100755 index 517006c..0000000 --- a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datasets-collection/dataset-drop-dialog.component.html +++ /dev/null @@ -1,26 +0,0 @@ -<!--/* -Licensed 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 class="dataset-dialog"> - <p mat-dialog-title>DROP DATASET</p> - <mat-dialog-content> - <p>PLEASE GIVE THE NAME OF THE DATASET TO DROP</p> - </mat-dialog-content> - <mat-form-field> - <input matInput tabindex="0" [(ngModel)]="data.datasetName"> - </mat-form-field> - <mat-dialog-actions> - <button mat-button (click)="onClick()" tabindex="1">DROP</button> - <button mat-button (click)="onNoClick()" tabindex="2">CANCEL</button> - </mat-dialog-actions> -</div> http://git-wip-us.apache.org/repos/asf/asterixdb/blob/3e5815a7/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datasets-collection/dataset-drop-dialog.component.scss ---------------------------------------------------------------------- diff --git a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datasets-collection/dataset-drop-dialog.component.scss b/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datasets-collection/dataset-drop-dialog.component.scss deleted file mode 100755 index c969489..0000000 --- a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datasets-collection/dataset-drop-dialog.component.scss +++ /dev/null @@ -1,18 +0,0 @@ -/* -Licensed 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. -*/ -.dataset-dialog { - font-family: "Roboto Mono", monospace; - font-size: 0.80rem; - font-weight: 500; -} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/asterixdb/blob/3e5815a7/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datasets-collection/datasets.component.html ---------------------------------------------------------------------- diff --git a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datasets-collection/datasets.component.html b/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datasets-collection/datasets.component.html deleted file mode 100755 index f556951..0000000 --- a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datasets-collection/datasets.component.html +++ /dev/null @@ -1,112 +0,0 @@ -<!--/* -Licensed 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 class="container" (click)="onClick()"> - <div class="master"> - <mat-card class="datasets-card" *ngIf="loaded$ | async as ld"> - <mat-toolbar color="primary" class="datasets-selector"> - <mat-icon class="icon">menu</mat-icon> - <span>DATASETS - METADATA</span> - <span class="spacer"></span> - </mat-toolbar> - <mat-card-content class="datasets-content"> - <mat-table #table [dataSource]="dataSource" class="datasets-table"> - <!-- CompactionPolicy Column --> - <ng-container matColumnDef="CompactionPolicy"> - <mat-header-cell *matHeaderCellDef class="header-compactionpolicy-cell">Compaction Policy</mat-header-cell> - <mat-cell *matCellDef="let element" class="dataset-compactionpolicy-cell"> {{element.CompactionPolicy}} </mat-cell> - </ng-container> - - <!-- DatasetId Column --> - <ng-container matColumnDef="DatasetId"> - <mat-header-cell *matHeaderCellDef class="header-datasetid-cell">Dataset Id</mat-header-cell> - <mat-cell *matCellDef="let element" class="dataset-datasetid-cell"> {{element.DatasetId}} </mat-cell> - </ng-container> - - <!-- DatasetName Column --> - <ng-container matColumnDef="DatasetName"> - <mat-header-cell *matHeaderCellDef class="header-datasetname-cell">Dataset Name</mat-header-cell> - <mat-cell *matCellDef="let element" class="dataset-datasetname-cell"> {{element.DatasetName}} </mat-cell> - </ng-container> - - <!-- DatasetType Column --> - <ng-container matColumnDef="DatasetType"> - <mat-header-cell *matHeaderCellDef class="header-datasettype-cell">Dataset Type</mat-header-cell> - <mat-cell *matCellDef="let element" class="dataset-datasettype-cell"> {{element.DatasetType}} </mat-cell> - </ng-container> - - <!-- DatatypeDataverseName Column --> - <ng-container matColumnDef="DatatypeDataverseName"> - <mat-header-cell *matHeaderCellDef class="header-datatypedataversename-cell">Datatype Dataverse Name</mat-header-cell> - <mat-cell *matCellDef="let element" class="dataset-datatypedataversename-cell"> {{element.DatatypeDataverseName}} </mat-cell> - </ng-container> - - <!-- DatatypeName Column --> - <ng-container matColumnDef="DatatypeName"> - <mat-header-cell *matHeaderCellDef class="header-datatypename-cell">Datatype Name</mat-header-cell> - <mat-cell *matCellDef="let element" class="dataset-datatypename-cell"> {{element.DatatypeName}} </mat-cell> - </ng-container> - - <!-- DataverseName Column --> - <ng-container matColumnDef="DataverseName"> - <mat-header-cell *matHeaderCellDef class="header-dataversename-cell">Dataverse Name</mat-header-cell> - <mat-cell *matCellDef="let element" class="dataset-dataversename-cell"> {{element.DataverseName}} </mat-cell> - </ng-container> - - <!-- GroupName Column --> - <ng-container matColumnDef="GroupName"> - <mat-header-cell *matHeaderCellDef class="header-groupname-cell">Group Name</mat-header-cell> - <mat-cell *matCellDef="let element" class="dataset-groupname-cell"> {{element.GroupName}} </mat-cell> - </ng-container> - - <!-- PendingOp Column --> - <ng-container matColumnDef="PendingOp"> - <mat-header-cell *matHeaderCellDef class="header-pendingop-cell">Pending Op</mat-header-cell> - <mat-cell *matCellDef="let element" class="dataset-pendingop-cell"> {{element.PendingOp}} </mat-cell> - </ng-container> - - <!-- DatasetType Column --> - <ng-container matColumnDef="Timestamp"> - <mat-header-cell *matHeaderCellDef class="header-timestamp-cell">Timestamp</mat-header-cell> - <mat-cell *matCellDef="let element" class="dataset-timestamp-cell"> {{element.Timestamp}} </mat-cell> - </ng-container> - - <mat-header-row *matHeaderRowDef="['DatasetName', 'DataverseName', 'DatatypeName', 'Timestamp']"></mat-header-row> - <mat-row *matRowDef="let row; columns: ['DatasetName', 'DataverseName', 'DatatypeName', 'Timestamp'];" - [ngClass]="{'highlight': selectedRowIndex == row.id}" - (click)="highlight(row)"> - </mat-row> - </mat-table> - </mat-card-content> - <mat-card-actions class="actions"> - <button class="refresh-button" mat-button (click)="openDropDatasetDialog()">DROP</button> - <span class="error-message">{{errorMessage}}</span> - <span class="spacer"></span> - <button class="refresh-button" mat-button (click)="getDatasets()">REFRESH</button> - </mat-card-actions> - </mat-card> - <awc-query-metadata #querymetadata class="query"></awc-query-metadata> - </div> - <div class="detail"> - <mat-card class="datasets-details-card"> - <mat-toolbar color="primary" class="datasets-selector"> - <mat-icon class="icon">menu</mat-icon> - <span>DATASET - METADATA - DETAILS</span> - <span class="spacer"></span> - </mat-toolbar> - <mat-card-content class="datasets-content output"> - <span><pre>{{output}}</pre></span> - </mat-card-content> - </mat-card> - </div> -</div> http://git-wip-us.apache.org/repos/asf/asterixdb/blob/3e5815a7/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datasets-collection/datasets.component.scss ---------------------------------------------------------------------- diff --git a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datasets-collection/datasets.component.scss b/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datasets-collection/datasets.component.scss deleted file mode 100755 index 38a8272..0000000 --- a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datasets-collection/datasets.component.scss +++ /dev/null @@ -1,415 +0,0 @@ -/* -Licensed 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. -*/ -$datasets-spacing-unit: 8px; - -.container { - display: flex; - flex-flow: row; - padding: 0; - margin: 0; -} - -.master { - width: 60%; - overflow: hidden; -} - -.detail { - width: 40%; - overflow: hidden; -} - -.datasets-card { - display: flex; - flex-flow: column; - padding: 0; - margin:0 auto; - margin-top: ($datasets-spacing-unit * 2); - min-height: 450px; - max-height: 450px; - //min-width: 98%; //(100vw / 2); - //max-width: 98%; // (100vw / 2); - width: 95%; // 98%; - overflow: hidden; -} - -.datasets-details-card { - display: flex; - flex-flow: column; - padding: 0; - margin:0 auto; - margin: ($datasets-spacing-unit * 2); - min-height: 716px; - max-height: 716px; - //min-width: 95%; //(100vw / 2); - //max-width: 95%; // (100vw / 2); - overflow: hidden; -} - -.icon { - padding: 0 14px 0 0; - margin: 0; -} - -.spacer { - flex: 1 1 auto; -} - -.datasets-selector { - min-height: 42px; - max-height: 42px; - justify-content: center; - font-size: 0.80rem; - font-weight: 500; - background-color: white; - border: 1px solid rgba(54, 147, 209, 0.87); -} - -.datasets-content { - position:relative; - top: 0; - left: 0; - margin: 0px; - padding: 0px; - overflow: auto; -} - -.datasets-table { - margin: $datasets-spacing-unit !important; - height: 330px; - overflow: auto; -} - -.spacer { - flex: 1 1 auto; -} - -.example-header { - min-height: 64px; - display: flex; - align-items: center; - padding-left: 24px; - font-size: 20px; -} - -.mat-table { - overflow: auto; -} - -.customWidthClass{ - flex: 0 0 250px; -} - -.mat-column-DataverseName { - text-align: left; -} - -.mat-header-cell.mat-column-DataverseName { - text-align: left; -} - -.mat-cell.mat-column-DataverseName { - text-align: left; -} - -.header-compactionpolicy-cell { - border: none; - font-size: 12px; - letter-spacing: 1px; - line-height: $datasets-spacing-unit * 3; - font-weight: 400; - margin: 0; - padding: 0 ($datasets-spacing-unit * 2); - text-align: left; - color: hsla(0,0%,0%,.87); - text-transform: uppercase; - flex: 0 0 250px; -} - -.dataset-compactionpolicy-cell { - border: none; - font-size: 12px; - letter-spacing: 1px; - line-height: $datasets-spacing-unit * 3; - font-weight: 400; - margin: 0; - padding: 0 ($datasets-spacing-unit * 2); - text-align: left; - color: hsla(0,0%,0%,.87); - flex: 0 0 250px; -} - -.header-datasetid-cell { - border: none; - font-size: 12px; - letter-spacing: 1px; - line-height: $datasets-spacing-unit * 3; - font-weight: 400; - margin: 0; - padding: 0 ($datasets-spacing-unit * 2); - text-align: left; - color: hsla(0,0%,0%,.87); - text-transform: uppercase; - flex: 0 0 250px; -} - -.dataset-datasetid-cell { - border: none; - font-size: 12px; - letter-spacing: 1px; - line-height: $datasets-spacing-unit * 3; - font-weight: 400; - margin: 0; - padding: 0 ($datasets-spacing-unit * 2); - text-align: left; - color: hsla(0,0%,0%,.87); - flex: 0 0 250px; -} - -.header-datasetname-cell { - border: none; - font-size: 12px; - letter-spacing: 1px; - line-height: $datasets-spacing-unit * 3; - font-weight: 400; - margin: 0; - padding: 0 ($datasets-spacing-unit * 2); - text-align: left; - color: hsla(0,0%,0%,.87); - text-transform: uppercase; - flex: 0 0 250px; -} - -.dataset-datasetname-cell { - border: none; - font-size: 12px; - letter-spacing: 1px; - line-height: $datasets-spacing-unit * 3; - font-weight: 400; - margin: 0; - padding: 0 ($datasets-spacing-unit * 2); - text-align: left; - color: hsla(0,0%,0%,.87); - flex: 0 0 250px; -} - -.header-datasettype-cell { - border: none; - font-size: 12px; - //letter-spacing: 1px; - line-height: $datasets-spacing-unit * 3; - font-weight: 400; - margin: 0; - padding: 0 ($datasets-spacing-unit * 2); - text-align: left; - color: hsla(0,0%,0%,.87); - text-transform: uppercase; - flex: 0 0 250px; -} - -.dataset-datasettype-cell { - border: none; - font-size: 12px; - //letter-spacing: 1px; - line-height: $datasets-spacing-unit * 3; - font-weight: 400; - margin: 0; - padding: 0 ($datasets-spacing-unit * 2); - text-align: left; - color: hsla(0,0%,0%,.87); - flex: 0 0 250px; -} - -.header-datatypedataversename-cell { - border: none; - font-size: 12px; - letter-spacing: 1px; - line-height: $datasets-spacing-unit * 3; - font-weight: 400; - margin: 0; - padding: 0 ($datasets-spacing-unit * 2); - text-align: left; - color: hsla(0,0%,0%,.87); - text-transform: uppercase; - flex: 0 0 250px; -} - -.dataset-datatypedataversename-cell { - border: none; - font-size: 12px; - letter-spacing: 1px; - line-height: $datasets-spacing-unit * 3; - font-weight: 400; - margin: 0; - padding: 0 ($datasets-spacing-unit * 2); - text-align: left; - color: hsla(0,0%,0%,.87); - flex: 0 0 250px; -} - -.header-datatypename-cell { - border: none; - font-size: 12px; - letter-spacing: 1px; - line-height: $datasets-spacing-unit * 3; - font-weight: 400; - margin: 0; - padding: 0 ($datasets-spacing-unit * 2); - text-align: left; - color: hsla(0,0%,0%,.87); - text-transform: uppercase; - flex: 0 0 250px; -} - -.dataset-datatypename-cell { - border: none; - font-size: 12px; - letter-spacing: 1px; - line-height: $datasets-spacing-unit * 3; - font-weight: 400; - margin: 0; - padding: 0 ($datasets-spacing-unit * 2); - text-align: left; - color: hsla(0,0%,0%,.87); - flex: 0 0 250px; -} - -.header-dataversename-cell { - border: none; - font-size: 12px; - letter-spacing: 1px; - line-height: $datasets-spacing-unit * 3; - font-weight: 400; - margin: 0; - padding: 0 ($datasets-spacing-unit * 2); - text-align: left; - color: hsla(0,0%,0%,.87); - text-transform: uppercase; - flex: 0 0 250px; -} - -.dataset-dataversename-cell { - border: none; - font-size: 12px; - letter-spacing: 1px; - line-height: $datasets-spacing-unit * 3; - font-weight: 400; - margin: 0; - padding: 0 ($datasets-spacing-unit * 2); - text-align: left; - color: hsla(0,0%,0%,.87); - flex: 0 0 250px; -} - - -.header-groupname-cell { - border: none; - font-size: 12px; - letter-spacing: 1px; - line-height: $datasets-spacing-unit * 3; - font-weight: 400; - margin: 0; - padding: 0 ($datasets-spacing-unit * 2); - text-align: left; - color: hsla(0,0%,0%,.87); - text-transform: uppercase; - flex: 0 0 250px; -} - -.dataset-groupname-cell { - border: none; - font-size: 12px; - letter-spacing: 1px; - line-height: $datasets-spacing-unit * 3; - font-weight: 400; - margin: 0; - padding: 0 ($datasets-spacing-unit * 2); - text-align: left; - color: hsla(0,0%,0%,.87); - flex: 0 0 250px; -} - -.header-timestamp-cell { - border: none; - font-size: 12px; - letter-spacing: 1px; - line-height: $datasets-spacing-unit * 3; - font-weight: 400; - margin: 0; - padding: 0 ($datasets-spacing-unit * 2); - text-align: left; - color: hsla(0,0%,0%,.87); - text-transform: uppercase; - flex: 0 0 250px; -} - -.dataset-timestamp-cell { - border: none; - font-size: 12px; - letter-spacing: 1px; - line-height: $datasets-spacing-unit * 3; - font-weight: 400; - margin: 0; - padding: 0 ($datasets-spacing-unit * 2); - text-align: left; - color: hsla(0,0%,0%,.87); - flex: 0 0 250px; -} - -.example-header { - min-height: 56px; - max-height: 56px; - display: flex; - align-items: center; - padding: 8px 24px 0; - font-size: 20px; - justify-content: space-between; - border-bottom: 1px solid transparent; -} - -.mat-form-field { - font-size: 14px; - flex-grow: 1; - margin-top: 8px; -} - -.example-no-results { - display: flex; - justify-content: center; - padding: 24px; - font-size: 12px; - font-style: italic; -} - -.actions { - display: flex; - border-top: 1px solid rgba(0, 0, 0, 0.1); - color: rgba(54, 147, 209, 0.87); - padding: $datasets-spacing-unit; - margin: 0; -} - -.error-message { - border-bottom: 1px solid rgba(0, 0, 0, 0.1); - color: rgba(209, 54, 54, 0.87); - padding-top: 10px; - padding-left: 20px; - text-overflow: ellipsis; -} - -.output { - padding-left: ($datasets-spacing-unit * 2); -} - - http://git-wip-us.apache.org/repos/asf/asterixdb/blob/3e5815a7/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datasets-collection/datasets.component.ts ---------------------------------------------------------------------- diff --git a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datasets-collection/datasets.component.ts b/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datasets-collection/datasets.component.ts deleted file mode 100755 index 0fe8c74..0000000 --- a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datasets-collection/datasets.component.ts +++ /dev/null @@ -1,231 +0,0 @@ -/* -Licensed 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 { Component, ElementRef, ViewChild, Inject, Input } from '@angular/core'; -import { Dataset } from '../../../shared/models/asterixDB.model' -import { Store } from '@ngrx/store'; -import { Observable } from 'rxjs/Observable'; -import * as datasetActions from '../../../shared/actions/dataset.actions' -import {DataSource} from '@angular/cdk/collections'; -import {BehaviorSubject} from 'rxjs/BehaviorSubject'; -import { Subscription } from "rxjs/Rx"; -import { State } from '../../../shared/reducers/dataset.reducer'; -import 'rxjs/add/operator/startWith'; -import 'rxjs/add/observable/merge'; -import 'rxjs/add/operator/map'; -import 'rxjs/add/operator/debounceTime'; -import 'rxjs/add/operator/distinctUntilChanged'; -import 'rxjs/add/observable/fromEvent'; -import { MatPaginator } from '@angular/material'; -import { SelectionModel } from '@angular/cdk/collections'; -import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material'; - -/** - * Root component - * Defines our application's layout - */ -@Component({ - selector: 'awc-datasets', - templateUrl: 'datasets.component.html', - styleUrls: ['datasets.component.scss'] -}) - -export class DatasetCollection { - displayedColumns = "['CompactionPolicy', 'DatasetId', 'DatasetName', 'DatasetType', 'DatatypeDataverseName', 'DatatypeName', 'DataverseName', 'GroupName', 'PendingOp', 'Timestamp']" - -/* - compactionPolicy: string; - compactionPolicyProperties: CompactionPolicyProperties[]; * - datasetId: string; - datasetName: string; - datasetType:string; - datatypeDataverseName: string; - datatypeName: string; - dataverseName: string; - groupName:string; - hints: string[]; * - internalDetails: InternalDetails; * - pendingOp: string; - timestamp: string; */ - datasetName: string; - dataSource: DatasetDataSource | null; - loaded$: Observable<any> - @Input('message') errorMessage: string = "" - dsName = ""; - - constructor(private store: Store<any>, public dialog: MatDialog) { - this.loaded$ = this.store.select('dataset'); - - // Watching the name of the latest create dataset - this.store.select(s => s.dataset.createDatasetName).subscribe((data: any) => { - this.dsName = data; - }) - - // Watching the name of the latest drop dataset - this.store.select(s => s.dataset.dropDatasetName).subscribe((data: any) => { - this.dsName = data; - }) - - // Watching for the if there is a change in the collection - this.store.select(s => s.dataset.createDatasetSuccess).subscribe((data: any) => { - if (data === true) { - this.getDatasets(); - this.errorMessage = "SUCCEED: CREATE DATASET " + this.dsName; - } - }) - - // Watching for the if there is a error in a create dataset operation - this.store.select(s => s.dataset.createDatasetError).subscribe((data: any) => { - if (data.errors) { - this.errorMessage = "ERROR: " + data.errors[0].msg; - } - }) - - - // Watching for the success message in a drop dataset operation - this.store.select(s => s.dataset.dropDatasetSuccess).subscribe((data: any) => { - if (data === true) { - this.getDatasets(); - this.errorMessage = "SUCCEED: DROP DATASET " + this.dsName; - } - }) - - // Watching for the if there is a error in a drop dataset operation - this.store.select(s => s.dataset.dropDatasetError).subscribe((data: any) => { - if (data.errors) { - this.errorMessage = "ERROR: " + data.errors[0].msg; - } - }) - } - - getDatasets() { - // Trigger the effect to refresh the dataset - this.store.dispatch(new datasetActions.SelectDatasets('-')); - } - - ngOnInit() { - // Assign the datasource for the table - this.dataSource = new DatasetDataSource(this.store); - } - - /* - * opens the create dataverse dialog - */ - openCreateDatasetDialog(): void { - let dialogRef = this.dialog.open(DialogCreateDataset, { - width: '420px', - data: { name: this.datasetName } - }); - - dialogRef.afterClosed().subscribe(result => { - this.datasetName = result; - }); - } - - /* - * opens the drop dataverse dialog - */ - openDropDatasetDialog(): void { - let dialogRef = this.dialog.open(DialogDropDataset, { - width: '420px', - data: { name: this.datasetName } - }); - - dialogRef.afterClosed().subscribe(result => { - this.datasetName = result; - }); - } - - /* - * Clean up the error message on the screen - */ - onClick(): void { - this.errorMessage = ""; - } - - output: any; - - highlight(row){ - this.output = JSON.stringify(row, null, 2); - } - - @ViewChild('querymetadata') inputQuery; - - /* Cleans up error message */ - cleanUp() { - this.errorMessage = ""; - // Cascading - this.inputQuery.cleanUp(); - } -} - -@Component({ - selector: 'dataset-create-dialog', - templateUrl: 'dataset-create-dialog.component.html', - styleUrls: ['dataset-create-dialog.component.scss'] -}) - -export class DialogCreateDataset { - constructor( private store: Store<any>, - public dialogCreateDsRef: MatDialogRef<DialogCreateDataset>, - @Inject(MAT_DIALOG_DATA) public data: any) { } - - onClick(): void { - this.store.dispatch(new datasetActions.CreateDataset(this.data.datasetName)); - this.dialogCreateDsRef.close(); - } - - onNoClick(): void { - this.dialogCreateDsRef.close(); - } -} - -@Component({ - selector: 'dataset-drop-dialog', - templateUrl: 'dataset-drop-dialog.component.html', - styleUrls: ['dataset-drop-dialog.component.scss'] -}) - -export class DialogDropDataset { - constructor( private store: Store<any>, - public dialogDropDsRef: MatDialogRef<DialogDropDataset>, - @Inject(MAT_DIALOG_DATA) public data: any) { } - - onClick(): void { - this.store.dispatch(new datasetActions.DropDataset(this.data.datasetName)); - this.dialogDropDsRef.close(); - } - - onNoClick(): void { - this.dialogDropDsRef.close(); - } -} - -export class DatasetDataSource extends DataSource<any> { - private datasets$: Observable<any> - constructor(private store: Store<any>) { - super(); - this.datasets$ = this.store.select(s => s.dataset.datasets.results); - } - - /** Connect function called by the table to retrieve one stream containing the data to render. */ - connect(): Observable<Dataset[]> { - const displayDataChanges = [ - this.datasets$, - ]; - - return this.datasets$; - } - - disconnect() {} -} http://git-wip-us.apache.org/repos/asf/asterixdb/blob/3e5815a7/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datatypes-collection/datatype-create-dialog.component.html ---------------------------------------------------------------------- diff --git a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datatypes-collection/datatype-create-dialog.component.html b/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datatypes-collection/datatype-create-dialog.component.html deleted file mode 100755 index aca06fd..0000000 --- a/asterixdb/asterix-dashboard/src/node/src/app/dashboard/metadata/datatypes-collection/datatype-create-dialog.component.html +++ /dev/null @@ -1,14 +0,0 @@ -<!--/* -Licensed 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. -*/--> -<!-- Place holder for future expansion --> \ No newline at end of file