pulse-meter 0.1.11 → 0.2.0

data/lib/pulse-meter/visualize/public/js/application.js

@@ -4,11 +4,6 @@
   $(function() {
     var AppRouter, PageInfo, PageInfoList, PageTitleView, PageTitlesView, Widget, WidgetChartView, WidgetList, WidgetListView, WidgetView, appRouter, globalOptions, pageInfos, pageTitlesApp, widgetList, widgetListApp;
     globalOptions = gon.options;
-    Highcharts.setOptions({
-      global: {
-        useUTC: globalOptions.useUtc
-      }
-    });
     PageInfo = Backbone.Model.extend({});
     PageInfoList = Backbone.Collection.extend({
       model: PageInfo,
@@ -100,21 +95,26 @@
         }
       },
       cutoffValue: function(v, min, max) {
-        if (min !== null && v.y < min) {
-          v.y = min;
-          v.color = globalOptions.outlierColor;
-        }
-        if (max !== null && v.y > max) {
-          v.y = max;
-          return v.color = globalOptions.outlierColor;
+        if (v !== null) {
+          if (min !== null && v < min) {
+            return min;
+          } else if (max !== null && v > max) {
+            return max;
+          } else {
+            return v;
+          }
+        } else {
+          return 0;
         }
       },
       cutoff: function(min, max) {
-        return _.each(this.get('series'), function(s) {
-          console.log(s.data.length);
-          return _.each(s.data, function(v) {
-            return this.cutoffValue(v, min, max);
-          }, this);
+        return _.each(this.get('series').rows, function(row) {
+          var i, _i, _ref, _results;
+          _results = [];
+          for (i = _i = 1, _ref = row.length - 1; 1 <= _ref ? _i <= _ref : _i >= _ref; i = 1 <= _ref ? ++_i : --_i) {
+            _results.push(row[i] = this.cutoffValue(row[i], min, max));
+          }
+          return _results;
         }, this);
       },
       forceUpdate: function() {
@@ -123,6 +123,98 @@
             return model.trigger('redraw');
           }
         });
+      },
+      pieData: function() {
+        var data;
+        data = new google.visualization.DataTable();
+        data.addColumn('string', 'Title');
+        data.addColumn('number', this.get('valuesTitle'));
+        data.addRows(this.get('series').data);
+        return data;
+      },
+      dateOffset: function() {
+        if (globalOptions.useUtc) {
+          return (new Date).getTimezoneOffset() * 60000;
+        } else {
+          return 0;
+        }
+      },
+      lineData: function() {
+        var data, dateOffset, series, title;
+        title = this.get('title');
+        data = new google.visualization.DataTable();
+        data.addColumn('datetime', 'Time');
+        dateOffset = this.dateOffset();
+        series = this.get('series');
+        _.each(series.titles, function(t) {
+          return data.addColumn('number', t);
+        });
+        console.log(series);
+        _.each(series.rows, function(row) {
+          row[0] = new Date(row[0] + dateOffset);
+          return data.addRow(row);
+        });
+        return data;
+      },
+      options: function() {
+        return {
+          title: this.get('title'),
+          lineWidth: 1,
+          chartArea: {
+            left: 40,
+            width: '100%'
+          },
+          height: 300,
+          legend: {
+            position: 'bottom'
+          },
+          vAxis: {
+            title: this.get('valuesTitle')
+          },
+          axisTitlesPosition: 'in'
+        };
+      },
+      pieOptions: function() {
+        return $.extend(true, this.options(), {
+          slices: this.get('series').options
+        });
+      },
+      lineOptions: function() {
+        return $.extend(true, this.options(), {
+          hAxis: {
+            format: 'yyyy.MM.dd HH:mm:ss'
+          },
+          series: this.get('series').options
+        });
+      },
+      tableOptions: function() {
+        return $.extend(true, this.lineOptions(), {
+          sortColumn: 0,
+          sortAscending: false
+        });
+      },
+      chartOptions: function() {
+        var opts;
+        opts = this.get('type') === 'pie' ? this.pieOptions() : this.get('type') === 'table' ? this.tableOptions() : this.lineOptions();
+        return $.extend(true, opts, globalOptions.gchartOptions, pageInfos.selected().get('gchartOptions'));
+      },
+      chartData: function() {
+        if (this.get('type') === 'pie') {
+          return this.pieData();
+        } else {
+          return this.lineData();
+        }
+      },
+      chartClass: function() {
+        if (this.get('type') === 'pie') {
+          return google.visualization.PieChart;
+        } else if (this.get('type') === 'area') {
+          return google.visualization.AreaChart;
+        } else if (this.get('type') === 'table') {
+          return google.visualization.Table;
+        } else {
+          return google.visualization.LineChart;
+        }
       }
     });
     WidgetList = Backbone.Collection.extend({
@@ -137,61 +229,14 @@
         return this.model.bind('destroy', this.remove, this);
       },
       updateData: function(min, max) {
-        var chartSeries, i, newSeries, _i, _ref;
         this.model.cutoff(min, max);
-        chartSeries = this.chart.series;
-        newSeries = this.model.get('series');
-        for (i = _i = 0, _ref = chartSeries.length - 1; 0 <= _ref ? _i <= _ref : _i >= _ref; i = 0 <= _ref ? ++_i : --_i) {
-          if (newSeries[i] != null) {
-            chartSeries[i].setData(newSeries[i].data, false);
-          }
-        }
-        return this.chart.redraw();
+        return this.chart.draw(this.model.chartData(), this.model.chartOptions());
       },
       render: function() {
-        var options;
-        options = {
-          chart: {
-            renderTo: this.el,
-            plotBorderWidth: 1,
-            spacingLeft: 0,
-            spacingRight: 0,
-            type: this.model.get('type'),
-            animation: false,
-            zoomType: 'x'
-          },
-          credits: {
-            enabled: false
-          },
-          title: {
-            text: this.model.get('title')
-          },
-          xAxis: {
-            type: 'datetime'
-          },
-          yAxis: {
-            title: {
-              text: this.model.get('valuesTitle')
-            }
-          },
-          tooltip: {
-            xDateFormat: '%Y-%m-%d %H:%M:%S',
-            valueDecimals: 6
-          },
-          series: this.model.get('series'),
-          plotOptions: {
-            series: {
-              animation: false,
-              lineWidth: 1,
-              shadow: false,
-              marker: {
-                radius: 0
-              }
-            }
-          }
-        };
-        $.extend(true, options, globalOptions.highchartOptions, pageInfos.selected().get('highchartOptions'));
-        return this.chart = new Highcharts.Chart(options);
+        var chartClass;
+        chartClass = this.model.chartClass();
+        this.chart = new chartClass(this.el);
+        return this.updateData();
       }
     });
     WidgetView = Backbone.View.extend({

data/lib/pulse-meter/visualize/sensor.rb

@@ -12,13 +12,13 @@ module PulseMeter
         @color = args[:color]
       end
 
-      def last_value(need_incomplete=false)
+      def last_value(now, need_incomplete=false)
         sensor = real_sensor
 
         sensor_data = if need_incomplete
-          sensor.timeline(sensor.interval).first
+          sensor.timeline_within(now - sensor.interval, now).first
         else
-          sensor.timeline(sensor.interval * 2).first
+          sensor.timeline_within(now - sensor.interval * 2, now).first
         end
 
         if sensor_data.is_a?(PulseMeter::SensorData)
@@ -28,13 +28,13 @@ module PulseMeter
         end
       end
 
-      def last_point_data(need_incomplete=false)
-        extractor.point_data(last_value(need_incomplete))
+      def last_point_data(now, need_incomplete=false)
+        extractor.point_data(last_value(now, need_incomplete))
       end
 
-      def timeline_data(time_span, need_incomplete = false)
+      def timeline_data(now, time_span, need_incomplete = false)
         sensor = real_sensor
-        timeline_data = sensor.timeline(time_span)
+        timeline_data = sensor.timeline_within(now - time_span, now)
         timeline_data.pop unless need_incomplete
         extractor.series_data(timeline_data)
       end
@@ -47,6 +47,10 @@ module PulseMeter
         real_sensor.class
       end
 
+      def interval
+        real_sensor.interval
+      end
+
       def extractor
         PulseMeter::Visualize.extractor(self)
       end

data/lib/pulse-meter/visualize/series_extractor.rb

@@ -14,15 +14,15 @@ module PulseMeter
         end
 
         def series_data(timeline_data)
-          {
+          [{
             data: timeline_data.map{|sd| {x: sd.start_time.to_i*1000, y: to_float(sd.value)}}
-          }.merge(opts_to_add)
+          }.merge(opts_to_add)]
         end
 
         def point_data(value)
-          {
+          [{
             y: to_float(value)
-          }.merge(opts_to_add)
+          }.merge(opts_to_add)]
         end
 
         protected

data/lib/pulse-meter/visualize/views/main.haml

@@ -4,11 +4,13 @@
   :javascript
     var ROOT = "#{url('/')}";
   = include_gon
-  - %w{jquery-1.7.2.min.js json2.js underscore-min.js backbone-min.js highcharts.js application.js bootstrap.js}.each do |jsfile|
-    %script{:type => 'text/javascript', :src => url("/js/#{jsfile}")}
+  - %w{jquery-1.7.2.min.js json2.js underscore-min.js backbone-min.js application.js bootstrap.js}.each do |jsfile|
+    %script{type: 'text/javascript', src: url("/js/#{jsfile}")}
   - %w{bootstrap.min.css application.css}.each do |cssfile|
-    %link{:rel => 'stylesheet', :href => url("/css/#{cssfile}"), :type => 'text/css', :media => 'screen'}
-		
+    %link{rel: 'stylesheet', href: url("/css/#{cssfile}"), type: 'text/css', media: 'screen'}
+  %script{type: 'text/javascript', src: "https://www.google.com/jsapi"}
+  :javascript
+    google.load("visualization", "1", {packages:["corechart", "table"]});
 %body
   %script#widget-template{type: 'text/template'}
     #plotarea
@@ -17,6 +19,7 @@
         %button#refresh.btn.btn-mini
           %i.icon-refresh
           Refresh
+        <% if(type != 'table'){ %>
         %span.space
         %label
           Cutoff min:
@@ -25,6 +28,7 @@
         %label
           Cutoff max:
           %input.btn-mini#cutoff-max
+        <% } %>
         %span.space
         %label
           Refresh:
@@ -44,10 +48,18 @@
             %option{value: 60 * 60 * 24 * 7 * 2} 2 weeks
             %option{value: 60 * 60 * 24 * 30} 1 month
           %button#extend-timespan.btn.btn-mini
+            <% if(type != 'table'){ %>
             %i.icon-arrow-left
+            <% } else { %>
+            %i.icon-arrow-down
+            <% } %>
             Extend
           %button#reset-timespan.btn.btn-mini
+            <% if(type != 'table'){ %>
             %i.icon-arrow-right
+            <% } else { %>
+            %i.icon-arrow-up
+            <% } %>
             Reset
         <% } %>
     %hr

data/lib/pulse-meter/visualize/widget.rb

@@ -1,6 +1,11 @@
 module PulseMeter
   module Visualize
+    class Error < StandardError; end
+
     class Widget
+      class NotATimelinedSensorInWidget < PulseMeter::Visualize::Error; end
+      class DifferentSensorIntervalsInWidget < PulseMeter::Visualize::Error; end
+
       attr_reader :sensors
       attr_reader :title
       attr_reader :type
@@ -23,6 +28,7 @@ module PulseMeter
       end
 
       def data(options = {})
+        ensure_sensor_match!
         real_timespan = options[:timespan] || timespan
         {
           title: title,
@@ -39,27 +45,77 @@ module PulseMeter
 
       def series_data(tspan)
         case type
-          when :spline
-            line_series_data(tspan)
           when :line
             line_series_data(tspan)
           when :area
             line_series_data(tspan)
           when :pie
             pie_series_data
+          when :table
+            line_series_data(tspan)
+        end
+      end
+
+      def ensure_sensor_match!
+        intervals = []
+        sensors.each do |s|
+          unless s.type < PulseMeter::Sensor::Timeline
+            raise NotATimelinedSensorInWidget, "sensor `#{s.name}' is not timelined"
+          end
+          intervals << s.interval
+        end
+
+        unless intervals.all?{|i| i == intervals.first}
+          interval_notice = sensors.map{|s| "#{s.name}: #{s.interval}"}.join(', ')
+          raise DifferentSensorIntervalsInWidget, "Sensors with different intervals in a single widget: #{interval_notice}"
         end
       end
 
       def line_series_data(tspan)
-        sensors.map{ |s| s.timeline_data(tspan, show_last_point) }.flatten(1)
+        now = Time.now
+        sensor_datas = sensors.map{ |s|
+          s.timeline_data(now, tspan, show_last_point)
+        }
+        rows = []
+        titles = []
+        series_options = []
+        datas = []
+        sensor_datas.each do |sensor_data|
+          sensor_data.each do |tl|
+            titles << tl[:name]
+            series_options << {color: tl[:color]}
+            datas << tl[:data]
+          end
+        end
+        unless datas.empty?
+          first = datas.shift
+          first.each_with_index do |tl_data, row_num|
+            rows << datas.each_with_object([tl_data[:x], tl_data[:y]]) do |data_col, row|
+              row << data_col[row_num][:y]
+            end
+          end
+        end
+        {
+          titles: titles,
+          rows: rows,
+          options: series_options
+        }
       end
 
       def pie_series_data
-        [{
-          type: type,
-          name: values_label,
-          data: sensors.map{|s| s.last_point_data(show_last_point)}.flatten(1)
-        }]
+        values = []
+        slice_options = []
+        now = Time.now
+        sensors.each do |s|
+          s.last_point_data(now, show_last_point).each do |point_data|
+            values << [point_data[:name], point_data[:y]]
+            slice_options << {color: point_data[:color]}
+          end
+        end
+        {
+          data: values,
+          options: slice_options
+        }
       end
 
     end

data/spec/pulse_meter/visualize/dsl/layout_spec.rb

@@ -7,12 +7,12 @@ describe PulseMeter::Visualize::DSL::Layout do
   let(:layout){ described_class.new }
 
   describe '.new' do
-    it "should initialize pages, title, use_utc, highchart_options" do
+    it "should initialize pages, title, use_utc, gchart_options" do
       l = layout.to_layout
       l.title.should == PulseMeter::Visualize::DSL::Layout::DEFAULT_TITLE
       l.pages.should == []
       l.use_utc.should be_true
-      l.highchart_options.should == {}
+      l.gchart_options.should == {}
     end
   end
 
@@ -20,7 +20,7 @@ describe PulseMeter::Visualize::DSL::Layout do
     it "should add page constructed by block to pages" do
       layout.page "My Foo Page" do |p|
         p.pie "foo_widget", sensor: sensor_name
-        p.spline "bar_widget" do |w|
+        p.line "bar_widget" do |w|
           w.sensor(sensor_name)
         end
       end
@@ -48,10 +48,10 @@ describe PulseMeter::Visualize::DSL::Layout do
     end
   end
 
-  describe "#highchart_options" do
-    it "should set highchart_options" do
-      layout.highchart_options({b: 1})
-      layout.to_layout.highchart_options.should == {b: 1}
+  describe "#gchart_options" do
+    it "should set gchart_options" do
+      layout.gchart_options({b: 1})
+      layout.to_layout.gchart_options.should == {b: 1}
     end
   end