<commit_before><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
        <title>Pie chart</title>
        <script src="libraries/raphael.js">
        </script>
        <script src="libraries/jquery-2.0.0.min.js">
        </script>
        <style>
            
            *, body {
                margin: 0;
                padding: 0;
            };
            * {
                width: 100%;
                height: 100%;
            }
        </style>
    </head>
    <body>
        <div id='graphic'>
        </div>
        <script>
            
            function toRad(degree){
            
                return degree * Math.PI / 180;
                
            }
            
            
            function segmentsPath(startAngle, endAngle, xCenter, yCenter, innerR, outerR){
            
                var newInnerX1 = xCenter + innerR * Math.cos(toRad(startAngle - 90));
                
                var newInnerY1 = yCenter + innerR * Math.sin(toRad(startAngle - 90));
                
                var newOuterX1 = xCenter + outerR * Math.cos(toRad(startAngle - 90));
                
                var newOuterY1 = yCenter + outerR * Math.sin(toRad(startAngle - 90));
                
                var newInnerX2 = xCenter + innerR * Math.cos(toRad(endAngle - 90));
                
                var newInnerY2 = yCenter + innerR * Math.sin(toRad(endAngle - 90));
                
                var newOuterX2 = xCenter + outerR * Math.cos(toRad(endAngle - 90));
                
                var newOuterY2 = yCenter + outerR * Math.sin(toRad(endAngle - 90));
                
                var circumference = endAngle - startAngle;
                
                var path = [["M", newOuterX1, newOuterY1], ["A", outerR, outerR, 0, +(circumference > 180), 1, newOuterX2, newOuterY2], ["L", newInnerX2, newInnerY2], ["A", innerR, innerR, 0, +(circumference > 180), 0, newInnerX1, newInnerY1], ["z"]];
                
                return path;
                
            }
            
			
            var canvas = Raphael("graphic", $(window).height(), $(window).height());
            
            var radius = $(window).height() / 2;
			
			
			var data = [34534,5647,4567,878];
			
			
			var total = 0;
			
			for(var i =0; i < data.length; i++ ){
				total += data[i];
			}
			
			var multiplier = 360 / total;
			
			
			var innerRadius = radius / 1.3;
			
			
			var startAngle = 0;
			var endAngle = multiplier * data[0];
			
			for(var i =0; i < data.length; i++ ){

				var path_ = segmentsPath(startAngle, endAngle, radius, radius, innerRadius, radius)
                
				canvas.path(path_);
				
				startAngle = 0 + endAngle;
				endAngle += (multiplier * data[i + 1]);				

			}				
				
            
        </script>
    </body>
</html><commit_msg>next button<commit_after><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
   <head>
      <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
      <title>Pie chart</title>
      <script src="libraries/raphael.js"></script>
      <script src="libraries/jquery-2.0.0.min.js"></script>
      <style>
         * , body {
           margin: 0;
           padding: 0;
         }
         #graphic {
           width: 100%;
           height: 100%;
         }
         .new_chart {
           border: none;
           background-color: inherit;
           padding: 14px 28px;
           font-size: 16px;
           cursor: pointer;
           display: inline-block;
           background-color: green;
           color: white;
           position: absolute;
           left: 20px;
           border-radius:0.3em;
           top:20px;
           z-index: 55;
         }
         .new_chart:hover{
           background-color:#4095c6;
         }
      </style>
   </head>
   <body>
      <button class="new_chart" onclick="reloadPage()">Next chart</button>
      <div id='graphic'>
      </div>
      <script>
         function reloadPage(){
           window.location.reload(false);
         }
         function toRad(degree){
             return degree * Math.PI / 180;
         }

         function segmentsPath(startAngle, endAngle, xCenter, yCenter, innerR, outerR){

             var newInnerX1 = xCenter + innerR * Math.cos(toRad(startAngle - 90));

             var newInnerY1 = yCenter + innerR * Math.sin(toRad(startAngle - 90));

             var newOuterX1 = xCenter + outerR * Math.cos(toRad(startAngle - 90));

             var newOuterY1 = yCenter + outerR * Math.sin(toRad(startAngle - 90));

             var newInnerX2 = xCenter + innerR * Math.cos(toRad(endAngle - 90));

             var newInnerY2 = yCenter + innerR * Math.sin(toRad(endAngle - 90));

             var newOuterX2 = xCenter + outerR * Math.cos(toRad(endAngle - 90));

             var newOuterY2 = yCenter + outerR * Math.sin(toRad(endAngle - 90));

             var circumference = endAngle - startAngle;

             var path = [["M", newOuterX1, newOuterY1], ["A", outerR, outerR, 0, +(circumference > 180), 1, newOuterX2, newOuterY2], ["L", newInnerX2, newInnerY2], ["A", innerR, innerR, 0, +(circumference > 180), 0, newInnerX1, newInnerY1], ["z"]];

             return path;

         }


         var canvas = Raphael("graphic", $(window).width(), $(window).height());

         var radius = ($(window).height() / 2) - 80;

         function randomNumber(from, to){
             return Math.floor(Math.random() * (to - from + 1) + from);
         }

         var number_of_segments = randomNumber(2, 7);

         var data = [];

         for (var i = 0; i < number_of_segments; i++) {
          data.push(randomNumber(1, 28) );
         }


         var total = 0;

         for(var i =0; i < data.length; i++ ){
         total += data[i];
         }

         var multiplier = 360 / total;


         var innerRadius = radius / 1.7;


         var startAngle = 0;
         var endAngle = multiplier * data[0];


         var xCenter_ =  Number ($(window).width() / 2 );

         var yCenter_ =  Number ($(window).height() / 2 );

         var chart_colours = ["red","gray","black","pink","yellow","orange","purple"];

         for(var i =0; i < data.length; i++ ){

           var path_ = segmentsPath(startAngle, endAngle, xCenter_, yCenter_, innerRadius, radius)

           canvas.path(path_).attr({
               'fill': chart_colours[i],
               'stroke': "white"
           });;

           startAngle = 0 + endAngle;
           endAngle += (multiplier * data[i + 1]);

         }


      </script>
   </body>
</html>
{'fraction_non_alphanumeric': 0.13733905579399142, 'fraction_numerical': 0.030486902471511024, 'mean_word_length': 1.5598484848484848, 'pattern_counts': {'":': 0, '<': 50, '<?xml version=': 0, '>': 49, 'https://': 0, 'lorem ipsum': 0, 'www.': 2, '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': '851309', 'n_tokens_mistral': 2330, 'n_tokens_neox': 2022, 'n_words': 463}