You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@atlas.apache.org by su...@apache.org on 2016/02/04 22:46:39 UTC
incubator-atlas git commit: ATLAS-287: UI: GUID on table details page
Repository: incubator-atlas
Updated Branches:
refs/heads/master bd47628fe -> 21b403bb7
ATLAS-287: UI: GUID on table details page
Signed-off-by: Suma Shivaprasad <su...@gmail.com>
Project: http://git-wip-us.apache.org/repos/asf/incubator-atlas/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-atlas/commit/21b403bb
Tree: http://git-wip-us.apache.org/repos/asf/incubator-atlas/tree/21b403bb
Diff: http://git-wip-us.apache.org/repos/asf/incubator-atlas/diff/21b403bb
Branch: refs/heads/master
Commit: 21b403bb72ceaaa11ad1d46b103d13de18e4ab80
Parents: bd47628
Author: Anilsg <an...@gmail.com>
Authored: Sat Jan 30 09:28:18 2016 +0530
Committer: Suma Shivaprasad <su...@gmail.com>
Committed: Thu Feb 4 13:46:22 2016 -0800
----------------------------------------------------------------------
.../public/modules/details/detailsController.js | 50 ++++-
.../public/modules/details/views/details.html | 190 +++++++++----------
.../public/modules/search/searchController.js | 76 ++++++--
.../public/modules/search/views/search.html | 10 +-
4 files changed, 201 insertions(+), 125 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/21b403bb/dashboard/public/modules/details/detailsController.js
----------------------------------------------------------------------
diff --git a/dashboard/public/modules/details/detailsController.js b/dashboard/public/modules/details/detailsController.js
index cc6bb2d..606b971 100644
--- a/dashboard/public/modules/details/detailsController.js
+++ b/dashboard/public/modules/details/detailsController.js
@@ -23,16 +23,49 @@ angular.module('dgc.details').controller('DetailsController', ['$window', '$scop
$scope.tableName = false;
$scope.isTable = false;
$scope.isLineage = false;
-
+
DetailsResource.get({
id: $stateParams.id
}, function(data) {
- $scope.details = data;
+
$scope.tableName = data.values.name;
$scope.onActivate('io');
$scope.isTags = (typeof data.traits !== 'undefined' && typeof data.traits === 'object') ? true : false;
+ if (data && data.values) {
+ var getName = function(aaa, attr) {
+ DetailsResource.get({
+ id: attr.id
+ }, function(data1) {
+ if (data1.values && data1.values.name) {
+ attr.name = data1.values.name;
+ }
+ });
+ };
+
+ for (var aaa in data.values) {
+ if (typeof data.values[aaa] === 'object' && data.values[aaa] !== null && data.values[aaa].id && typeof data.values[aaa].id === 'string') {
+ data.values[aaa].name = data.values[aaa].id;
+ getName(aaa, data.values[aaa]);
+ }
+ if (typeof data.values[aaa] === 'object' && data.values[aaa] !== null && data.values[aaa].id && typeof data.values[aaa].id === 'object') {
+ data.values[aaa].id.name = data.values[aaa].id.id;
+ getName(aaa, data.values[aaa].id);
+ }
+ if (typeof data.values[aaa] === 'object' && angular.isArray(data.values[aaa]) === true) {
+ var arrObj = data.values[aaa];
+ for(var a=0; a < arrObj.length; a++){
+ if(typeof arrObj[a].id === 'string'){
+ arrObj[a].name = arrObj[a].id;
+ getName(arrObj[a], arrObj[a]);
+ }
+ }
+ }
+ }
+ }
+
+ $scope.details = data;
if (data && data.values && data.values.name && data.values.name !== "") {
SchemaResource.get({
tableName: data.values.name
@@ -42,15 +75,15 @@ angular.module('dgc.details').controller('DetailsController', ['$window', '$scop
$scope.isSchema = (data1.results.rows && data1.results.rows.length > 0) ? true : false;
for (var t = 0; t < data1.results.rows.length; t++) {
if (data1.results.rows[t].$id$) {
- $scope.isTraitId = true;
+ $scope.isTraitId = true;
}
if (data1.results.rows[t].type) {
- $scope.isHiveSchema = true;
- }
- if($scope.isTraitId && $scope.isHiveSchema){
+ $scope.isHiveSchema = true;
+ }
+ if ($scope.isTraitId && $scope.isHiveSchema) {
break;
}
- }
+ }
}
});
}
@@ -68,7 +101,7 @@ angular.module('dgc.details').controller('DetailsController', ['$window', '$scop
$scope.$broadcast('render-lineage', {
type: tabname,
tableName: $scope.tableName,
- guid : $stateParams.id
+ guid: $stateParams.id
});
};
@@ -78,7 +111,6 @@ angular.module('dgc.details').controller('DetailsController', ['$window', '$scop
});
};
-
$scope.goDetails = function(id) {
$state.go("details", {
id: id
http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/21b403bb/dashboard/public/modules/details/views/details.html
----------------------------------------------------------------------
diff --git a/dashboard/public/modules/details/views/details.html b/dashboard/public/modules/details/views/details.html
index 37fcaad..93208fa 100644
--- a/dashboard/public/modules/details/views/details.html
+++ b/dashboard/public/modules/details/views/details.html
@@ -1,101 +1,93 @@
-
-
<!--
- ~ 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.
- -->
+ ~ 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 class="row detailsPage" data-ng-controller="DetailsController">
- <div class="col-lg-12 padding0">
- <ul class="breadcrumb">
- <li><button class="btn btn-link" data-ng-click="goBack()"><i class="fa fa-arrow-left"></i> Back To Result</button> </li>
- </ul>
- </div>
- <div role="tabpanel" class="col-lg-12 padding0">
- <div class="mB20">
- <h4 ng-if="details.values && details.values.name && details.values.name != ''">
- <b>Name:</b> <span class="black">{{details.values.name}}</span></h2>
- <h4 ng-if="details.values && details.values.description && details.values.description != ''"><b>Description:</b> <span class="black">{{details.values.description}}</span></h4>
- <h4 data-disable="!tableName" data-select="onActivate('io')" id="lineageGraph" class="hide">
- <span class="lineage">Lineage</span>
- <ng-include data-table-type="io" src="'/modules/lineage/views/lineage_io.html'"/>
- </h4>
- </div>
- <tabset>
- <tab heading="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="isObject(value) && isString(value.id)" class="pointer">
- <a data-ui-sref="details({id:value.id})">{{ value.id }}</a>
- </td>
- <td data-ng-if="isObject(value) && isObject(value.id) && isString(value.id.id)" class="pointer"> <a data-ui-sref="details({id:value.id.id})">{{ value.id.id }}</a>
- </td>
- <td data-ng-if="isObject(value) && !isArray(value) && !isString(value.id) && !isObject(value.id)">
- <span data-ng-repeat="(key2, value2) in value"> {{ key2 }} : {{ value2 }}<span ng-if="!$last">,</span></span>
- </td>
- <td data-ng-if="isArray(value) && !isString(value.id) && !isObject(value.id)">
- <div data-ng-repeat="(key2, value2) in value">
- <a class=" pointer" data-ng-if="isObject(value2) && isString(value2.id)" data-ui-sref="details({id:value2.id})">{{ value2.id }}</a>
-
- <div class="row pdLft15px" data-ng-repeat="(key1, value1) in value2">
-
- <span ng-if="isObject(value1)">
- <a class=" pointer" data-ng-if="isString(value1.id)" data-ui-sref="details({id:value1.id})">{{ value1.id }}</a>
-
-
- </span>
-
-
-
- </div>
- </div>
- </td>
- <td data-ng-if="isArray(value) && !isObject(value)" >
- <div class="row" data-ng-repeat="(key1, value1) in value" ng-if="value1">
- <div data-ng-if="isObject(value1)" data-ng-repeat="(key2, value2) in value1" >
- <a data-ng-if="isString(value2) && key2 == 'id'" class="pointer pdLft15px" data-ui-sref="details({id:value2})">{{ value2 }}</a>
- </div>
- </div>
- </td>
- <td data-ng-if="!isArray(value) && isObject(value[0]) && isString(value[0].id) && key=='inputTables'" data-ng-click="goDetails(value[0].id)" class="pointer">
- <div class="row" data-ng-repeat="(key1, value1) in value[0]" 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'}} UTC</div>
- </div>
- </td>
- <td data-ng-if="isNumber(value)">{{value * 1000 | date:'yyyy-MM-dd HH:mm:ss'}} UTC</td>
- <td data-ng-if="isString(value)">{{value}}</td>
- </tr>
- </tbody>
- </table>
- </tab>
- <tab data-heading="Schema" data-ng-if="isSchema">
- <ng-include src="'/modules/details/views/schema.html'"/>
- </tab>
- <tab data-heading="Tags" data-ng-if="isTags">
- <ng-include src="'/modules/tags/instance/views/tags.html'"/>
- </tab>
- </tabset>
- </div>
-</div>
\ No newline at end of file
+ <div class="col-lg-12 padding0">
+ <ul class="breadcrumb">
+ <li><button class="btn btn-link" data-ng-click="goBack()"><i class="fa fa-arrow-left"></i> Back To Result</button> </li>
+ </ul>
+ </div>
+ <div role="tabpanel" class="col-lg-12 padding0">
+ <div class="mB20">
+ <h4 ng-if="details.values && details.values.name && details.values.name != ''">
+ <b>Name:</b> <span class="black">{{details.values.name}}</span></h2>
+ <h4 ng-if="details.values && details.values.description && details.values.description != ''"><b>Description:</b> <span class="black">{{details.values.description}}</span></h4>
+ <h4 data-disable="!tableName" data-select="onActivate('io')" id="lineageGraph" class="hide">
+ <span class="lineage">Lineage</span>
+ <ng-include data-table-type="io" src="'/modules/lineage/views/lineage_io.html'"/>
+ </h4>
+ </div>
+ <tabset>
+ <tab heading="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="isObject(value) && isString(value.id)" class="pointer">
+ <a data-ui-sref="details({id:value.id})">{{ value.name }}</a>
+ </td>
+ <td data-ng-if="isObject(value) && isObject(value.id) && isString(value.id.id)" class="pointer"> <a data-ui-sref="details({id:value.id.id})">{{ value.id.name }}</a>
+ </td>
+ <td data-ng-if="isObject(value) && !isArray(value) && !isString(value.id) && !isObject(value.id)">
+ <span data-ng-repeat="(key2, value2) in value"> {{ key2 }} : {{ value2 }}<span ng-if="!$last">,</span></span>
+ </td>
+ <td data-ng-if="isArray(value) && !isString(value.id) && !isObject(value.id)">
+ <div data-ng-repeat="(key2, value2) in value">
+ <a class=" pointer" data-ng-if="isObject(value2) && isString(value2.id)" data-ui-sref="details({id:value2.id})">{{ value2.name }}<span ng-if="!$last">,</span></a>
+ <div class="row pdLft15px" data-ng-repeat="(key1, value1) in value2">
+ <span ng-if="isObject(value1)">
+ <a class=" pointer" data-ng-if="isString(value1.id)" data-ui-sref="details({id:value1.id})">{{ value1.id }}</a>
+ </span>
+ </div>
+ </div>
+ </td>
+ <td data-ng-if="isArray(value) && !isObject(value)" >
+ <div class="row" data-ng-repeat="(key1, value1) in value" ng-if="value1">
+ <div data-ng-if="isObject(value1)" data-ng-repeat="(key2, value2) in value1" >
+ <a data-ng-if="isString(value2) && key2 == 'id'" class="pointer pdLft15px" data-ui-sref="details({id:value2})">{{ value2 }}</a>
+ </div>
+ </div>
+ </td>
+ <td data-ng-if="!isArray(value) && isObject(value[0]) && isString(value[0].id) && key=='inputTables'" data-ng-click="goDetails(value[0].id)" class="pointer">
+ <div class="row" data-ng-repeat="(key1, value1) in value[0]" 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'}} UTC</div>
+ </div>
+ </td>
+ <td data-ng-if="isNumber(value)">{{value | date:'yyyy-MM-dd HH:mm:ss'}} UTC</td>
+ <td data-ng-if="isString(value)">{{value}}</td>
+ </tr>
+ </tbody>
+ </table>
+ </tab>
+ <tab data-heading="Schema" data-ng-if="isSchema">
+ <ng-include src="'/modules/details/views/schema.html'"/>
+ </tab>
+ <tab data-heading="Tags" data-ng-if="isTags">
+ <ng-include src="'/modules/tags/instance/views/tags.html'"/>
+ </tab>
+ </tabset>
+ </div>
+</div>
+
http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/21b403bb/dashboard/public/modules/search/searchController.js
----------------------------------------------------------------------
diff --git a/dashboard/public/modules/search/searchController.js b/dashboard/public/modules/search/searchController.js
index c7d5728..32744a4 100644
--- a/dashboard/public/modules/search/searchController.js
+++ b/dashboard/public/modules/search/searchController.js
@@ -37,6 +37,58 @@ angular.module('dgc.search').controller('SearchController', ['$scope', '$locatio
$scope.setPage = function(pageNo) {
$scope.currentPage = pageNo;
};
+
+ $scope.initalPage = function() {
+ var begin = (($scope.currentPage - 1) * $scope.itemsPerPage),
+ end = begin + $scope.itemsPerPage,
+ currentRowData = [],
+ res = [],
+ count = 0,
+ firstRowId = 0;
+
+ if ($scope.transformedResults && $scope.transformedResults.length > 0) {
+ currentRowData = $scope.transformedResults.slice(begin, end);
+ }
+
+ var getName = function(gid, obj) {
+ DetailsResource.get({
+ id: gid
+ }, function(data) {
+ if (data.values && data.values.name) {
+ obj.name = data.values.name;
+ } else {
+ obj.name = gid;
+ }
+ res.push(obj);
+ count++;
+
+ $scope.filteredResults = res;
+ if (!$scope.transformedProperties && firstRowId === gid) {
+ $scope.transformedProperties = $scope.filterProperties();
+ }
+ });
+ };
+
+ angular.forEach(currentRowData, function(value) {
+ var objVal = value;
+
+ if (objVal.guid && !objVal.name) {
+ if (!firstRowId) {
+ firstRowId = objVal.guid;
+ }
+ getName(objVal.guid, objVal);
+ } else {
+ res.push(objVal);
+ count++;
+
+ $scope.filteredResults = res;
+ if (!$scope.transformedProperties) {
+ $scope.transformedProperties = $scope.filterProperties();
+ }
+ }
+ });
+ };
+
$scope.search = function(query) {
$scope.results = [];
NotificationService.reset();
@@ -46,7 +98,6 @@ angular.module('dgc.search').controller('SearchController', ['$scope', '$locatio
SearchResource.search({
query: query
}, function searchSuccess(response) {
-
$scope.resultCount = response.count;
$scope.results = response.results;
$scope.resultRows = ($scope.results && $scope.results.rows) ? $scope.results.rows : $scope.results;
@@ -84,13 +135,10 @@ angular.module('dgc.search').controller('SearchController', ['$scope', '$locatio
}
}
$scope.transformedResults = $scope.filterResults();
- $scope.transformedProperties = $scope.filterProperties();
-
} else if (typeof response.dataType === 'undefined') {
$scope.dataTransitioned = true;
$scope.searchKey = '';
$scope.transformedResults = $scope.filterResults();
- $scope.transformedProperties = $scope.filterProperties();
} else if (response.dataType.typeName && response.dataType.typeName.toLowerCase().indexOf('table') !== -1) {
$scope.searchKey = "Table";
$scope.transformedResults = $scope.resultRows;
@@ -100,11 +148,7 @@ angular.module('dgc.search').controller('SearchController', ['$scope', '$locatio
}
$scope.$watch('currentPage + itemsPerPage', function() {
- var begin = (($scope.currentPage - 1) * $scope.itemsPerPage),
- end = begin + $scope.itemsPerPage;
- if ($scope.transformedResults) {
- $scope.filteredResults = $scope.transformedResults.slice(begin, end);
- }
+ $scope.initalPage();
$scope.pageCount = function() {
return Math.ceil($scope.resultCount / $scope.itemsPerPage);
};
@@ -125,9 +169,11 @@ angular.module('dgc.search').controller('SearchController', ['$scope', '$locatio
$scope.filterResults = function() {
var res = [];
+
if ($scope.searchKey !== '') {
angular.forEach($scope.resultRows, function(value) {
- res.push(value[$scope.searchKey]);
+ var objVal = value[$scope.searchKey];
+ res.push(objVal);
});
} else {
angular.forEach($scope.resultRows, function(value) {
@@ -161,7 +207,6 @@ angular.module('dgc.search').controller('SearchController', ['$scope', '$locatio
if (onlyId) {
objVal.guid = objVal.id;
}
-
res.push(objVal);
});
}
@@ -189,11 +234,13 @@ angular.module('dgc.search').controller('SearchController', ['$scope', '$locatio
$scope.doToggle = function($event, el) {
this.isCollapsed = !el;
};
+
$scope.openAddTagHome = function(traitId) {
$state.go('addTagHome', {
tId: traitId
});
};
+
$scope.isTag = function(typename) {
if (typename.indexOf("__tempQueryResultStruct") > -1 || $scope.searchKey === '') {
@@ -202,6 +249,7 @@ angular.module('dgc.search').controller('SearchController', ['$scope', '$locatio
return false;
}
};
+
$scope.getResourceDataHome = function(event, id) {
DetailsResource.get({
id: id
@@ -215,7 +263,9 @@ angular.module('dgc.search').controller('SearchController', ['$scope', '$locatio
}
});
};
+
$scope.$on('refreshResourceData', $scope.getResourceDataHome);
+
$scope.filterSearchResults = function(items) {
var res = {};
var count = 0;
@@ -229,10 +279,12 @@ angular.module('dgc.search').controller('SearchController', ['$scope', '$locatio
$scope.keyLength = count;
return res;
};
+
$scope.searchQuery = $location.search();
+
$scope.query = ($location.search()).query;
- if ($scope.query) {
+ if ($scope.query) {
$scope.search($scope.query);
}
}
http://git-wip-us.apache.org/repos/asf/incubator-atlas/blob/21b403bb/dashboard/public/modules/search/views/search.html
----------------------------------------------------------------------
diff --git a/dashboard/public/modules/search/views/search.html b/dashboard/public/modules/search/views/search.html
index 306fb27..733fe16 100644
--- a/dashboard/public/modules/search/views/search.html
+++ b/dashboard/public/modules/search/views/search.html
@@ -49,7 +49,7 @@
<th>Tools</th>
</tr>
<tr ng-if="isTag(resultType) && transformedProperties != undefined" >
- <th ng-repeat="prop in transformedProperties" ng-if="prop !== 'id'">
+ <th ng-repeat="prop in transformedProperties" ng-if="prop !== 'id' && prop !== 'guid'">
{{(prop != '$traits$') ? prop : 'Tags'}}
</th>
</tr>
@@ -73,17 +73,17 @@
<td class="addTag"><img ng-src="img/addTag.png" tooltip="Add Tag" ng-click="openAddTagHome(result['$id$'].id || result.guid)"></td>
</tr>
<tr ng-if="isTag(resultType)" ng-repeat="result in filteredResults track by $index">
- <td data-ng-if="isObject(result) && !isString(result) && res != 'id'" data-ng-repeat="res in transformedProperties track by $index" class="wordBreak">
+ <td data-ng-if="isObject(result) && !isString(result) && res != 'id' && res != 'guid'" data-ng-repeat="res in transformedProperties track by $index">
- <a data-ng-if="res == 'guid'" data-ui-sref="details({id:result[res]})">{{result[res]}}</a>
+ <a data-ng-if="res == 'guid' && !result['name']" data-ui-sref="details({id:result[res]})">{{result[res]}}</a>
<span data-ng-if="res != '$traits$' && res != 'Tools' && res != 'guid' && res.toLowerCase().indexOf('name') == -1 && res.toLowerCase().indexOf('time') == -1">{{result[res]}}</span>
<span data-ng-if="res.toLowerCase().indexOf('time') != -1 && isNumber(result[res])">{{result[res] * 1000 | date:'yyyy-MM-dd HH:mm:ss'}} UTC</span>
- <a data-ng-if="res.toLowerCase().indexOf('name') != -1 && result['id']" data-ui-sref="details({id:result['id']|| result['guid']})">{{result[res]}}</a>
+ <a data-ng-if="res.toLowerCase().indexOf('name') != -1 && (result['id'] || result['guid']) " data-ui-sref="details({id:result['id']|| result['guid']})">{{result[res]}}</a>
- <span data-ng-if="res.toLowerCase().indexOf('name') != -1 && !result['id']">{{result[res]}}</span>
+ <span data-ng-if="res.toLowerCase().indexOf('name') != -1 && !result['id'] && !result['guid']">{{result[res]}}</span>
<div data-ng-if="res == '$traits$'" class="wordBreak tags" id="{{result['id']|| result['guid']}}">
<a class="tabsearchanchor" ng-repeat="(key, value) in result[res]" data-ui-sref="search({query: key})" title="{{key}}">{{key}}<span> </span></a>