added 260907 version of worker toolkit

worker-toolkit-flaredown/repo/frontend/app/components/chart/g-blank-flat.js

@@ -0,0 +1,26 @@
+import Ember from 'ember';
+import Graphable from 'flaredown/components/chart/graphable';
+import * as d3 from "d3";
+
+const {
+  get,
+  computed,
+  Component,
+  computed: { alias },
+} = Ember;
+
+export default Component.extend(Graphable, {
+  name: alias('model.name'),
+
+  halfHeight: computed('height', function() {
+    return get(this, 'yScale')(0);
+  }),
+
+  yScale: computed('data', function() {
+    return d3.scale.linear().range([get(this, 'height') , 0]).domain([-1, 1]);
+  }),
+
+  data: computed('timeline', function() {
+    return (this.get('timeline') || []).map(day => ({ x: day, y: null })).sortBy('x');
+  }),
+});

worker-toolkit-flaredown/repo/frontend/app/components/chart/g-blank-trackable.js

@@ -0,0 +1,23 @@
+import Ember from 'ember';
+import Graphable from 'flaredown/components/chart/graphable';
+import * as d3 from "d3";
+
+const {
+  computed,
+  Component,
+  computed: { alias },
+} = Ember;
+
+export default Component.extend(Graphable, {
+  yRulers: [0, 1, 2, 3, 4],
+
+  name: alias('model.name'),
+
+  yScale: computed('data', function() {
+    return d3.scale.linear().range([this.get('height') , 0]).domain([-1, 5]);
+  }),
+
+  data: computed('timeline', function() {
+    return (this.get('timeline') || []).map(day => ({ x: day, y: null })).sortBy('x');
+  }),
+});

worker-toolkit-flaredown/repo/frontend/app/components/chart/g-flat.js

@@ -0,0 +1,97 @@
+import Ember from 'ember';
+import moment from 'moment';
+import Graphable from 'flaredown/components/chart/graphable';
+import * as d3 from "d3";
+
+const {
+  get,
+  set,
+  computed,
+  Component,
+  computed: { alias },
+} = Ember;
+
+export default Component.extend(Graphable, {
+  markerRadius: 7,
+
+  name: alias('model.name'),
+
+  halfHeight: computed('height', function() {
+    return get(this, 'yScale')(0);
+  }),
+
+  markers: computed('data', function() {
+    return(
+      get(this, 'data')
+        .filter(item => item.y === true)
+        .map(item => ({
+          x: get(this, 'xScale')(item.x),
+          y: get(this, 'yScale')(0) - Math.ceil(get(this, 'markerRadius') / 2),
+          tip: {
+            label: item.label,
+            x: get(this, 'xScale')(item.x) - 15,
+            y: get(this, 'yScale')(item.y) - get(this, 'markerRadius') / 3,
+          }
+        }))
+    );
+  }),
+
+  xAxisElementId: computed('model', function() {
+    return `${get(this, 'model.constructor.modelName')}-${get(this, 'model.id')}`;
+  }),
+
+  yScale: computed('data', function() {
+    return d3.scale.linear().range([get(this, 'height') , 0]).domain([-1, 1]);
+  }),
+
+  data: computed('checkins', function() {
+    var type = get(this, 'model.constructor.modelName');
+    var key = type.pluralize();
+    var timeline = get(this, 'timeline') || [];
+    const modelId = get(this, 'model.id');
+    const modelName = get(this, 'name');
+
+    return timeline.map(day => {
+      var filteredCheckins = get(this, 'checkins').filter((checkin) => (
+        get(checkin, 'formattedDate') === moment(day).format("YYYY-MM-DD")
+      ))
+      var coordinate = { x: day, y: null };
+
+      if(filteredCheckins.length) {
+        var items = key === 'tags' || key === 'foods' ?
+          filteredCheckins.map(item => (
+            get(item, key).findBy('name', modelName)
+          )).filter(Boolean)
+        :
+          filteredCheckins.map(item => (
+            get(item, key).findBy(`${type}.id`, modelId)
+          )).filter(Boolean)
+
+        var takenItems = items.filter((item) => (get(item, 'isTaken')))
+
+        if (items.length && (takenItems.length || key === 'tags' || key === 'foods')) {
+          var itemValues = [...takenItems, ...items].map(item => (get(item, 'value'))).filter(Boolean)
+
+          var label = itemValues.join(", ")
+
+          coordinate.label = label;
+          coordinate.y = true;
+        }
+      }
+
+      return coordinate;
+    }).sortBy('x');
+  }),
+
+  actions: {
+    openMarkerTooltip(marker) {
+      set(this, 'openMarkerTooltip', true);
+      set(this, 'currentMarker', marker);
+    },
+
+    closeMarkerTooltip() {
+      set(this, 'openMarkerTooltip', false);
+      set(this, 'currentMarker', null);
+    }
+  },
+});

