diff --git a/web/handler.go b/web/handler.go new file mode 100644 index 000000000..75b411eb7 --- /dev/null +++ b/web/handler.go @@ -0,0 +1,26 @@ +// Copyright 2013 Prometheus Team +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. + +package web + +import ( + "net/http" +) + +func graphHandler(w http.ResponseWriter, r *http.Request) { + executeTemplate(w, "graph", nil) +} + +func consoleHandler(w http.ResponseWriter, r *http.Request) { + executeTemplate(w, "console", nil) +} diff --git a/web/static/css/prometheus.css b/web/static/css/prometheus.css index 96a8ca84b..da245fd77 100644 --- a/web/static/css/prometheus.css +++ b/web/static/css/prometheus.css @@ -2,8 +2,8 @@ body { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 14px; line-height: 20px; - color: #333333; - background-color: #eee; + color: #333; + background-color: #f2f2f2; margin: 0px; padding: 0px; } @@ -49,3 +49,15 @@ input[name=end_input], input[name=range_input] { margin-left: -4px; margin-right: -4px; } + +#navigation { + font-size: 20pt; + background-color: #333; + color: #F2F2F2; + line-height: 120%; +} + +#navigation a { padding-right: 1em; text-decoration: none } +#navigation a:visited { color: #F2F2F2 } +#navigation a:active { color: #F60 } +#navigation a:hover { color: #06C } diff --git a/web/static/js/graph.js b/web/static/js/graph.js index e2bc92fce..260a5ab64 100644 --- a/web/static/js/graph.js +++ b/web/static/js/graph.js @@ -20,6 +20,7 @@ var Prometheus = Prometheus || {}; var graphs = []; +var graphTemplate; Prometheus.Graph = function(element, options) { this.el = element; @@ -57,9 +58,8 @@ Prometheus.Graph.prototype.initialize = function() { self.options['stacked_checked'] = self.options['stacked'] ? "checked" : ""; // Draw graph controls and container from Handlebars template. - var source = $("#graph_template").html(); - var template = Handlebars.compile(source); - var graphHtml = template(self.options); + + var graphHtml = graphTemplate(self.options); self.el.append(graphHtml); // Get references to all the interesting elements in the graph container and @@ -428,15 +428,22 @@ function init() { cache: false }); - var options = parseGraphOptionsFromUrl(); - if (options.length == 0) { - options.push({}); - } - for (var i = 0; i < options.length; i++) { - addGraph(options[i]); - } - - $("#add_graph").click(function() { addGraph({}); }); + $.ajax({ + url: "/static/js/graph_template.handlebar", + success: function(data) { + console.log("got template") + console.log(data) + graphTemplate = Handlebars.compile(data); + var options = parseGraphOptionsFromUrl(); + if (options.length == 0) { + options.push({}); + } + for (var i = 0; i < options.length; i++) { + addGraph(options[i]); + } + $("#add_graph").click(function() { addGraph({}); }); + } + }) } $(init); diff --git a/web/static/js/graph_template.handlebar b/web/static/js/graph_template.handlebar new file mode 100644 index 000000000..e24277197 --- /dev/null +++ b/web/static/js/graph_template.handlebar @@ -0,0 +1,42 @@ +
+
+
+
+
+ + +
+
+ + + + + + + + + + + + + + + + + + +
+
+
+
+ +
+
+
+
+
+
+
+
diff --git a/web/templates/_base.html b/web/templates/_base.html index 02f80d234..79c1b23f8 100644 --- a/web/templates/_base.html +++ b/web/templates/_base.html @@ -4,10 +4,16 @@ Prometheus - + + {{template "head" .}} + {{template "content" .}} diff --git a/web/templates/console.html b/web/templates/console.html index df6e32cfa..c97356e01 100644 --- a/web/templates/console.html +++ b/web/templates/console.html @@ -1,15 +1,8 @@ - - - - - Prometheus Expression Browser - - - +{{define "head"}} - +{{end}} - +{{define "content"}}
@@ -23,5 +16,4 @@
- - +{{end}} diff --git a/web/templates/graph.html b/web/templates/graph.html index ca2ad0eda..2181bb0ca 100644 --- a/web/templates/graph.html +++ b/web/templates/graph.html @@ -1,17 +1,12 @@ - - - - - Prometheus Expression Browser - +{{define "head"}} - - + + - - + + @@ -19,61 +14,17 @@ - - - + + + - + - - + +{{end}} - +{{define "content"}}
- - +{{end}} diff --git a/web/templates/status.html b/web/templates/status.html index a7602dab4..722d9dc4a 100644 --- a/web/templates/status.html +++ b/web/templates/status.html @@ -1,3 +1,5 @@ +{{define "head"}}{{end}} + {{define "content"}}

Status

diff --git a/web/web.go b/web/web.go index 6c9b55e2d..76b38e8cb 100644 --- a/web/web.go +++ b/web/web.go @@ -36,7 +36,10 @@ func StartServing(appState *appstate.ApplicationState) { gorest.RegisterService(api.NewMetricsService(appState)) exporter := registry.DefaultRegistry.YieldExporter() - http.Handle("/status", &StatusHandler{appState: appState}) + http.Handle("/", &StatusHandler{appState: appState}) + http.HandleFunc("/graph", graphHandler) + http.HandleFunc("/console", consoleHandler) + http.Handle("/api/", gorest.Handle()) http.Handle("/metrics.json", exporter) if *useLocalAssets {