<commit_before>/* 
  <NAME> 2014
  Angular directives which use Canvas to provide an editable context for images.
  Jcrop, used for cropping http://deepliquid.com/content/Jcrop.html
*/
/*Convert a file in the scope into an img src data attribute*/
angular.module('imgEditor.directives', [])
  .directive('imgData', ['$parse',
    function($parse) {
      return {
        restrict: 'A',
        link: function(scope, element, attributes) {
          var imgData = scope.$eval(attributes.imgData);
          var width, height;
          var reader = new FileReader();
          reader.onload = function(e) {
            scope.$apply(function() {
              var img = new Image();
              img.onload = function() {
                element.attr('src', img.src);
                $(element).css('width', img.width + 'px');
                $(element).css('height', img.height + 'px');
              };
              img.src = reader.result;
              scope.$broadcast('loadedImg', img);
            });
          }
          reader.readAsDataURL(imgData);
        }
      };
    }
  ])
/* read a file from a url and convert it to a data src (this will only work for CORS images */
.directive('imgDataFromUri', function() {
  return {
    restrict: 'A',
    link: function(scope, element, attributes) {
      // Create an empty canvas element
      var canvas = document.createElement("canvas");
      var img = new Image();
      img.onload = function() {
        canvas.width = img.width;
        canvas.height = img.height;
        // Copy the image contents to the canvas
        var ctx = canvas.getContext("2d");
        ctx.drawImage(img, 0, 0);
        var dataURL = canvas.toDataURL("image/png");
        element.attr('src', dataURL);
        var loadedImgData = new Image();
        loadedImgData.src = dataURL;
        scope.$broadcast('loadedImg', loadedImgData);
        $(element).css('width', img.width + 'px');
        $(element).css('height', img.height + 'px');
      }
      img.crossOrigin = '';
      attributes.$observe('imgDataFromUri', function(val){
        img.src = val;
      });
    }
  };
})
  .directive('imgThumb', ['$parse',
    function($parse) {
      return {
        restrict: 'A',
        link: function(scope, element, attributes) {
          scope.$on('loadedImg', function(e, img) {
            element.attr('src', img.src);
          });
          scope.$on('update', function(e, imgSRC) {
            element.attr('src', imgSRC);
          });
        }
      };
    }
  ])
