Add tooltip titles to tags and show the tags in the image hover tooltip

This commit is contained in:
Joseph Schorr 2014-04-07 19:53:25 -04:00
parent a43379d8a6
commit f7b1087ef9
2 changed files with 21 additions and 4 deletions

View file

@ -2411,12 +2411,19 @@ p.editable:hover i {
text-align: center;
}
#image-history-container .tags .tag, #confirmdeleteTagModal .tag {
.tags .tag, #confirmdeleteTagModal .tag {
border-radius: 10px;
margin-right: 4px;
cursor: pointer;
}
.tooltip-tags {
display: block;
margin-top: 10px;
border-top: 1px dotted #aaa;
padding-top: 10px;
}
#changes-tree-container {
overflow: hidden;
}

View file

@ -222,7 +222,17 @@ ImageHistoryTree.prototype.draw = function(container) {
if (d.image.command && d.image.command.length) {
html += '<span class="command info-line"><i class="fa fa-terminal"></i>' + formatCommand(d.image) + '</span>';
}
html += '<span class="created info-line"><i class="fa fa-calendar"></i>' + formatTime(d.image.created) + '</span>';
html += '<span class="created info-line"><i class="fa fa-calendar"></i>' + formatTime(d.image.created) + '</span>';
var tags = d.tags || [];
html += '<span class="tooltip-tags tags">';
for (var i = 0; i < tags.length; ++i) {
var tag = tags[i];
var kind = 'default';
html += '<span class="label label-' + kind + ' tag" data-tag="' + tag + '">' + tag + '</span>';
}
html += '</span>';
return html;
})
@ -709,7 +719,7 @@ ImageHistoryTree.prototype.update_ = function(source) {
if (tag == currentTag) {
kind = 'success';
}
html += '<span class="label label-' + kind + ' tag" data-tag="' + tag + '"">' + tag + '</span>';
html += '<span class="label label-' + kind + ' tag" data-tag="' + tag + '" title="' + tag + '">' + tag + '</span>';
}
return html;
});
@ -1686,7 +1696,7 @@ LogUsageChart.prototype.draw = function(container, logData, startDate, endDate)
.duration(500)
.call(chart);
nv.utils.windowResize(chart.update);
nv.utils.windoweResize(chart.update);
chart.multibar.dispatch.on('elementClick', function(e) { that.handleElementClicked_(e); });
chart.dispatch.on('stateChange', function(e) { that.handleStateChange_(e); });