', { "class": 'sub-graph' }); this.graphType = options.graphType; if (options.showTitle) { this.el.append("

"); } this.el.find('.title').html(options.label); chartEl = $('

', { "class": 'sub-graph-chart' }); this.el.append(chartEl); this.data = []; this.chartOptions = { element: chartEl, series: [], xkey: "x", ykeys: [], labels: [], smooth: false, data: this.data }; if (options.key === 'change') { this.chartOptions.postUnits = '%'; } } SubGraph.prototype.addSeries = function(json) { var data, i, point, start_time, time, _i, _len, _ref; data = this.data; start_time = Date.parse(json.start_time); _ref = json.data; for (i = _i = 0, _len = _ref.length; _i < _len; i = ++_i) { point = _ref[i]; time = start_time + i * json.period_milliseconds; data[i] || (data[i] = { x: time }); data[i][json.uid] = point; } this.chartOptions.ykeys.push(json.uid); this.chartOptions.labels.push(json.uid); return this.el; }; SubGraph.prototype["class"] = function() { if (this.graphType === 'area') { return Morris.Area; } else { return Morris.Line; } }; SubGraph.prototype.draw = function() { return this.chart = new this["class"]()(this.chartOptions); }; return SubGraph; })(); Graph = (function() { function Graph(options) { this.getSubgraph = __bind(this.getSubgraph, this); this.render = __bind(this.render, this); this.url = options.url; this.el = options.el; this.$el = $(options.el); console.log(this.$el); } Graph.prototype.render = function() { $.getJSON(this.url, (function(_this) { return function(json) { var extractor, index, _i, _len, _ref, _results; _ref = json.extractors; _results = []; for (index = _i = 0, _len = _ref.length; _i < _len; index = ++_i) { extractor = _ref[index]; _results.push($.get(extractor.url, function(line_json) { var subgraph; subgraph = _this.getSubgraph({ label: line_json.label, key: line_json.key, graphType: json.graph_type }); subgraph.addSeries(line_json); if (_this.$el.hasClass('dashboard')) { if (subgraph.chartOptions.ykeys.length === json.extractors.length) { return subgraph.draw(); } } else { return subgraph.draw(); } })); } return _results; }; })(this)); return this; }; Graph.prototype.getSubgraph = function(options) { var create; create = (function(_this) { return function(options) { var subgraph; subgraph = new SubGraph(options); _this.$el.append(subgraph.el); return subgraph; }; })(this); if (this.$el.hasClass('dashboard')) { return this.subGraph || (this.subGraph = create(options)); } else { return create($.extend(options, { showTitle: true })); } }; return Graph; })(); this.Prosperity || (this.Prosperity = {}); this.Prosperity.Graph = Graph; updateMetricOptions = function(el) { var $el, $form, $optionSelect, option, options, possibleOptions, selectedOption, _i, _len, _results; $el = $(el); if ($el.length === 0) { return; } $form = $el.parents('form'); options = $form.data('metric-options'); possibleOptions = options[$el.val()] || []; $optionSelect = $el.parents(".graph-line").find(".metric-option-select select"); selectedOption = $form.find("input[type=\"hidden\"][name=\"" + ($optionSelect.attr('name')) + "\"]").val(); $optionSelect.html(''); _results = []; for (_i = 0, _len = possibleOptions.length; _i < _len; _i++) { option = possibleOptions[_i]; _results.push($optionSelect.append($('