worker-toolkit-flaredown/repo/frontend/app/components/chart/g-hbi.js

@@ -0,0 +1,157 @@
+import Ember from 'ember';
+import moment from 'moment';
+import Colorable from 'flaredown/mixins/colorable';
+import Graphable from 'flaredown/components/chart/graphable';
+import * as d3 from "d3";
+
+const {
+  $,
+  get,
+  computed,
+  Component,
+  getProperties,
+} = Ember;
+
+export default Component.extend(Colorable, Graphable, {
+  colorId: '35',
+  rangeDevider: 4,
+
+  yRulersMax: computed.max('yRulers'),
+  yRulersMin: computed.min('yRulers'),
+  dataValuesYMax: computed.max('dataValuesY'),
+  dataValuesYMin: computed.min('dataValuesY'),
+
+  rulerStep: computed('dataValuesYMin', 'dataValuesYMax', function() {
+    const {
+      rangeDevider,
+      dataValuesYMax,
+      dataValuesYMin,
+    } = getProperties(this, 'dataValuesYMax', 'dataValuesYMin', 'rangeDevider');
+
+    const result = Math.ceil((dataValuesYMax - dataValuesYMin) / rangeDevider);
+
+    return result || 1;
+  }),
+
+  domainPadding: computed('yRulersMax', 'yRulersMin', function() {
+    const { rangeDevider, yRulersMax, yRulersMin } = getProperties(this, 'rangeDevider', 'yRulersMax', 'yRulersMin');
+
+    return (yRulersMax - yRulersMin) / rangeDevider;
+  }),
+
+  domain: computed('yRulersMax', 'yRulersMin', 'domainPadding', function() {
+    const {
+      yRulersMax,
+      yRulersMin,
+      domainPadding,
+    } = getProperties(this, 'yRulersMax', 'yRulersMin', 'domainPadding');
+
+    return [
+      yRulersMin - domainPadding,
+      yRulersMax + domainPadding,
+    ];
+  }),
+
+  points: computed('data', function() {
+    const { data, xScale, yScale } = getProperties(this, 'data', 'xScale', 'yScale');
+
+    return(
+      data
+        .filter(item => $.isNumeric(item.y))
+        .map(item => {
+          const x = xScale(item.x);
+          const y = yScale(item.y) - 4; // minus radius
+
+          return {
+            x,
+            y,
+            tip: {
+              label: item.y,
+              x: x - 15,
+              y: y - 10
+            }
+          };
+        })
+    );
+  }),
+
+  yRulers: computed('data', function() {
+    const {
+      rulerStep,
+      dataValuesYMax,
+      dataValuesYMin,
+    } = getProperties(this, 'dataValuesYMax', 'dataValuesYMin', 'rulerStep');
+
+    let result = [];
+    const max = dataValuesYMax + rulerStep;
+
+    for (let i = dataValuesYMin; i < max; i += rulerStep) {
+      result.pushObject(i);
+    }
+
+    result = result.uniq();
+
+    if (result.length < 4) {
+      result.pushObjects([dataValuesYMax + rulerStep, dataValuesYMin - rulerStep]);
+
+      let offset = dataValuesYMin - rulerStep;
+
+      offset = offset >= 0 ? 0 : offset;
+
+      return result.uniq().map(v => v - offset);
+    } else {
+      return result;
+    }
+  }),
+
+  dataValuesY: computed('data', function() {
+    const values = get(this, 'data')
+      .filter(item => item.y || item.y === 0)
+      .map(item => item.y)
+      .compact();
+
+    return values.length ? values : [0, 100];
+  }),
+
+  yScale: computed('data', function() {
+    const { height, domain } = getProperties(this, 'height', 'domain');
+
+    return(
+      d3
+        .scale
+        .linear()
+        .range([height, 0])
+        .domain(domain)
+    );
+  }),
+
+  data: computed('checkins', function() {
+    const {
+      field,
+      checkins,
+      timeline,
+    } = getProperties(this, 'field', 'timeline', 'checkins');
+
+    return (timeline || []).map(day => {
+      let filteredCheckins = checkins.filter((checkin) => (
+        get(checkin, 'formattedDate') === moment(day).format("YYYY-MM-DD")
+      ))
+      let coordinate = { x: day, y: null };
+
+      if (filteredCheckins.length) {
+        let items = filteredCheckins.map((checkin) => (
+          get(checkin, 'harveyBradshawIndex')
+        )).filter(Boolean)
+
+        if (items.length) {
+          let itemValues = items.map(checkin => get(checkin, field)).filter(Boolean)
+          let value = itemValues.reduce((acc, val) => (acc + val), 0) / itemValues.length
+
+          coordinate.y = value
+        }
+      }
+
+      return coordinate;
+    });
+  }),
+});