/* add listeners for 'crop', 'rotate' and 'rest' brodcasts */
.directive('imgEditable', function() {
  return {
    restrict: 'A',
    link: function(scope, element, attributes) {
      var jcrop_api;
      var croppedImage; //this will be used to support cancel of crop.
      var fullSize = new Image();
      var orig = new Image();
      scope.crop = false;
      scope.rotation = 0;
      if(element.attr('src') && element.attr('src').length > 1) { 
        fullSize.src = element.attr('src'); 
      } //load the src if it was already on the dom
      scope.$on('loadedImg', function(e, img) {
        fullSize.src = img.src; //if we are using one of the helpers to load img data this will load the fs once they finish
        orig.src = img.src;
      });
      //listen for actions
      scope.$on('crop', function() {
        scope.cropping = true;
        croppedImage = new Image();
        croppedImage.src = element.attr('src');
        //re-load the full size image, instead of the cropped on so that the user can crop wider
        element.attr('src', fullSize.src);
        $(element).css('width', fullSize.width + 'px');
        $(element).css('height', fullSize.height + 'px');

        //Init Jcrop with old selection if one exists
        if (scope.crop) {
          var pt1 = rotatePoint(scope.crop.x, scope.crop.y, orig.width, orig.height, scope.rotation);
          var pt2 = rotatePoint(scope.crop.x2, scope.crop.y2, orig.width, orig.height, scope.rotation);
          selectedInit = [pt1.x, pt1.y, pt2.x, pt2.y];
          $(element).Jcrop({
            setSelect: selectedInit
          }, function() {
            jcrop_api = this;
          });
        } else {
          $(element).Jcrop({}, function() {
            jcrop_api = this;
          });
        }
      });

      scope.$on('reset', function() {
        scope.crop = false;
        scope.rotation = 0;
        reset();
        //brodcast update
        scope.$broadcast('update', orig.src);
      });

      scope.$on('save', function() {
        if (scope.cropping) {
          croppedImage = null;
          //main crop function.
          scope.cropping = false;
          //Save the new crop to the scope
          var crop = jcrop_api.tellSelect();
          var p1 = rotatePoint(crop.x, crop.y, fullSize.width, fullSize.height, -scope.rotation);
          var p2 = rotatePoint(crop.x2, crop.y2, fullSize.width, fullSize.height, -scope.rotation);
          scope.crop = {
            x: p1.x,
            y: p1.y,
            x2: p2.x,
            y2: p2.y
          }; //save the crop in origin cords
          console.log(crop);
          console.log(scope.crop);
          //turn off jcrop
          jcrop_api.destroy();
          //apply the crop (requires canvas support)
          applyCrop(crop);
          //TODO Convert Crop to Orig Cords.
        }
      });

      scope.$on('cancel', function() {
        if (scope.cropping) {
          scope.cropping = false;
          element.attr('src', croppedImage.src);
          $(element).css('width', croppedImage.width + 'px');
          $(element).css('height', croppedImage.height + 'px');
          croppedImage = null;
          jcrop_api.destroy();
        }
        //extend if other methods need cancel support
      });

      //rotate
      scope.$on('rotate', function() {
        scope.rotation = (scope.rotation + 90) % 360;
        doRotate();
      });

      //Functions
      function reset() {
        croppedImage = null;
        element.attr('src', orig.src);
        $(element).css('width', orig.width + 'px');
        $(element).css('height', orig.height + 'px');
        fullSize.src = orig.src; //reset the saved crop image as well
      }

      function doRotate() {

        var img = new Image();
        img.onload = function() {
          var myImage;<commit_msg>allow user to specify model variables<commit_after>/* 
  <NAME> 2014
  Angular directives which use Canvas to provide an editable context for images.
  Jcrop, used for cropping http://deepliquid.com/content/Jcrop.html
*/
/*Convert a file in the scope into an img src data attribute*/
angular.module('imgEditor.directives', [])
  .directive('imgData', ['$parse',
    function($parse) {
      return {
        restrict: 'A',
        link: function(scope, element, attributes) {
          var imgData = scope.$eval(attributes.imgData);
          var width, height;
          var reader = new FileReader();
          reader.onload = function(e) {
            scope.$apply(function() {
              var img = new Image();
              img.onload = function() {
                element.attr('src', img.src);
                $(element).css('width', img.width + 'px');
                $(element).css('height', img.height + 'px');
              };
              img.src = reader.result;
              scope.$broadcast('loadedImg', img);
            });
          }
          reader.readAsDataURL(imgData);
        }
      };
    }
  ])
/* read a file from a url and convert it to a data src (this will only work for CORS images */
.directive('imgDataFromUri', function() {
  return {
    restrict: 'A',
    link: function(scope, element, attributes) {
      // Create an empty canvas element
      var canvas = document.createElement("canvas");
      var img = new Image();
      img.onload = function() {
        canvas.width = img.width;
        canvas.height = img.height;
        // Copy the image contents to the canvas
        var ctx = canvas.getContext("2d");
        ctx.drawImage(img, 0, 0);
        var dataURL = canvas.toDataURL("image/png");
        element.attr('src', dataURL);
        var loadedImgData = new Image();
        loadedImgData.src = dataURL;
        scope.$broadcast('loadedImg', loadedImgData);
        $(element).css('width', img.width + 'px');
        $(element).css('height', img.height + 'px');
      }
      img.crossOrigin = '';
      attributes.$observe('imgDataFromUri', function(val){
        img.src = val;
      });
    }
  };
})
  .directive('imgThumb', ['$parse',
    function($parse) {
      return {
        restrict: 'A',
        link: function(scope, element, attributes) {
          scope.$on('loadedImg', function(e, img) {
            element.attr('src', img.src);
          });
          scope.$on('update', function(e, imgSRC) {
            element.attr('src', imgSRC);
          });
        }
      };
    }
  ])
/* add listeners for 'crop', 'rotate' and 'rest' brodcasts */
.directive('imgEditable', function( $parse ) {
  return {
    restrict: 'A',
    link: function(scope, element, attributes) {
      var jcrop_api;
      var croppedImage; //this will be used to support cancel of crop.
      var fullSize = new Image();
      var orig = new Image();
      var model = {};
      model.crop = $parse(attributes.crop); 
      model.rotation = $parse(attributes.rotation); 
      if(!scope.crop){
        scope.crop = false;
      }
      if(!scope.rotation) {
        scope.rotation = 0;
      }
      if(element.attr('src') && element.attr('src').length > 1) { 
        fullSize.src = element.attr('src'); 
      } //load the src if it was already on the dom
      scope.$on('loadedImg', function(e, img) {
        fullSize.src = img.src; //if we are using one of the helpers to load img data this will load the fs once they finish
        orig.src = img.src;
      });
      //listen for actions
      scope.$on('crop', function() {
        scope.cropping = true;
        croppedImage = new Image();
        croppedImage.src = element.attr('src');
        //re-load the full size image, instead of the cropped on so that the user can crop wider
        element.attr('src', fullSize.src);
        $(element).css('width', fullSize.width + 'px');
        $(element).css('height', fullSize.height + 'px');

        //Init Jcrop with old selection if one exists
        if (scope.crop) {
          var pt1 = rotatePoint(scope.crop.x, scope.crop.y, orig.width, orig.height, scope.rotation);
          var pt2 = rotatePoint(scope.crop.x2, scope.crop.y2, orig.width, orig.height, scope.rotation);
          selectedInit = [pt1.x, pt1.y, pt2.x, pt2.y];
          $(element).Jcrop({
            setSelect: selectedInit
          }, function() {
            jcrop_api = this;
          });
        } else {
          $(element).Jcrop({}, function() {
            jcrop_api = this;
          });
        }
      });

      scope.$on('reset', function() {
        scope.crop = false;
        scope.rotation = 0;
        reset();
        //brodcast update
        scope.$broadcast('update', orig.src);
      });

      scope.$on('save', function() {
        if (scope.cropping) {
          croppedImage = null;
          //main crop function.
          scope.cropping = false;
          //Save the new crop to the scope
          var crop = jcrop_api.tellSelect();
          var p1 = rotatePoint(crop.x, crop.y, fullSize.width, fullSize.height, -scope.rotation);
          var p2 = rotatePoint(crop.x2, crop.y2, fullSize.width, fullSize.height, -scope.rotation);
          scope.crop = {
            x: p1.x,
            y: p1.y,
            x2: p2.x,
            y2: p2.y
          }; 
          //save the crop in origin cords
          model.crop.assign(scope,scope.crop);


          //turn off jcrop
          jcrop_api.destroy();
          //apply the crop (requires canvas support)
          applyCrop(crop);
        }
      });

      scope.$on('cancel', function() {
        if (scope.cropping) {
          scope.cropping = false;
          element.attr('src', croppedImage.src);
          $(element).css('width', croppedImage.width + 'px');
          $(element).css('height', croppedImage.height + 'px');
          croppedImage = null;
          jcrop_api.destroy();
        }
        //extend if other methods need cancel support
      });

      //rotate
      scope.$on('rotate', function() {
        scope.rotation = (scope.rotation + 90) % 360;
        //update the model
        model.rotation.assign(scope,scope.rotation);
        doRotate();
      });

      //Functions
      function reset() {
        croppedImage = null;
        element.attr('src', orig.src);
        $(element).css('width', orig.width + 'px');
        $(element).css('height', orig.height + 'px');
        fullSize.src = orig.src; //reset the saved crop image as well
      }

      function doRotate() {

        var img = new Image();
        img.onload = function() {
          var myImage;
{'fraction_non_alphanumeric': 0.14328611025562057, 'fraction_numerical': 0.0050816137973514015, 'mean_word_length': 1.9077680770091785, 'pattern_counts': {'":': 0, '<': 5, '<?xml version=': 0, '>': 7, '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': '3916382', 'n_tokens_mistral': 3854, 'n_tokens_neox': 3772, 'n_words': 978}