cms/app-client/app/components/visu-chrono-year.js
author ymh <ymh.work@gmail.com>
Fri, 09 Dec 2016 11:41:15 +0100
changeset 467 762fc0eb4946
parent 424 feb0d3e0fef9
child 532 1190ea937f2d
permissions -rw-r--r--
Migrate d3js to v4 and correct d3js visualisations i.e. bug 3.20. Breadcrumb navigation for the language treemap has been improved
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
393
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
     1
import Ember from 'ember';
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
     2
import _ from 'lodash/lodash';
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
     3
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
     4
export default Ember.Component.extend({
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
     5
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
     6
    colors: Ember.inject.service(),
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
     7
    filter: Ember.inject.service(),
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
     8
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
     9
    tagName: 'li',
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    10
    classNameBindings: ['isDisabled:disabled', 'isDark:light-color', 'isHighlighted:highlighted'],
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    11
    attributeBindings: ['style', 'title', 'id'],
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    12
424
feb0d3e0fef9 add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
ymh <ymh.work@gmail.com>
parents: 394
diff changeset
    13
    colorScale: null,
feb0d3e0fef9 add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
ymh <ymh.work@gmail.com>
parents: 394
diff changeset
    14
393
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    15
    isDisabled: Ember.computed('range', 'year', 'count', function() {
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    16
        let year = parseInt(this.get('year'));
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    17
        let count = this.get('count');
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    18
        return (!_.inRange(year, this.get('range')[0], this.get('range')[1]+1)) || count === 0;
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    19
    }),
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    20
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    21
    isHighlighted: Ember.computed('filter.dateList.[]', function() {
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    22
        return _.contains(this.get('filter.dateList'), this.get('year'));
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    23
    }),
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    24
    isDark: Ember.computed('backgroundColor', 'isDisabled', function() {
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    25
        let backgroundColor = this.get('backgroundColor');
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    26
        if(this.get('isDisabled')) {
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    27
            return false;
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    28
        }
394
48458e099b05 make dynamic filters for all route and do some code pruning and cleaning
ymh <ymh.work@gmail.com>
parents: 393
diff changeset
    29
        return this.get('colors').getPerceptiveLuminance(backgroundColor) >= 0.5;
393
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    30
    }),
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    31
424
feb0d3e0fef9 add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
ymh <ymh.work@gmail.com>
parents: 394
diff changeset
    32
    backgroundColor: Ember.computed('count', function() {
feb0d3e0fef9 add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
ymh <ymh.work@gmail.com>
parents: 394
diff changeset
    33
        return this.get('scale')(this.get('count'));
feb0d3e0fef9 add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
ymh <ymh.work@gmail.com>
parents: 394
diff changeset
    34
        //return this.get('colors').shadeLinear(this.get('count'), this.get('minCount'), this.get('maxCount'));
393
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    35
    }),
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    36
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    37
    style: Ember.computed('backgroundColor', 'isDisabled', 'isHighlighted', function() {
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    38
        let backgroundColor = this.get('backgroundColor');
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    39
        if(this.get('isDisabled') || this.get('isHighlighted')) {
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    40
          return null;
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    41
        }
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    42
        return Ember.String.htmlSafe(`background-color: ${backgroundColor};`);
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    43
    }),
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    44
    id: Ember.computed.alias('year'),
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    45
    count: Ember.computed('datestats.[]', function() {
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    46
        let year = this.get('year');
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    47
        let count = this.get('datestats').get(`${year}`);
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    48
        return count?count:0;
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    49
    }),
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    50
    title: Ember.computed('count', 'isDsabled', function() {
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    51
        if(this.get('isDisabled')) {
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    52
            return null;
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    53
        }
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    54
        let year = this.get('year');
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    55
        let count = this.get('count');
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    56
        return `${year} (${count})`;
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    57
    }),
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    58
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    59
    year: null,
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    60
    datestats: null,
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    61
    range: null,
5ef3bfef0bff add colors to visu chrono
ymh <ymh.work@gmail.com>
parents:
diff changeset
    62
});