Skip to content
This repository has been archived by the owner on Nov 9, 2017. It is now read-only.

Commit

Permalink
Merge pull request #250 from ammendonca/hawkular-next
Browse files Browse the repository at this point in the history
Fixes to the UI for hawkular-next
  • Loading branch information
mtho11 committed Jun 25, 2015
2 parents 4d3afbf + 040cafb commit 050127a
Show file tree
Hide file tree
Showing 4 changed files with 99 additions and 85 deletions.
2 changes: 1 addition & 1 deletion ui/console/src/main/scripts/gulpfile.js
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ var gulp = require('gulp'),

var POM_MAIN_PATH = '../../../../pom.xml';
var DIST_TARGET_PATH = '../../../../dist/target/';
var WF_CONSOLE_PATH = 'wildfly-8.2.0.Final/modules/org/hawkular/nest/main/deployments/hawkular-console.war/dist/';
var WF_CONSOLE_PATH = 'wildfly-9.0.0.CR2/modules/org/hawkular/nest/main/deployments/hawkular-console.war/dist/';

var plugins = gulpLoadPlugins({});
var pkg = require('./package.json');
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -45,92 +45,107 @@ <h3 class="pull-left" data-toggle="tooltip" data-placement="top" title="" data-o
</div>

<!-- Deployments Table -->
<div class="hk-info-top clearfix">
<h3>Deployments</h3>
<div class="actions-table">
<button class="btn btn-default add" type="button" disabled>Add Deployment</button>
<div class="dropdown">
<button class="btn btn-default" type="button" id="dropdownMenu1" dropdown-toggle>
Actions
<span class="caret"></span>
</button>
<ul class="dropdown-menu disabled" role="menu" aria-labelledby="dropdownMenu1">
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Enable</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Disable</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Redeploy</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Undeploy</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Delete</a></li>
</ul>
<div ng-show="vm.resourceList.$resolved && vm.resourceList.length <= 0">
<div class="hk-info-top clearfix">
<h3>Deployments</h3>
<div class="blank-slate-pf">
<div class="blank-slate-pf-icon">
<i class="fa fa-cubes"></i>
</div>
<h1>No deployments.</h1>
<div style="padding-top: 20px;"><button class="btn btn-primary btn-lg">Add Deployment</button></div>
</div>
</div>
</div>

