HDFS-12585. Ozone: KSM UI: Add description for configs in UI. Contributed by Ajay Kumar.

This commit is contained in:
Anu Engineer 2017-10-15 13:10:27 -07:00 committed by Owen O'Malley
parent 763484e596
commit 06c6582694
4 changed files with 138 additions and 25 deletions

View File

@ -18,6 +18,16 @@
package org.apache.hadoop.conf;
import java.net.URL;
import java.util.ArrayList;
import java.util.List;
import javax.xml.bind.JAXBContext;
import javax.xml.bind.JAXBException;
import javax.xml.bind.Unmarshaller;
import javax.xml.bind.annotation.XmlAccessType;
import javax.xml.bind.annotation.XmlAccessorType;
import javax.xml.bind.annotation.XmlElement;
import javax.xml.bind.annotation.XmlRootElement;
import org.apache.hadoop.classification.InterfaceAudience;
/**
@ -39,4 +49,107 @@ public OzoneConfiguration() {
public OzoneConfiguration(Configuration conf) {
super(conf);
}
public List<Property> readPropertyFromXml(URL url) throws JAXBException {
JAXBContext context = JAXBContext.newInstance(XMLConfiguration.class);
Unmarshaller um = context.createUnmarshaller();
XMLConfiguration config = (XMLConfiguration) um.unmarshal(url);
return config.getProperties();
}
/**
* Class to marshall/un-marshall configuration from xml files.
*/
@XmlAccessorType(XmlAccessType.FIELD)
@XmlRootElement(name = "configuration")
public static class XMLConfiguration {
@XmlElement(name = "property", type = Property.class)
private List<Property> properties = new ArrayList<>();
public XMLConfiguration() {
}
public XMLConfiguration(List<Property> properties) {
this.properties = properties;
}
public List<Property> getProperties() {
return properties;
}
public void setProperties(List<Property> properties) {
this.properties = properties;
}
}
/**
* Class to marshall/un-marshall configuration properties from xml files.
*/
@XmlAccessorType(XmlAccessType.FIELD)
@XmlRootElement(name = "property")
public static class Property implements Comparable<Property> {
private String name;
private String value;
private String tag;
private String description;
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public String getValue() {
return value;
}
public void setValue(String value) {
this.value = value;
}
public String getTag() {
return tag;
}
public void setTag(String tag) {
this.tag = tag;
}
public String getDescription() {
return description;
}
public void setDescription(String description) {
this.description = description;
}
@Override
public int compareTo(Property o) {
if (this == o) {
return 0;
}
return this.getName().compareTo(o.getName());
}
@Override
public String toString() {
return this.getName() + " " + this.getValue() + this.getTag();
}
@Override
public int hashCode(){
return this.getName().hashCode();
}
@Override
public boolean equals(Object obj) {
return (obj instanceof Property) && (((Property) obj).getName()).equals
(this.getName());
}
}
}

View File

@ -55,3 +55,8 @@
.sortorder.reverse:after {
content: '\25bc'; // BLACK DOWN-POINTING TRIANGLE
}
.wrap-table{
word-wrap: break-word;
table-layout: fixed;
}

View File

@ -33,25 +33,16 @@ app.controller('tagController', function($scope, $http,$filter) {
$scope.loadAll();
});
$scope.convertToArray = function(configAr) {
$scope.configArray = [];
console.log("Reloading "+configAr);
for (config in configAr) {
var newProp = {};
newProp['prop'] = config;
newProp['value'] = configAr[config];
$scope.configArray.push(newProp);
$scope.configArray = configAr;
}
}
$scope.loadAll = function() {
console.log("Displaying all configs");
$http.get("/conf?cmd=getPropertyByTag&tags=" + $scope.tags + "&group=ozone").then(function(response) {
$scope.configs = response.data;
$scope.convertToArray($scope.configs);
$scope.sortBy('prop');
$scope.sortBy('name');
});
};
@ -89,18 +80,16 @@ app.controller('tagController', function($scope, $http,$filter) {
$http.get("/conf?cmd=getPropertyByTag&tags=" + filter + "&group=ozone").then(function(response) {
var tmpConfig = response.data;
console.log('filtering config for tag:'+filter);
array3 = {};
array3 = [];
for(var prop1 in tmpConfig) {
for(var i1 in tmpConfig) {
for(var prop2 in $scope.configs) {
if(prop1 == prop2){
array3[prop1] = tmpConfig[prop1];
console.log('match found for :'+prop1+' '+prop2);
for(var i2 in $scope.configs) {
if(tmpConfig[i1].name == $scope.configs[i2].name){
array3.push( tmpConfig[i1]);
}
}
}
console.log('array3->'+array3);
$scope.convertToArray(array3);
});
};

View File

@ -72,27 +72,33 @@ <h2>Ozone Configuration</h2>
</table>
</div>
<div class="col-md-9">
<table class="table table-striped table-condensed table-hover">
<table class="table table-striped table-condensed table-hover wrap-table">
<thead>
<tr>
<th>
<a href="#" ng-click="sortBy('prop')">Property</a>
<span class="sortorder" ng-show="propertyName === 'prop'"
<th class="col-md-3">
<a href="#" ng-click="sortBy('name')">Property</a>
<span class="sortorder" ng-show="propertyName === 'name'"
ng-class="{reverse: reverse}">
</span>
</th>
<th>
<th class="col-md-2">
<a ng-click="sortBy('value')">Value</a>
<span class="sortorder" ng-show="propertyName === 'value'"
ng-class="{reverse: reverse}"></span>
</th>
<th class="col-md-7">
<a ng-click="sortBy('description')">Description</a>
<span class="sortorder" ng-show="propertyName === 'description'"
ng-class="{reverse: reverse}"></span>
</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="config in configArray | filter:search | orderBy:propertyName:reverse">
<td>{{config.prop}}</td>
<td>{{config.name}}</td>
<td>{{config.value}}</td>
<td>{{config.description}}</td>
</tr>
</tbody>
</table>