worker-toolkit-flaredown/repo/frontend/app/components/chart/g-ruler.js

@@ -0,0 +1,45 @@
+import Ember from 'ember';
+
+let {
+  set,
+  computed,
+  Component,
+  getProperties,
+} = Ember;
+
+export default Component.extend({
+  unit: '',
+  tagName: 'g',
+  labelSize: 12,
+  linesOffset: 0,
+
+  init() {
+    this._super(...arguments);
+
+    Ember.run.scheduleOnce('afterRender', () => {
+      const labelsBox = this.$().find('.ruler-labels')[0].getBBox();
+
+      set(this, 'linesOffset', labelsBox.x + labelsBox.width);
+    });
+  },
+
+  rulers: computed('yRulers', function() {
+    const {
+      unit,
+      yScale,
+      labelSize,
+      yRulers,
+    } = getProperties(this, 'unit', 'yScale', 'labelSize', 'yRulers');
+
+    return (yRulers || [])
+      .map(item => {
+        const lineY = yScale(item);
+
+        return {
+          lineY,
+          label: `${item}${unit}`,
+          labelY: lineY + labelSize / 2 - 2,
+        };
+      });
+  }),
+});

worker-toolkit-flaredown/repo/frontend/app/components/chart/g-timeline.js

@@ -0,0 +1,67 @@
+import Ember from 'ember';
+import moment from 'moment';
+import * as d3 from "d3";
+
+export default Ember.Component.extend( {
+  tagName: 'g',
+  classNames: 'timeline',
+  attributeBindings: ['transform'],
+
+  xAxisElementId: Ember.computed(function() {
+    return "x-axis-timeline";
+  }),
+
+  transform: Ember.computed('xScale', 'startAt', 'totalSeriesHeight', function() {
+    return `translate(${ - this.get('xScale')( this.get('startAt') )},${this.get('totalSeriesHeight')})`;
+  }),
+
+  drawAxis: Ember.on('didInsertElement', Ember.observer('xAxis', function() {
+    d3.select(`g#${this.get('xAxisElementId')}`)
+      .call(this.get('xAxis'))
+      .selectAll('.tick')
+      .on('click', this.handleDataClick.bind(this))
+      .on('mouseover', this.handleMouseHover.bind(this))
+      .on('mouseleave', this.handleMouseLeave.bind(this));
+  })),
+
+
+  xAxis: Ember.computed('xScale', function() {
+    return d3.svg.axis().scale(this.get('xScale')).orient("bottom").ticks(this.get('timelineLength')).tickFormat(function(d){
+      return moment(d).format("MMM DD");
+    });
+  }),
+
+  xScale: Ember.computed('xDomain', function() {
+    return d3.time.scale()
+                  .range([0, this.get('width')])
+                  .domain(this.get('xDomain'));
+  }),
+
+  xDomain: Ember.computed('timeline', function() {
+    return d3.extent(this.get('timeline'));
+  }),
+
+  handleDataClick(date) {
+    this.get('onDateClicked')(moment(date).format("YYYY-MM-DD"));
+  },
+
+  handleMouseHover(date) {
+    var formattedDate = moment(date).format("MMM DD");
+    var position = null;
+
+    d3.select(`g#${this.get('xAxisElementId')}`).selectAll('.tick').get(0).forEach( function(elem) {
+      if(Ember.isEqual(elem.textContent, formattedDate)) {
+        var clientRect = Ember.$(elem).get(0).getBoundingClientRect();
+        position = clientRect.left + ( clientRect.width / 2);
+      }
+    });
+
+    this.get('onMouseHover')(formattedDate, position );
+  },
+
+  handleMouseLeave(date) {
+    this.get('onMouseLeave')(moment(date).format("YYYY-MM-DD") );
+  }
+
+
+});

