<commit_before>(function (angular) {
  "use strict";

  angular.module('mojsart')
  .directive('search', function () {
    return {

    };
  })

  // use this directive as a template for other directives
  .directive('d3Visualizer', ['d3Service', function(d3Service) {
    return {
      restrict: 'EA',
      scope: {
        data: "=",
        label: "@",
        onClick: "&",
        onClickThingy: "="
      },
      
      link: function(scope, iElement, iAttrs) {
        d3Service.d3().then(function(d3) {
          var svg = d3.select(iElement[0])
          .append("svg")
          .attr("height", "85%"); //TODO do not hardcode

          // on window resize, re-render d3 canvas
          window.onresize = function() {
            return scope.$apply();
          };

          scope.$watch(function(){
              return angular.element(window)[0].innerWidth;
            }, function(){
              return scope.render(scope.data);
            }
          );

          // watch for data changes and re-render
          scope.$watch('data', function(newVals, oldVals) {
            return scope.render(newVals);
          }, true);

          // define render function
          scope.render = function(data){
            // remove all previous items before render
            svg.selectAll("*").remove();

            // setup variables
            var width, height, max;
            width = d3.select(iElement[0])[0][0].offsetWidth;
            height = d3.select(iElement[0])[0][0].offsetHeight;

            // sort data so smaller circles appear on top
            data = data.sort(function (a, b) {
              if (a.echoData.audio_summary.loudness > b.echoData.audio_summary.loudness)
                return 1;
              if (a.echoData.audio_summary.loudness < b.echoData.audio_summary.loudness)
                return -1;
              // a must be equal to b
              return 0;
            });

            var circles = svg.selectAll("circle")
              .data(data)
              .enter()
                .append("circle")
                  .attr("fill", "white")
                  .attr("stroke", "black")
                  .attr("stroke-width", 3)
                .on("click", function(d, i) {
                  var artist = d.echoData.artist;
                  var title = d.echoData.title;
                  var x = d3.select(this).attr('cx');
                  var y = d3.select(this).attr('cy');
                  // console.log(scope.onClickThingy)
                  scope.$apply(function() {scope.onClickThingy(d)});
                  // can't just do scope.onClickThingy because angular needs to know about it
                  // digest cycle
                  console.log(artist, '-', title, ': (' + x + ', ' + y + ')');
                  console.log('md5:', d.echoData.md5);
                })
                .on("mouseover", function() {
                  d3.select(this)
                    .transition()
                    .attr("fill", "lightblue")
                    // .attr("stroke", "lightblue")
                    .attr("r", d3.select(this).attr("r")*1.2);
                    
                })
                .on("mouseout", function() {
                  d3.select(this)
                    .transition()
                    .attr("fill", "white")
                    .attr("stroke", "black")
                    .attr("r", d3.select(this).attr("r")/1.2);
                })
                     // .attr("fill",function(d,i){return color(i);})
                     // .attr("stroke",function(d,i){return color(i);})
                .attr("r", 0) // radius
                // .attr("cx",function() { return width*Math.random(); })
                // .attr("cy", function() { return height*Math.random(); })
                .transition()
                  .duration(1000) // time of duration
                .attr("r", function(d) { return Math.abs(5 * d.echoData.audio_summary.loudness); })
                .attr("cx",function(d) { return width*(d.echoData.audio_summary.speechiness + d.echoData.audio_summary.acousticness/2); })
                .attr("cy", function(d) { return height*(d.echoData.audio_summary.energy + d.echoData.audio_summary.danceability)/2; });
          };
        });
      }
    };
  }]);
}(angular));<commit_msg>Change way cx is calculated to use userData<commit_after>(function (angular) {
  "use strict";

  angular.module('mojsart')
  .directive('search', function () {
    return {

    };
  })

  // use this directive as a template for other directives
  .directive('d3Visualizer', ['d3Service', function(d3Service) {
    return {
      restrict: 'EA',
      scope: {
        data: "=",
        label: "@",
        onClick: "&",
        onClickThingy: "="
      },
      
      link: function(scope, iElement, iAttrs) {
        d3Service.d3().then(function(d3) {
          var svg = d3.select(iElement[0])
          .append("svg")
          .attr("height", "85%"); //TODO do not hardcode

          // on window resize, re-render d3 canvas
          window.onresize = function() {
            return scope.$apply();
          };

          scope.$watch(function(){
              return angular.element(window)[0].innerWidth;
            }, function(){
              return scope.render(scope.data);
            }
          );

          // watch for data changes and re-render
          scope.$watch('data', function(newVals, oldVals) {
            return scope.render(newVals);
          }, true);

          // define render function
          scope.render = function(data){
            // remove all previous items before render
            svg.selectAll("*").remove();

            // setup variables
            var width, height, max;
            width = d3.select(iElement[0])[0][0].offsetWidth;
            height = d3.select(iElement[0])[0][0].offsetHeight;

            // sort data so smaller circles appear on top
            data = data.sort(function (a, b) {
              if (a.echoData.audio_summary.loudness > b.echoData.audio_summary.loudness)
                return 1;
              if (a.echoData.audio_summary.loudness < b.echoData.audio_summary.loudness)
                return -1;
              // a must be equal to b
              return 0;
            });

            var circles = svg.selectAll("circle")
              .data(data)
              .enter()
                .append("circle")
                  .attr("fill", "white")
                  .attr("stroke", "black")
                  .attr("stroke-width", 3)
                .on("click", function(d, i) {
                  var artist = d.echoData.artist;
                  var title = d.echoData.title;
                  var x = d3.select(this).attr('cx');
                  var y = d3.select(this).attr('cy');
                  // console.log(scope.onClickThingy)
                  scope.$apply(function() {scope.onClickThingy(d);});
                  // can't just do scope.onClickThingy because angular needs to know about it
                  // digest cycle
                  console.log(artist, '-', title, ': (' + x + ', ' + y + ')');
                  console.log('md5:', d.echoData.md5);
                })
                .on("mouseover", function() {
                  d3.select(this)
                    .transition()
                    .attr("fill", "lightblue")
                    // .attr("stroke", "lightblue")
                    .attr("r", d3.select(this).attr("r")*1.2);
                    
                })
                .on("mouseout", function() {
                  d3.select(this)
                    .transition()
                    .attr("fill", "white")
                    .attr("stroke", "black")
                    .attr("r", d3.select(this).attr("r")/1.2);
                })
                     // .attr("fill",function(d,i){return color(i);})
                     // .attr("stroke",function(d,i){return color(i);})
                .attr("r", 0) // radius
                // .attr("cx",function() { return width*Math.random(); })
                // .attr("cy", function() { return height*Math.random(); })
                .transition()
                  .duration(1000) // time of duration
                .attr("r", function(d) { return Math.abs(5 * d.echoData.audio_summary.loudness); })
                .attr("cx",function(d) { return width*(d.echoData.audio_summary.speechiness + d.userData.speechiness + d.echoData.audio_summary.acousticness/3); })
                .attr("cy", function(d) { return height*(d.echoData.audio_summary.energy + d.echoData.audio_summary.danceability)/2; });
          };
        });
      }
    };
  }]);
}(angular));
{'fraction_non_alphanumeric': 0.15088689242110112, 'fraction_numerical': 0.0101359133840129, 'mean_word_length': 1.4294907666480134, 'pattern_counts': {'":': 0, '<': 5, '<?xml version=': 0, '>': 5, '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': '4596425', 'n_tokens_mistral': 2496, 'n_tokens_neox': 2364, 'n_words': 459}