{"action":"created","issue":{"url":"https://api.github.com/repos/CrackerakiUA/ui-cropper/issues/57","repository_url":"https://api.github.com/repos/CrackerakiUA/ui-cropper","labels_url":"https://api.github.com/repos/CrackerakiUA/ui-cropper/issues/57/labels{/name}","comments_url":"https://api.github.com/repos/CrackerakiUA/ui-cropper/issues/57/comments","events_url":"https://api.github.com/repos/CrackerakiUA/ui-cropper/issues/57/events","html_url":"https://github.com/CrackerakiUA/ui-cropper/issues/57","id":262369467,"number":57,"title":"Cropper not rendered into ui bootstrap modal","user":{"login":"swordman1205","id":15131704,"avatar_url":"https://avatars2.githubusercontent.com/u/15131704?v=4","gravatar_id":"","url":"https://api.github.com/users/swordman1205","html_url":"https://github.com/swordman1205","followers_url":"https://api.github.com/users/swordman1205/followers","following_url":"https://api.github.com/users/swordman1205/following{/other_user}","gists_url":"https://api.github.com/users/swordman1205/gists{/gist_id}","starred_url":"https://api.github.com/users/swordman1205/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/swordman1205/subscriptions","organizations_url":"https://api.github.com/users/swordman1205/orgs","repos_url":"https://api.github.com/users/swordman1205/repos","events_url":"https://api.github.com/users/swordman1205/events{/privacy}","received_events_url":"https://api.github.com/users/swordman1205/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":6,"created_at":"2017-10-03T09:58:25Z","updated_at":"2017-10-10T08:29:37Z","closed_at":null,"author_association":"NONE","body":"Hi, I have an issue in rendering cropper into ui bootstrap modal. It works well for smaller images, but not for bigger ones. This is weird issue since it's worked well before. Not sure since when it's started not working. Let me share some of codebase.\r\n\r\n```\r\nangular.element(document.querySelector('#cover-photo-trigger')).on('change', function(evt) {\r\n          var file = evt.currentTarget.files[0];\r\n          var reader = new FileReader();\r\n          reader.onload = function () {\r\n            var image = new Image();\r\n            image.onload = function() {\r\n                    var modalInstance = $modal.open({\r\n                      templateUrl: 'views.promoter.modals.cover-upload',\r\n                      controller: function($scope, $modalInstance, data) {\r\n                        $scope.image = data.image;\r\n                        $scope.croppedImg = '';\r\n                        $scope.width = data.width;\r\n                        $scope.height = data.height;\r\n\r\n                        $scope.cancel = function() {\r\n                            $modalInstance.dismiss('cancel');\r\n                        }\r\n\r\n                        $scope.cropImage = function() {\r\n                            $modalInstance.close($scope.croppedImg);\r\n                        }\r\n                      },\r\n                      size: 'lg',\r\n                      windowClass: 'cover-popup',\r\n                      resolve: {\r\n                        data: function () {\r\n                          return {\r\n                            image: reader.result,\r\n                            width: image.width,\r\n                            height: image.height\r\n                          };\r\n                        }\r\n                      }\r\n                    });\r\n\r\n                    modalInstance.result.then(function (croppedImg) {\r\n                      ...\r\n                    }, function () {\r\n                      console.log('modal dismissed');\r\n                    });\r\n            }\r\n            image.src = reader.result;            \r\n          };\r\n          if (file) {\r\n            reader.readAsDataURL(file);\r\n            angular.element(document.querySelector('#cover-photo-trigger'))[0].value = ''; \r\n          }\r\n        });\r\n```\r\n\r\nHere is modal template:\r\n\r\n```\r\n<div class=\"modal-header\">\r\n  <h2 class=\"modal-title\">Crop Image</h2>\r\n</div>\r\n<div class=\"modal-body\">\r\n  <div style=\"width: {{ width }}px; height: {{ height }}px; margin: 0 auto;\">\r\n    <ui-cropper image=\"image\" area-type=\"rectangle\" result-image=\"croppedImg\"></ui-cropper>\r\n  </div>\r\n</div>\r\n<div class=\"modal-footer\">\r\n  <button class=\"btn btn-md btn-gray\" ng-click=\"cancel()\">\r\n    Cancel\r\n  </button>\r\n  <button class=\"btn btn-md btn-orange\" ng-click=\"cropImage()\">\r\n    Ok\r\n  </button>\r\n</div>\r\n\r\n```\r\n\r\nLooking forward to your reply.\r\nThanks!"},"comment":{"url":"https://api.github.com/repos/CrackerakiUA/ui-cropper/issues/comments/335400013","html_url":"https://github.com/CrackerakiUA/ui-cropper/issues/57#issuecomment-335400013","issue_url":"https://api.github.com/repos/CrackerakiUA/ui-cropper/issues/57","id":335400013,"user":{"login":"CrackerakiUA","id":6815721,"avatar_url":"https://avatars2.githubusercontent.com/u/6815721?v=4","gravatar_id":"","url":"https://api.github.com/users/CrackerakiUA","html_url":"https://github.com/CrackerakiUA","followers_url":"https://api.github.com/users/CrackerakiUA/followers","following_url":"https://api.github.com/users/CrackerakiUA/following{/other_user}","gists_url":"https://api.github.com/users/CrackerakiUA/gists{/gist_id}","starred_url":"https://api.github.com/users/CrackerakiUA/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/CrackerakiUA/subscriptions","organizations_url":"https://api.github.com/users/CrackerakiUA/orgs","repos_url":"https://api.github.com/users/CrackerakiUA/repos","events_url":"https://api.github.com/users/CrackerakiUA/events{/privacy}","received_events_url":"https://api.github.com/users/CrackerakiUA/received_events","type":"User","site_admin":false},"created_at":"2017-10-10T08:29:37Z","updated_at":"2017-10-10T08:29:37Z","author_association":"OWNER","body":"@RHinderiks or @swordman1205 please provide code setup with images you use to reproduce the issue."}}
{"actor":{"display_login":"CrackerakiUA"}}