worker-toolkit-flaredown/repo/frontend/app/components/chart/g-trackable.js

@@ -0,0 +1,74 @@
+import Ember from 'ember';
+import moment from 'moment';
+import Graphable from 'flaredown/components/chart/graphable';
+import * as d3 from "d3";
+
+const {
+  $,
+  get,
+  computed,
+  Component,
+  isPresent,
+  computed: { alias },
+} = Ember;
+
+export default Component.extend(Graphable, {
+  yRulers: [0, 1, 2, 3, 4],
+
+  name: alias('model.name'),
+
+  points: computed('data', function() {
+    return get(this, 'data').filter( (item) => {
+      return $.isNumeric(item.y);
+    }).map( (item) => {
+      let x = get(this, 'xScale')(item.x);
+      let y = get(this, 'yScale')(item.y) - 4; // minus radius
+
+      return {
+        x,
+        y,
+        tip: {
+          label: item.label,
+          x: x - 15,
+          y: y - 10
+        }
+      };
+    });
+  }),
+
+  yScale: computed('data', function() {
+    return d3.scale.linear().range([get(this, 'height') , 0]).domain([-1, 5]);
+  }),
+
+  data: computed('checkins', function() {
+    var trackable = get(this, 'model');
+    var type = get(trackable, 'constructor.modelName');
+    var key = type.pluralize();
+    var timeline = get(this, 'timeline') || [];
+
+    return timeline.map( (day) => {
+      var filteredCheckins = get(this, 'checkins').filter((checkin) => (
+        get(checkin, 'formattedDate') === moment(day).format("YYYY-MM-DD")
+      ))
+      var coordinate = { x: day, y: null };
+
+      if(filteredCheckins.length) {
+        var items = filteredCheckins.map(item => (
+          get(item, key).findBy(`${type}.id`, get(trackable, 'id'))
+        )).filter(Boolean)
+
+        if (items.length) {
+          var allItemValues = items.map(item => (get(item, 'value')))
+          var averageItemValue = allItemValues.reduce((acc, val) => (acc + val), 0) / allItemValues.length
+
+          if (isPresent(averageItemValue) && $.isNumeric(averageItemValue)) {
+            coordinate.label = averageItemValue
+            coordinate.y = averageItemValue
+          }
+        }
+      }
+
+      return coordinate;
+    }).sortBy('x');
+  }),
+});

worker-toolkit-flaredown/repo/frontend/app/components/chart/g-weather.js

