add tooltip

This commit is contained in:
John Mitchell
2017-09-22 10:07:51 -04:00
parent 25e503219f
commit 46eb1727ad
3 changed files with 15 additions and 4 deletions

View File

@@ -46,7 +46,11 @@ function ComponentsStrings (BaseString) {
ns.truncate = { ns.truncate = {
DEFAULT: t.s('Copy full revision to clipboard.'), DEFAULT: t.s('Copy full revision to clipboard.'),
COPIED: t.s('Copied to clipboard.') COPIED: t.s('Copied to clipboard.')
} };
ns.capacityBar = {
IS_OFFLINE: t.s('Unavailable to run jobs.')
};
} }
ComponentsStrings.$inject = ['BaseStringService']; ComponentsStrings.$inject = ['BaseStringService'];

View File

@@ -1,5 +1,5 @@
export default ['templateUrl', export default ['templateUrl', 'ComponentsStrings',
function (templateUrl) { function (templateUrl, strings) {
return { return {
scope: { scope: {
capacity: '=', capacity: '=',
@@ -13,8 +13,10 @@ export default ['templateUrl',
scope.$watch('totalCapacity', function(val) { scope.$watch('totalCapacity', function(val) {
if (val === 0) { if (val === 0) {
scope.isOffline = true; scope.isOffline = true;
scope.offlineTip = strings.get(`capacityBar.IS_OFFLINE`);
} else { } else {
scope.isOffline = false; scope.isOffline = false;
scope.offlineTip = null;
} }
}, true); }, true);

View File

@@ -1,5 +1,10 @@
<div class="CapacityBar" <div class="CapacityBar"
ng-class="{'CapacityBar--offline': isOffline}"> ng-class="{'CapacityBar--offline': isOffline}"
aw-tool-tip="{{ offlineTip }}"
data-tip-watch="offlineTip"
data-placement="top"
data-trigger="hover"
data-container="body">
<div class="CapacityBar-remaining" ng-style="CapacityStyle"></div> <div class="CapacityBar-remaining" ng-style="CapacityStyle"></div>
<div class="CapacityBar-consumed"></div> <div class="CapacityBar-consumed"></div>
</div> </div>