diff options
Diffstat (limited to '')
| -rw-r--r-- | bundles/prometheus/files/console_assets/prom.lib | 150 |
1 files changed, 150 insertions, 0 deletions
diff --git a/bundles/prometheus/files/console_assets/prom.lib b/bundles/prometheus/files/console_assets/prom.lib new file mode 100644 index 0000000..fbc39ff --- /dev/null +++ b/bundles/prometheus/files/console_assets/prom.lib @@ -0,0 +1,150 @@ +{{/* vim: set ft=gotmpl: */}} +{{/* Load Prometheus console library JS/CSS. Should go in head */}} + +{{ define "prom_console_head" }} +<meta name="viewport" content="width=device-width,initial-scale=1.0"> +<meta name="title" content="Prometheus Console"> +<title>Prometheus Console</title> +<link type="text/css" rel="stylesheet" href="{{ pathPrefix }}/classic/static/vendor/rickshaw/rickshaw.min.css"> +<link type="text/css" rel="stylesheet" href="{{ pathPrefix }}/classic/static/vendor/bootstrap-4.5.2/css/bootstrap.min.css"> +<link type="text/css" rel="stylesheet" href="{{ pathPrefix }}/classic/static/css/prom_console.css"> +<link type="text/css" rel="stylesheet" href="{{ pathPrefix }}/classic/static/vendor/bootstrap4-glyphicons/css/bootstrap-glyphicons.min.css"> +<style type="text/css"> + body { + background-color: #191d21 !important; + color: #fff !important; + } + .navbar { + margin-bottom: unset !important; + padding-left: 15px !important; + padding-right: 15px !important; + } + .prom_console_content { + padding-top: unset !important; + margin-bottom: unset !important; + } + .prom_content_div { + width: unset !important; + display: grid; + grid-template-columns: 1fr 1fr; + gap: 15px; + } + @media (max-width: 768px) { + .prom_content_div { + grid-template-columns: 1fr; + } + } + .prom_content_div > div { + padding: 10px; + border: 1px solid var(--gray); + } + .prom_content_div * { + background-color: var(--light) !important; + color: var(--dark) !important; + } + .prom_graph_table { + overflow: hidden; + } +</style> +<script src="{{ pathPrefix }}/classic/static/vendor/rickshaw/vendor/d3.v3.js"></script> +<script src="{{ pathPrefix }}/classic/static/vendor/rickshaw/vendor/d3.layout.min.js"></script> +<script src="{{ pathPrefix }}/classic/static/vendor/rickshaw/rickshaw.min.js"></script> +<script src="{{ pathPrefix }}/classic/static/vendor/js/jquery-3.5.1.min.js"></script> +<script src="{{ pathPrefix }}/classic/static/vendor/js/popper.min.js"></script> +<script src="{{ pathPrefix }}/classic/static/vendor/bootstrap-4.5.2/js/bootstrap.min.js"></script> +<script> + var PATH_PREFIX = "{{ pathPrefix }}"; +</script> +<script src="{{ pathPrefix }}/classic/static/js/prom_console.js"></script> +{{ end }} + +{{/* Top of all pages. */}} +{{ define "head" -}} +<!DOCTYPE html> +<html lang="en"> + <head> + {{ template "prom_console_head" }} + </head> + <body> + {{ template "navbar" . }} + {{ template "menu" . }} +{{ end }} + +{{ define "__prom_query_drilldown_noop" }}{{ . }}{{ end }} +{{ define "humanize" }}{{ humanize . }}{{ end }} +{{ define "humanizeNoSmallPrefix" }}{{ if and (lt . 1.0) (gt . -1.0) }}{{ printf "%.3g" . }}{{ else }}{{ humanize . }}{{ end }}{{ end }} +{{ define "humanize1024" }}{{ humanize1024 . }}{{ end }} +{{ define "humanizeDuration" }}{{ humanizeDuration . }}{{ end }} +{{ define "humanizePercentage" }}{{ humanizePercentage . }}{{ end }} +{{ define "humanizeTimestamp" }}{{ humanizeTimestamp . }}{{ end }} +{{ define "printf.1f" }}{{ printf "%.1f" . }}{{ end }} +{{ define "printf.3g" }}{{ printf "%.3g" . }}{{ end }} + +{{/* prom_query_drilldown (args expr suffix? renderTemplate?) +Displays the result of the expression, with a link to /graph for it. + +renderTemplate is the name of the template to use to render the value. +*/}} +{{ define "prom_query_drilldown" }} +{{ $expr := .arg0 }}{{ $suffix := (or .arg1 "") }}{{ $renderTemplate := (or .arg2 "__prom_query_drilldown_noop") }} +<a class="prom_query_drilldown" href="{{ pathPrefix }}{{ graphLink $expr }}"> {{ with query $expr }}{{tmpl $renderTemplate ( . | first | value )}}{{ $suffix }}{{ else }}-{{ end }}</a> +{{ end }} + +{{ define "prom_path" }}/consoles/{{ .Path }}?{{ range $param, $value := .Params }}{{ $param }}={{ $value }}&{{ end }}{{ end }}" + +{{ define "prom_content_head" }} + <div class="prom_console_content"> + {{ template "prom_graph_timecontrol" . }} +{{ end }} +{{ define "prom_content_tail" }} + </div> +{{ end }} + +{{ define "prom_graph_timecontrol" }} + <div class="prom_graph_timecontrol"> + <div class="prom_graph_timecontrol_inner"> + <div class="prom_graph_timecontrol_group "> + <button class="btn btn-light pull-left" type="button" id="prom_graph_duration_shrink" title="Shrink the time range."> + <i class="glyphicon glyphicon-minus"></i> + </button><!-- Comments between elements to remove spaces + --><input class="input pull-left align-middle" size="3" title="Time range of graph" type="text" id="prom_graph_duration"><!-- + --><button class="btn btn-light pull-left" type="button" id="prom_graph_duration_grow" title="Grow the time range."> + <i class="glyphicon glyphicon-plus"></i> + </button> + </div> + <div class="prom_graph_timecontrol_group "> + <button class="btn btn-light pull-left" type="button" id="prom_graph_time_back" title="Rewind the end time."> + <i class="glyphicon glyphicon-backward"></i> + </button><!-- + --><input class="input pull-left align-middle" title="End time of graph" placeholder="Until" type="text" id="prom_graph_time_end" size="16" value=""><!-- + --><button class="btn btn-light pull-left" type="button" id="prom_graph_time_forward" title="Advance the end time."> + <i class="glyphicon glyphicon-forward"></i> + </button> + </div> + <div class="prom_graph_timecontrol_group "> + <div class="btn-group dropup prom_graph_timecontrol_refresh pull-left"> + <button type="button" class="btn btn-light pull-left" id="prom_graph_refresh_button" title="Refresh."> + <i class="glyphicon glyphicon-repeat"></i> + <span class="icon-repeat"></span> + (<span id="prom_graph_refresh_button_value">Off</span>) + </button> + <button type="button" class="btn btn-light pull-left dropdown-toggle" data-toggle="dropdown" title="Set autorefresh." aria-haspopup="true" aria-expanded="false"> + <span class="caret"></span> + </button> + <ul class="dropdown-menu" id="prom_graph_refresh_intervals" role="menu"> + </ul> + </div> + </div> + </div> + <script> + new PromConsole.TimeControl(); + </script> + </div> +{{ end }} + +{{/* Bottom of all pages. */}} + +{{ define "tail" }} + </body> +</html> +{{ end }} |