<commit_before>import Ember from 'ember';
import uuid from '../utils/uuid';
import stripFloat from '../utils/strip-float';

export default Ember.Component.extend({
  width: 0,
  height: 0,
  units: 'units',
  chartTitle: '',
  chartDescription: '',
  legend: false,
  action: false,
  dataSource: null,
  totalSize: 0,
  attributeBindings: ['getId:data-id'],
  classNames: ['inline-block'],
  colors: {
    "gray": "#D7D7D7",
    "light-green": "rgb(106, 185, 117)",
    "dark-green": "#45924f",
    "blue": "rgb(86, 135, 209)",
    "dark-blue": "rgb(63, 98, 151)",
    "orange": "rgb(222, 120, 59)",
    "yellow": "#FFF79A",
    "red": "rgb(128, 21, 21)",
    "brown": "#4D3619"
  },
  getId: Ember.computed('customId', function(){
    return this.get('customId');
  }),
  isSizeDynamic: Ember.computed('dataSource', 'dataSource.isSizeDynamic', 'dataSource.@each', function() {
    return this.get('dataSource.isSizeDynamic');
  }),
  sizeMultiplier: Ember.computed('dataSource', 'dataSource.sizeMultiplier', 'dataSource.@each', function(){
    return this.get('dataSource.sizeMultiplier');
  }),
  gCustomId: Ember.computed(function() {
    return 'g' + this.get('elementId');
  }),
  explanationStyle: Ember.computed('width', 'height', function() {
    return 'width:100%; height:100%';
  }),
  customStyle: Ember.computed('width', 'height', function() {
    return 'width:100%; height:100%';
  }),
  dataSourceExists: Ember.computed('dataSource.@each', 'dataSource', function() {
    return typeof this.get('dataSource') !== 'undefined' && this.get('dataSource') !== null;
  }),
  radius: Ember.computed('width', 'height', function() {
    return Math.min(this.get('width'), this.get('height')) / 2;
  }),
  drawDetailSunburst: function(dataSource) {
    var percent = 25;
    var width = (percent / 100) * this.get('width');
    var height = (percent / 100) * this.get('height');
    var radius = Math.min(width, height) / 2;

    var self = this;
    var vis = d3.select('[data-id="'+self.get('customId')+'"] .bf-sunburst-details').append("svg:svg")
    .attr("width", width)
    .attr("height", height)
    .append("g")
    .attr("id", self.get('gCustomId') + 'details')
    .attr("transform", "translate(" + width / 2 + "," + height / 2 + ")");

    var partition = d3.layout.partition()
      .sort(null)
      .size([2 * Math.PI, radius * radius])
      .value(function(d) { return d.size; });

    var arc = d3.svg.arc().startAngle(function(d) { return d.x; })
      .endAngle(function(d) { return d.x + d.dx; })
      .innerRadius(function(d) { return Math.sqrt(d.y); })
      .outerRadius(function(d) { return Math.sqrt(d.y + d.dy); });

    d3.select('[data-id="'+self.get('customId')+'"] .bf-sunburst-details').append("text")
          .attr("r", radius)
          .style("opacity", 0);

    var path = vis.data([dataSource]).selectAll('[data-id="'+self.get('customId')+'"] .bf-sunburst-details path')
      .data(partition.nodes)
      .enter().append("path")
      .attr("display", function(d) { return d.depth ? null : "none"; }) // hide inner ring
      .attr("d", arc)
      .style("stroke", "#fff")
      .style("fill", function(d) {
        if (d.fill_type) {
          return self.get('colors')[d.fill_type];
        } else {
          return d3.scale.category20c(((d.children ? d : d.parent).name));
        }
      })
      .style("fill-rule", "evenodd")
      .style("opacity", 1);

    dataSource.children.forEach( function(item, index, enumerable){
      Ember.$('[data-id="'+self.get('customId')+'"] .bf-sunburst-details').append('<div class="bf-sunburst-details-item"> <div class="bf-sunburst-details-swatch" style="background-color:'+self.get('colors')[item.fill_type]+';"> </div><span class="bf-sunburst-details-label">' + item.name + ' ' + item.size + ' ' + self.get('units') + '</span></div>');
    });
  },
  draw: function() {
    var isHovered = Ember.$('[data-id="'+this.get('customId')+'"] .bf-sunburst-svg-container:hover').length > 0;
    if (isHovered) { return; }
    Ember.$('[data-id="'+this.get('customId')+'"] .bf-sunburst-svg-container').empty();
    var self = this;
    var vis = d3.select('[data-id="'+self.get('customId')+'"] .bf-sunburst-svg-container').append("svg:svg")
    .attr("width", "100%")
    .attr('viewBox', '0 0 300 300')
    .append("g")
    .attr("id", self.get('gCustomId'))
    .attr("transform", "translate(" + self.get('width') / 2 + "," + self.get('height') / 2 + ")");
    var partition = d3.layout.partition()
      .sort(null)
      .size([2 * Math.PI, self.get('radius') * self.get('radius')])
      .value(function(d) { return d.size; });
    var arc = d3.svg.arc()
      .startAngle(function(d) { return d.x; })
      .endAngle(function(d) { return d.x + d.dx; })
      .innerRadius(function(d) { return Math.sqrt(d.y); })
      .outerRadius(function(d) { return Math.sqrt(d.y + d.dy); });
    d3.select('[data-id="'+self.get('customId')+'"] .bf-sunburst-svg-container').append("text")
      .attr("r", self.get('radius'))
      .style("opacity", 0);
    var path = vis.data([this.get('dataSource')]).selectAll('[data-id="'+self.get('customId')+'"] .bf-sunburst-svg-container path')
      .data(partition.nodes)
      .enter().append("path")
      .attr("display", function(d) { return d.depth ? null : "none"; }) // hide inner ring
      .attr("d", arc)
      .style("stroke", "#fff")
      .style("fill", function(d) {
        if (d.fill_type) {
          return self.get('colors')[d.fill_type];
        } else if (d.dynamic_color) {
          return d.dynamic_color;
        } else {
          return d3.scale.category20c(((d.children ? d : d.parent).name));
        }
      })
      .style("fill-rule", "evenodd")
      .style("opacity", 1)
      .on("mouseover", mouseover, true);

      d3.select('[data-id="'+self.get('customId')+'"]').on("mouseleave", mouseleave);
      this.set('totalSize', path.node().__data__.value);
      defaultExplanation();
      function mouseover(d, i) {
          var percentage = 100 * d.value / self.get('totalSize');
          var percentageString = stripFloat(percentage) + "%";
          if (percentage < 0.1) {
            percentageString = "< 0.1%";
          }
          d3.select('[data-id="'+self.get('customId')+'"] .bf-sunburst-percentage')
            .text(percentageString);
          d3.select('[data-id="'+self.get('customId')+'"] .bf-sunburst-title')
            .text(d.name);
          if (self.get('isSizeDynamic')) {
            var readableSize = '';
            if (!Ember.isEmpty(self.get('sizeMultiplier'))) {
              readableSize = bytesToReadableSize(d.size, self.get('sizeMultiplier'));
            } else {
              readableSize = bytesToReadableSize(d.size);
            }
            d3.select('[data-id="'+self.get('customId')+'"] .bf-sunburst-description')
            .text(readableSize);
          } else {
            d3.select('[data-id="'+self.get('customId')+'"] .bf-sunburst-description')
            .text(d.size + " " + self.get('units'));
          }
          d3.select('[data-id="'+self.get('customId')+'"] .bf-sunburst-fill_type')
            .text(d.description);
          //d3.select('[data-id="'+self.get('customId')+'"] .sunburst-details')

          //self.set('explanationStyle', 'visibility: visible; width:'+self.get('width')+'px; height:'+self.get('height')+'px;');
          self.set('explanationStyle', 'visibility: visible; width:100%; height:100%');

          // Empty details
          Ember.$('[data-id="'+self.get('customId')+'"] .bf-sunburst-details').empty();
          // Draw Details
          if (typeof d.detailsChildren !== "undefined") {
            self.drawDetailSunburst(d.detailsChildren);
          }

          var sequenceArray = getAncestors(d);
          //updateBreadcrumbs(sequenceArray, percentageString);

          // Fade all the segments.
          d3.selectAll('[data-id="'+self.get('customId')+'"] .bf-sunburst-svg-container path')
            .style("opacity", 0.3);

          // Then highlight only those that are an ancestor of the current segment.<commit_msg>Deprecate & remove details nested sunburst feature<commit_after>import Ember from 'ember';
import uuid from '../utils/uuid';
import stripFloat from '../utils/strip-float';

export default Ember.Component.extend({
  width: 0,
  height: 0,
  units: 'units',
  chartTitle: '',
  chartDescription: '',
  legend: false,
  action: false,
  dataSource: null,
  totalSize: 0,
  attributeBindings: ['getId:data-id'],
  classNames: ['inline-block'],
  colors: {
    "gray": "#D7D7D7",
    "light-green": "rgb(106, 185, 117)",
    "dark-green": "#45924f",
    "blue": "rgb(86, 135, 209)",
    "dark-blue": "rgb(63, 98, 151)",
    "orange": "rgb(222, 120, 59)",
    "yellow": "#FFF79A",
    "red": "rgb(128, 21, 21)",
    "brown": "#4D3619"
  },
  getId: Ember.computed('customId', function(){
    return this.get('customId');
  }),
  isSizeDynamic: Ember.computed('dataSource', 'dataSource.isSizeDynamic', 'dataSource.@each', function() {
    return this.get('dataSource.isSizeDynamic');
  }),
  sizeMultiplier: Ember.computed('dataSource', 'dataSource.sizeMultiplier', 'dataSource.@each', function(){
    return this.get('dataSource.sizeMultiplier');
  }),
  gCustomId: Ember.computed(function() {
    return 'g' + this.get('elementId');
  }),
  explanationStyle: Ember.computed('width', 'height', function() {
    return 'width:100%; height:100%';
  }),
  customStyle: Ember.computed('width', 'height', function() {
    return 'width:100%; height:100%';
  }),
  dataSourceExists: Ember.computed('dataSource.@each', 'dataSource', function() {
    return typeof this.get('dataSource') !== 'undefined' && this.get('dataSource') !== null;
  }),
  radius: Ember.computed('width', 'height', function() {
    return Math.min(this.get('width'), this.get('height')) / 2;
  }),
  draw: function() {
    var isHovered = Ember.$('[data-id="'+this.get('customId')+'"] .bf-sunburst-svg-container:hover').length > 0;
    if (isHovered) { return; }
    Ember.$('[data-id="'+this.get('customId')+'"] .bf-sunburst-svg-container').empty();
    var self = this;
    var vis = d3.select('[data-id="'+self.get('customId')+'"] .bf-sunburst-svg-container').append("svg:svg")
    .attr("width", "100%")
    .attr('viewBox', '0 0 300 300')
    .append("g")
    .attr("id", self.get('gCustomId'))
    .attr("transform", "translate(" + self.get('width') / 2 + "," + self.get('height') / 2 + ")");
    var partition = d3.layout.partition()
      .sort(null)
      .size([2 * Math.PI, self.get('radius') * self.get('radius')])
      .value(function(d) { return d.size; });
    var arc = d3.svg.arc()
      .startAngle(function(d) { return d.x; })
      .endAngle(function(d) { return d.x + d.dx; })
      .innerRadius(function(d) { return Math.sqrt(d.y); })
      .outerRadius(function(d) { return Math.sqrt(d.y + d.dy); });
    d3.select('[data-id="'+self.get('customId')+'"] .bf-sunburst-svg-container').append("text")
      .attr("r", self.get('radius'))
      .style("opacity", 0);
    var path = vis.data([this.get('dataSource')]).selectAll('[data-id="'+self.get('customId')+'"] .bf-sunburst-svg-container path')
      .data(partition.nodes)
      .enter().append("path")
      .attr("display", function(d) { return d.depth ? null : "none"; }) // hide inner ring
      .attr("d", arc)
      .style("stroke", "#fff")
      .style("fill", function(d) {
        if (d.fill_type) {
          return self.get('colors')[d.fill_type];
        } else if (d.dynamic_color) {
          return d.dynamic_color;
        } else {
          return d3.scale.category20c(((d.children ? d : d.parent).name));
        }
      })
      .style("fill-rule", "evenodd")
      .style("opacity", 1)
      .on("mouseover", mouseover, true);

      d3.select('[data-id="'+self.get('customId')+'"]').on("mouseleave", mouseleave);
      this.set('totalSize', path.node().__data__.value);
      defaultExplanation();
      function mouseover(d, i) {
          var percentage = 100 * d.value / self.get('totalSize');
          var percentageString = stripFloat(percentage) + "%";
          if (percentage < 0.1) {
            percentageString = "< 0.1%";
          }
          d3.select('[data-id="'+self.get('customId')+'"] .bf-sunburst-percentage')
            .text(percentageString);
          d3.select('[data-id="'+self.get('customId')+'"] .bf-sunburst-title')
            .text(d.name);
          if (self.get('isSizeDynamic')) {
            var readableSize = '';
            if (!Ember.isEmpty(self.get('sizeMultiplier'))) {
              readableSize = bytesToReadableSize(d.size, self.get('sizeMultiplier'));
            } else {
              readableSize = bytesToReadableSize(d.size);
            }
            d3.select('[data-id="'+self.get('customId')+'"] .bf-sunburst-description')
            .text(readableSize);
          } else {
            d3.select('[data-id="'+self.get('customId')+'"] .bf-sunburst-description')
            .text(d.size + " " + self.get('units'));
          }
          d3.select('[data-id="'+self.get('customId')+'"] .bf-sunburst-fill_type')
            .text(d.description);
          //d3.select('[data-id="'+self.get('customId')+'"] .sunburst-details')

          //self.set('explanationStyle', 'visibility: visible; width:'+self.get('width')+'px; height:'+self.get('height')+'px;');
          self.set('explanationStyle', 'visibility: visible; width:100%; height:100%');

          // Empty details
          Ember.$('[data-id="'+self.get('customId')+'"] .bf-sunburst-details').empty();

          var sequenceArray = getAncestors(d);
          //updateBreadcrumbs(sequenceArray, percentageString);

          // Fade all the segments.
          d3.selectAll('[data-id="'+self.get('customId')+'"] .bf-sunburst-svg-container path')
            .style("opacity", 0.3);

          // Then highlight only those that are an ancestor of the current segment.
{'fraction_non_alphanumeric': 0.21273079962640995, 'fraction_numerical': 0.0183202816294274, 'mean_word_length': 3.0023001725129386, 'pattern_counts': {'":': 18, '<': 13, '<?xml version=': 0, '>': 11, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '753892', 'n_tokens_mistral': 4849, 'n_tokens_neox': 4648, 'n_words': 784}