diff --git a/web/ui/static/js/graph.js b/web/ui/static/js/graph.js index a032dc30f..37d8942a6 100644 --- a/web/ui/static/js/graph.js +++ b/web/ui/static/js/graph.js @@ -8,6 +8,7 @@ Handlebars.registerHelper('pathPrefix', function() { return PATH_PREFIX; }); Prometheus.Graph = function(element, options) { this.el = element; + this.graphHtml = null; this.options = options; this.changeHandler = null; this.rickshawGraph = null; @@ -45,8 +46,8 @@ Prometheus.Graph.prototype.initialize = function() { // Draw graph controls and container from Handlebars template. - var graphHtml = graphTemplate(self.options); - self.el.append(graphHtml); + self.graphHtml = $(graphTemplate(self.options)); + self.el.append(self.graphHtml); // Get references to all the interesting elements in the graph container and // bind event handlers. @@ -164,6 +165,12 @@ Prometheus.Graph.prototype.initialize = function() { self.expr.focus(); // refocusing }); + var removeBtn = graphWrapper.find("[name=remove]"); + removeBtn.click(function() { + self.remove(); + return false; + }); + self.populateInsertableMetrics(); if (self.expr.val()) { @@ -612,6 +619,13 @@ Prometheus.Graph.prototype.handleConsoleResponse = function(data, textStatus) { } }; +Prometheus.Graph.prototype.remove = function() { + var self = this; + $(self.graphHtml).remove(); + graphs = graphs.filter(function(e) {return e !== self}); + storeGraphOptionsInURL(); +}; + function parseGraphOptionsFromURL() { var hashOptions = window.location.hash.slice(1); if (!hashOptions) { diff --git a/web/ui/static/js/graph_template.handlebar b/web/ui/static/js/graph_template.handlebar index 7dfbd8d03..3f38bb61f 100644 --- a/web/ui/static/js/graph_template.handlebar +++ b/web/ui/static/js/graph_template.handlebar @@ -124,5 +124,10 @@ +
+
+ Remove Graph +
+