<div id="DataTables_Table_0_wrapper" class="dataTables_wrapper no-footer">
<div class="dataTables_header">
<div id="DataTables_Table_0_filter" class="dataTables_filter">
<label><input type="search" ng-model="vm.search" aria-controls="DataTables_Table_0"></label>
<div ng-show="vm.resourceList.length > 0">
<div class="hk-info-top clearfix">
<h3>Deployments</h3>
<div class="actions-table">
<button class="btn btn-default add" type="button" disabled>Add Deployment</button>
<div class="dropdown">
<button class="btn btn-default" type="button" id="dropdownMenu1" dropdown-toggle>
Actions
<span class="caret"></span>
</button>
<ul class="dropdown-menu disabled" role="menu" aria-labelledby="dropdownMenu1">
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Enable</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Disable</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Redeploy</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Undeploy</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Delete</a></li>
</ul>
</div>
</div>
<div class="dataTables_info" id="DataTables_Table_0_info" role="status" aria-live="polite">Showing <b>1</b> to <b>{{vm.resourceList.length}}</b> of <b>{{vm.resourceList.length}}</b> Items</div>
</div>
<div class="table-responsive">
<table class="datatable table table-striped table-bordered table-checkbox dataTable no-footer" id="DataTables_Table_0" aria-describedby="DataTables_Table_0_info" role="grid">
<thead>
<tr role="row">
<th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-sort="ascending" aria-label=": activate to sort column descending"><input type="checkbox"></th>
<th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-label="Current State: activate to sort column ascending">Current State</th>
<th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-label="Deployments 10: activate to sort column ascending">Deployments <span class="label label-default label-alert pull-right" tooltip-trigger tooltip-placement="top" tooltip="Total alerts" ng-show="vm.alertList.length">{{vm.alertList.length}}</span></th>
<th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-label="Enabled/Disabled: activate to sort column ascending">Enabled/Disabled</th>
<th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-label="Computer Health: activate to sort column ascending">Computed Health</th>
<th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-label="Actions: activate to sort column ascending">Actions</th>
</tr>
</thead>
<tbody>
<tr class="odd"><td valign="top" colspan="6" class="dataTables_empty" ng-show="vm.search && (vm.resourceList | filter:vm.search).length === 0"><p>Suggestions</p><ul><li>Check the syntax of the search term.</li><li>Check that the correct menu option is chosen (token ID vs. user ID).</li><li>Use wildcards (* to match zero or more characters or ? to match a single character).</li><li>Clear the search field, then click Search to return to the 20 most recent records.</li></ul></td></tr>
<tr role="row" ng-repeat="res in vm.resourceList | filter:vm.search" class="odd">
<td class="sorting_1"><input type="checkbox"></td>
<td class="state" ng-show="res.state === 'up'"><i class="fa fa-check-circle-o"></i> OK</td>
<td class="state" ng-show="res.state === 'unknown'"><i class="fa fa-square"></i> Stopped</td>
<td class="state" ng-show="false"><i class="fa fa-times-circle-o"></i> Failed</td>
<td><strong>{{res.properties.name | limitTo14 : res.properties.name.length-13 : 12}}</strong> <span ng-show="false">({{res.properties.name | limitTo14 : res.properties.name.length-13 : 12}})</span> <span class="label label-danger label-alert pull-right" tooltip-trigger tooltip-placement="top" tooltip="Deployment alerts">{{res.alerts}}</span></td>
<td ng-show="true">Enabled</td>
<td ng-show="false">Disabled</td>
<td class="success" ng-show="true">Good</td>
<td class="warning" ng-show="false">Fair</td>
<td class="danger" ng-show="false">Poor</td>
<td class="actions">
<div class="dropdown">
<button class="btn btn-default" type="button" id="dropdownMenu2" dropdown-toggle>
Actions
<span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu2">
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Enable</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Disable</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Redeploy</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Undeploy</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Delete</a></li>
</ul>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div class="dataTables_footer">
<div class="dataTables_paginate paging_bootstrap_input" id="DataTables_Table_0_paginate">
<ul class="pagination">
<li class="first disabled"><span class="i fa fa-angle-double-left"></span></li>
<li class="prev disabled"><span class="i fa fa-angle-left"></span></li>
</ul>
<div class="pagination-input">
<input type="text" class="paginate_input" value="1"><span class="paginate_of">of <b>1</b></span>

<div id="DataTables_Table_0_wrapper" class="dataTables_wrapper no-footer">
<div class="dataTables_header">
<div id="DataTables_Table_0_filter" class="dataTables_filter">
<label><input type="search" ng-model="vm.search" aria-controls="DataTables_Table_0"></label>
</div>
<div class="dataTables_info" id="DataTables_Table_0_info" role="status" aria-live="polite">Showing <b>1</b> to <b>{{vm.resourceList.length}}</b> of <b>{{vm.resourceList.length}}</b> Items</div>
</div>
<div class="table-responsive">
<table class="datatable table table-striped table-bordered table-checkbox dataTable no-footer" id="DataTables_Table_0" aria-describedby="DataTables_Table_0_info" role="grid">
<thead>
<tr role="row">
<th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-sort="ascending" aria-label=": activate to sort column descending"><input type="checkbox"></th>
<th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-label="Current State: activate to sort column ascending">Current State</th>
<th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-label="Deployments 10: activate to sort column ascending">Deployments <span class="label label-default label-alert pull-right" tooltip-trigger tooltip-placement="top" tooltip="Total alerts" ng-show="vm.alertList.length">{{vm.alertList.length}}</span></th>
<th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-label="Enabled/Disabled: activate to sort column ascending">Enabled/Disabled</th>
<th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-label="Computer Health: activate to sort column ascending">Computed Health</th>
<th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" aria-label="Actions: activate to sort column ascending">Actions</th>
</tr>
</thead>
<tbody>
<tr class="odd"><td valign="top" colspan="6" class="dataTables_empty" ng-show="vm.search && (vm.resourceList | filter:vm.search).length === 0"><p>Suggestions</p><ul><li>Check the syntax of the search term.</li><li>Check that the correct menu option is chosen (token ID vs. user ID).</li><li>Use wildcards (* to match zero or more characters or ? to match a single character).</li><li>Clear the search field, then click Search to return to the 20 most recent records.</li></ul></td></tr>
<tr role="row" ng-repeat="res in vm.resourceList | filter:vm.search" class="odd">
<td class="sorting_1"><input type="checkbox"></td>
<td class="state" ng-show="res.state === 'up'"><i class="fa fa-check-circle-o"></i> OK</td>
<td class="state" ng-show="res.state === 'down'"><i class="fa fa-square"></i> Stopped</td>
<td class="state" ng-show="res.state === 'unknown'"><i class="fa fa-times-circle-o"></i> Failed</td>
<td class="state" ng-hide="res.state"><i class="fa fa-chain-broken"></i> Unknown</td>
<td><strong>{{res.properties.name | limitTo14 : res.properties.name.length-13 : 12}}</strong> <span ng-show="false">({{res.properties.name | limitTo14 : res.properties.name.length-13 : 12}})</span> <span class="label label-danger label-alert pull-right" tooltip-trigger tooltip-placement="top" tooltip="Deployment alerts">{{res.alerts}}</span></td>
<td ng-show="true">Enabled</td>
<td ng-show="false">Disabled</td>
<td class="success" ng-show="true">Good</td>
<td class="warning" ng-show="false">Fair</td>
<td class="danger" ng-show="false">Poor</td>
<td class="actions">
<div class="dropdown">
<button class="btn btn-default" type="button" id="dropdownMenu2" dropdown-toggle>
Actions
<span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu2">
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Enable</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Disable</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Redeploy</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Undeploy</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">Delete</a></li>
</ul>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div class="dataTables_footer">
<div class="dataTables_paginate paging_bootstrap_input" id="DataTables_Table_0_paginate">
<ul class="pagination">
<li class="first disabled"><span class="i fa fa-angle-double-left"></span></li>
<li class="prev disabled"><span class="i fa fa-angle-left"></span></li>
</ul>
<div class="pagination-input">
<input type="text" class="paginate_input" value="1"><span class="paginate_of">of <b>1</b></span>
</div>
<ul class="pagination">
<li class="next disabled"><span class="i fa fa-angle-right"></span></li>
<li class="last disabled"><span class="i fa fa-angle-double-right"></span></li>
</ul>
</div>
<ul class="pagination">
<li class="next disabled"><span class="i fa fa-angle-right"></span></li>
<li class="last disabled"><span class="i fa fa-angle-double-right"></span></li>
</ul>
</div>
</div>
</div>

