mudhorn/prometheus
1
0
Fork 0
mirror of https://github.com/prometheus/prometheus.git synced 2024-12-25 21:54:10 -08:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

Web UI QoL improvements (#5201)

Browse source 
1. Added an ability to resize text area on mouseclick
2. Remember selected target status button on page reload

Signed-off-by: Maria Nemtinova <nemtinovamasha@gmail.com>
This commit is contained in:
Maria Nemtinova 2019-02-12 02:22:05 +03:00 committed by Julius Volz
parent 4cb6c202ff
commit 8e3a39f725
4 changed files with 28 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
web/ui/assets_vfsdata.go
View file

File diff suppressed because one or more lines are too long

17
web/ui/static/js/graph/index.js
View file

@ -62,6 +62,12 @@ Prometheus.Graph.prototype.initialize = function() {
var graphWrapper = self.el.find("#graph_wrapper" + self.id);
self.queryForm = graphWrapper.find(".query_form");
// Auto-resize the text area on input or mouseclick
var resizeTextarea = function(el) {
var offset = el.offsetHeight - el.clientHeight;
$(el).css('height', 'auto').css('height', el.scrollHeight + offset);
};
self.expr = graphWrapper.find("textarea[name=expr]");
self.expr.keypress(function(e) {
const enter = 13;
@ -69,14 +75,13 @@ Prometheus.Graph.prototype.initialize = function() {
self.queryForm.submit();
e.preventDefault();
}
// Auto-resize the text area on input.
var offset = this.offsetHeight - this.clientHeight;
var resizeTextarea = function(el) {
$(el).css('height', 'auto').css('height', el.scrollHeight + offset);
};
$(this).on('keyup input', function() { resizeTextarea(this); });
});
self.expr.click(function(e) {
resizeTextarea(this);
});
self.expr.change(self.handleChange);
self.rangeInput = self.queryForm.find("input[name=range_input]");

10
web/ui/static/js/targets.js
View file

@ -21,6 +21,14 @@ function showUnhealthy(_, container) {
}
function init() {
if (!localStorage.selectedTab || localStorage.selectedTab == "all-targets"){
$("#all-targets").parent().addClass("active");
$(".table-container").each(showAll);
} else if (localStorage.selectedTab == "unhealthy-targets") {
$("#unhealthy-targets").parent().addClass("active");
$(".table-container").each(showUnhealthy);
}
$("button.targets").click(function () {
const tableTitle = $(this).closest("h2").find("a").attr("id");
@ -45,8 +53,10 @@ function init() {
if (target === "all-targets") {
$(".table-container").each(showAll);
localStorage.setItem("selectedTab", "all-targets");
} else if (target === "unhealthy-targets") {
$(".table-container").each(showUnhealthy);
localStorage.setItem("selectedTab", "unhealthy-targets");
}
});
}

2
web/ui/templates/targets.html
View file

@ -8,7 +8,7 @@
<div class="container-fluid">
<h1>Targets</h1>
<div id="showTargets" class="btn-group" data-toggle="buttons">
<label class="btn btn-primary active">
<label class="btn btn-primary">
<input type="radio" name="targets" id="all-targets" autocomplete="off" checked> All
</label>
<label class="btn btn-primary">