@@ -0,0 +1,121 @@
+import Ember from 'ember';
+import moment from 'moment';
+import * as d3 from "d3";
+import Colorable from 'flaredown/mixins/colorable';
+import Graphable from 'flaredown/components/chart/graphable';
+
+const { $, Component, computed, get } = Ember;
+
+export default Component.extend(Colorable, Graphable, {
+  colorId: '35',
+  rangeDevider: 4,
+  offset: -10,
+
+  dataValuesYMin: computed.min('dataValuesY'),
+  dataValuesYMax: computed.max('dataValuesY'),
+
+  roundValuesYMin: computed('dataValuesYMin', function() {
+    return Math.floor(get(this, 'dataValuesYMin'));
+  }),
+
+  roundValuesYMax: computed('dataValuesYMax', function() {
+    return Math.ceil(get(this, 'dataValuesYMax'));
+  }),
+
+  isDecimalStep: computed('roundValuesYMin', 'roundValuesYMax', function() {
+    return get(this, 'roundValuesYMax') - get(this, 'roundValuesYMin') < get(this, 'rangeDevider');
+  }),
+
+  chosenYMin: computed('isDecimalStep', function() {
+    return get(this, get(this, 'isDecimalStep') ? 'dataValuesYMin' : 'roundValuesYMin');
+  }),
+
+  chosenYMax: computed('isDecimalStep', function() {
+    return get(this, get(this, 'isDecimalStep') ? 'dataValuesYMax' : 'roundValuesYMax');
+  }),
+
+  rulerStep: computed('roundValuesYMin', 'roundValuesYMax', function() {
+    return (get(this, 'chosenYMax') - get(this, 'chosenYMin')) / get(this, 'rangeDevider');
+  }),
+
+  points: computed('data', function() {
+    return(
+      get(this, 'data')
+        .filter(item => $.isNumeric(item.y))
+        .map(item => {
+          const x = get(this, 'xScale')(item.x);
+          const y = get(this, 'yScale')(item.y) - 4; // minus radius
+
+          return {
+            x,
+            y,
+            tip: {
+              label: `${item.y}${get(this, 'unit')}`,
+              x: x - 15,
+              y: y - 10
+            }
+          };
+        })
+    );
+  }),
+
+  yRulers: computed('data', function() {
+    let result = [];
+
+    const finalizeNumber = get(this, 'isDecimalStep') ?
+      number => Math.round(number * 100) / 100
+    :
+      number => Math.floor(number);
+
+    for (let i = get(this, 'chosenYMin'); i < get(this, 'chosenYMax'); i += get(this, 'rulerStep')) {
+      result.pushObject(finalizeNumber(i));
+    }
+
+    result.pushObject(get(this, 'chosenYMax'));
+
+    return result.uniq();
+  }),
+
+  dataValuesY: computed('data', function() {
+    const values = get(this, 'data')
+      .filter(item => item.y || item.y === 0)
+      .map(item => item.y)
+      .compact();
+
+    return values.length ? values : [0, 100];
+  }),
+
+  yScale: computed('data', function() {
+    return(
+      d3
+        .scale
+        .linear()
+        .range([get(this, 'height') + get(this, 'offset'), 0])
+        .domain([
+          get(this, 'chosenYMin') - get(this, 'rulerStep'),
+          get(this, 'chosenYMax') + get(this, 'rulerStep')
+        ])
+    );
+  }),
+
+  data: computed('checkins', function() {
+    return (get(this, 'timeline') || []).map(day => {
+      let filteredCheckins = get(this, 'checkins').filter((checkin) => (
+        get(checkin, 'formattedDate') === moment(day).format("YYYY-MM-DD")
+      ))
+      let coordinate = { x: day, y: null };
+
+      if (filteredCheckins.length) {
+        let itemWeathers = filteredCheckins.map(checkin => get(checkin, 'weather')).filter(Boolean)
+
+        if (itemWeathers.length) {
+          let itemsValues = itemWeathers.map(checkin => get(checkin, get(this, 'field')))
+          let weatherValue = itemsValues.reduce((acc, val) => (acc + val), 1)  / itemsValues.length
+          coordinate.y = weatherValue
+        }
+      }
+
+      return coordinate;
+    });
+  }),
+});