</section><!-- .deployments -->
Original file line number Diff line number Diff line change
Expand Up @@ -82,15 +82,15 @@ module HawkularMetrics {
getResourceList(currentTenantId?: TenantId): any {
this.alertList = []; // FIXME: when we have alerts for app server
var tenantId:TenantId = currentTenantId || this.$rootScope.currentPersona.id;
this.HawkularInventory.ResourceOfType.query({tenantId: tenantId, resourceTypeId: 'Deployment'}, (aResourceList, getResponseHeaders) => {
this.HawkularInventory.ResourceOfType.query({resourceTypeId: 'Deployment'}, (aResourceList, getResponseHeaders) => {
var promises = [];
var tmpResourceList = [];
angular.forEach(aResourceList, function(res, idx) {
if (res.id.startsWith(new RegExp('\\[' + this.$routeParams.resourceId + '~/'))) {
tmpResourceList.push(res);
promises.push(this.HawkularMetric.AvailabilityMetricData.query({
promises.push(this.HawkularMetric.AvailabilityMetricData(this.$rootScope.currentPersona.id).query({
tenantId: tenantId,
availabilityId: 'AI~R~' + res.id + '~AT~Deployment Status',
availabilityId: 'AI~R~' + res.id + '~AT~Deployment Status~Deployment Status',
distinct: true}, (resource) => {
var latestData = resource[resource.length-1];
if (latestData) {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -85,9 +85,8 @@ module HawkularMetrics {
this.startTimeStamp = this.endTimeStamp - (this.$routeParams.timeOffset || 3600000);

var tenantId:TenantId = currentTenantId || this.$rootScope.currentPersona.id;
this.HawkularMetric.NumericMetricData.query({
tenantId: tenantId,
numericId: 'MI~R~[' + this.$routeParams.resourceId + '~/]~MT~Heap Used',
this.HawkularMetric.GaugeMetricData(this.$rootScope.currentPersona.id).queryMetrics({
gaugeId: 'MI~R~[' + this.$routeParams.resourceId + '~/]~MT~WildFly Memory Metrics~Heap Used',
start: this.startTimeStamp,
end: this.endTimeStamp,
buckets: 1}, (resource) => {
Expand Down

0 comments on commit 050127a

Please sign in to comment.