Skip to content

Commit 69c56cc

Browse files
committed
Added placeholders when lists empty
1 parent 50b73f7 commit 69c56cc

File tree

5 files changed

+32
-9
lines changed

5 files changed

+32
-9
lines changed

src/ServicePulse.Host/app/css/app.css

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -51,4 +51,23 @@
5151
.rowSelected {
5252
border: 1px solid #6BA6E1;
5353
background-color: #f2f6fc !important;
54+
}
55+
56+
.row-fluid .span1.check {
57+
width: 0;
58+
margin-left: 5px;
59+
}
60+
61+
@media (min-width: 1200px) {
62+
.row-fluid .span11.check {
63+
width: 96.452991%;
64+
*width: 96.452991%;
65+
}
66+
}
67+
68+
@media (min-width: 768px) and (max-width: 979px) {
69+
.row-fluid .span11.check {
70+
width: 96.489362%;
71+
*width: 96.489362%;
72+
}
5473
}

src/ServicePulse.Host/app/js/alerts/alerts.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,9 +4,11 @@ angular.module('alerts', [])
44
.controller('AlertsCtrl', ['$scope', 'serviceControlService', 'streamService', function($scope, serviceControlService, streamService) {
55

66
$scope.model = [];
7-
7+
$scope.loadingData = true;
8+
89
serviceControlService.getAlerts().then(function(alerts) {
910
$scope.model = alerts;
11+
$scope.loadingData = false;
1012
});
1113

1214
streamService.subscribe($scope, 'AlertRaised', function(message) {

src/ServicePulse.Host/app/js/alerts/alerts.tpl.html

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,13 +6,15 @@ <h2><i class="fa-icon-info-sign"></i><span class="break"></span>Latest events</h
66
<div class="scRow" ng-repeat="alert in model | orderBy: '-raised_at' | limitTo: 10">
77
<div class="row-fluid">
88
<div class="span10 text-info">{{alert.description}}</div>
9-
<div class="span2"><sp-moment date="{{alert.raised_at}}" /></div>
9+
<div class="span2 text-right"><sp-moment date="{{alert.raised_at}}" /></div>
1010
</div>
1111
<div class="row-fluid">
1212
<div class="span2" title="Severity: {{alert.severity}}"><span ng-class="{'label label-success': alert.severity == 'info', 'label label-important': alert.severity == 'error'}">{{alert.severity}}</span></div>
1313
<div class="span4" title="Category: {{alert.category}}">{{alert.category}}</div>
1414
<div class="span6" title="Related to: {{alert.related_to[0]}}">{{alert.related_to[0]}}</div>
1515
</div>
1616
</div>
17+
<div class="alert alert-success" ng-show='!loadingData && model.length == 0'>No events!</div>
18+
<div class="alert alert-info" ng-show='loadingData'><strong>Loading data ...</strong></div>
1719
</div>
1820
</div>

src/ServicePulse.Host/app/js/custom_checks/customChecks.tpl.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -23,11 +23,11 @@ <h2><i class="fa-icon-check"></i><span class="break"></span>Showing {{model.tota
2323
<div class="row-fluid">
2424
<div class="span2" title="Id: {{item.id}}"><strong>{{item.id}}</strong></div>
2525
<div class="span4" title="Category: {{item.category}}">{{item.category}}</div>
26-
<div class="span6 text-right" title="On: {{item.originating_endpoint.name + '@' + item.originating_endpoint.machine}}">on {{item.originating_endpoint.name + '@' + item.originating_endpoint.machine}}</div>
26+
<div class="span6 text-right" title="In: {{item.originating_endpoint.name}} on {{item.originating_endpoint.machine}}">in {{item.originating_endpoint.name}} on {{item.originating_endpoint.machine}}</div>
2727
</div>
2828
</div>
2929
<div class="alert alert-success" ng-show='!loadingData && model.total == 0'>No failed custom checks</div>
30-
<div class="alert alert-info" ng-show='loadingData'>Loading more data...</div>
30+
<div class="alert alert-info" ng-show='loadingData'><strong>Loading data ...</strong></div>
3131
</div>
3232
</div>
3333
</div>

src/ServicePulse.Host/app/js/failed_messages/failedMessages.tpl.html

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,7 @@ <h2><i class="fa-icon-envelope"></i><span class="break"></span>Showing {{model.f
5252
<div class="box-content">
5353
<div class="btn-toolbar">
5454
<button class="btn" ng-click="retrySelected()" ng-disabled="model.selectedIds.length == 0"><i class="icon-repeat"></i> Retry {{model.selectedIds.length}} selected</button>
55-
<button class="btn" ng-click="retryAll()"><i class="icon-asterisk"></i> Retry all ({{model.total}} messages)</button>
55+
<button class="btn" ng-click="retryAll()" ng-disabled="model.total == 0"><i class="icon-asterisk"></i> Retry all ({{model.total}} messages)</button>
5656
<div class="btn-group pull-right">
5757
<a class="btn btn-link dropdown-toggle"
5858
data-toggle="dropdown"
@@ -69,21 +69,21 @@ <h2><i class="fa-icon-envelope"></i><span class="break"></span>Showing {{model.f
6969
<div infinite-scroll="loadMoreResults()" infinite-scroll-distance="0" infinite-scroll-disabled="disableLoadingData">
7070
<div class="scRow" ng-repeat="row in model.failedMessages">
7171
<div class="row-fluid scSelectableRow" ng-class="{rowSelected: row.selected == true}" ng-click="toggleRowSelect(row)" style="cursor: pointer;">
72-
<div class="span1" style="margin-left: 5px; width: 0;"><input type="checkbox" ng-checked="row.selected"></div>
73-
<div class="span11">
72+
<div class="span1 check"><input type="checkbox" ng-checked="row.selected"></div>
73+
<div class="span11 check">
7474
<div class=" row-fluid">
7575
<div class="span10 rowText" title="Message Type: {{row.message_type}}">{{row.message_type | limitTo: 90}}<span ng-show="row.message_type.length > 90">...</span></div>
7676
<div class="span2 text-right"><sp-moment date="{{row.time_sent}}" /></div>
7777
</div>
7878
<div class="row-fluid">
7979
<div class="span8"><code>{{row.failure_details.exception.message}}</code></div>
80-
<div class="span4 text-right" title="On: {{row.receiving_endpoint.name}}@{{row.receiving_endpoint.machine}}">on {{row.receiving_endpoint.name}}@{{row.receiving_endpoint.machine}}</div>
80+
<div class="span4 text-right" title="In: {{row.receiving_endpoint.name}} on {{row.receiving_endpoint.machine}}">in {{row.receiving_endpoint.name}} on {{row.receiving_endpoint.machine}}</div>
8181
</div>
8282
</div>
8383
</div>
8484
</div>
8585
<div class="alert alert-success" ng-show='!loadingData && model.total == 0'>No failed messages</div>
86-
<div class="alert alert-info" ng-show='loadingData'>Loading more data...</div>
86+
<div class="alert alert-info" ng-show='loadingData'><strong>Loading data ...</strong></div>
8787
</div>
8888
</div>
8989
</div>

0 commit comments

Comments
 (0)