worker-toolkit-flaredown/repo/frontend/app/components/chart/graphable.js

@@ -0,0 +1,89 @@
+import Ember from 'ember';
+import * as d3 from "d3";
+
+/* no-unexpected-multiline: "error" */
+
+const {
+  get,
+  set,
+  Mixin,
+  isEmpty,
+  computed,
+  getProperties,
+} = Ember;
+
+export default Mixin.create({
+  tagName: 'g',
+  classNames: 'chart',
+  attributeBindings: ['transform'],
+
+  transform: computed('height', 'padding', 'chartOffset', function() {
+    return `translate(0,${get(this, 'chartOffset')})`;
+  }),
+
+  nestedTransform: computed('height', 'startAt', 'data', function() {
+    return `translate(${ - parseFloat(get(this, 'xScale')( get(this, 'startAt') ) )}, 5)`;
+  }),
+
+  xDomain: computed('data', function() {
+    return d3.extent(get(this, 'data'), d => d.x);
+  }),
+
+  xScale: computed('data', function() {
+    return(
+      d3
+        .time
+        .scale()
+        .range([0, get(this, 'width')])
+        .domain(get(this, 'xDomain'))
+    );
+  }),
+
+  lineData: computed('data', function() {
+    return get(this, 'data').reject(item => isEmpty(item.y));
+  }),
+
+  /*eslint-disable no-unexpected-multiline*/
+  lineFunction: computed('lineData', function() {
+    return(
+      d3
+        .svg
+        .line()
+        .x(this.getX.bind(this))
+        .y(this.getY.bind(this))
+        .interpolate('linear')
+        (get(this, 'lineData'))
+    );
+  }),
+  /*eslint-enable no-unexpected-multiline*/
+
+  getX(d) {
+    return get(this, 'xScale')(d.x);
+  },
+
+  getY(d) {
+    return get(this, 'yScale')(d.y) - 4; // minus radius
+  },
+
+  actions: {
+    openPointTooltip(point) {
+      set(this, 'openPointTooltip', true);
+      set(this, 'currentPoint', point);
+    },
+
+    closePointTooltip() {
+      set(this, 'openPointTooltip', false);
+      set(this, 'currentPoint', null);
+    },
+
+    hideChart() {
+      const {
+        name,
+        category,
+        chartsVisibilityService,
+      } = getProperties(this, 'name', 'category', 'chartsVisibilityService');
+
+      chartsVisibilityService.setVisibility(false, category, name);
+    },
+  }
+});

worker-toolkit-flaredown/repo/frontend/app/components/chart/resizable.js

@@ -0,0 +1,37 @@
+import Ember from 'ember';
+
+export default Ember.Mixin.create( {
+  resizeEndDelay: 350,
+  resizing: false,
+
+  didInsertElement(){
+    this._super(...arguments);
+    this.installHandlers();
+  },
+
+  willDestroyElement(){
+    this._super(...arguments);
+    this.removeHandlers();
+  },
+
+  installHandlers() {
+    return Ember.$(window).on("resize." + this.elementId, this.handlerManager.bind(this));
+  },
+
+  removeHandlers() {
+    Ember.$(window).off("resize." + this.elementId);
+  },
+
+  endResize(event) {
+    this.set('resizing', false);
+    Ember.tryInvoke(this, 'onResizeEnd', [event]);
+  },
+
+  handlerManager(event) {
+    if( !this.get('resizing') ) {
+      this.set('resizing', true);
+      Ember.tryInvoke(this, 'onResizeStart', [event]);
+      Ember.run.debounce(this, this.get('endResize'), event, this.get('resizeEndDelay'));
+    }
+  }
+});