Skip to content

A
atlas
Commit 41c81145 by dileep8014
Options

Merge pull request #5 from MPR-Global/HDPDGI-34-1

Hdpdgi 34 1
parents cbf662db 9cea4f64
Showing with 209 additions and 198 deletions
dashboard/v2/public/css/common.css
......@@ -120,7 +120,10 @@ footer.navbar-bottom img {
min-height: 0;
padding: 5px 5px 5px 0;
}
#Details
{
height: 800px;
}
.pagination {
float: right;
}
\ No newline at end of file
dashboard/v2/public/js/app.js
......@@ -38,6 +38,10 @@ angular.module('dgc').factory('lodash', ['$window',
function($window) {
return $window.d3;
}
]).factory('dagreD3', ['$window',
function($window) {
return $window.dagreD3;
}
]).factory('Global', ['$window',
function($window) {
return {
......
dashboard/v2/public/js/routes.js
......@@ -23,6 +23,6 @@ angular.module('dgc').config(['$locationProvider', '$urlRouterProvider',
function($locationProvider, $urlRouterProvider) {
$locationProvider.hashPrefix('!');
// For unmatched routes:
$urlRouterProvider.otherwise('/');
$urlRouterProvider.otherwise('/search');
}
]);
dashboard/v2/public/modules/details/detailsController.js
......@@ -21,8 +21,11 @@
angular.module('dgc.details').controller('DetailsController', ['$scope', '$stateParams', 'DetailsResource',
function($scope, $stateParams, DetailsResource) {
$scope.details = DetailsResource.get({
DetailsResource.get({
id: $stateParams.id
}, function(data) {
$scope.details = data;
$scope.tableName = data.values.name;
});
$scope.isString = angular.isString;
......
dashboard/v2/public/modules/details/views/attribute.html
......@@ -22,18 +22,9 @@
<!--{{value}}-->
<!--</div>-->
<div class="row" data-ng-repeat="(key1,value1) in value" ng-if="value1">
<div class="col-md-6" data-ng-if="!isString(value1)" data-ng-repeat="(key2,value2) in value1 track by $index"></div>
<div data-ng-if="isString(value2)" data-ng-repeat="(key3,value3) in value2"> {{key3}}: {{value3}}</div>
<div class="col-md-6" data-ng-if="isString(value1)"> {{key1}} : {{value1 | date:'medium'}}</div>
<div >
<table class="table table-bordered" ng-if="value && !(key==='columns') && !(key==='name') && !(key==='description')">
<thead>
<tr >
<th>{{key}}</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{value}}</td>
</tr>
</tbody>
</table>
</div>
\ No newline at end of file
dashboard/v2/public/modules/details/views/details.html
......@@ -17,23 +17,44 @@
-->
<div role="tabpanel" >
<div role="tabpanel" class="col-md-7 col-lg-offset-3" data-ng-controller="DetailsController">
<h2>{{details.values.name}}</h2>
<h4>{{details.values.description}}</h4>
<!-- Nav tabs -->
<ul class="nav nav-tabs" role="tablist">
<li role="presentation" ><a href="#home" aria-controls="home" role="tab" data-toggle="tab">Details</a></li>
<li role="presentation"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">Schema</a></li>
<li role="presentation" class="active"><a href="#messages" aria-controls="messages" role="tab" data-toggle="tab">Output</a></li>
<!--<li role="presentation"><a href="#settings" aria-controls="settings" role="tab" data-toggle="tab">Settings</a></li>-->
<li role="presentation" class="active"><a href="#Details" aria-controls="Details" role="tab" data-toggle="tab">Details</a></li>
<li role="presentation" data-ng-if="details.typeName=='Table'"><a href="#Schema" aria-controls="Schema" role="tab" data-toggle="tab">Schema</a></li>
<li role="presentation" data-ng-if="details.typeName=='Table'"><a href="#Output" aria-controls="Output" role="tab" data-toggle="tab">Output</a></li>
<li role="presentation" data-ng-if="details.typeName=='Table'"><a href="#Input" aria-controls="Input" role="tab" data-toggle="tab">Input</a></li>
</ul>
<!-- Tab panes -->
<div class="tab-content" data-ng-controller="DetailsController">
<div role="tabpanel" class="tab-pane " id="home"> <section data-ng-repeat="(key,value) in details" data-ng-if="isString(value)" data-ng-include="'/modules/details/views/attribute.html'"></section>
<div class="tab-content">
<div role="tabpanel" class="tab-pane active" id="Details">
<table class="table table-bordered">
<thead>
<tr >
<th>Key</th>
<th>Value</th>
</tr>
</thead>
<tbody>
<tr data-ng-repeat="(key,value) in details.values" ng-if="value && !(key==='columns') && !(key==='name') && !(key==='description')">
<td>{{key}}</td>
<td data-ng-if="!isString(value)" data-ng-include="'/modules/details/views/attribute.html'"></td>
<td data-ng-if="isString(value)">{{value | date:'medium'}}</td>
</tr>
</tbody>
</table>
</div>
<div role="tabpanel" class="tab-pane" id="profile"> <section data-ng-include="'/modules/details/views/schema.html'"></section></div>
<div role="tabpanel" class="tab-pane active" id="messages"><div data-ng-include="'/modules/lineage/views/lineage.html'"></div></div>
<!--<div role="tabpanel" class="tab-pane" id="settings">...</div>-->
<div role="tabpanel" class="tab-pane" id="Schema"> <section data-ng-include="'/modules/details/views/schema.html'"></section></div>
<div role="tabpanel" class="tab-pane" id="Output"><div data-ng-include="'/modules/lineage/views/outputs.html'"></div></div>
<div role="tabpanel" class="tab-pane" id="Input"><div data-ng-include="'/modules/lineage/views/inputs.html'"></div></div>
</div>
</div>
\ No newline at end of file
dashboard/v2/public/modules/details/views/schema.html
......@@ -15,7 +15,6 @@
~ See the License for the specific language governing permissions and
~ limitations under the License.
-->
<div>
<table class="table table-bordered">
<thead>
......
dashboard/v2/public/modules/home/homeRoutes.js
......@@ -24,8 +24,8 @@ angular.module('dgc.home.routes', []).config(['$stateProvider',
// states for my app
$stateProvider.state('home', {
url: '/',
templateUrl: '/modules/home/views/home.html'
url: '/search',
templateUrl: '/modules/search/views/search.html'
});
}
]);
dashboard/v2/public/modules/home/views/header.html
......@@ -24,7 +24,7 @@
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a data-ui-sref="home" data-ui-sref-active="active"><h1>DGI</h1></a>
<a data-ui-sref="search" data-ui-sref-active="active"><h1>DGI</h1></a>
</div>
<nav class="collapse navbar-collapse" data-collapse="isCollapsed" data-role="navigation">
<ul class="navbar-nav nav" data-ng-if="isLoggedIn()">
......
dashboard/v2/public/modules/lineage/lineageController.js
......@@ -18,162 +18,98 @@
'use strict';
angular.module('dgc.lineage').controller('LineageController', ['$element', '$scope', '$state', '$stateParams', 'lodash', 'LineageResource', 'd3',
function($element, $scope, $state, $stateParams, _, LineageResource, d3) {
var metaData = {
"jsonClass":"org.apache.hadoop.metadata.typesystem.json.InstanceSerialization$_Struct",
"typeName":"__tempQueryResultStruct5",
"values":{
"vertices":{
"2318d240-481e-421c-a614-843347d03941":{
"jsonClass":"org.apache.hadoop.metadata.typesystem.json.InstanceSerialization$_Struct",
"typeName":"__tempQueryResultStruct4",
"values":{
"vertexId":{
"jsonClass":"org.apache.hadoop.metadata.typesystem.json.InstanceSerialization$_Struct",
"typeName":"__IdType",
"values":{
"guid":"2318d240-481e-421c-a614-843347d03941",
"typeName":"Table"
}
},
"name":"sales_fact_daily_mv"
}
},
"2e2ab719-842e-4150-95bd-c9f684b3e3bf":{
"jsonClass":"org.apache.hadoop.metadata.typesystem.json.InstanceSerialization$_Struct",
"typeName":"__tempQueryResultStruct4",
"values":{
"vertexId":{
"jsonClass":"org.apache.hadoop.metadata.typesystem.json.InstanceSerialization$_Struct",
"typeName":"__IdType",
"values":{
"guid":"2e2ab719-842e-4150-95bd-c9f684b3e3bf",
"typeName":"Table"
}
},
"name":"time_dim"
}
},
"d3991d56-4600-415f-acdb-6f1b0c8079b2":{
"jsonClass":"org.apache.hadoop.metadata.typesystem.json.InstanceSerialization$_Struct",
"typeName":"__tempQueryResultStruct4",
"values":{
"vertexId":{
"jsonClass":"org.apache.hadoop.metadata.typesystem.json.InstanceSerialization$_Struct",
"typeName":"__IdType",
"values":{
"guid":"d3991d56-4600-415f-acdb-6f1b0c8079b2",
"typeName":"Table"
}
},
"name":"sales_fact_monthly_mv"
}
},
"7b516348-d8bb-4624-b330-3082ae87e705":{
"jsonClass":"org.apache.hadoop.metadata.typesystem.json.InstanceSerialization$_Struct",
"typeName":"__tempQueryResultStruct4",
"values":{
"vertexId":{
"jsonClass":"org.apache.hadoop.metadata.typesystem.json.InstanceSerialization$_Struct",
"typeName":"__IdType",
"values":{
"guid":"7b516348-d8bb-4624-b330-3082ae87e705",
"typeName":"Table"
}
},
"name":"sales_fact"
}
}, "7b516348-d8bb-4624-b330-3082ae87e706":{
"jsonClass":"org.apache.hadoop.metadata.typesystem.json.InstanceSerialization$_Struct",
"typeName":"__tempQueryResultStruct4",
"values":{
"vertexId":{
"jsonClass":"org.apache.hadoop.metadata.typesystem.json.InstanceSerialization$_Struct",
"typeName":"__IdType",
"values":{
"guid":"7b516348-d8bb-4624-b330-3082ae87e705",
"typeName":"Table"
}
},
"name":"sales_fact_2"
}
}
},
"edges":{
"2318d240-481e-421c-a614-843347d03941":[
"0f45a2df-9bd5-4579-88ec-6ad0ff251d6f"
],
"0f45a2df-9bd5-4579-88ec-6ad0ff251d6f":[
"7b516348-d8bb-4624-b330-3082ae87e705",
"2e2ab719-842e-4150-95bd-c9f684b3e3bf"
],
"d3991d56-4600-415f-acdb-6f1b0c8079b2":[
"3710a18a-6116-4625-bf99-57670a7a90a8"
],
"3710a18a-6116-4625-bf99-57670a7a90a8":[
"2318d240-481e-421c-a614-843347d03941"
],
"7b516348-d8bb-4624-b330-3082ae87e706": [
"2318d240-481e-421c-a614-843347d03941"
]
}
}
};
angular.module('dgc.lineage').controller('LineageController', ['$element', '$scope', '$state', '$stateParams', 'lodash', 'LineageResource', 'd3', 'dagreD3',
function($element, $scope, $state, $stateParams, _, LineageResource, d3, dagreD3) {
$scope.metaData = [];
LineageResource.get({
tableName: $scope.tableName,
type: "outputs"
}, function lineageSuccess(response) {
$scope.metaData = response.results;
renderGraph(transformData(response.results), d3.select($element[0]).select('svg'));
function transformData(metaData){
});
LineageResource.get({
tableName: $scope.tableName,
type: "inputs"
}, function lineageSuccess(response) {
$scope.metaData = response.results;
renderGraph(transformData(response.results), d3.select($element[0]).select('svg'));
});
function transformData(metaData) {
var nodes = [];
var name, guid;
var nodeGuids = Object.keys(metaData.values.vertices);
for (var index in nodeGuids) {
name = metaData.values.vertices[nodeGuids[index]].values.name;
guid = nodeGuids[index];
nodes.push({ guid: guid, label: name, shape: "rect" });
nodes.push({
guid: guid,
label: name,
shape: "rect"
});
}
var edges = [];
var parent;
var child;
var edgesParents = Object.keys(metaData.values.edges)
for(var index in edgesParents){
var edgesParents = Object.keys(metaData.values.edges);
for (index in edgesParents) {
parent = edgesParents[index];
for(var j = 0; j < metaData.values.edges[parent].length; j++ ) {
for (var j = 0; j < metaData.values.edges[parent].length; j++) {
child = metaData.values.edges[parent][j];
if(!metaData.values.vertices.hasOwnProperty(child)) {
nodes.push({guid: child, label: 'Load Process', shape: "circle"});
if (!metaData.values.vertices.hasOwnProperty(child)) {
nodes.push({
guid: child,
label: 'Load Process',
shape: "circle"
});
}
edges.push({parent: parent, child: child});
edges.push({
parent: parent,
child: child
});
}
}
return {nodes: nodes, edges: edges};
return {
nodes: nodes,
edges: edges
};
}
function renderGraph(data, element){
function renderGraph(data, element) {
// Create a new directed graph
var g = new dagreD3
.graphlib
.Graph()
.setGraph({rankdir: "LR"});
.setGraph({
rankdir: "LR"
});
// Automatically label each of the nodes
//g.setNode("DB (sales)", { label: "Sales DB", width: 144, height: 100 })
//states.forEach(function(state) { g.setNode(state, { label: state }); });
// Automatically label each of the nodes
//g.setNode("DB (sales)", { label: "Sales DB", width: 144, height: 100 })
//states.forEach(function(state) { g.setNode(state, { label: state }); });
_.forEach(data.nodes, function (node) {
g.setNode(node.guid, { label: node.label, shape: node.shape });
_.forEach(data.nodes, function(node) {
g.setNode(node.guid, {
label: node.label,
shape: node.shape
});
});
_.forEach(data.edges, function(edge) {
g.setEdge(edge.parent, edge.child, {label: ""});
g.setEdge(edge.parent, edge.child, {
label: ""
});
});
// Set some general styles
// Set some general styles
g.nodes().forEach(function(v) {
var node = g.node(v);
node.rx = node.ry = 5;
......@@ -181,22 +117,20 @@ angular.module('dgc.lineage').controller('LineageController', ['$element', '$sco
var inner = element.select("g");
// Create the renderer
// Create the renderer
var render = new dagreD3.render();
// Run the renderer. This is what draws the final graph.
// Run the renderer. This is what draws the final graph.
render(inner, g);
// Center the graph
// Center the graph
var initialScale = 0.75;
zoom
.translate([(element.attr("width") - g.graph().width * initialScale) / 2, 20])
.scale(initialScale)
.event(element);
// zoom
// .translate([(element.attr("width") - g.graph().width * initialScale) / 2, 20])
// .scale(initialScale)
// .event(element);
element.attr('height', g.graph().height * initialScale + 90);
}
renderGraph(transformData(metaData), d3.select($element[0]).select('svg'));
}
]);
\ No newline at end of file
dashboard/v2/public/modules/lineage/lineageResource.js
......@@ -19,8 +19,5 @@
'use strict';
angular.module('dgc.lineage').factory('LineageResource', ['$resource', function($resource) {
return $resource('/api/metadata/discovery/search/relationships/:id', {
depth: 3,
edgesToFollow: 'HiveLineage.sourceTables.0,HiveLineage.sourceTables.1,HiveLineage.sourceTables.2,HiveLineage.tableName'
});
return $resource('/api/metadata/lineage/hive/table/:tableName/:type/graph', {});
}]);
dashboard/v2/public/modules/lineage/views/inputs.html 0 → 100644
<!--
~ 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 data-ng-controller="LineageController">
<div id="inputs">
<svg class="lineage-viz"><g></svg>
</div>
</div>
dashboard/v2/public/modules/lineage/views/outputs.html 0 → 100644
<!--
~ 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 data-ng-controller="LineageController">
<div id="outputs">
<svg class="lineage-viz"><g></svg>
</div>
</div>
dashboard/v2/public/modules/navigation/navigationController.js
......@@ -21,6 +21,7 @@
angular.module('dgc.navigation').controller('NavigationController', ['$scope', 'NavigationResource',
function($scope, NavigationResource) {
$scope.leftnav= NavigationResource.get();
$scope.updateVar = function(event) {
$scope.$$prevSibling.query = angular.element(event.target).text();
......
dashboard/v2/public/modules/navigation/navigationModule.js
......@@ -17,5 +17,4 @@
*/
'use strict';
angular.module('dgc.navigation',[]);
dashboard/v2/public/modules/search/searchDirective.js 0 → 100644
/*
* 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.
*/
'use strict';
angular.module('dgc.search').directive(
"myDirective",
function() {
return {
restrict: 'EA',
template: '<a href="javascript: void(0);" button-toggle toggle="isCollapsed" class="show-more" ng-click="isCollapsed = !isCollapsed">..show more</a>',
link: function($scope) {
$scope.isCollapsed = true;
console.log($scope.isCollapsed);
},
transclude: true,
scope: {}
};
});
dashboard/v2/public/modules/search/searchRoutes.js
......@@ -21,12 +21,15 @@
//Setting up route
angular.module('dgc.search').config(['$stateProvider',
function($stateProvider) {
// states for my app
$stateProvider.state('search', {
url: '/search',
templateUrl: '/modules/search/views/search.html',
controller:'SearchController'
controller: 'SearchController'
}).state('search.results', {
url: '/:query',
templateUrl: '/modules/search/views/searchResult.html',
controller: 'SearchController'
}).state('search.results', {
url: '?query',
templateUrl: '/modules/search/views/searchResult.html',
......
dashboard/v2/public/modules/search/views/searchResult.html
......@@ -45,4 +45,3 @@
<pagination total-items="totalItems" items-per-page="itemsPerPage" ng-model="currentPage" ng-change="pageChanged()"></pagination>
<p>
</div>
dashboard/v2/public/views/includes/foot.html
......@@ -15,11 +15,6 @@
~ See the License for the specific language governing permissions and
~ limitations under the License.
-->
<script>
$(function () {
$('#myTab a:last').tab('show')
})
</script>
<!-- Angular JS -->
<script type="text/javascript" src="/lib/angular/angular.min.js"></script>
<script type="text/javascript" src="/lib/lodash/lodash.min.js"></script>
......@@ -36,13 +31,6 @@
<script src="http://cpettitt.github.io/project/dagre-d3/latest/dagre-d3.js"></script>
<script type="text/javascript" src="dist/app.min.js"></script>
<!-- Enable the tabs -->
<script type="text/javascript">
$('#myTabs a').click(function (e) {
e.preventDefault()
$(this).tab('show')
});
</script>
{% if (process.env.NODE_ENV == 'local') %}
<!-- Livereload script rendered -->
......
dashboard/v2/public/views/includes/head.html
......@@ -35,19 +35,8 @@
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function ($) {
$('#tabs').tab();
});
</script>
<style >
</style>
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment