<commit_before>"use strict";

var App = App || {};

let ChartListView = function(listID) {
  let self = {
    chartHeight: 200,
    chartMargins: {
      top: 10,
      right: 10,
      bottom: 25,
      left: 25
    },
    chartList: null,
    selections: {},
    propertyScales: null,
  };

  init();

  function init() {
    self.chartList = d3.select(listID)

    self.propertyScales = {
      census: {
        "TOTAL_POPULATION": {
          "Total": d3.scaleLinear()
        },
      }
    }
  }

  function createChart(property_data) {
    // let rgb = d3.rgb(property_data.color);

    console.log("createChart",property_data);

    self.chartList.append("div")
      .datum(property_data)
      .attr("class", "panel panel-default chartEntry")
      .attr("id", createPropertyID(property_data))
      // .style("height", "200px")
      // .style("border", `5px solid rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, 0.75)`)
      // .style("background-color", `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, 0.25)`)
      // .style("background-color", "rgba(255,255,255,0.75)")
      .each(setupChart);

    //already done in setupChart
    // self.chartList.selectAll(".chartEntry")
    //   .each(updateChart);
  }

  function setupChart(property_data) {
    // let rgb = d3.rgb(d.color);

    let panel = d3.select(this);

    let heading = panel.append("div").attr("class", "panel-heading").append('div').classed('row',true);
      // .style("background-color", d.color);

    let mainTypeTitle = property_data.mainType.split("_").map((d) => { return `${d[0].toUpperCase()}${d.slice(1).toLowerCase()}`; }).join(" ");
    let propertyTitle = heading.append('h4').attr('class', 'col-md-10 propertyTitle').html(`<b>${mainTypeTitle}:</b> ${property_data.subType.replace(/[^a-zA-Z0-9 ]/g, "")} (/mi<sup>2</sup>)`);
    let closeButton = heading.append('h4').append('span').attr('class', 'col-md-2 glyphicon glyphicon-remove')
      .on('click',function(){
        removePropertyChart(property_data);
        App.controllers.mapData.removeChartFromList(property_data);
      });
    
    // let area = heading.append("h4").attr("class", "rectArea").html(`Area (mi<sup>2</sup>): ${d.area.toFixed(2)}`);

    let body = panel.append("div").attr("class", "panel-body");

    let chart = body.append("svg");

    let graph = chart.append('g').classed('graph-group',true);

    graph.background = graph.append("rect")
      .attr("x", self.chartMargins.left)
      .attr("y", self.chartMargins.top)
      .attr("width", chart.node().clientWidth - self.chartMargins.left - self.chartMargins.right)
      .attr("height", chart.node().clientHeight - self.chartMargins.top - self.chartMargins.bottom)
      .classed('graph-background',true).attr('property-data', JSON.stringify(property_data));
    graph.content = graph.append('g').classed('graph-content',true);

    updateChart(createPropertyID(property_data));
  }

  //redraw selection bars
  function updateChart(chartID) {
    if(typeof chartID === "object"){ //given a property object
      chartID = createPropertyID(chartID);
    }
    console.log("updating chart",chartID);
    let chart = self.chartList.select(`#${chartID}`);
    let graph = chart.select('.graph-group');
    try{
      graph.selectAll('.error-text').remove();
      graph.selectAll('g.graph-content').remove();
      graph.background = graph.select('.graph-background');
      graph.content = graph.append('g').classed('graph-content',true);<commit_msg>Hide border around graph rectangle in analytics page<commit_after>"use strict";

var App = App || {};

let ChartListView = function(listID) {
  let self = {
    chartHeight: 200,
    chartMargins: {
      top: 10,
      right: 10,
      bottom: 25,
      left: 25
    },
    chartList: null,
    selections: {},
    propertyScales: null,
  };

  init();

  function init() {
    self.chartList = d3.select(listID)

    self.propertyScales = {
      census: {
        "TOTAL_POPULATION": {
          "Total": d3.scaleLinear()
        },
      }
    }
  }

  function createChart(property_data) {
    // let rgb = d3.rgb(property_data.color);

    console.log("createChart",property_data);

    self.chartList.append("div")
      .datum(property_data)
      .attr("class", "panel panel-default chartEntry")
      .attr("id", createPropertyID(property_data))
      // .style("height", "200px")
      // .style("border", `5px solid rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, 0.75)`)
      // .style("background-color", `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, 0.25)`)
      // .style("background-color", "rgba(255,255,255,0.75)")
      .each(setupChart);

    //already done in setupChart
    // self.chartList.selectAll(".chartEntry")
    //   .each(updateChart);
  }

  function setupChart(property_data) {
    // let rgb = d3.rgb(d.color);

    let panel = d3.select(this);

    let heading = panel.append("div").attr("class", "panel-heading").append('div').classed('row',true);
      // .style("background-color", d.color);

    let mainTypeTitle = property_data.mainType.split("_").map((d) => { return `${d[0].toUpperCase()}${d.slice(1).toLowerCase()}`; }).join(" ");
    let propertyTitle = heading.append('h4').attr('class', 'col-md-10 propertyTitle').html(`<b>${mainTypeTitle}:</b> ${property_data.subType.replace(/[^a-zA-Z0-9 ]/g, "")} (/mi<sup>2</sup>)`);
    let closeButton = heading.append('h4').append('span').attr('class', 'col-md-2 glyphicon glyphicon-remove')
      .on('click',function(){
        removePropertyChart(property_data);
        App.controllers.mapData.removeChartFromList(property_data);
      });
    
    // let area = heading.append("h4").attr("class", "rectArea").html(`Area (mi<sup>2</sup>): ${d.area.toFixed(2)}`);

    let body = panel.append("div").attr("class", "panel-body");

    let chart = body.append("svg");

    let graph = chart.append('g').classed('graph-group',true);

    graph.background = graph.append("rect")
      .attr("x", self.chartMargins.left)
      .attr("y", self.chartMargins.top)
      .attr("width", chart.node().clientWidth - self.chartMargins.left - self.chartMargins.right)
      .attr("height", chart.node().clientHeight - self.chartMargins.top - self.chartMargins.bottom)
      .classed('graph-background',true).attr('property-data', JSON.stringify(property_data))
      .style('stroke','none');
    graph.content = graph.append('g').classed('graph-content',true);

    updateChart(createPropertyID(property_data));
  }

  //redraw selection bars
  function updateChart(chartID) {
    if(typeof chartID === "object"){ //given a property object
      chartID = createPropertyID(chartID);
    }
    console.log("updating chart",chartID);
    let chart = self.chartList.select(`#${chartID}`);
    let graph = chart.select('.graph-group');
    try{
      graph.selectAll('.error-text').remove();
      graph.selectAll('g.graph-content').remove();
      graph.background = graph.select('.graph-background');
      graph.content = graph.append('g').classed('graph-content',true);
{'fraction_non_alphanumeric': 0.19619074896176428, 'fraction_numerical': 0.014606902477445224, 'mean_word_length': 3.332506203473945, 'pattern_counts': {'":': 4, '<': 15, '<?xml version=': 0, '>': 17, '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': '5603960', 'n_tokens_mistral': 2381, 'n_tokens_neox': 2270, 'n_words': 355}